fix: wip

src/app/api/manager/multiviews/[id]/route.ts

@@ -14,8 +14,9 @@ export async function GET(
       status: 403
     });
   }
+  const { id } = await params;
   try {
-    return NextResponse.json(await getMultiviewPreset(params.id));
+    return NextResponse.json(await getMultiviewPreset(id));
   } catch (e) {
     return new NextResponse(JSON.stringify(e), {
       status: 500
@@ -35,12 +36,13 @@ export async function PUT(
       status: 403
     });
   }
+  const { id } = await params;
   try {
     const data = (await request.json()) as PutMultiviewRequest;
     return NextResponse.json(
       await updateMultiviewForPipeline(
         data.pipelineId,
-        params.id,
+        id,
         data.multiviews
       )
     );

src/app/api/manager/pipelines/[id]/route.ts

@@ -21,7 +21,8 @@ export async function GET(
       status: 403
     });
   }
-  const pipeline = await getPipeline(params.id);
+  const { id } = await params;
+  const pipeline = await getPipeline(id);
   if (!pipeline) {
     console.log('Pipeline not found');
   }

src/app/api/manager/presets/[id]/route.ts

@@ -15,9 +15,10 @@ export async function GET(
       status: 403
     });
   }
+  const { id } = await params;
 
   try {
-    return NextResponse.json(await getPresetByid(params.id));
+    return NextResponse.json(await getPresetByid(id));
   } catch (e) {
     return new NextResponse(JSON.stringify(e), {
       status: 500
@@ -34,9 +35,11 @@ export async function PUT(
       status: 403
     });
   }
+  const { id } = await params;
+
   try {
     const body = (await request.json()) as PresetWithId;
-    const prod = await putPreset(params.id, body);
+    const prod = await putPreset(id, body);
     return new NextResponse(JSON.stringify(prod), { status: 200 });
   } catch (error) {
     Log().warn('Could not update preset', error);

src/app/api/manager/streams/[id]/route.ts

@@ -19,10 +19,11 @@ export async function DELETE(
   }
   const body = await request.json();
   const multiview = body.multiview as MultiviewSettings[];
+  const { id } = await params;
   try {
-    await deleteStream(params.id).catch((e) => {
-      Log().error(`Failed to delete stream: ${params.id}: ${e.message}`);
-      throw `Failed to delete stream: ${params.id}: ${e.message}`;
+    await deleteStream(id).catch((e) => {
+      Log().error(`Failed to delete stream: ${id}: ${e.message}`);
+      throw `Failed to delete stream: ${id}: ${e.message}`;
     });
     if (!multiview || multiview.length === 0) {
       return new NextResponse(
@@ -60,7 +61,7 @@ export async function DELETE(
           {
             step: 'delete_stream',
             success: false,
-            message: `Failed to delete stream: ${params.id}: ${e}`
+            message: `Failed to delete stream: ${id}: ${e}`
           }
         ],
         error: 'Failed to remove stream properly'

src/components/modal/Modal.tsx

@@ -5,18 +5,22 @@ import { Modal as BaseModal } from '@mui/base';
 
 type BaseModalProps = {
   open: boolean;
-  forwardRef?: LegacyRef<HTMLDivElement> | null;
+  //forwardRef?: LegacyRef<HTMLDivElement> | null;
   outsideClick: () => void;
 };
 
 export type ModalProps = BaseModalProps & PropsWithChildren;
 
 export function Modal({ open, children, outsideClick }: ModalProps) {
   const element = useRef<HTMLDivElement | null>(null);
+  //const childrenRef = useRef(children);
+  const openRef = useRef(open);
+  //const outsideClickRef = useRef(outsideClick);
+
   useEffect(() => {
     const handleClickOutside = (event: MouseEvent) => {
       if (element.current && !element.current.contains(event.target as Node)) {
-        outsideClick();
+        outsideClick;
       }
     };
 
@@ -32,7 +36,7 @@ export function Modal({ open, children, outsideClick }: ModalProps) {
       open={open}
     >
       <div
-        ref={element}
+        ref={element.current}
         className="bg-container text-p p-4 shadow-xl rounded m-2"
       >
         {children}

src/components/modal/StopModal.tsx

@@ -5,6 +5,7 @@ import { Modal } from './Modal';
 import { Loader } from '../loader/Loader';
 import { StopProductionStatus } from '../../interfaces/production';
 import StopProductionFeed from '../startProduction/StopProductionFeed';
+import { useRef } from 'react';
 
 type DeleteModalProps = {
   name: string;
@@ -24,8 +25,9 @@ export function StopModal({
   stopStatus
 }: DeleteModalProps) {
   const t = useTranslate();
+  const cancel = useRef(onCancel);
   return (
-    <Modal open={open} outsideClick={onCancel}>
+    <Modal open={open} outsideClick={cancel}>
       <div className="text-center">
         <h1 className="text-xl mb-2">
           {stopStatus && stopStatus.success

src/components/productionsList/ProductionsListItem.tsx

@@ -34,7 +34,6 @@ export function ProductionsListItem({ production }: ProductionListItemProps) {
     useState<StartProductionStatus>();
   const [stopProductionStatus, setStopProductionStatus] =
     useState<StopProductionStatus>();
-  const [deleteMonitoring] = useDeleteMonitoring();
   const [stopModalOpen, setStopModalOpen] = useState(false);
   const [startErrorModalOpen, setStartErrorModalOpen] = useState(false);
   const putProduction = usePutProduction();
@@ -91,7 +90,7 @@ export function ProductionsListItem({ production }: ProductionListItemProps) {
             }
           }
         })
-        .catch((error) => {
+        .catch(() => {
           setStartProductionStatus({
             success: false,
             steps: [{ step: 'start', success: false }]