Skip to content

Commit 5333ac0

Browse files
andchiindandchiind
committed
Include installation code in URL
1 parent 7d0b499 commit 5333ac0

File tree

9 files changed

+65
-69
lines changed

9 files changed

+65
-69
lines changed

‎frontend/src/components/Contexts/AssetContext.tsx‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -235,7 +235,9 @@ export const AssetProvider: FC<Props> = ({ children }) => {
235235
}, [registerEvent, connectionReady])
236236

237237
const switchInstallation = (selectedName: string) => {
238-
const installation = activeInstallations.find((i) => i.name === selectedName)
238+
const installation = activeInstallations.find(
239+
(i) => i.name === selectedName || i.installationCode === selectedName
240+
)
239241
if (!installation) return
240242
setSelectedInstallation(installation)
241243
window.localStorage.setItem('installation', JSON.stringify(installation))

‎frontend/src/components/Contexts/MissionFilterContext.tsx‎

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -114,10 +114,11 @@ export const MissionFilterProvider: FC<Props> = ({ children }) => {
114114
const [filterState, setFilterState] = useState<IMissionFilterContext['filterState']>(mapURLtoFilter(searchParams))
115115

116116
useEffect(() => {
117-
setSearchParams([])
117+
const newParams = new URLSearchParams()
118118
Object.entries(filterState).forEach((entry) => {
119-
if (entry[1]) setSearchParams({ [entry[0]]: JSON.stringify(entry[1]) })
119+
if (entry[1]) newParams.set(entry[0], JSON.stringify(entry[1]))
120120
})
121+
setSearchParams(newParams, { replace: true })
121122
}, [filterState])
122123

123124
const switchPage = (newPage: number) => {

‎frontend/src/components/Dialogs/MissionEditDialog.tsx‎

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -19,6 +19,7 @@ import { ChangeEvent, useState } from 'react'
1919
import { useNavigate } from 'react-router-dom'
2020
import styled from 'styled-components'
2121
import { formulateAutoScheduleFrequencyAsString } from 'utils/language'
22+
import { useAssetContext } from 'components/Contexts/AssetContext'
2223

2324
const StyledSummary = styled.div`
2425
padding: 16px 8px 0px 8px;
@@ -58,6 +59,7 @@ const StyledTimeChips = styled.div`
5859
const useMissionUpdater = () => {
5960
const { TranslateText } = useLanguageContext()
6061
const { setAlert, setListAlert } = useAlertContext()
62+
const { installationCode } = useAssetContext()
6163
const navigate = useNavigate()
6264

6365
const updateMission = (
@@ -76,7 +78,8 @@ const useMissionUpdater = () => {
7678
BackendAPICaller.updateMissionDefinition(mission.id, form)
7779
.then((missionDefinition) => {
7880
onSuccess()
79-
if (missionDefinition.isDeprecated) navigate(`${config.FRONTEND_BASE_ROUTE}/front-page`)
81+
if (missionDefinition.isDeprecated)
82+
navigate(`${config.FRONTEND_BASE_ROUTE}/${installationCode}/front-page`)
8083
})
8184
.catch(() => {
8285
setAlert(

‎frontend/src/components/Displays/MissionButtons/MissionRestartButton.tsx‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -11,6 +11,7 @@ import { FailedRequestAlertContent, FailedRequestAlertListContent } from 'compon
1111
import { Mission } from 'models/Mission'
1212
import { AlertCategory } from 'components/Alerts/AlertsBanner'
1313
import { ScheduleMissionWithInspectionAreaVerification } from '../InspectionAreaVerificationDialogs/ScheduleMissionWithInspectionAreaVerification'
14+
import { useAssetContext } from 'components/Contexts/AssetContext'
1415

1516
const Centered = styled.div`
1617
display: flex;
@@ -36,6 +37,7 @@ enum ReRunOptions {
3637

3738
export const MissionRestartButton = ({ mission, hasFailedTasks, smallButton }: MissionProps) => {
3839
const { TranslateText } = useLanguageContext()
40+
const { installationCode } = useAssetContext()
3941
const { setAlert, setListAlert } = useAlertContext()
4042
const [isOpen, setIsOpen] = useState<boolean>(false)
4143
const [isLocationVerificationOpen, setIsLocationVerificationOpen] = useState<boolean>(false)
@@ -44,7 +46,7 @@ export const MissionRestartButton = ({ mission, hasFailedTasks, smallButton }: M
4446

4547
const navigate = useNavigate()
4648
const navigateToHome = () => {
47-
const path = `${config.FRONTEND_BASE_ROUTE}/front-page`
49+
const path = `${config.FRONTEND_BASE_ROUTE}/${installationCode}/front-page`
4850
navigate(path)
4951
}
5052

‎frontend/src/components/Header/Header.tsx‎

Lines changed: 4 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -58,18 +58,14 @@ const StyledNavigationMenu = styled.div`
5858

5959
export const Header = ({ page }: { page: string }) => {
6060
const { alerts } = useAlertContext()
61-
const { installationName } = useAssetContext()
61+
const { installationName, installationCode } = useAssetContext()
6262
const navigate = useNavigate()
6363

6464
return (
6565
<>
6666
<StyledTopBar id={FrontPageSectionId.TopBar}>
6767
<StyledWrapper>
68-
<TopBar.Header
69-
onClick={() => {
70-
navigate(findNavigationPage())
71-
}}
72-
>
68+
<TopBar.Header onClick={() => navigate(findNavigationPage(installationCode))}>
7369
<StyledTopBarHeader>
7470
<HandPointer>
7571
<Typography variant="body_short_bold" color="text-primary">
@@ -85,20 +81,10 @@ export const Header = ({ page }: { page: string }) => {
8581
<TopBar.Actions>
8682
<IconStyle>
8783
{page !== 'root' && <AlertIcon />}
88-
<Button
89-
variant="ghost_icon"
90-
onClick={() => {
91-
navigate(`${config.FRONTEND_BASE_ROUTE}/`)
92-
}}
93-
>
84+
<Button variant="ghost_icon" onClick={() => navigate(`${config.FRONTEND_BASE_ROUTE}/`)}>
9485
<Icon name={Icons.Platform} size={24} title="Change Asset" />
9586
</Button>
96-
<Button
97-
variant="ghost_icon"
98-
onClick={() => {
99-
navigate(`${config.FRONTEND_BASE_ROUTE}/info`)
100-
}}
101-
>
87+
<Button variant="ghost_icon" onClick={() => navigate(`${config.FRONTEND_BASE_ROUTE}/info`)}>
10288
<Icon name={Icons.Info} size={24} title="Info Page" />
10389
</Button>
10490
</IconStyle>

‎frontend/src/pages/AssetSelectionPage/AssetSelectionPage.tsx‎

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -105,23 +105,23 @@ export const AssetSelectionPage = () => {
105105
)
106106
}
107107

108-
export const findNavigationPage = () => {
108+
export const findNavigationPage = (installationCode: string) => {
109109
if (window.innerWidth <= 600) {
110-
return `${config.FRONTEND_BASE_ROUTE}/mission-control`
110+
return `${config.FRONTEND_BASE_ROUTE}/${installationCode}/mission-control`
111111
} else {
112-
return `${config.FRONTEND_BASE_ROUTE}/front-page`
112+
return `${config.FRONTEND_BASE_ROUTE}/${installationCode}/front-page`
113113
}
114114
}
115115

116116
const InstallationPicker = () => {
117-
const { installationName, switchInstallation, activeInstallations } = useAssetContext()
117+
const { installationName, switchInstallation, activeInstallations, installationCode } = useAssetContext()
118118
const { TranslateText } = useLanguageContext()
119119
const [selectedInstallation, setSelectedInstallation] = useState<string>(installationName)
120120
const navigate = useNavigate()
121121

122122
const handleClick = () => {
123123
switchInstallation(selectedInstallation)
124-
const target = findNavigationPage()
124+
const target = findNavigationPage(installationCode)
125125
navigate(target)
126126
}
127127

‎frontend/src/pages/FlotillaSite.tsx‎

Lines changed: 15 additions & 26 deletions
Original file line numberDiff line numberDiff line change
@@ -14,43 +14,32 @@ import {
1414
import { InfoPage } from './InfoPage'
1515
import { PageRouter } from './PageRouter'
1616
import { PageNotFound } from './NotFoundPage'
17+
import { useAssetContext } from 'components/Contexts/AssetContext'
1718

1819
export const FlotillaSite = () => {
1920
const frontPageTabOptions = Object.values(TabNames)
21+
const { installationCode } = useAssetContext()
2022

2123
return (
2224
<>
2325
<APIUpdater>
2426
<BrowserRouter>
2527
<Routes>
28+
<Route path={`${config.FRONTEND_BASE_ROUTE}`} element={<AssetSelectionPage />} />
2629
<Route path={`${config.FRONTEND_BASE_ROUTE}/`} element={<AssetSelectionPage />} />
27-
<Route
28-
path={`${config.FRONTEND_BASE_ROUTE}/front-page`}
29-
element={<FrontPage initialTab={frontPageTabOptions[0]} />}
30-
/>
31-
{frontPageTabOptions.map((tab) => (
32-
<Route
33-
key={tab}
34-
path={`${config.FRONTEND_BASE_ROUTE}/front-page-${tab}`}
35-
element={<FrontPage initialTab={tab} />}
36-
/>
37-
))}
30+
<Route path={`${config.FRONTEND_BASE_ROUTE}/${installationCode}/`}>
31+
<Route path={`front-page`} element={<FrontPage activeTab={frontPageTabOptions[0]} />} />
32+
{frontPageTabOptions.map((tab) => (
33+
<Route key={tab} path={`front-page-${tab}`} element={<FrontPage activeTab={tab} />} />
34+
))}
35+
<Route path={`history`} element={<MissionHistoryPage />} />
36+
<Route path={`mission-control`} element={<MissionControlPage />} />
37+
<Route path={`inspection-overview`} element={<AreaOverviewPage />} />
38+
<Route path={`predefined-missions`} element={<PredefinedMissionsPage />} />
39+
<Route path={`auto-schedule`} element={<AutoSchedulePage />} />
40+
<Route path={`robots`} element={<RobotStatusPage />} />
41+
</Route>
3842
<Route path={`${config.FRONTEND_BASE_ROUTE}/:page`} element={<PageRouter />} />
39-
<Route path={`${config.FRONTEND_BASE_ROUTE}/history`} element={<MissionHistoryPage />} />
40-
<Route
41-
path={`${config.FRONTEND_BASE_ROUTE}/mission-control`}
42-
element={<MissionControlPage />}
43-
/>
44-
<Route
45-
path={`${config.FRONTEND_BASE_ROUTE}/inspection-overview`}
46-
element={<AreaOverviewPage />}
47-
/>
48-
<Route
49-
path={`${config.FRONTEND_BASE_ROUTE}/predefined-missions`}
50-
element={<PredefinedMissionsPage />}
51-
/>
52-
<Route path={`${config.FRONTEND_BASE_ROUTE}/auto-schedule`} element={<AutoSchedulePage />} />
53-
<Route path={`${config.FRONTEND_BASE_ROUTE}/robots`} element={<RobotStatusPage />} />
5443
<Route path={`${config.FRONTEND_BASE_ROUTE}/info`} element={<InfoPage />} />
5544
<Route path="*" element={<PageNotFound />} />
5645
</Routes>

‎frontend/src/pages/FrontPage/FrontPage.tsx‎

Lines changed: 4 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@ import { tokens } from '@equinor/eds-tokens'
66
import { MissionControlSection } from './MissionOverview/MissionControlSection'
77
import { redirectIfNoInstallationSelected } from 'utils/RedirectIfNoInstallationSelected'
88
import { AutoScheduleSection } from './AutoScheduleSection/AutoScheduleSection'
9-
import { useState, useMemo, type ReactNode } from 'react'
9+
import { useMemo, type ReactNode } from 'react'
1010
import { Icon, Tabs, Typography } from '@equinor/eds-core-react'
1111
import { useLanguageContext } from 'components/Contexts/LanguageContext'
1212
import { InspectionSection } from '../InspectionPage/InspectionSection'
@@ -94,10 +94,9 @@ type TabDef = {
9494
render: () => ReactNode
9595
}
9696

97-
export const FrontPage = ({ initialTab }: { initialTab: TabNames }) => {
98-
const [activeTab, setActiveTab] = useState<TabNames>(initialTab)
97+
export const FrontPage = ({ activeTab }: { activeTab: TabNames }) => {
9998
const { TranslateText } = useLanguageContext()
100-
const { installationInspectionAreas } = useAssetContext()
99+
const { installationInspectionAreas, installationCode } = useAssetContext()
101100

102101
redirectIfNoInstallationSelected()
103102

@@ -148,9 +147,7 @@ export const FrontPage = ({ initialTab }: { initialTab: TabNames }) => {
148147
else tab = tabs.find((t) => t.name === index)
149148

150149
if (tab === undefined) return
151-
152-
setActiveTab(tab.name)
153-
navigate(`${config.FRONTEND_BASE_ROUTE}/front-page-${tab.name}`)
150+
navigate(`${config.FRONTEND_BASE_ROUTE}/${installationCode}/front-page-${tab.name}`)
154151
}
155152

156153
const setActiveTabToMissionControl = () => goToTab(tabs.findIndex((t) => t.name === TabNames.MissionControl))
@@ -171,7 +168,6 @@ export const FrontPage = ({ initialTab }: { initialTab: TabNames }) => {
171168
<StopRobotDialog />
172169
</StyledTabHeaderRightContent>
173170
</StyledTabHeader>
174-
175171
{tabs[activeIndex]?.render()}
176172
</Tabs>
177173
</StyledFrontPage>

‎frontend/src/pages/NotFoundPage.tsx‎

Lines changed: 24 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,13 @@
1-
import { useNavigate } from 'react-router-dom'
1+
import { matchRoutes, useLocation, useNavigate, useSearchParams } from 'react-router-dom'
22
import { Button, Typography } from '@equinor/eds-core-react'
33
import styled from 'styled-components'
44
import notfound from 'mediaAssets/404notfound.png'
55
import { config } from 'config'
66
import { StyledPage } from 'components/Styles/StyledComponents'
77
import { Header } from 'components/Header/Header'
88
import { phone_width } from 'utils/constants'
9+
import { useEffect } from 'react'
10+
import { useAssetContext } from 'components/Contexts/AssetContext'
911

1012
const StyledPageContent = styled.div`
1113
position: absolute;
@@ -51,6 +53,26 @@ const StyledButton = styled(Button)`
5153

5254
export const PageNotFound = () => {
5355
const navigate = useNavigate()
56+
// eslint-disable-next-line @typescript-eslint/no-unused-vars
57+
const [searchParams, setSearchParams] = useSearchParams()
58+
const location = useLocation()
59+
const { switchInstallation, installationCode, activeInstallations } = useAssetContext()
60+
61+
useEffect(() => {
62+
if (activeInstallations) {
63+
const route = matchRoutes([{ path: '/:installationCode/*' }], location)
64+
if (!route) return
65+
const installationCode = route![0].params.installationCode
66+
switchInstallation(installationCode!)
67+
}
68+
}, [activeInstallations])
69+
70+
useEffect(() => {
71+
let params = ''
72+
if (searchParams) params = `?${searchParams.toString()}`
73+
if (installationCode) navigate(`${config.FRONTEND_BASE_ROUTE}${location.pathname}${params}`)
74+
}, [installationCode])
75+
5476
return (
5577
<>
5678
<Header page={'404'} />
@@ -61,12 +83,7 @@ export const PageNotFound = () => {
6183
<StyledTypography variant="h3">
6284
{"We couldn't find the page you're looking for."}
6385
</StyledTypography>
64-
<StyledButton
65-
color="secondary"
66-
onClick={() => {
67-
navigate(`${config.FRONTEND_BASE_ROUTE}/front-page`)
68-
}}
69-
>
86+
<StyledButton color="secondary" onClick={() => navigate(`${config.FRONTEND_BASE_ROUTE}`)}>
7087
{"Let's go back"}
7188
</StyledButton>
7289
</StyledActions>

0 commit comments

Comments
 (0)