feat: when delete prod you also delete all connected layouts

src/api/manager/multiviews.ts

@@ -1,6 +1,7 @@
 import { ObjectId, WithId } from 'mongodb';
 import { MultiviewPreset } from '../../interfaces/preset';
 import { getDatabase } from '../mongoClient/dbClient';
+import { Log } from '../logger';
 
 export async function getMultiviewLayouts(): Promise<MultiviewPreset[]> {
   const db = await getDatabase();
@@ -36,3 +37,10 @@ export async function putMultiviewLayout(
     await collection.insertOne({ ...newMultiviewLayout, _id: new ObjectId() });
   }
 }
+
+export async function deleteLayouts(id: string): Promise<void> {
+  const db = await getDatabase();
+
+  await db.collection('multiviews').deleteMany({ productionId: id });
+  Log().info('Deleted layouts for production', id);
+}

src/app/api/manager/multiviews/route.tsx

@@ -1,6 +1,7 @@
 import { NextRequest, NextResponse } from 'next/server';
 import { isAuthenticated } from '../../../../api/manager/auth';
 import {
+  deleteLayouts,
   getMultiviewLayouts,
   putMultiviewLayout
 } from '../../../../api/manager/multiviews';
@@ -43,3 +44,26 @@ export async function PUT(request: NextRequest): Promise<NextResponse> {
     });
   }
 }
+
+export async function DELETE(request: NextRequest): Promise<NextResponse> {
+  if (!(await isAuthenticated())) {
+    return new NextResponse(`Not Authorized!`, {
+      status: 403
+    });
+  }
+  try {
+    const productionId = await request.json();
+    await deleteLayouts(productionId);
+    return new NextResponse(null, {
+      status: 200
+    });
+  } catch (error) {
+    console.log(error);
+    return new NextResponse(
+      `Error occurred while posting to DB! Error: ${error}`,
+      {
+        status: 500
+      }
+    );
+  }
+}

src/components/productionsList/DeleteProductionButton.tsx

@@ -6,6 +6,7 @@ import { useCallback, useState } from 'react';
 import { Loader } from '../loader/Loader';
 import { useRouter } from 'next/navigation';
 import { DeleteModal } from '../modal/DeleteModal';
+import { useDeleteMultiviewLayouts } from '../../hooks/multiviewLayout';
 
 type DeleteProductionButtonProps = {
   id: string;
@@ -22,6 +23,7 @@ export function DeleteProductionButton({
 }: DeleteProductionButtonProps) {
   const router = useRouter();
   const deleteProduction = useDeleteProduction();
+  const deleteLayouts = useDeleteMultiviewLayouts();
 
   const [loading, setLoading] = useState(false);
   const [modalOpen, setModalOpen] = useState(false);
@@ -30,10 +32,11 @@ export function DeleteProductionButton({
   const onConfirm = useCallback(async () => {
     setModalOpen(false);
     setLoading(true);
-    deleteProduction(id)
+    await deleteProduction(id);
+    deleteLayouts(id)
       .then(() => router.refresh())
       .finally(() => setLoading(false));
-  }, [router, deleteProduction, id]);
+  }, [deleteProduction, id, deleteLayouts, router]);
 
   return (
     <>

src/hooks/multiviewLayout.ts

@@ -66,3 +66,17 @@ export function usePutMultiviewLayout() {
     throw await response.text();
   };
 }
+
+export function useDeleteMultiviewLayouts() {
+  return async (id: string): Promise<void> => {
+    const response = await fetch(`/api/manager/multiviews`, {
+      method: 'DELETE',
+      headers: [['x-api-key', `Bearer ${API_SECRET_KEY}`]],
+      body: JSON.stringify(id)
+    });
+    if (response.ok) {
+      return;
+    }
+    throw await response.text();
+  };
+}