From 1c94ae8354a7f3e4d5bd1dcafc5107ea639d31e8 Mon Sep 17 00:00:00 2001 From: SharglutDev Date: Thu, 27 Jul 2023 17:00:30 +0200 Subject: [PATCH 1/8] front: refacto clone infra workflow --- .../InfraSelectorEditionActionsBar.tsx | 27 ++++++++------ .../InfraSelectorEditionActionsBarDelete.jsx | 4 +-- .../InfraSelectorEditionItem.jsx | 6 ++-- .../InfraSelector/InfraSelectorModal.tsx | 35 ++++++------------- .../InfraSelectorModalBodyEdition.tsx | 12 +++---- 5 files changed, 38 insertions(+), 46 deletions(-) diff --git a/front/src/common/InfraSelector/InfraSelectorEditionActionsBar.tsx b/front/src/common/InfraSelector/InfraSelectorEditionActionsBar.tsx index a2630becba9..d4ca3528937 100644 --- a/front/src/common/InfraSelector/InfraSelectorEditionActionsBar.tsx +++ b/front/src/common/InfraSelector/InfraSelectorEditionActionsBar.tsx @@ -5,25 +5,27 @@ import { post, get, put } from 'common/requests'; import { MdCancel, MdCheck } from 'react-icons/md'; import fileDownload from 'js-file-download'; import { Infra, osrdEditoastApi } from 'common/api/osrdEditoastApi'; +import { useDispatch } from 'react-redux'; +import { setFailure } from 'reducers/main'; import { INFRA_URL } from './Consts'; type ActionBarProps = { infra: Infra; isFocused?: number; setIsFocused: (focus?: number) => void; - getInfrasList: () => void; + // getInfrasList: () => void; inputValue: string; }; -export default function ActionsBar({ +export default function ActionsBar2({ infra, isFocused, setIsFocused, - getInfrasList, inputValue, }: ActionBarProps) { const { t } = useTranslation('infraManagement'); const [isWaiting, setIsWaiting] = useState(false); + const dispatch = useDispatch(); const [cloneInfra] = osrdEditoastApi.usePostInfraByIdCloneMutation(); @@ -32,7 +34,7 @@ export default function ActionsBar({ setIsWaiting(true); try { await post(`${INFRA_URL}${infra.id}/${action}/`, {}); - getInfrasList(); + // getInfrasList(); setIsWaiting(false); } catch (e) { setIsWaiting(false); @@ -57,14 +59,19 @@ export default function ActionsBar({ if (!isWaiting) { setIsWaiting(true); try { - await cloneInfra({ id: infra.id, name: `${infra.name}_copy` }).unwrap(); - setIsWaiting(false); + await cloneInfra({ id: infra.id, name: `${infra.name}_copy` }); } catch (e) { + if (e instanceof Error) { + dispatch( + setFailure({ + name: e.name, + message: e.message, + }) + ); + } + } finally { setIsWaiting(false); } - setTimeout(() => { - getInfrasList(); - }, 1000); } } @@ -73,7 +80,7 @@ export default function ActionsBar({ setIsWaiting(true); try { await put(`${INFRA_URL}${infra.id}/`, { name: inputValue }); - getInfrasList(); + // getInfrasList(); setIsFocused(undefined); setIsWaiting(false); } catch (e) { diff --git a/front/src/common/InfraSelector/InfraSelectorEditionActionsBarDelete.jsx b/front/src/common/InfraSelector/InfraSelectorEditionActionsBarDelete.jsx index 5772f9af00f..47b5b83a68f 100644 --- a/front/src/common/InfraSelector/InfraSelectorEditionActionsBarDelete.jsx +++ b/front/src/common/InfraSelector/InfraSelectorEditionActionsBarDelete.jsx @@ -13,7 +13,7 @@ export default function InfraSelectorEditionActionsBarDelete(props) { try { await deleteRequest(`${INFRA_URL}${infra.id}/`); setRunningDelete(undefined); - getInfrasList(); + // getInfrasList(); } catch (e) { /* empty */ } @@ -61,7 +61,7 @@ export default function InfraSelectorEditionActionsBarDelete(props) { } InfraSelectorEditionActionsBarDelete.propTypes = { - getInfrasList: PropTypes.func.isRequired, + // getInfrasList: PropTypes.func.isRequired, infra: PropTypes.object.isRequired, setRunningDelete: PropTypes.func.isRequired, }; diff --git a/front/src/common/InfraSelector/InfraSelectorEditionItem.jsx b/front/src/common/InfraSelector/InfraSelectorEditionItem.jsx index 626bdd61caf..3f1bc17b8e6 100644 --- a/front/src/common/InfraSelector/InfraSelectorEditionItem.jsx +++ b/front/src/common/InfraSelector/InfraSelectorEditionItem.jsx @@ -27,7 +27,7 @@ export default function InfraSelectorEditionItem(props) { ) : null} {isFocused === infra.id ? null : ( @@ -81,7 +81,7 @@ export default function InfraSelectorEditionItem(props) { infra={infra} isFocused={isFocused} setIsFocused={setIsFocused} - getInfrasList={getInfrasList} + // getInfrasList={getInfrasList} inputValue={value} /> @@ -100,5 +100,5 @@ InfraSelectorEditionItem.propTypes = { setIsFocused: PropTypes.func.isRequired, runningDelete: PropTypes.number, setRunningDelete: PropTypes.func.isRequired, - getInfrasList: PropTypes.func.isRequired, + // getInfrasList: PropTypes.func.isRequired, }; diff --git a/front/src/common/InfraSelector/InfraSelectorModal.tsx b/front/src/common/InfraSelector/InfraSelectorModal.tsx index 4a5d50042ae..2b644695655 100644 --- a/front/src/common/InfraSelector/InfraSelectorModal.tsx +++ b/front/src/common/InfraSelector/InfraSelectorModal.tsx @@ -20,52 +20,37 @@ const InfraSelectorModal = ({ onInfraChange, onlySelectionMode = false, }: InfraSelectorModalProps) => { - const [infrasList, setInfrasList] = useState([]); const { t } = useTranslation(['translation', 'infraManagement']); const [filter, setFilter] = useState(''); const [filteredInfrasList, setFilteredInfrasList] = useState([]); const [editionMode, setEditionMode] = useState(false); - const [isFetching, setIsFetching] = useState(false); - const [getInfra] = osrdEditoastApi.endpoints.getInfra.useLazyQuery(); + const { data: infrasList, isSuccess, isLoading } = osrdEditoastApi.useGetInfraQuery(); const debouncedFilter = useDebounce(filter, 250); function filterInfras(infrasListLocal: Infra[]) { if (debouncedFilter && debouncedFilter !== '') { - infrasListLocal = infrasList.filter((infra) => + infrasListLocal = infrasListLocal.filter((infra) => infra.name.toLowerCase().includes(debouncedFilter.toLowerCase()) ); } const filteredInfrasListLocal = infrasListLocal .slice() .sort((a, b) => a.name.localeCompare(b.name)); - setFilteredInfrasList(filteredInfrasListLocal); } - const getInfrasList = () => { - setIsFetching(true); - getInfra() - .unwrap() - .then(({ results }) => { - setInfrasList(results as Infra[]); - filterInfras(results as Infra[]); - setIsFetching(false); - }) - .catch(() => setIsFetching(false)); - }; - useEffect(() => { - if (infrasList) { - filterInfras(infrasList); + if (infrasList?.results) { + filterInfras(infrasList.results); } - // eslint-disable-next-line react-hooks/exhaustive-deps }, [debouncedFilter]); useEffect(() => { - getInfrasList(); - // eslint-disable-next-line react-hooks/exhaustive-deps - }, []); + if (isSuccess && infrasList?.results && infrasList.results.length > 0) { + filterInfras(infrasList.results); + } + }, [isSuccess, infrasList]); return ( <> @@ -101,7 +86,7 @@ const InfraSelectorModal = ({ - {isFetching && ( + {isLoading && (
@@ -111,7 +96,7 @@ const InfraSelectorModal = ({ infrasList={filteredInfrasList} setFilter={setFilter} filter={filter} - getInfrasList={getInfrasList} + // getInfrasList={getInfrasList} /> ) : ( >; filter: string; - getInfrasList: () => void; + // getInfrasList: () => void; }; const InfraSelectorModalBodyEdition = ({ infrasList, setFilter, filter = '', - getInfrasList, -}: InfraSelectorModalBodyEditionProps) => { +}: // getInfrasList, +InfraSelectorModalBodyEditionProps) => { const [isFocused, setIsFocused] = useState(undefined); const [runningDelete, setRunningDelete] = useState(undefined); const [nameNewInfra, setNameNewInfra] = useState(''); @@ -71,14 +71,14 @@ const InfraSelectorModalBodyEdition = ({ .unwrap() .then(() => { setSelectedFile(undefined); - getInfrasList(); + // getInfrasList(); setErrorMessage(undefined); }); } else { postInfra({ body: { name: nameNewInfra } }) .unwrap() .then(() => { - getInfrasList(); + // getInfrasList(); setErrorMessage(undefined); }); } @@ -110,7 +110,7 @@ const InfraSelectorModalBodyEdition = ({ runningDelete={runningDelete} setRunningDelete={setRunningDelete} setIsFocused={setIsFocused} - getInfrasList={getInfrasList} + // getInfrasList={getInfrasList} /> ))} From 43d99a55effd8c17b7b3a88226d6ef641b96f3bd Mon Sep 17 00:00:00 2001 From: SharglutDev Date: Thu, 27 Jul 2023 17:19:52 +0200 Subject: [PATCH 2/8] front: migrate rename infra with rtk --- .../InfraSelectorEditionActionsBar.tsx | 16 ++++++++++++---- 1 file changed, 12 insertions(+), 4 deletions(-) diff --git a/front/src/common/InfraSelector/InfraSelectorEditionActionsBar.tsx b/front/src/common/InfraSelector/InfraSelectorEditionActionsBar.tsx index d4ca3528937..f0ac1c8cef6 100644 --- a/front/src/common/InfraSelector/InfraSelectorEditionActionsBar.tsx +++ b/front/src/common/InfraSelector/InfraSelectorEditionActionsBar.tsx @@ -1,7 +1,7 @@ import React, { useState } from 'react'; import { FaCopy, FaDownload, FaLock, FaLockOpen, FaPencilAlt } from 'react-icons/fa'; import { useTranslation } from 'react-i18next'; -import { post, get, put } from 'common/requests'; +import { post, get } from 'common/requests'; import { MdCancel, MdCheck } from 'react-icons/md'; import fileDownload from 'js-file-download'; import { Infra, osrdEditoastApi } from 'common/api/osrdEditoastApi'; @@ -28,6 +28,7 @@ export default function ActionsBar2({ const dispatch = useDispatch(); const [cloneInfra] = osrdEditoastApi.usePostInfraByIdCloneMutation(); + const [updateInfra] = osrdEditoastApi.usePutInfraByIdMutation(); async function handleLockedState(action: string) { if (!isWaiting) { @@ -79,11 +80,18 @@ export default function ActionsBar2({ if (!isWaiting) { setIsWaiting(true); try { - await put(`${INFRA_URL}${infra.id}/`, { name: inputValue }); - // getInfrasList(); + await updateInfra({ id: infra.id, body: { name: inputValue } }); setIsFocused(undefined); - setIsWaiting(false); } catch (e) { + if (e instanceof Error) { + dispatch( + setFailure({ + name: e.name, + message: e.message, + }) + ); + } + } finally { setIsWaiting(false); } } From 69be280ed087d81cd753405af8b22a9eb73c128e Mon Sep 17 00:00:00 2001 From: SharglutDev Date: Thu, 27 Jul 2023 17:52:05 +0200 Subject: [PATCH 3/8] front: migrate lock unlock infra with rtk --- front/src/common/InfraSelector/Consts.jsx | 2 - .../InfraSelectorEditionActionsBar.tsx | 38 +++++++++++-------- .../InfraSelectorEditionActionsBarDelete.jsx | 2 +- front/src/common/InfraSelector/consts.ts | 4 ++ 4 files changed, 28 insertions(+), 18 deletions(-) delete mode 100644 front/src/common/InfraSelector/Consts.jsx create mode 100644 front/src/common/InfraSelector/consts.ts diff --git a/front/src/common/InfraSelector/Consts.jsx b/front/src/common/InfraSelector/Consts.jsx deleted file mode 100644 index a3ca67aaa44..00000000000 --- a/front/src/common/InfraSelector/Consts.jsx +++ /dev/null @@ -1,2 +0,0 @@ -export const INFRA_URL = '/editoast/infra/'; -export const INFRA_URL_OLD = '/infra/'; diff --git a/front/src/common/InfraSelector/InfraSelectorEditionActionsBar.tsx b/front/src/common/InfraSelector/InfraSelectorEditionActionsBar.tsx index f0ac1c8cef6..4b528eb1678 100644 --- a/front/src/common/InfraSelector/InfraSelectorEditionActionsBar.tsx +++ b/front/src/common/InfraSelector/InfraSelectorEditionActionsBar.tsx @@ -1,43 +1,51 @@ import React, { useState } from 'react'; import { FaCopy, FaDownload, FaLock, FaLockOpen, FaPencilAlt } from 'react-icons/fa'; import { useTranslation } from 'react-i18next'; -import { post, get } from 'common/requests'; +import { get } from 'common/requests'; import { MdCancel, MdCheck } from 'react-icons/md'; import fileDownload from 'js-file-download'; import { Infra, osrdEditoastApi } from 'common/api/osrdEditoastApi'; import { useDispatch } from 'react-redux'; import { setFailure } from 'reducers/main'; -import { INFRA_URL } from './Consts'; +import { INFRA_URL, InfraLockState } from './consts'; type ActionBarProps = { infra: Infra; isFocused?: number; setIsFocused: (focus?: number) => void; - // getInfrasList: () => void; inputValue: string; }; -export default function ActionsBar2({ - infra, - isFocused, - setIsFocused, - inputValue, -}: ActionBarProps) { +export default function ActionsBar({ infra, isFocused, setIsFocused, inputValue }: ActionBarProps) { const { t } = useTranslation('infraManagement'); const [isWaiting, setIsWaiting] = useState(false); const dispatch = useDispatch(); + const [lockInfra] = osrdEditoastApi.usePostInfraByIdLockMutation(); + const [unlockInfra] = osrdEditoastApi.usePostInfraByIdUnlockMutation(); const [cloneInfra] = osrdEditoastApi.usePostInfraByIdCloneMutation(); const [updateInfra] = osrdEditoastApi.usePutInfraByIdMutation(); - async function handleLockedState(action: string) { + async function handleLockedState(action: InfraLockState) { if (!isWaiting) { setIsWaiting(true); try { - await post(`${INFRA_URL}${infra.id}/${action}/`, {}); - // getInfrasList(); - setIsWaiting(false); + if (action === InfraLockState.LOCK) { + await lockInfra({ id: infra.id }); + } + if (action === InfraLockState.UNLOCK) { + await unlockInfra({ id: infra.id }); + } } catch (e) { + if (e instanceof Error) { + dispatch( + setFailure({ + name: e.name, + message: e.message, + }) + ); + } + } finally { setIsWaiting(false); } } @@ -137,7 +145,7 @@ export default function ActionsBar2({ className="infraslist-item-action unlock" type="button" title={t('infraManagement:actions.unlock')} - onClick={() => handleLockedState('unlock')} + onClick={() => handleLockedState(InfraLockState.UNLOCK)} > @@ -146,7 +154,7 @@ export default function ActionsBar2({ className="infraslist-item-action lock" type="button" title={t('infraManagement:actions.lock')} - onClick={() => handleLockedState('lock')} + onClick={() => handleLockedState(InfraLockState.LOCK)} > diff --git a/front/src/common/InfraSelector/InfraSelectorEditionActionsBarDelete.jsx b/front/src/common/InfraSelector/InfraSelectorEditionActionsBarDelete.jsx index 47b5b83a68f..c03d098dc63 100644 --- a/front/src/common/InfraSelector/InfraSelectorEditionActionsBarDelete.jsx +++ b/front/src/common/InfraSelector/InfraSelectorEditionActionsBarDelete.jsx @@ -3,7 +3,7 @@ import PropTypes from 'prop-types'; import { deleteRequest } from 'common/requests'; import { useTranslation } from 'react-i18next'; import Countdown from 'react-countdown'; -import { INFRA_URL } from './Consts'; +import { INFRA_URL } from './consts'; export default function InfraSelectorEditionActionsBarDelete(props) { const { getInfrasList, setRunningDelete, infra } = props; diff --git a/front/src/common/InfraSelector/consts.ts b/front/src/common/InfraSelector/consts.ts new file mode 100644 index 00000000000..d2918565439 --- /dev/null +++ b/front/src/common/InfraSelector/consts.ts @@ -0,0 +1,4 @@ +enum InfraLockState { + LOCK, + UNLOCK, +} From 4698c47a0c6ec3d46f72d7f663a9ed6a302e2129 Mon Sep 17 00:00:00 2001 From: SharglutDev Date: Thu, 27 Jul 2023 18:02:52 +0200 Subject: [PATCH 4/8] front: migrate export railjson with rtk --- .../InfraSelectorEditionActionsBar.tsx | 16 ++++++++++++---- 1 file changed, 12 insertions(+), 4 deletions(-) diff --git a/front/src/common/InfraSelector/InfraSelectorEditionActionsBar.tsx b/front/src/common/InfraSelector/InfraSelectorEditionActionsBar.tsx index 4b528eb1678..25ddd32f04b 100644 --- a/front/src/common/InfraSelector/InfraSelectorEditionActionsBar.tsx +++ b/front/src/common/InfraSelector/InfraSelectorEditionActionsBar.tsx @@ -1,13 +1,12 @@ import React, { useState } from 'react'; import { FaCopy, FaDownload, FaLock, FaLockOpen, FaPencilAlt } from 'react-icons/fa'; import { useTranslation } from 'react-i18next'; -import { get } from 'common/requests'; import { MdCancel, MdCheck } from 'react-icons/md'; import fileDownload from 'js-file-download'; import { Infra, osrdEditoastApi } from 'common/api/osrdEditoastApi'; import { useDispatch } from 'react-redux'; import { setFailure } from 'reducers/main'; -import { INFRA_URL, InfraLockState } from './consts'; +import { InfraLockState } from './consts'; type ActionBarProps = { infra: Infra; @@ -23,6 +22,7 @@ export default function ActionsBar({ infra, isFocused, setIsFocused, inputValue const [lockInfra] = osrdEditoastApi.usePostInfraByIdLockMutation(); const [unlockInfra] = osrdEditoastApi.usePostInfraByIdUnlockMutation(); + const [getRailjson] = osrdEditoastApi.useLazyGetInfraByIdRailjsonQuery(); const [cloneInfra] = osrdEditoastApi.usePostInfraByIdCloneMutation(); const [updateInfra] = osrdEditoastApi.usePutInfraByIdMutation(); @@ -55,10 +55,18 @@ export default function ActionsBar({ infra, isFocused, setIsFocused, inputValue if (!isWaiting) { setIsWaiting(true); try { - const railjson = await get(`${INFRA_URL}${infra.id}/railjson/`); + const railjson = await getRailjson({ id: infra.id }); fileDownload(JSON.stringify(railjson), `${infra.name}.id${infra.id}.railjson.json`); - setIsWaiting(false); } catch (e) { + if (e instanceof Error) { + dispatch( + setFailure({ + name: e.name, + message: e.message, + }) + ); + } + } finally { setIsWaiting(false); } } From d69d21ca495334c049ba165761a4965608861998 Mon Sep 17 00:00:00 2001 From: SharglutDev Date: Fri, 28 Jul 2023 09:58:21 +0200 Subject: [PATCH 5/8] front: refacto delete infra component to tsx and rtk --- front/public/locales/fr/infraManagement.json | 1 + .../InfraSelectorEditionActionsBar.tsx | 2 +- ... InfraSelectorEditionActionsBarDelete.tsx} | 50 ++++++++++++------- .../InfraSelectorEditionItem.jsx | 10 +--- .../InfraSelector/InfraSelectorModal.tsx | 1 - .../InfraSelectorModalBodyEdition.tsx | 7 +-- front/src/common/InfraSelector/consts.ts | 2 + 7 files changed, 40 insertions(+), 33 deletions(-) rename front/src/common/InfraSelector/{InfraSelectorEditionActionsBarDelete.jsx => InfraSelectorEditionActionsBarDelete.tsx} (53%) diff --git a/front/public/locales/fr/infraManagement.json b/front/public/locales/fr/infraManagement.json index 2e9908802bc..b470e045c64 100644 --- a/front/public/locales/fr/infraManagement.json +++ b/front/public/locales/fr/infraManagement.json @@ -24,6 +24,7 @@ "goToEditionMode": "Éditer", "goToStandardMode": "Retour à la sélection", "infraChoice": "Infrastructures", + "infraDeleted": "L'infrastructure {{name}} a bien été supprimée.", "infraManagement": "Gestion des infrastructures", "infraName": "Nom de l'infrastructure", "infrasFound_zero": "Aucune insfrastructure trouvée", diff --git a/front/src/common/InfraSelector/InfraSelectorEditionActionsBar.tsx b/front/src/common/InfraSelector/InfraSelectorEditionActionsBar.tsx index 25ddd32f04b..0b0001466f8 100644 --- a/front/src/common/InfraSelector/InfraSelectorEditionActionsBar.tsx +++ b/front/src/common/InfraSelector/InfraSelectorEditionActionsBar.tsx @@ -6,7 +6,7 @@ import fileDownload from 'js-file-download'; import { Infra, osrdEditoastApi } from 'common/api/osrdEditoastApi'; import { useDispatch } from 'react-redux'; import { setFailure } from 'reducers/main'; -import { InfraLockState } from './consts'; +import InfraLockState from './consts'; type ActionBarProps = { infra: Infra; diff --git a/front/src/common/InfraSelector/InfraSelectorEditionActionsBarDelete.jsx b/front/src/common/InfraSelector/InfraSelectorEditionActionsBarDelete.tsx similarity index 53% rename from front/src/common/InfraSelector/InfraSelectorEditionActionsBarDelete.jsx rename to front/src/common/InfraSelector/InfraSelectorEditionActionsBarDelete.tsx index c03d098dc63..1d32117bdd0 100644 --- a/front/src/common/InfraSelector/InfraSelectorEditionActionsBarDelete.jsx +++ b/front/src/common/InfraSelector/InfraSelectorEditionActionsBarDelete.tsx @@ -1,31 +1,53 @@ import React from 'react'; -import PropTypes from 'prop-types'; -import { deleteRequest } from 'common/requests'; import { useTranslation } from 'react-i18next'; import Countdown from 'react-countdown'; -import { INFRA_URL } from './consts'; +import { Infra, osrdEditoastApi } from 'common/api/osrdEditoastApi'; +import { useDispatch } from 'react-redux'; +import { setFailure, setSuccess } from 'reducers/main'; -export default function InfraSelectorEditionActionsBarDelete(props) { - const { getInfrasList, setRunningDelete, infra } = props; +type InfraSelectorEditionActionsBarDeleteProps = { + infra: Infra; + setRunningDelete: (infraId?: number) => void; +}; + +export default function InfraSelectorEditionActionsBarDelete({ + infra, + setRunningDelete, +}: InfraSelectorEditionActionsBarDeleteProps) { const { t } = useTranslation('infraManagement'); + const dispatch = useDispatch(); + + const [deleteInfra] = osrdEditoastApi.useDeleteInfraByIdMutation(); - async function deleteInfra() { + async function handleDeleteInfra() { try { - await deleteRequest(`${INFRA_URL}${infra.id}/`); + await deleteInfra({ id: infra.id }); setRunningDelete(undefined); - // getInfrasList(); + dispatch( + setSuccess({ + title: t('infraDeleted', { name: infra.name }), + text: '', + }) + ); } catch (e) { - /* empty */ + if (e instanceof Error) { + dispatch( + setFailure({ + name: e.name, + message: e.message, + }) + ); + } } } - const countDownDelete = ({ seconds, completed }) => { + const countDownDelete = ({ seconds, completed }: { seconds: number; completed: boolean }) => { if (completed) { return ( @@ -59,9 +81,3 @@ export default function InfraSelectorEditionActionsBarDelete(props) { ); } - -InfraSelectorEditionActionsBarDelete.propTypes = { - // getInfrasList: PropTypes.func.isRequired, - infra: PropTypes.object.isRequired, - setRunningDelete: PropTypes.func.isRequired, -}; diff --git a/front/src/common/InfraSelector/InfraSelectorEditionItem.jsx b/front/src/common/InfraSelector/InfraSelectorEditionItem.jsx index 3f1bc17b8e6..ad55c832230 100644 --- a/front/src/common/InfraSelector/InfraSelectorEditionItem.jsx +++ b/front/src/common/InfraSelector/InfraSelectorEditionItem.jsx @@ -9,7 +9,7 @@ import ActionsBar from './InfraSelectorEditionActionsBar'; import InfraSelectorEditionActionsBarDelete from './InfraSelectorEditionActionsBarDelete'; export default function InfraSelectorEditionItem(props) { - const { infra, isFocused, setIsFocused, runningDelete, setRunningDelete, getInfrasList } = props; + const { infra, isFocused, setIsFocused, runningDelete, setRunningDelete } = props; const [value, setValue] = useState(infra.name); const { t } = useTranslation('infraManagement'); @@ -24,11 +24,7 @@ export default function InfraSelectorEditionItem(props) {
) : null} {runningDelete === infra.id ? ( - + ) : null} {isFocused === infra.id ? null : (
@@ -100,5 +95,4 @@ InfraSelectorEditionItem.propTypes = { setIsFocused: PropTypes.func.isRequired, runningDelete: PropTypes.number, setRunningDelete: PropTypes.func.isRequired, - // getInfrasList: PropTypes.func.isRequired, }; diff --git a/front/src/common/InfraSelector/InfraSelectorModal.tsx b/front/src/common/InfraSelector/InfraSelectorModal.tsx index 2b644695655..3ed26db8e73 100644 --- a/front/src/common/InfraSelector/InfraSelectorModal.tsx +++ b/front/src/common/InfraSelector/InfraSelectorModal.tsx @@ -96,7 +96,6 @@ const InfraSelectorModal = ({ infrasList={filteredInfrasList} setFilter={setFilter} filter={filter} - // getInfrasList={getInfrasList} /> ) : ( >; filter: string; - // getInfrasList: () => void; }; const InfraSelectorModalBodyEdition = ({ infrasList, setFilter, filter = '', -}: // getInfrasList, -InfraSelectorModalBodyEditionProps) => { +}: InfraSelectorModalBodyEditionProps) => { const [isFocused, setIsFocused] = useState(undefined); const [runningDelete, setRunningDelete] = useState(undefined); const [nameNewInfra, setNameNewInfra] = useState(''); @@ -71,14 +69,12 @@ InfraSelectorModalBodyEditionProps) => { .unwrap() .then(() => { setSelectedFile(undefined); - // getInfrasList(); setErrorMessage(undefined); }); } else { postInfra({ body: { name: nameNewInfra } }) .unwrap() .then(() => { - // getInfrasList(); setErrorMessage(undefined); }); } @@ -110,7 +106,6 @@ InfraSelectorModalBodyEditionProps) => { runningDelete={runningDelete} setRunningDelete={setRunningDelete} setIsFocused={setIsFocused} - // getInfrasList={getInfrasList} /> ))} diff --git a/front/src/common/InfraSelector/consts.ts b/front/src/common/InfraSelector/consts.ts index d2918565439..e5b797fa68a 100644 --- a/front/src/common/InfraSelector/consts.ts +++ b/front/src/common/InfraSelector/consts.ts @@ -2,3 +2,5 @@ enum InfraLockState { LOCK, UNLOCK, } + +export default InfraLockState; From f9faf1a13e3414b5ce9ddce4604fc0f6baad0a42 Mon Sep 17 00:00:00 2001 From: SharglutDev Date: Fri, 28 Jul 2023 10:11:53 +0200 Subject: [PATCH 6/8] front: refacto infra item selection in tsx --- ...nItem.jsx => InfraSelectorEditionItem.tsx} | 31 +++++++++---------- .../InfraSelectorModalBodyEdition.tsx | 3 -- 2 files changed, 14 insertions(+), 20 deletions(-) rename front/src/common/InfraSelector/{InfraSelectorEditionItem.jsx => InfraSelectorEditionItem.tsx} (84%) diff --git a/front/src/common/InfraSelector/InfraSelectorEditionItem.jsx b/front/src/common/InfraSelector/InfraSelectorEditionItem.tsx similarity index 84% rename from front/src/common/InfraSelector/InfraSelectorEditionItem.jsx rename to front/src/common/InfraSelector/InfraSelectorEditionItem.tsx index ad55c832230..fadeadc9ec7 100644 --- a/front/src/common/InfraSelector/InfraSelectorEditionItem.jsx +++ b/front/src/common/InfraSelector/InfraSelectorEditionItem.tsx @@ -1,16 +1,26 @@ import React, { useState } from 'react'; -import PropTypes from 'prop-types'; import nextId from 'react-id-generator'; import { FaLock, FaTrash } from 'react-icons/fa'; import InputSNCF from 'common/BootstrapSNCF/InputSNCF'; import { useTranslation } from 'react-i18next'; -import { editoastUpToDateIndicator } from './InfraSelectorModalBodyStandard'; +import { Infra } from 'common/api/osrdEditoastApi'; import ActionsBar from './InfraSelectorEditionActionsBar'; +import { editoastUpToDateIndicator } from './InfraSelectorModalBodyStandard'; import InfraSelectorEditionActionsBarDelete from './InfraSelectorEditionActionsBarDelete'; -export default function InfraSelectorEditionItem(props) { - const { infra, isFocused, setIsFocused, runningDelete, setRunningDelete } = props; +type InfraSelectorEditionItemProps = { + infra: Infra; + isFocused?: number; + setIsFocused: (infraId?: number) => void; +}; + +export default function InfraSelectorEditionItem({ + infra, + isFocused, + setIsFocused, +}: InfraSelectorEditionItemProps) { const [value, setValue] = useState(infra.name); + const [runningDelete, setRunningDelete] = useState(undefined); const { t } = useTranslation('infraManagement'); const handleRunningDelete = () => { @@ -83,16 +93,3 @@ export default function InfraSelectorEditionItem(props) { ); } - -InfraSelectorEditionItem.defaultProps = { - isFocused: undefined, - runningDelete: undefined, -}; - -InfraSelectorEditionItem.propTypes = { - infra: PropTypes.object.isRequired, - isFocused: PropTypes.number, - setIsFocused: PropTypes.func.isRequired, - runningDelete: PropTypes.number, - setRunningDelete: PropTypes.func.isRequired, -}; diff --git a/front/src/common/InfraSelector/InfraSelectorModalBodyEdition.tsx b/front/src/common/InfraSelector/InfraSelectorModalBodyEdition.tsx index 2935360ecbf..445b9fa0b63 100644 --- a/front/src/common/InfraSelector/InfraSelectorModalBodyEdition.tsx +++ b/front/src/common/InfraSelector/InfraSelectorModalBodyEdition.tsx @@ -18,7 +18,6 @@ const InfraSelectorModalBodyEdition = ({ filter = '', }: InfraSelectorModalBodyEditionProps) => { const [isFocused, setIsFocused] = useState(undefined); - const [runningDelete, setRunningDelete] = useState(undefined); const [nameNewInfra, setNameNewInfra] = useState(''); const [errorMessage, setErrorMessage] = useState(''); const [selectedFile, setSelectedFile] = useState(undefined); @@ -103,8 +102,6 @@ const InfraSelectorModalBodyEdition = ({ infra={infra} key={nextId()} isFocused={isFocused} - runningDelete={runningDelete} - setRunningDelete={setRunningDelete} setIsFocused={setIsFocused} /> ))} From 072c6f21c10d91cd19ed0556994660903cf8ca28 Mon Sep 17 00:00:00 2001 From: SharglutDev Date: Fri, 28 Jul 2023 10:23:40 +0200 Subject: [PATCH 7/8] front: refacto infras list component in tsx --- ...jsx => InfraSelectorModalBodyStandard.tsx} | 47 ++++++++++--------- 1 file changed, 26 insertions(+), 21 deletions(-) rename front/src/common/InfraSelector/{InfraSelectorModalBodyStandard.jsx => InfraSelectorModalBodyStandard.tsx} (78%) diff --git a/front/src/common/InfraSelector/InfraSelectorModalBodyStandard.jsx b/front/src/common/InfraSelector/InfraSelectorModalBodyStandard.tsx similarity index 78% rename from front/src/common/InfraSelector/InfraSelectorModalBodyStandard.jsx rename to front/src/common/InfraSelector/InfraSelectorModalBodyStandard.tsx index ed1d83c53bb..ae41fd7f52e 100644 --- a/front/src/common/InfraSelector/InfraSelectorModalBodyStandard.jsx +++ b/front/src/common/InfraSelector/InfraSelectorModalBodyStandard.tsx @@ -1,5 +1,4 @@ import React, { useContext } from 'react'; -import PropTypes from 'prop-types'; import nextId from 'react-id-generator'; import { FaLock } from 'react-icons/fa'; import InputSNCF from 'common/BootstrapSNCF/InputSNCF'; @@ -8,21 +7,41 @@ import { getInfraID } from 'reducers/osrdconf/selectors'; import { updateInfraID, deleteItinerary } from 'reducers/osrdconf'; import { useTranslation } from 'react-i18next'; import { ModalContext } from 'common/BootstrapSNCF/ModalSNCF/ModalProvider'; +import { Infra } from 'common/api/osrdEditoastApi'; + +type InfraSelectorModalBodyStandardProps = { + filter: string; + setFilter: (filterInput: string) => void; + infrasList: Infra[]; + onlySelectionMode: boolean; + onInfraChange?: (infraId: number) => void; +}; // Test coherence between actual & generated version, eg. if editoast is up to date with data -export function editoastUpToDateIndicator(v, genv) { - return ●; +export function editoastUpToDateIndicator( + infraVersion: string, + infraGeneratedVersion: string | null +) { + return ( + + ● + + ); } -export default function InfraSelectorModalBodyStandard(props) { - const { infrasList, filter, setFilter, onlySelectionMode, onInfraChange } = props; - +export default function InfraSelectorModalBodyStandard({ + filter = '', + setFilter, + infrasList, + onlySelectionMode = false, + onInfraChange, +}: InfraSelectorModalBodyStandardProps) { const { t } = useTranslation(['translation', 'infraManagement']); const dispatch = useDispatch(); const infraID = useSelector(getInfraID); const { closeModal } = useContext(ModalContext); - function setInfraID(id) { + function setInfraID(id: number) { dispatch(updateInfraID(id)); if (onInfraChange) onInfraChange(id); dispatch(deleteItinerary()); @@ -83,17 +102,3 @@ export default function InfraSelectorModalBodyStandard(props) { ); } - -InfraSelectorModalBodyStandard.defaultProps = { - filter: '', - onlySelectionMode: false, - onInfraChange: undefined, -}; - -InfraSelectorModalBodyStandard.propTypes = { - filter: PropTypes.string, - infrasList: PropTypes.array.isRequired, - setFilter: PropTypes.func.isRequired, - onlySelectionMode: PropTypes.bool, - onInfraChange: PropTypes.func, -}; From 6e6bbb58eaf6b026b7624c5cdbfc167d8d0ffeb8 Mon Sep 17 00:00:00 2001 From: SharglutDev Date: Fri, 28 Jul 2023 11:24:26 +0200 Subject: [PATCH 8/8] front: fix max infras in the list --- editoast/openapi.yaml | 20 +++++++++++++++++-- editoast/openapi_legacy.yaml | 20 +++++++++++++++++-- .../InfraSelector/InfraSelectorModal.tsx | 6 +++++- front/src/common/api/osrdEditoastApi.ts | 14 ++++++++++--- 4 files changed, 52 insertions(+), 8 deletions(-) diff --git a/editoast/openapi.yaml b/editoast/openapi.yaml index be86cba360e..a62eb35d12d 100644 --- a/editoast/openapi.yaml +++ b/editoast/openapi.yaml @@ -2486,6 +2486,22 @@ paths: description: Check if Editoast is running correctly /infra/: get: + parameters: + - description: Page number + in: query + name: page + schema: + default: 1 + minimum: 1 + type: integer + - description: Number of elements by page + in: query + name: page_size + schema: + default: 25 + maximum: 10000 + minimum: 1 + type: integer responses: '200': content: @@ -2505,8 +2521,8 @@ paths: - next - previous type: object - description: The infra list - summary: List all available infra + description: The infras list + summary: Paginated list of all available infras tags: - infra post: diff --git a/editoast/openapi_legacy.yaml b/editoast/openapi_legacy.yaml index 49e367d48ba..7ddb3c226fa 100644 --- a/editoast/openapi_legacy.yaml +++ b/editoast/openapi_legacy.yaml @@ -173,10 +173,26 @@ paths: get: tags: - infra - summary: List all available infra + summary: Paginated list of all available infras + parameters: + - description: Page number + in: query + name: page + schema: + default: 1 + minimum: 1 + type: integer + - description: Number of elements by page + in: query + name: page_size + schema: + default: 25 + maximum: 10000 + minimum: 1 + type: integer responses: 200: - description: The infra list + description: The infras list content: application/json: schema: diff --git a/front/src/common/InfraSelector/InfraSelectorModal.tsx b/front/src/common/InfraSelector/InfraSelectorModal.tsx index 3ed26db8e73..e8cd1d81735 100644 --- a/front/src/common/InfraSelector/InfraSelectorModal.tsx +++ b/front/src/common/InfraSelector/InfraSelectorModal.tsx @@ -24,7 +24,11 @@ const InfraSelectorModal = ({ const [filter, setFilter] = useState(''); const [filteredInfrasList, setFilteredInfrasList] = useState([]); const [editionMode, setEditionMode] = useState(false); - const { data: infrasList, isSuccess, isLoading } = osrdEditoastApi.useGetInfraQuery(); + const { + data: infrasList, + isSuccess, + isLoading, + } = osrdEditoastApi.useGetInfraQuery({ pageSize: 1000 }); const debouncedFilter = useDebounce(filter, 250); diff --git a/front/src/common/api/osrdEditoastApi.ts b/front/src/common/api/osrdEditoastApi.ts index 3ede3e6be0e..ab08574a01b 100644 --- a/front/src/common/api/osrdEditoastApi.ts +++ b/front/src/common/api/osrdEditoastApi.ts @@ -72,7 +72,10 @@ const injectedRtkApi = api query: () => ({ url: `/health/` }), }), getInfra: build.query({ - query: () => ({ url: `/infra/` }), + query: (queryArg) => ({ + url: `/infra/`, + params: { page: queryArg.page, page_size: queryArg.pageSize }, + }), providesTags: ['infra'], }), postInfra: build.mutation({ @@ -660,13 +663,18 @@ export type GetElectricalProfileSetByIdLevelOrderApiArg = { }; export type GetHealthApiResponse = unknown; export type GetHealthApiArg = void; -export type GetInfraApiResponse = /** status 200 The infra list */ { +export type GetInfraApiResponse = /** status 200 The infras list */ { count: number; next: any; previous: any; results?: Infra[]; }; -export type GetInfraApiArg = void; +export type GetInfraApiArg = { + /** Page number */ + page?: number; + /** Number of elements by page */ + pageSize?: number; +}; export type PostInfraApiResponse = /** status 201 The created infra */ Infra; export type PostInfraApiArg = { /** Name of the infra to create */