Refactoring 2

apps/bridge-frontend/app/(main)/[...segment]/@detail/_components/Detail.tsx

@@ -1,45 +0,0 @@
-"use client";
-
-import { FC } from "react";
-import { Grid } from "@mui/material";
-import { DisplayTextField } from "ui";
-import { Selectable } from "kysely";
-import { Database } from "@/app/_lib/database";
-import { Detail as InternalDetail } from "@/app/_components/Detail";
-import { generateDeleteAction } from "@/app/_lib/actions";
-import { serviceConfig } from "@/app/_config/config";
-
-type DetailProps = {
-  service: string;
-  row: Selectable<keyof Database>;
-};
-
-export const Detail: FC<DetailProps> = ({ service, row }) => {
-  const {
-    [service]: { entity, table, displayName, displayFields: fields },
-  } = serviceConfig;
-  const deleteAction = generateDeleteAction({ entity, table });
-
-  return (
-    <InternalDetail
-      title={`${displayName}: ${row.name}`}
-      entity={entity}
-      id={row.id as string}
-      deleteAction={deleteAction}
-    >
-      <Grid container direction="row" rowSpacing={3} columnSpacing={2}>
-        {fields.map((field) => (
-          <Grid item xs={field.size ?? 6} key={field.name}>
-            <DisplayTextField
-              name={field.name}
-              label={field.label}
-              lines={field.lines ?? 1}
-              value={row[field.name] as string}
-              copyable={field.copyable ?? false}
-            />
-          </Grid>
-        ))}
-      </Grid>
-    </InternalDetail>
-  );
-};

apps/bridge-frontend/app/(main)/[...segment]/@detail/page.tsx

@@ -1,6 +1,5 @@
-import { db } from "@/app/_lib/database";
-import { serviceConfig } from "@/app/_config/config";
-import { Detail } from "./_components/Detail";
+import { db } from "bridge-common";
+import { serviceConfig, Detail } from "bridge-ui";
 
 type Props = {
   params: { segment: string[] };