Bridge integration

packages/bridge-ui/components/Create.tsx

@@ -8,6 +8,7 @@ import { Button, Dialog, TextField, Select, MultiValueField } from "ui";
 import { generateCreateAction } from "../lib/actions";
 import { FieldDescription } from "../lib/service";
 import { serviceConfig } from "../config/config";
+import { getBasePath } from "../lib/frontendUtils";
 
 type CreateProps = {
   service: string;
@@ -51,7 +52,7 @@ export const Create: FC<CreateProps> = ({ service }) => {
 
   useEffect(() => {
     if (formState.success) {
-      router.push(`/${entity}/${formState.values.id}`);
+      router.push(`${getBasePath()}${entity}/${formState.values.id}`);
     }
   }, [formState.success, router, entity, formState.values.id]);
 
@@ -60,14 +61,14 @@ export const Create: FC<CreateProps> = ({ service }) => {
       open
       title={`Create ${displayName}`}
       formAction={formAction}
-      onClose={() => router.push(`/${entity}`)}
+      onClose={() => router.push(`${getBasePath()}${entity}`)}
       buttons={
         <Grid container justifyContent="space-between">
           <Grid item>
             <Button
               text="Cancel"
               kind="secondary"
-              onClick={() => router.push(`/${entity}`)}
+              onClick={() => router.push(`${getBasePath()}${entity}`)}
             />
           </Grid>
           <Grid item>

packages/bridge-ui/components/Detail.tsx

@@ -9,6 +9,7 @@ import { type Database } from "bridge-common";
 import { generateDeleteAction } from "../lib/actions";
 import { serviceConfig } from "../config/config";
 import { FieldDescription } from "../lib/service";
+import { getBasePath } from "../lib/frontendUtils";
 
 type DetailProps = {
   service: string;
@@ -29,7 +30,7 @@ export const Detail: FC<DetailProps> = ({ service, row }) => {
   const continueDeleteAction = async () => {
     await deleteAction?.(id);
     setShowDeleteConfirmation(false);
-    router.push(`/${entity}`);
+    router.push(`${getBasePath()}${entity}`);
   };
 
   return (
@@ -37,7 +38,7 @@ export const Detail: FC<DetailProps> = ({ service, row }) => {
       <Dialog
         open
         title={`${displayName} Detail`}
-        onClose={() => router.push(`/${entity}`)}
+        onClose={() => router.push(`${getBasePath()}${entity}`)}
         buttons={
           <Grid container justifyContent="space-between">
             <Grid item container xs="auto" spacing={2}>
@@ -52,12 +53,16 @@ export const Detail: FC<DetailProps> = ({ service, row }) => {
                 <Button
                   text="Edit"
                   kind="secondary"
-                  href={`/${entity}/${id}/edit`}
+                  href={`${getBasePath()}${entity}/${id}/edit`}
                 />
               </Grid>
             </Grid>
             <Grid item>
-              <Button text="Done" kind="primary" href={`/${entity}`} />
+              <Button
+                text="Done"
+                kind="primary"
+                href={`${getBasePath()}${entity}`}
+              />
             </Grid>
           </Grid>
         }

packages/bridge-ui/components/Edit.tsx

@@ -10,6 +10,7 @@ import { type Database } from "bridge-common";
 import { generateUpdateAction } from "../lib/actions";
 import { serviceConfig } from "../config/config";
 import { FieldDescription } from "../lib/service";
+import { getBasePath } from "../lib/frontendUtils";
 
 type EditProps = {
   service: string;
@@ -51,7 +52,7 @@ export const Edit: FC<EditProps> = ({ service, row }) => {
 
   useEffect(() => {
     if (formState.success) {
-      router.push(`/${entity}`);
+      router.push(`${getBasePath()}${entity}`);
     }
   }, [formState.success, router, entity]);
 
@@ -60,14 +61,14 @@ export const Edit: FC<EditProps> = ({ service, row }) => {
       open
       title={`Edit ${displayName}`}
       formAction={formAction}
-      onClose={() => router.push(`/${entity}`)}
+      onClose={() => router.push(`${getBasePath()}${entity}`)}
       buttons={
         <Grid container justifyContent="space-between">
           <Grid item>
             <Button
               text="Cancel"
               kind="secondary"
-              onClick={() => router.push(`/${entity}`)}
+              onClick={() => router.push(`${getBasePath()}${entity}`)}
             />
           </Grid>
           <Grid item>

packages/bridge-ui/components/Home.tsx

@@ -0,0 +1,5 @@
+import { FC } from "react";
+
+export const Home: FC = () => {
+  return <h1>Home</h1>;
+};

packages/bridge-ui/components/List.tsx

@@ -6,6 +6,7 @@ import { List as InternalList, Button } from "ui";
 import { type Selectable } from "kysely";
 import { type Database } from "bridge-common";
 import { serviceConfig } from "../config/config";
+import { getBasePath } from "../lib/frontendUtils";
 
 type ListProps = {
   service: string;
@@ -18,7 +19,7 @@ export const List: FC<ListProps> = ({ service, rows }) => {
   const router = useRouter();
 
   const onRowClick = (id: string) => {
-    router.push(`/${entity}/${id}`);
+    router.push(`${getBasePath()}${entity}/${id}`);
   };
 
   return (
@@ -28,7 +29,11 @@ export const List: FC<ListProps> = ({ service, rows }) => {
       columns={listColumns}
       onRowClick={onRowClick}
       buttons={
-        <Button text="Create" kind="primary" href={`/${entity}/create`} />
+        <Button
+          text="Create"
+          kind="primary"
+          href={`${getBasePath()}${entity}/create`}
+        />
       }
     />
   );