('configure');
const [environment, setEnvironment] = useState('');
const [importPayload, setImportPayload] = useState('');
@@ -135,6 +141,7 @@ export const ImportModal = ({ open, setOpen, project }: IImportModalProps) => {
environment={environment}
payload={importPayload}
onClose={close}
+ onImport={onImport}
/>
}
/>
diff --git a/frontend/src/component/project/Project/Import/import/ImportStage.tsx b/frontend/src/component/project/Project/Import/import/ImportStage.tsx
index 192788edc4..337a6ae0fd 100644
--- a/frontend/src/component/project/Project/Import/import/ImportStage.tsx
+++ b/frontend/src/component/project/Project/Import/import/ImportStage.tsx
@@ -12,8 +12,6 @@ import { PulsingAvatar } from '../PulsingAvatar';
import { ConditionallyRender } from 'component/common/ConditionallyRender/ConditionallyRender';
import { Box } from '@mui/system';
import { useChangeRequestsEnabled } from 'hooks/useChangeRequestsEnabled';
-import useProject from 'hooks/api/getters/useProject/useProject';
-import { usePendingChangeRequests } from 'hooks/api/getters/usePendingChangeRequests/usePendingChangeRequests';
export const ImportStatusArea = styled(Box)(({ theme }) => ({
padding: theme.spacing(4, 2, 2, 2),
@@ -63,19 +61,16 @@ export const ImportStage: FC<{
project: string;
payload: string;
onClose: () => void;
-}> = ({ environment, project, payload, onClose }) => {
+ onImport: () => void;
+}> = ({ environment, project, payload, onClose, onImport }) => {
const { createImport, loading, errors } = useImportApi();
- const { refetch: refreshProject } = useProject(project);
- const { refetch: refreshChangeRequests } =
- usePendingChangeRequests(project);
const { setToastData } = useToast();
const { isChangeRequestConfigured } = useChangeRequestsEnabled(project);
useEffect(() => {
createImport({ environment, project, data: JSON.parse(payload) })
.then(() => {
- refreshProject();
- refreshChangeRequests();
+ onImport();
})
.catch((error) => {
setToastData({
diff --git a/frontend/src/component/project/Project/Import/useRefreshOnImport.ts b/frontend/src/component/project/Project/Import/useRefreshOnImport.ts
new file mode 100644
index 0000000000..a0d9314d21
--- /dev/null
+++ b/frontend/src/component/project/Project/Import/useRefreshOnImport.ts
@@ -0,0 +1,16 @@
+import { usePendingChangeRequests } from 'hooks/api/getters/usePendingChangeRequests/usePendingChangeRequests';
+import { useState } from 'react';
+
+export const useRefreshOnImport = (projectId: string) => {
+ const { refetch: refreshChangeRequests } =
+ usePendingChangeRequests(projectId);
+ const [projectKey, setProjectKey] = useState(projectId);
+ const refreshProjectOverviewKey = () => {
+ setProjectKey(projectId + Date.now());
+ };
+ const refreshOnImport = () => {
+ refreshChangeRequests();
+ refreshProjectOverviewKey();
+ };
+ return { refreshOnImport, projectKey };
+};
diff --git a/frontend/src/component/project/Project/Project.tsx b/frontend/src/component/project/Project/Project.tsx
index 07fbb9c377..b29bdd08ca 100644
--- a/frontend/src/component/project/Project/Project.tsx
+++ b/frontend/src/component/project/Project/Project.tsx
@@ -14,7 +14,7 @@ import {
StyledTabContainer,
StyledTopRow,
} from './Project.styles';
-import { Box, Paper, Tabs, Typography, styled } from '@mui/material';
+import { Box, Paper, styled, Tabs, Typography } from '@mui/material';
import FileUpload from '@mui/icons-material/FileUpload';
import useToast from 'hooks/useToast';
import useQueryParams from 'hooks/useQueryParams';
@@ -43,6 +43,7 @@ import { HiddenProjectIconWithTooltip } from './HiddenProjectIconWithTooltip/Hid
import { ChangeRequestPlausibleProvider } from 'component/changeRequest/ChangeRequestContext';
import { ProjectApplications } from '../ProjectApplications/ProjectApplications';
import { ProjectInsights } from './ProjectInsights/ProjectInsights';
+import { useRefreshOnImport } from './Import/useRefreshOnImport';
const StyledBadge = styled(Badge)(({ theme }) => ({
position: 'absolute',
@@ -190,6 +191,8 @@ export const Project = () => {
);
+ const { refreshOnImport, projectKey } = useRefreshOnImport(projectId);
+
return (
@@ -324,12 +327,16 @@ export const Project = () => {
/>
} />
} />
- } />
+ }
+ />
);
diff --git a/frontend/src/component/project/Project/ProjectOverview.tsx b/frontend/src/component/project/Project/ProjectOverview.tsx
index 218c13c864..5ac3a94720 100644
--- a/frontend/src/component/project/Project/ProjectOverview.tsx
+++ b/frontend/src/component/project/Project/ProjectOverview.tsx
@@ -34,7 +34,8 @@ const StyledContentContainer = styled(Box)(({ theme }) => ({
const ProjectOverview: FC<{
storageKey?: string;
-}> = ({ storageKey = 'project-overview-v2' }) => {
+ key: string;
+}> = ({ key, storageKey = 'project-overview-v2' }) => {
const projectId = useRequiredPathParam('projectId');
const projectName = useProjectOverviewNameOrId(projectId);
@@ -49,7 +50,7 @@ const ProjectOverview: FC<{
}, [projectId, setLastViewed]);
return (
-
+