feat: Display system status link on settings page (#64)

namesakefyi · Sep 12, 2024 · 99aef0d · 99aef0d
1 parent 324fd2d
commit 99aef0d
Show file tree

Hide file tree

Showing 4 changed files with 33 additions and 16 deletions.
diff --git a/.changeset/tidy-eagles-judge.md b/.changeset/tidy-eagles-judge.md
@@ -0,0 +1,5 @@
+---
+"namesake": patch
+---
+
+Add link to system status from settings page
diff --git a/src/routes/__root.tsx b/src/routes/__root.tsx
@@ -11,7 +11,7 @@ import { AppHeader } from "../components";
 
 declare module "react-aria-components" {
   interface RouterConfig {
-    href: ToOptions;
+    href: ToOptions | string;
     routerOptions: Omit<NavigateOptions, keyof ToOptions>;
   }
 }
@@ -29,9 +29,17 @@ function RootRoute() {
   const router = useRouter();
 
   return (
+    // TODO: Improve this API
+    // https://github.com/adobe/react-spectrum/issues/6587
     <RouterProvider
-      navigate={(path, options) => router.navigate({ ...path, ...options })}
-      useHref={(path) => router.buildLocation(path).href}
+      navigate={(path, options) =>
+        router.navigate(
+          typeof path === "string" ? { ...options } : { ...path, ...options },
+        )
+      }
+      useHref={(path) =>
+        typeof path === "string" ? path : router.buildLocation(path).href
+      }
     >
       <main className="flex flex-col flex-1 min-h-screen text-gray-normal">
         <AppHeader />

diff --git a/src/routes/admin/forms/index.tsx b/src/routes/admin/forms/index.tsx
@@ -170,13 +170,8 @@ const FormTableRow = ({ form }: { form: DataModel["forms"]["document"] }) => {
           </Button>
           <Menu>
             {formUrl && (
-              <MenuItem>
-                {/* TODO: Relocate this `href` to parent MenuItem and delete `a`;
-                requires react-aria-components to support external links
-                https://github.com/adobe/react-spectrum/issues/6397 */}
-                <a href={formUrl} target="_blank" rel="noreferrer">
-                  View PDF
-                </a>
+              <MenuItem href={formUrl} target="_blank" rel="noreferrer">
+                View PDF
               </MenuItem>
             )}
             {form.deletionTime ? (

diff --git a/src/routes/settings/index.tsx b/src/routes/settings/index.tsx
@@ -10,6 +10,7 @@ import type { Theme } from "../../../convex/constants";
 import {
   Button,
   Container,
+  Link,
   Modal,
   PageHeader,
   Radio,
@@ -155,12 +156,20 @@ function SettingsRoute() {
           </Modal>
         </div>
       )}
-      <a
-        href={`https://github.com/namesakefyi/namesake/releases/tag/v${APP_VERSION}`}
-        target="_blank"
-        rel="noreferrer"
-        className="inline-block mt-4"
-      >{`Namesake v${APP_VERSION}`}</a>
+      <div className="flex gap-2 items-center mt-4">
+        <Link
+          href="https://github.com/namesakefyi/namesake/releases"
+          target="_blank"
+          rel="noreferrer"
+        >{`Namesake v${APP_VERSION}`}</Link>
+        <Link
+          href="https://status.namesake.fyi"
+          target="_blank"
+          rel="noreferrer"
+        >
+          System Status
+        </Link>
+      </div>
     </Container>
   );
 }