fix: pointer on drag and droped when activ prod

Eyevinn · Nov 14, 2024 · dcfe2a8 · dcfe2a8
1 parent 4894fef
commit dcfe2a8
Show file tree

Hide file tree

Showing 2 changed files with 28 additions and 5 deletions.
diff --git a/src/components/image/ImageComponent.tsx b/src/components/image/ImageComponent.tsx
@@ -17,10 +17,11 @@ interface ImageComponentProps extends PropsWithChildren {
   src?: string;
   alt?: string;
   type?: Type;
+  className?: string;
 }
 
 const ImageComponent: React.FC<ImageComponentProps> = (props) => {
-  const { src, alt = 'Image', children, type } = props;
+  const { src, alt = 'Image', children, type, className } = props;
   const { imageRefetchKey } = useContext(GlobalContext);
   const [imgSrc, setImgSrc] = useState<string>();
   const [loaded, setLoaded] = useState<boolean>(false);
@@ -52,7 +53,9 @@ const ImageComponent: React.FC<ImageComponentProps> = (props) => {
   return (
     <>
       {(!type || type === 'ingest_source') && src && (
-        <div className="relative z-10 aspect-video min-w-full overflow-hidden border rounded-lg bg-zinc-700">
+        <div
+          className={`${className} relative z-10 aspect-video min-w-full overflow-hidden border rounded-lg bg-zinc-700`}
+        >
           {((!imgSrc || error) && (
             <IconExclamationCircle className="text-error fill-white w-full h-full" />
           )) || (

diff --git a/src/components/sourceCard/SourceCard.tsx b/src/components/sourceCard/SourceCard.tsx
@@ -100,7 +100,9 @@ export default function SourceCard({
     <div
       ref={forwardedRef}
       style={style}
-      className="relative bg-zinc-700 aspect-video m-2 overflow-hidden cursor-pointer"
+      className={`relative bg-zinc-700 aspect-video m-2 overflow-hidden ${
+        productionSetup?.isActive ? 'cursor-auto' : 'cursor-pointer'
+      }`}
     >
       <div className="relative">
         <input
@@ -115,8 +117,26 @@ export default function SourceCard({
           disabled={locked}
         />
       </div>
-      {source && <ImageComponent src={getSourceThumbnail(source)} />}
-      {!source && sourceRef && <ImageComponent type={sourceRef.type} />}
+      {source && (
+        <ImageComponent
+          className={`${
+            productionSetup?.isActive
+              ? 'pointer-events-none'
+              : 'pointer-events-auto'
+          }`}
+          src={getSourceThumbnail(source)}
+        />
+      )}
+      {!source && sourceRef && (
+        <ImageComponent
+          className={`${
+            productionSetup?.isActive
+              ? 'pointer-events-none'
+              : 'pointer-events-auto'
+          }`}
+          type={sourceRef.type}
+        />
+      )}
       {(source || sourceRef) && (
         <h2
           className={`${