Redirect to correct path

turbot · MichaelBurgess · Nov 5, 2024 · Nov 6, 2024 · Nov 6, 2024 · Nov 6, 2024
commit 1535b62cd1dd8f4d940153ca286570d03b92c653
diff --git a/ui/dashboard/src/App.tsx b/ui/dashboard/src/App.tsx
@@ -40,6 +40,7 @@ const DashboardApp = ({
     <Routes>
       <Route path="/" element={dashboards} />
       <Route path="/snapshot/:dashboard_name" element={dashboards} />
+      {/*<Route path="/snapshot_diff/:dashboard_name" element={dashboards} />*/}
       <Route path="/:dashboard_name" element={dashboards} />
     </Routes>
   );

diff --git a/ui/dashboard/src/components/DashboardList/index.tsx b/ui/dashboard/src/components/DashboardList/index.tsx
@@ -468,10 +468,10 @@ const DashboardList = () => {
 
 const DashboardListWrapper = ({ wrapperClassName = "" }) => {
   const { dashboard_name } = useParams();
-  const { dataMode, search } = useDashboard();
+  const { search } = useDashboard();
 
   // If we have a dashboard selected and no search, we don't want to show the list
-  if ((dataMode === "diff" || dashboard_name) && !search.value) {
+  if (dashboard_name && !search.value) {
     return null;
   }
 

diff --git a/ui/dashboard/src/components/SnapshotDiffButton/index.tsx b/ui/dashboard/src/components/SnapshotDiffButton/index.tsx
@@ -1,10 +1,12 @@
 import { DashboardActions } from "../../types";
 import { useDashboard } from "../../hooks/useDashboard";
+import { useNavigate } from "react-router-dom";
 import { useRef } from "react";
 
 const SnapshotDiffButton = () => {
   const { dispatch, snapshot } = useDashboard();
   const fileInputRef = useRef<HTMLInputElement | null>(null);
+  const navigate = useNavigate();
 
   if (!snapshot) {
     return null;
@@ -41,12 +43,14 @@ const SnapshotDiffButton = () => {
 
             e.target.value = "";
             try {
+              navigate(`/snapshot/diff`);
               const data = JSON.parse(fr.result.toString());
               dispatch({
                 type: DashboardActions.GET_SNAPSHOT_DIFF,
                 snapshot: data,
               });
             } catch (err: any) {
+              console.log(err);
               dispatch({
                 type: DashboardActions.WORKSPACE_ERROR,
                 error: "Unable to load snapshot:" + err.message,

diff --git a/ui/dashboard/src/hooks/useDashboard.tsx b/ui/dashboard/src/hooks/useDashboard.tsx
@@ -10,6 +10,7 @@ import {
   DashboardCliMode,
   DashboardDataModeCLISnapshot,
   DashboardDataModeCloudSnapshot,
+  DashboardDataModeDiff,
   DashboardDataModeLive,
   DashboardDataOptions,
   DashboardRenderOptions,
@@ -232,11 +233,25 @@ const DashboardProvider = ({
     state.snapshot,
   ]);
 
+  useEffect(() => {
+    if (
+      location.pathname === "/" &&
+      (state.dataMode === DashboardDataModeCLISnapshot ||
+        state.dataMode === DashboardDataModeDiff)
+    ) {
+      dispatch({
+        type: DashboardActions.SET_DATA_MODE,
+        dataMode: DashboardDataModeLive,
+      });
+    }
+  }, [dispatch, location, state.dataMode]);
+
   useEffect(() => {
     if (
       !!dashboard_name &&
       !location.pathname.startsWith("/snapshot/") &&
-      state.dataMode === DashboardDataModeCLISnapshot
+      (state.dataMode === DashboardDataModeCLISnapshot ||
+        state.dataMode === DashboardDataModeDiff)
     ) {
       dispatch({
         type: DashboardActions.SET_DATA_MODE,
@@ -672,7 +687,8 @@ const DashboardProvider = ({
     if (
       !state.availableDashboardsLoaded ||
       !dashboard_name ||
-      state.dataMode === DashboardDataModeCLISnapshot
+      state.dataMode === DashboardDataModeCLISnapshot ||
+      state.dataMode === DashboardDataModeDiff
     ) {
       return;
     }
@@ -692,7 +708,8 @@ const DashboardProvider = ({
   useEffect(() => {
     if (
       location.pathname.startsWith("/snapshot/") &&
-      state.dataMode !== DashboardDataModeCLISnapshot
+      state.dataMode !== DashboardDataModeCLISnapshot &&
+      state.dataMode !== DashboardDataModeDiff
     ) {
       navigate("/");
     }