fix: solved conflicts and problems with 'media-html-inputs'-branch

src/api/ateliereLive/ingest.ts

@@ -74,24 +74,6 @@ export async function getIngests(): Promise<ResourcesCompactIngestResponse[]> {
   throw await response.json();
 }
 
-export async function getCompleteIngests(): Promise<ResourcesIngestResponse[]> {
-  const response = await fetch(
-    new URL(LIVE_BASE_API_PATH + `/ingests?expand=true`, process.env.LIVE_URL),
-    {
-      headers: {
-        authorization: getAuthorizationHeader()
-      },
-      next: {
-        revalidate: 0
-      }
-    }
-  );
-  if (response.ok) {
-    return response.json();
-  }
-  throw await response.json();
-}
-
 export async function getIngest(
   uuid: string
 ): Promise<ResourcesIngestResponse> {

src/api/manager/productions.ts

@@ -64,8 +64,6 @@ export async function putProduction(
     name: production.name,
     isActive: production.isActive,
     sources: sources,
-    html: [],
-    mediaplayers: [],
     production_settings: production.production_settings
   };
 }

src/app/production/[id]/page.tsx

@@ -66,8 +66,6 @@ export default function ProductionConfiguration({ params }: PageProps) {
   const [selectedSourceRef, setSelectedSourceRef] = useState<
     SourceReference | undefined
   >();
-  const [sourceReferenceToAdd, setSourceReferenceToAdd] =
-    useState<SourceReference>();
   const [createStream, loadingCreateStream] = useCreateStream();
   const [deleteStream, loadingDeleteStream] = useDeleteStream();
   //PRODUCTION
@@ -119,7 +117,6 @@ export default function ProductionConfiguration({ params }: PageProps) {
     if (!productionSetup) return;
     addSource(input, productionSetup).then((updatedSetup) => {
       if (!updatedSetup) return;
-      setSourceReferenceToAdd(updatedSetup.sources[0]);
       setProductionSetup(updatedSetup);
       refreshProduction();
       setAddSourceModal(false);
@@ -719,7 +716,6 @@ export default function ProductionConfiguration({ params }: PageProps) {
             {productionSetup?.sources && sources.size > 0 && (
               <DndProvider backend={HTML5Backend}>
                 <SourceCards
-                  // sourceRef={sourceReferenceToAdd}
                   productionSetup={productionSetup}
                   updateProduction={(updated) => {
                     updateProduction(productionSetup._id, updated);

src/components/dragElement/DragItem.tsx

@@ -1,9 +1,8 @@
-import React, { ReactElement, memo, useEffect, useRef } from 'react';
+import React, { ReactElement, memo, useRef } from 'react';
 import { useDrag, useDrop } from 'react-dnd';
 import { SourceReference } from '../../interfaces/Source';
 import { ObjectId } from 'mongodb';
 import { Production } from '../../interfaces/production';
-import { v4 as uuidv4 } from 'uuid';
 
 interface IDrag {
   id: ObjectId | string;
@@ -59,7 +58,7 @@ const DragItem: React.FC<IDrag> = memo(
             ...productionSetup,
             sources: currentOrder.map((source) => ({
               ...source,
-              _id: source._id || uuidv4() // Ensure ID consistency
+              _id: source._id || undefined
             }))
           };
 

src/components/sourceCard/SourceCard.tsx

@@ -1,5 +1,4 @@
 'use client';
-
 import React, { ChangeEvent, KeyboardEvent, useState } from 'react';
 import { IconTrash } from '@tabler/icons-react';
 import { SourceReference, Type } from '../../interfaces/Source';
@@ -8,14 +7,16 @@ import { useTranslate } from '../../i18n/useTranslate';
 import { ISource } from '../../hooks/useDragableItems';
 
 type SourceCardProps = {
-  source: ISource;
+  source?: ISource;
   label: string;
-  onSourceUpdate: (source: SourceReference, sourceItem: ISource) => void;
+  onSourceUpdate: (source: SourceReference) => void;
   onSourceRemoval: (source: SourceReference) => void;
   onSelectingText: (bool: boolean) => void;
   forwardedRef?: React.LegacyRef<HTMLDivElement>;
   style?: object;
-  src: string;
+  src?: string;
+  sourceRef?: SourceReference;
+  type: Type;
 };
 
 export default function SourceCard({
@@ -26,40 +27,48 @@ export default function SourceCard({
   onSelectingText,
   forwardedRef,
   src,
-  style
+  style,
+  sourceRef,
+  type
 }: SourceCardProps) {
-  const [sourceLabel, setSourceLabel] = useState(label ? label : source.name);
-
+  const [sourceLabel, setSourceLabel] = useState(
+    sourceRef?.label || source?.name
+  );
   const t = useTranslate();
 
   const updateText = (event: ChangeEvent<HTMLInputElement>) => {
     setSourceLabel(event.currentTarget.value);
   };
   const saveText = () => {
     onSelectingText(false);
-    // if (source.name === label) {
-    //   return;
-    // }
-    if (sourceLabel.length === 0) {
-      setSourceLabel(source.name);
+    if (sourceLabel?.length === 0) {
+      if (source) {
+        setSourceLabel(source.name);
+      } else if (sourceRef) {
+        setSourceLabel(sourceRef.label);
+      }
     }
-    onSourceUpdate(
-      {
+    if (source) {
+      onSourceUpdate({
         _id: source._id.toString(),
-        label: sourceLabel,
-        type: source.ingest_type as Type,
+        type: 'ingest_source',
+        label: sourceLabel || source.name,
         input_slot: source.input_slot
-      },
-      source
-    );
+      });
+    } else if (sourceRef) {
+      onSourceUpdate({
+        _id: sourceRef._id,
+        type: sourceRef.type,
+        label: sourceLabel || sourceRef.label,
+        input_slot: sourceRef.input_slot
+      });
+    }
   };
-
   const handleKeyDown = (event: KeyboardEvent<HTMLInputElement>) => {
     if (event.key === 'Enter') {
       event.currentTarget.blur();
     }
   };
-
   return (
     <div
       ref={forwardedRef}
@@ -78,26 +87,58 @@ export default function SourceCard({
           onBlur={saveText}
         />
       </div>
-      <SourceThumbnail source={source} src={src} />
-      <h2 className="absolute bottom-0 text-p text-xs bg-zinc-900 w-full bg-opacity-90">
-        {t('source.ingest', {
-          ingest: source.ingest_name
-        })}
-      </h2>
-      <button
-        className="absolute bottom-0 right-0 text-p hover:border-l hover:border-t bg-red-700 hover:bg-red-600 min-w-fit p-1 rounded-tl-lg"
-        onClick={() => {
-          onSourceRemoval({
-            _id: source._id.toString(),
-            label: source.label,
-            type: source.ingest_type as Type,
-            input_slot: source.input_slot,
-            stream_uuids: source.stream_uuids
-          });
-        }}
-      >
-        <IconTrash className="text-p w-4 h-4" />
-      </button>
+      {source && source.src && (
+        <SourceThumbnail source={source} src={src} type={type} />
+      )}
+      {!source && sourceRef && <SourceThumbnail type={sourceRef.type} />}
+      {(sourceRef || source) && (
+        <h2
+          className={`${
+            source && 'absolute bottom-4'
+          } p-1 text-p text-xs bg-zinc-900 w-full bg-opacity-90 ${
+            sourceRef && !source && 'absolute bottom-0'
+          }`}
+        >
+          {t('source.input_slot', {
+            input_slot:
+              sourceRef?.input_slot?.toString() ||
+              source?.input_slot?.toString() ||
+              ''
+          })}
+        </h2>
+      )}
+      {source && (
+        <h2 className="absolute bottom-0 text-p text-xs bg-zinc-900 w-full bg-opacity-90">
+          {t('source.ingest', {
+            ingest: source.ingest_name
+          })}
+        </h2>
+      )}
+      {(source || sourceRef) && (
+        <button
+          className="absolute bottom-0 right-0 text-p hover:border-l hover:border-t bg-red-700 hover:bg-red-600 min-w-fit p-1 rounded-tl-lg"
+          onClick={() => {
+            if (source) {
+              onSourceRemoval({
+                _id: source._id.toString(),
+                type: 'ingest_source',
+                label: sourceLabel || source.name,
+                input_slot: source.input_slot,
+                stream_uuids: source.stream_uuids
+              });
+            } else if (sourceRef && !source) {
+              onSourceRemoval({
+                _id: sourceRef._id,
+                type: sourceRef.type,
+                label: sourceRef.label,
+                input_slot: sourceRef.input_slot
+              });
+            }
+          }}
+        >
+          <IconTrash className="text-p w-4 h-4" />
+        </button>
+      )}
     </div>
   );
 }