diff --git a/src/utils/tests.tsx b/src/utils/tests.tsx index 7ca325c3..196f804e 100644 --- a/src/utils/tests.tsx +++ b/src/utils/tests.tsx @@ -1,6 +1,7 @@ import { render, RenderResult } from "@testing-library/react"; import { SnackbarProvider } from "@eyeseetea/d2-ui-components"; import { ReactNode } from "react"; +import { MemoryRouter } from "react-router-dom"; import { AppContext, AppContextState } from "../webapp/contexts/app-context"; import { getTestCompositionRoot } from "../CompositionRoot"; import { createAdminUser } from "../domain/entities/__tests__/userFixtures"; @@ -84,9 +85,11 @@ export function getReactComponent(children: ReactNode): RenderResult { - - {children} - + + + {children} + + diff --git a/src/webapp/components/im-team-hierarchy/IMTeamHierarchyView.tsx b/src/webapp/components/im-team-hierarchy/IMTeamHierarchyView.tsx index 45a43ccb..385359de 100644 --- a/src/webapp/components/im-team-hierarchy/IMTeamHierarchyView.tsx +++ b/src/webapp/components/im-team-hierarchy/IMTeamHierarchyView.tsx @@ -45,7 +45,9 @@ export const IMTeamHierarchyView: React.FC = React.mem return ( - + + + {isSelectable && searchTerm && selectedItemIds && selectedItemIds?.length > 0 ? ( {i18n.t( @@ -103,12 +105,14 @@ const StyledIMTeamHierarchyView = styled(TreeViewMUI)` const ContentWrapper = styled.div` display: flex; flex-direction: column; - /* gap: 8px; */ `; const CountSelectionText = styled.span` - margin-block-start: 10px; font-weight: 400; font-size: 0.875rem; color: ${props => props.theme.palette.common.grey900}; `; + +const SearchInputContainer = styled.div` + margin-block-end: 10px; +`; diff --git a/src/webapp/components/layout/side-bar/SideBarContent.tsx b/src/webapp/components/layout/side-bar/SideBarContent.tsx index 2bc100eb..4d7310d0 100644 --- a/src/webapp/components/layout/side-bar/SideBarContent.tsx +++ b/src/webapp/components/layout/side-bar/SideBarContent.tsx @@ -1,7 +1,7 @@ import { List, ListItem, ListItemText } from "@material-ui/core"; import React, { useCallback } from "react"; import styled from "styled-components"; -import { NavLink } from "react-router-dom"; +import { NavLink, useLocation } from "react-router-dom"; import { AddCircleOutline } from "@material-ui/icons"; import i18n from "../../../../utils/i18n"; import { Button } from "../../button/Button"; @@ -46,6 +46,7 @@ export const SideBarContent: React.FC = React.memo( ({ children, hideOptions = false, showCreateEvent = false }) => { const { goTo } = useRoutes(); const { getCurrentEventTracker } = useCurrentEventTracker(); + const location = useLocation(); const goToCreateEvent = useCallback(() => { goTo(RouteName.CREATE_FORM, { formType: "disease-outbreak-event" }); @@ -63,24 +64,25 @@ export const SideBarContent: React.FC = React.memo( ) : ( - {DEFAULT_SIDEBAR_OPTIONS.map(({ text, value }) => ( - - - - ))} + {DEFAULT_SIDEBAR_OPTIONS.map(({ text, value }) => { + const route = + value === RouteName.EVENT_TRACKER || + value === RouteName.IM_TEAM_BUILDER + ? routes[value].replace( + ":id", + getCurrentEventTracker()?.id || "" + ) + : routes[value]; + + return ( + + + + ); + })} )} diff --git a/src/webapp/contexts/CurrentEventTrackerProvider.tsx b/src/webapp/contexts/CurrentEventTrackerProvider.tsx index 47af0b48..1c8ace4c 100644 --- a/src/webapp/contexts/CurrentEventTrackerProvider.tsx +++ b/src/webapp/contexts/CurrentEventTrackerProvider.tsx @@ -10,6 +10,7 @@ export const CurrentEventTrackerContextProvider: React.FC = ( setCurrentEventTracker(EventTrackerDetails); localStorage.setItem("currentEventTracker", JSON.stringify(EventTrackerDetails)); }, []); + const resetCurrentEventTracker = useCallback(() => { setCurrentEventTracker(undefined); localStorage.removeItem("currentEventTracker"); @@ -19,8 +20,10 @@ export const CurrentEventTrackerContextProvider: React.FC = ( if (currentEventTracker) { return currentEventTracker; } + const localCurrentEventTracker = localStorage.getItem("currentEventTracker"); if (localCurrentEventTracker) { + setCurrentEventTracker(JSON.parse(localCurrentEventTracker) as DiseaseOutbreakEvent); return JSON.parse(localCurrentEventTracker); } return undefined; diff --git a/src/webapp/pages/form-page/useForm.ts b/src/webapp/pages/form-page/useForm.ts index 3a1efcb3..aa8c2394 100644 --- a/src/webapp/pages/form-page/useForm.ts +++ b/src/webapp/pages/form-page/useForm.ts @@ -22,7 +22,6 @@ import { } from "./incident-action/mapIncidentActionToInitialFormState"; import { useExistingEventTrackerTypes } from "../../contexts/existing-event-tracker-types-context"; import { useCheckWritePermission } from "../../hooks/useHasCurrentUserCaptureAccess"; -import { DiseaseOutbreakEvent } from "../../../domain/entities/disease-outbreak-event/DiseaseOutbreakEvent"; export type GlobalMessage = { text: string; @@ -65,21 +64,11 @@ export function useForm(formType: FormType, id?: Id): State { const [configurableForm, setConfigurableForm] = useState(); const [formLabels, setFormLabels] = useState(); const [isLoading, setIsLoading] = useState(false); - const [currentEventTrackerState, setCurrentEventTrackerState] = - useState>(); const currentEventTracker = getCurrentEventTracker(); const { existingEventTrackerTypes } = useExistingEventTrackerTypes(); useCheckWritePermission(formType); useEffect(() => { - // NOTICE: This if is to avoid infinite loop when the form page is reloaded from browser - if ( - currentEventTrackerState && - currentEventTracker && - currentEventTrackerState.id === currentEventTracker.id - ) - return; - compositionRoot.getConfigurableForm .execute(formType, currentEventTracker, configurations, id) .run( @@ -90,7 +79,6 @@ export function useForm(formType: FormType, id?: Id): State { kind: "loaded", data: mapEntityToFormState(formData, !!id, existingEventTrackerTypes), }); - setCurrentEventTrackerState(currentEventTracker); }, error => { setFormState({ @@ -101,14 +89,12 @@ export function useForm(formType: FormType, id?: Id): State { text: i18n.t(`An error occurred while loading form: ${error.message}`), type: "error", }); - setCurrentEventTrackerState(currentEventTracker); } ); }, [ compositionRoot.getConfigurableForm, configurations, currentEventTracker, - currentEventTrackerState, existingEventTrackerTypes, formType, id,