Use session storage for project id and update routing (#3665)

porter-dev · Sep 27, 2023 · 788708f · 788708f
1 parent e803393
commit 788708f
Show file tree

Hide file tree

Showing 3 changed files with 19 additions and 9 deletions.
diff --git a/dashboard/src/main/home/onboarding/Routes.tsx b/dashboard/src/main/home/onboarding/Routes.tsx
@@ -1,20 +1,24 @@
-import React from "react";
+import React, { useContext } from "react";
 import { Route, Switch } from "react-router";
+import { Context } from "shared/Context";
 import PorterErrorBoundary from "shared/error_handling/PorterErrorBoundary";
 import { OFState } from "./state";
 import ConnectRegistry from "./steps/ConnectRegistry/ConnectRegistry";
 import ConnectSource from "./steps/ConnectSource";
 import ProvisionResources from "./steps/ProvisionResources/ProvisionResources";
 
 export const Routes = () => {
+  const context = useContext(Context);
+  const { currentProject } = context;
+
   return (
     <>
       <PorterErrorBoundary
         errorBoundaryLocation="onboarding"
         tags={{ scope: "onboarding" }}
       >
         <Switch>
-          <Route path={`/onboarding/source`}>
+          <Route path={`/onboarding/source/${currentProject}`}>
             <ConnectSource
               onSuccess={(data) => OFState.actions.nextStep("continue", data)}
             />
@@ -36,4 +40,4 @@ export const Routes = () => {
   );
 };
 
-export default Routes;
+export default Routes;
diff --git a/dashboard/src/main/home/onboarding/state/StepHandler.ts b/dashboard/src/main/home/onboarding/state/StepHandler.ts
@@ -41,7 +41,7 @@ const flow: FlowType = {
   initial: "connect_source",
   steps: {
     connect_source: {
-      url: "/onboarding/source",
+      url: "/onboarding/source/",
       on: {
         continue: "connect_registry",
       },
@@ -288,7 +288,7 @@ export const useSteps = (isParentLoading?: boolean) => {
   const snap = useSnapshot(StepHandler);
   const location = useLocation();
   const { pushFiltered } = useRouting();
-  const { setHasFinishedOnboarding } = useContext(Context);
+  const { setHasFinishedOnboarding, currentProject } = useContext(Context);
 
   useEffect(() => {
     if (isParentLoading) {
@@ -298,6 +298,12 @@ export const useSteps = (isParentLoading?: boolean) => {
       StepHandler.actions.clearState();
       setHasFinishedOnboarding(true);
     }
-    pushFiltered(snap.currentStep.url, ["tab"]);
+    if (currentProject && currentProject.id) {
+      pushFiltered(`${snap.currentStep.url}?project_id=${currentProject.id}`, ["tab"]);
+    } else {
+      pushFiltered(snap.currentStep.url, ["tab"]);
+    }
+
   }, [location.pathname, snap.currentStep?.url, isParentLoading]);
 };
+
diff --git a/dashboard/src/shared/Context.tsx b/dashboard/src/shared/Context.tsx
@@ -116,12 +116,12 @@ class ContextProvider extends Component<PropsType, StateType> {
     currentProject: null,
     setCurrentProject: (currentProject: ProjectType, callback?: any) => {
       if (currentProject) {
-        localStorage.setItem("currentProject", currentProject.id.toString());
+        sessionStorage.setItem("currentProject", currentProject.id.toString());
         pushQueryParams(this.props, {
           project_id: currentProject.id.toString(),
         });
       } else {
-        localStorage.removeItem("currentProject");
+        sessionStorage.removeItem("currentProject");
       }
       this.setState({ currentProject }, () => {
         callback && callback();
@@ -216,4 +216,4 @@ class ContextProvider extends Component<PropsType, StateType> {
   }
 }
 
-export { Context, ContextProvider, ContextConsumer };
+export { Context, ContextProvider, ContextConsumer };