use usegoback (#873)

InseeFr · Aug 2, 2024 · fb277c9 · fb277c9
1 parent 278d315
commit fb277c9
Show file tree

Hide file tree

Showing 7 changed files with 48 additions and 46 deletions.
diff --git a/src/js/applications/codelists/components/codelist-detail/view-container.js b/src/js/applications/codelists/components/codelist-detail/view-container.js
@@ -1,7 +1,7 @@
 import { useState, useEffect, useCallback } from 'react';
 import { useSelector } from 'react-redux';
 import { useParams } from 'react-router-dom';
-import { goBack } from '@inseefr/wilco';
+import { useGoBack } from '../../../../new-architecture/utils/hooks/useGoBack';
 import { Loading } from '../../../../new-architecture/components/loading/loading';
 import { Stores } from '../../../../utils';
 import { formatCodeList } from '../../utils';
@@ -11,6 +11,8 @@ import ComponentTitle from './title';
 import { CodeListDetailView } from './view';
 
 const CodelistComponentView = (props) => {
+	const goBack = useGoBack();
+
 	const secondLang = useSelector(Stores.SecondLang.getSecondLang);
 	const { id } = useParams();
 	const [loading, setLoading] = useState(true);
@@ -19,9 +21,7 @@ const CodelistComponentView = (props) => {
 	const [modalOpened, setModalOpened] = useState(false);
 	const [serverSideError, setServerSideError] = useState('');
 
-	const handleBack = useCallback(() => {
-		goBack(props, '/codelists')();
-	}, [props]);
+	const handleBack = useCallback(() => goBack('/codelists'), [goBack]);
 
 	const publish = () => {
 		setPublishing(true);
@@ -44,14 +44,14 @@ const CodelistComponentView = (props) => {
 			.then(() => {
 				setLoading(false);
 				setModalOpened(false);
-				goBack(props, '/codelists')();
+				goBack('/codelists');
 			})
 			.catch((error) => {
 				setServerSideError(D['errors_' + JSON.parse(error).code]);
 				setLoading(false);
 				setModalOpened(false);
 			});
-	}, [id, props]);
+	}, [id, goBack]);
 
 	useEffect(() => {
 		API.getDetailedCodelist(id)

diff --git a/src/js/applications/datasets/datasets/edit/edit.js b/src/js/applications/datasets/datasets/edit/edit.js
@@ -10,13 +10,7 @@ import {
 	GlobalClientSideErrorBloc,
 } from '../../../../new-architecture/components';
 
-import {
-	ActionToolbar,
-	CancelButton,
-	goBack,
-	goBackOrReplace,
-	SaveButton,
-} from '@inseefr/wilco';
+import { ActionToolbar, CancelButton, SaveButton } from '@inseefr/wilco';
 import { Auth, PageTitleBlock, useTitle } from '../../../../utils';
 import { GlobalInformation } from './tabs/global-information';
 import { InternalManagement } from './tabs/internal-management';
@@ -25,11 +19,14 @@ import { StatisticalInformation } from './tabs/statistical-information';
 import { LayoutWithLateralMenu } from './layout-with-lateral-menu';
 import { validate } from './validation';
 import './edit.scss';
+import { useGoBack } from '../../../../new-architecture/utils/hooks/useGoBack';
 
 export const DatasetEdit = (props) => {
 	const { id } = useParams();
 	const isEditing = !!id;
 
+	const goBack = useGoBack();
+
 	const [editingDataset, setEditingDataset] = useState({});
 	const [clientSideErrors, setClientSideErrors] = useState({});
 	const [submitting, setSubmitting] = useState(false);
@@ -160,7 +157,7 @@ export const DatasetEdit = (props) => {
 			}
 			queryClient.invalidateQueries(['datasets']);
 
-			goBackOrReplace(props, `/datasets/${id}`, !isEditing);
+			goBack(`/datasets/${id}`, !isEditing);
 		},
 	});
 
@@ -205,7 +202,7 @@ export const DatasetEdit = (props) => {
 			)}
 
 			<ActionToolbar>
-				<CancelButton action={goBack(props, '/datasets')} />
+				<CancelButton action={() => goBack('/datasets')} />
 				<SaveButton
 					action={onSubmit}
 					disabled={clientSideErrors.errorMessage?.length > 0}

