diff --git a/typescript/frontend-marios2/src/content/dashboards/Installations/Installation.tsx b/typescript/frontend-marios2/src/content/dashboards/Installations/Installation.tsx index d4311ff40..b4b572cc0 100644 --- a/typescript/frontend-marios2/src/content/dashboards/Installations/Installation.tsx +++ b/typescript/frontend-marios2/src/content/dashboards/Installations/Installation.tsx @@ -133,7 +133,10 @@ function Installation(props: singleInstallationProps) { const s3Credentials = { s3Bucket, ...S3data }; useEffect(() => { - if (installationId == props.current_installation.id) { + if ( + installationId == props.current_installation.id && + (currentTab == 'live' || currentTab == 'configuration') + ) { let isMounted = true; setFormValues(props.current_installation); setErrorLoadingS3Data(false); @@ -193,7 +196,7 @@ function Installation(props: singleInstallationProps) { clearInterval(interval); }; } - }, [installationId]); + }, [installationId, currentTab]); if (installationId == props.current_installation.id) { return ( diff --git a/typescript/frontend-marios2/src/content/dashboards/Installations/index.tsx b/typescript/frontend-marios2/src/content/dashboards/Installations/index.tsx index cb1d4ea9f..9b4041957 100644 --- a/typescript/frontend-marios2/src/content/dashboards/Installations/index.tsx +++ b/typescript/frontend-marios2/src/content/dashboards/Installations/index.tsx @@ -27,10 +27,11 @@ function InstallationTabs() { const searchParams = new URLSearchParams(location.search); const installationId = parseInt(searchParams.get('installation')); + //const currentTab = searchParams.get('tab'); const [singleInstallationID, setSingleInstallationID] = useState(-1); const context = useContext(UserContext); const { currentUser, setUser } = context; - const [currentTab, setCurrentTab] = useState('list'); + const [currentTab, setCurrentTab] = useState(searchParams.get('tab')); const { installations, fetchAllInstallations } = useContext(InstallationsContext); @@ -49,10 +50,16 @@ function InstallationTabs() { } if (installations.length === 1) { - navigate(`list?installation=${installations[0].id}&tab=live`, { - replace: true - }); - setCurrentTab('live'); + if (!currentTab) { + navigate(`?installation=${installationId}&tab=live`, { + replace: true + }); + setCurrentTab('live'); + } else { + navigate(`?installation=${installationId}&tab=${currentTab}`, { + replace: true + }); + } } else { if ( location.pathname === '/installations' || @@ -61,17 +68,29 @@ function InstallationTabs() { navigate(routes.installations + routes.list, { replace: true }); - } else if (location.pathname === '/installations/tree/') { + } else if ( + location.pathname === '/installations/tree/' && + !installationId + ) { setCurrentTab('tree'); - } else if (location.pathname === '/installations/list/') { + } else if ( + location.pathname === '/installations/list/' && + !installationId + ) { setCurrentTab('list'); } if (installationId) { - navigate(`?installation=${installationId}&tab=live`, { - replace: true - }); - setCurrentTab('live'); + if (currentTab == 'list' || currentTab == 'tree') { + navigate(`?installation=${installationId}&tab=live`, { + replace: true + }); + setCurrentTab('live'); + } else { + navigate(`?installation=${installationId}&tab=${currentTab}`, { + replace: true + }); + } } } }, [location.pathname, navigate, installationId, installations]); diff --git a/typescript/frontend-marios2/src/content/dashboards/Installations/installationForm.tsx b/typescript/frontend-marios2/src/content/dashboards/Installations/installationForm.tsx index 0456de833..935666a8c 100644 --- a/typescript/frontend-marios2/src/content/dashboards/Installations/installationForm.tsx +++ b/typescript/frontend-marios2/src/content/dashboards/Installations/installationForm.tsx @@ -29,9 +29,10 @@ function installationForm(props: installationFormProps) { region: '', location: '', country: '', + vpnIp: '', orderNumbers: '' }); - const requiredFields = ['name', 'region', 'location', 'country']; + const requiredFields = ['name', 'region', 'location', 'country', 'vpnIp']; const tokencontext = useContext(TokenContext); const { removeToken } = tokencontext; @@ -151,6 +152,18 @@ function installationForm(props: installationFormProps) { error={formValues.country === ''} /> +
+ } + name="VpnIp" + value={formValues.vpnIp} + onChange={handleChange} + fullWidth + required + error={formValues.vpnIp === ''} + /> +
+
{ const csvContent = item.value; pathsToSearch.forEach((path) => { diff --git a/typescript/frontend-marios2/src/contexts/WebSocketContextProvider.tsx b/typescript/frontend-marios2/src/contexts/WebSocketContextProvider.tsx index 5820f6479..eff71aabe 100644 --- a/typescript/frontend-marios2/src/contexts/WebSocketContextProvider.tsx +++ b/typescript/frontend-marios2/src/contexts/WebSocketContextProvider.tsx @@ -44,7 +44,7 @@ const WebSocketContextProvider = ({ children }: { children: ReactNode }) => { if (socket.readyState === WebSocket.OPEN) { socket.send(JSON.stringify([-1])); } - }, 10000); // Send a ping every 5 seconds + }, 10000); // Send a ping every 10 seconds // Listen for messages socket.addEventListener('message', (event) => { @@ -54,7 +54,7 @@ const WebSocketContextProvider = ({ children }: { children: ReactNode }) => { const installation_id = message.id; const status = message.status; - console.log('Message from server ', installation_id, status); + //console.log('Message from server ', installation_id, status); setInstallationStatus((prevStatus) => { // Create a new object by spreading the previous state