Edit and actions updates

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

@@ -2,9 +2,10 @@
 
 import { FC } from "react";
 import { Grid } from "@mui/material";
-import { DisplayTextField, Select } from "ui";
+import { DisplayTextField } from "ui";
 import { FacebookBot } from "@/app/_lib/database";
 import { Detail as InternalDetail } from "@/app/_components/Detail";
+import { deleteFacebookBotAction } from "../../_actions/facebook";
 
 type DetailProps = {
   row: FacebookBot;
@@ -12,9 +13,10 @@ type DetailProps = {
 
 export const Detail: FC<DetailProps> = ({ row }) => (
   <InternalDetail
-    title={`Facebook Bot: ${row.name}`}
+    title={`Facebook Connection: ${row.name}`}
     entity="facebook"
     id={row.id}
+    deleteAction={deleteFacebookBotAction}
   >
     <Grid container direction="row" rowSpacing={3} columnSpacing={2}>
       <Grid item xs={12}>

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

@@ -8,12 +8,17 @@ type Props = {
 };
 
 export default async function Page({ params: { segment } }: Props) {
-  const id = segment[0];
+  const id = segment?.[0];
+
+  if (!id) return null;
+
   const row = await db
     .selectFrom("FacebookBot")
     .selectAll()
     .where("id", "=", id)
     .executeTakeFirst();
 
+  if (!row) return null;
+
   return <Detail row={row} />;
 }