Merge pull request #1388 from flanksource/967-settings-health-clickin…

…g-config-source-crashes-ui 967-settings-health-clicking-config-source-crashes-ui
flanksource · Sep 13, 2023 · 1961111 · 1961111
2 parents 8b2424a + 74b0ae0
commit 1961111
Show file tree

Hide file tree

Showing 2 changed files with 15 additions and 4 deletions.
diff --git a/src/components/Authentication/Kratos/KratosAuthSessionChecker.tsx b/src/components/Authentication/Kratos/KratosAuthSessionChecker.tsx
@@ -14,7 +14,7 @@ export default function KratosAuthSessionChecker({
 }: KratosAuthSessionCheckerProps) {
   const [session, setSession] = useState<Session | undefined>();
 
-  const { push, pathname } = useRouter();
+  const { push } = useRouter();
 
   useEffect(() => {
     if (!isAuthEnabled()) {
@@ -27,7 +27,11 @@ export default function KratosAuthSessionChecker({
         setSession(data);
       })
       .catch((err: AxiosError) => {
-        const url = `${pathname}`;
+        // Due to the conflict between NextJS Routing and React Router, we can
+        // get the current URL from next router accurately, but we can rely on
+        // the window location to get the current URL accurately. This can be
+        // fixed in the future when we move to NextJS fully.
+        const url = window.location.pathname;
         switch (err.response?.status) {
           case 403:
             // This is a legacy error code thrown. See code 422 for
@@ -48,7 +52,7 @@ export default function KratosAuthSessionChecker({
         // Something else happened!
         return Promise.reject(err);
       });
-  }, [pathname, push]);
+  }, [push]);
 
   if (isAuthEnabled() && !session) {
     return null;

diff --git a/src/components/SchemaResourcePage/SchemaResourceEdit.tsx b/src/components/SchemaResourcePage/SchemaResourceEdit.tsx
@@ -22,6 +22,7 @@ import { Head } from "../Head/Head";
 import HealthSpecEditor from "../SpecEditor/HealthSpecEditor";
 import { Button } from "../Button";
 import DeleteResource from "./Delete/DeleteResource";
+import { HealthCheckEdit } from "../Canary/HealthCheckEdit";
 
 const CodeEditor = dynamic(
   () => import("../CodeEditor").then((m) => m.CodeEditor),
@@ -282,7 +283,13 @@ export function SchemaResourceEdit({
                                   )}
                                   <span>{name}</span>
                                 </h2>
-                                {!!source && (
+                                {!!source && table === "canaries" && id ? (
+                                  <HealthCheckEdit
+                                    check={{
+                                      canary_id: id
+                                    }}
+                                  />
+                                ) : (
                                   <div className="px-2">
                                     <a href={`${source}`}>Catalog source</a>
                                   </div>