diff --git a/src/js/applications/datasets/datasets/view/menu.js b/src/js/applications/datasets/datasets/view/menu.js
@@ -2,16 +2,18 @@ import {
 	ActionToolbar,
 	Button,
 	DeleteButton,
-	goBack,
 	ReturnButton,
 } from '@inseefr/wilco';
 import { Auth } from '../../../../utils';
 import D from '../../../../i18n/build-dictionary';
 import { useSelector } from 'react-redux';
 import { UNPUBLISHED } from '../../../../new-architecture/model/ValidationState';
 import { ValidationButton } from '../../../../new-architecture/components';
+import { useGoBack } from '../../../../new-architecture/utils/hooks/useGoBack';
 
 export const ViewMenu = ({ dataset, onPublish, onDelete, ...props }) => {
+	const goBack = useGoBack();
+
 	const permission = useSelector(Auth.getPermission);
 
 	const hasDatasetRightsBasedOnStamp =
@@ -21,7 +23,7 @@ export const ViewMenu = ({ dataset, onPublish, onDelete, ...props }) => {
 
 	return (
 		<ActionToolbar>
-			<ReturnButton action={goBack(props, '/datasets')} />
+			<ReturnButton action={() => goBack('/datasets')} />
 
 			{(isAdmin || hasDatasetRightsBasedOnStamp) && (
 				<ValidationButton object={dataset} callback={onPublish} />

diff --git a/src/js/applications/datasets/distributions/edit.js b/src/js/applications/datasets/distributions/edit.js
@@ -2,12 +2,9 @@ import { EditorMarkdown, PageTitleBlock, useTitle } from '../../../utils';
 import {
 	ActionToolbar,
 	CancelButton,
-	goBack,
-	goBackOrReplace,
 	LabelRequired,
 	SaveButton,
 } from '@inseefr/wilco';
-
 import { useEffect, useState } from 'react';
 import { useParams } from 'react-router-dom';
 import { useMutation, useQueryClient } from '@tanstack/react-query';
@@ -24,11 +21,14 @@ import {
 	ClientSideError,
 	GlobalClientSideErrorBloc,
 } from '../../../new-architecture/components';
+import { useGoBack } from '../../../new-architecture/utils/hooks/useGoBack';
 
 export const DistributionEdit = (props) => {
 	const { id } = useParams();
 	const isEditing = !!id;
 
+	const goBack = useGoBack();
+
 	const [editingDistribution, setEditingDistribution] = useState({});
 	const [clientSideErrors, setClientSideErrors] = useState({});
 	const [submitting, setSubmitting] = useState(false);
@@ -64,7 +64,7 @@ export const DistributionEdit = (props) => {
 			}
 			queryClient.invalidateQueries(['distributions']);
 
-			goBackOrReplace(props, `/datasets/distributions/${id}`, !isEditing);
+			goBack(`/datasets/distributions/${id}`, !isEditing);
 		},
 	});
 
@@ -102,7 +102,7 @@ export const DistributionEdit = (props) => {
 			)}
 
 			<ActionToolbar>
-				<CancelButton action={goBack(props, '/datasets/distributions')} />
+				<CancelButton action={() => goBack('/datasets/distributions')} />
 				<SaveButton
 					action={onSubmit}
 					disabled={clientSideErrors.errorMessage?.length > 0}

diff --git a/src/js/applications/datasets/distributions/view/menu.js b/src/js/applications/datasets/distributions/view/menu.js
@@ -2,21 +2,24 @@ import {
 	ActionToolbar,
 	Button,
 	DeleteButton,
-	goBack,
 	ReturnButton,
 } from '@inseefr/wilco';
 import { Auth } from '../../../../utils';
 import { useSelector } from 'react-redux';
 import D from '../../../../i18n/build-dictionary';
 import { UNPUBLISHED } from '../../../../new-architecture/model/ValidationState';
 import { ValidationButton } from '../../../../new-architecture/components';
+import { useGoBack } from '../../../../new-architecture/utils/hooks/useGoBack';
+
 export const ViewMenu = ({
 	distribution,
 	dataset,
 	onPublish,
 	onDelete,
 	...props
 }) => {
+	const goBack = useGoBack();
+
 	const permission = useSelector(Auth.getPermission);
 
 	const hasDatasetRightsBasedOnStamp =
@@ -26,7 +29,7 @@ export const ViewMenu = ({
 
 	return (
 		<ActionToolbar>
-			<ReturnButton action={goBack(props, '/datasets/distributions')} />
+			<ReturnButton action={() => goBack('/datasets/distributions')} />
 
 			{(isAdmin || hasDatasetRightsBasedOnStamp) && (
 				<ValidationButton object={distribution} callback={onPublish} />

diff --git a/src/js/applications/structures/components/component-detail/edit-container.js b/src/js/applications/structures/components/component-detail/edit-container.js
@@ -1,7 +1,6 @@
 import { useState, useEffect, useCallback } from 'react';
 import { Loading } from '../../../../new-architecture/components/loading/loading';
-
-import { goBack, goBackOrReplace } from '@inseefr/wilco';
+import { useGoBack } from '../../../../new-architecture/utils/hooks/useGoBack';
 import { DumbComponentDetailEdit } from './edit';
 import api from '../../apis/structure-api';
 import { getFormattedCodeList } from '../../apis';
@@ -10,6 +9,8 @@ import { useParams } from 'react-router-dom';
 import { useStampsOptions } from '../../../../new-architecture/utils/hooks/stamps';
 
 const EditContainer = (props) => {
+	const goBack = useGoBack();
+
 	const { id } = useParams();
 	const urlParams = new URLSearchParams(window.location.search);
 	const type = urlParams.get('type');
@@ -23,9 +24,10 @@ const EditContainer = (props) => {
 
 	const stampListOptions = useStampsOptions();
 
-	const handleBack = useCallback(() => {
-		goBack(props, '/structures/components')();
-	}, [props]);
+	const handleBack = useCallback(
+		() => goBack('/structures/components'),
+		[goBack]
+	);
 
 	const handleSave = useCallback(
 		(component) => {
@@ -41,20 +43,16 @@ const EditContainer = (props) => {
 			}
 
 			request
-				.then((id = component.id) => {
-					return goBackOrReplace(
-						props,
-						`/structures/components/${id}`,
-						!component.id
-					);
-				})
+				.then((id = component.id) =>
+					goBack(`/structures/components/${id}`, !component.id)
+				)
 				.catch((error) => {
 					setComponent(component);
 					setServerSideError(error);
 				})
 				.finally(() => setSaving(false));
 		},
-		[props]
+		[goBack]
 	);
 
 	useEffect(() => {

diff --git a/src/js/applications/structures/components/component-detail/view-container.js b/src/js/applications/structures/components/component-detail/view-container.js
@@ -1,7 +1,6 @@
 import { useState, useEffect, useCallback } from 'react';
-import { goBack } from '@inseefr/wilco';
+import { useGoBack } from '../../../../new-architecture/utils/hooks/useGoBack';
 import { Loading } from '../../../../new-architecture/components';
-
 import { ComponentDetailView } from './view';
 import api from '../../apis/structure-api';
 import { getFormattedCodeList } from '../../apis/code-list';
@@ -12,6 +11,8 @@ import { useSelector } from 'react-redux';
 import { useParams } from 'react-router-dom';
 
 const ViewContainer = (props) => {
+	const goBack = useGoBack();
+
 	const secondLang = useSelector(Stores.SecondLang.getSecondLang);
 	const { id } = useParams();
 	const [loading, setLoading] = useState(true);
@@ -25,16 +26,17 @@ const ViewContainer = (props) => {
 		return { lg1, lg2 };
 	});
 
-	const handleBack = useCallback(() => {
-		goBack(props, '/structures/components')();
-	}, [props]);
+	const handleBack = useCallback(
+		() => goBack('/structures/components'),
+		[goBack]
+	);
 
 	const handleDelete = useCallback(() => {
 		setLoading(true);
-		api.deleteMutualizedComponent(id).then(() => {
-			goBack(props, '/structures/components')();
-		});
-	}, [id, props]);
+		api
+			.deleteMutualizedComponent(id)
+			.then(() => goBack('/structures/components'));
+	}, [id, goBack]);
 
 	useEffect(() => {
 		Promise.all([