fix(regression): disable video uploads on welcome card logo uploader (formbricks#8188)

Author: itsjavi

apps/web/modules/survey/editor/components/edit-welcome-card.tsx

@@ -126,20 +126,14 @@ export const EditWelcomeCard = ({
                 id="welcome-card-image"
                 allowedFileExtensions={["png", "jpeg", "jpg", "webp", "heic"]}
                 workspaceId={workspaceId}
-                onFileUpload={(url: string[] | undefined, fileType: "image" | "video") => {
+                onFileUpload={(url: string[] | undefined) => {
                   if (url?.length && url[0]) {
-                    const update =
-                      fileType === "video"
-                        ? { videoUrl: url[0], fileUrl: undefined }
-                        : { fileUrl: url[0], videoUrl: undefined };
-                    updateSurvey(update);
+                    updateSurvey({ fileUrl: url[0], videoUrl: undefined });
                   } else {
                     updateSurvey({ fileUrl: undefined, videoUrl: undefined });
                   }
                 }}
                 fileUrl={localSurvey?.welcomeCard?.fileUrl}
-                videoUrl={localSurvey?.welcomeCard?.videoUrl}
-                isVideoAllowed={true}
                 maxSizeInMB={5}
                 isStorageConfigured={isStorageConfigured}
               />

apps/web/modules/ui/components/file-input/index.tsx

@@ -63,9 +63,14 @@ export const FileInput = ({
   ];
   const [selectedFiles, setSelectedFiles] = useState<SelectedFile[]>([]);
   const [uploadedVideoUrl, setUploadedVideoUrl] = useState(videoUrl ?? "");
-  const [activeTab, setActiveTab] = useState(videoUrl ? "video" : "image");
+  const [activeTab, setActiveTab] = useState(isVideoAllowed && videoUrl ? "video" : "image");
   const [imageUrlTemp, setImageUrlTemp] = useState(fileUrl ?? "");
   const [videoUrlTemp, setVideoUrlTemp] = useState(videoUrl ?? "");
+  const fileType = isVideoAllowed && activeTab === "video" ? "video" : "image";
+
+  useEffect(() => {
+    setActiveTab(isVideoAllowed && videoUrl ? "video" : "image");
+  }, [isVideoAllowed, videoUrl]);
 
   const handleUpload = async (files: File[]) => {
     if (!isStorageConfigured) {
@@ -115,7 +120,7 @@ export const FileInput = ({
       return;
     }
 
-    onFileUpload(uploadedUrls, activeTab === "video" ? "video" : "image");
+    onFileUpload(uploadedUrls, fileType);
   };
 
   const handleDragOver = (e: React.DragEvent<HTMLLabelElement>) => {
@@ -134,7 +139,7 @@ export const FileInput = ({
 
   const handleRemove = async (idx: number) => {
     const newFileUrl = selectedFiles.filter((_, i) => i !== idx).map((file) => file.url);
-    onFileUpload(newFileUrl, activeTab === "video" ? "video" : "image");
+    onFileUpload(newFileUrl, fileType);
     setImageUrlTemp("");
   };
 
@@ -185,7 +190,7 @@ export const FileInput = ({
     });
 
     const prevUrls = Array.isArray(fileUrl) ? fileUrl : fileUrl ? [fileUrl] : [];
-    onFileUpload([...prevUrls, ...uploadedUrls], activeTab === "video" ? "video" : "image");
+    onFileUpload([...prevUrls, ...uploadedUrls], fileType);
   };
 
   useEffect(() => {
@@ -202,23 +207,23 @@ export const FileInput = ({
   }, [fileUrl]);
 
   useEffect(() => {
-    if (activeTab === "image" && typeof imageUrlTemp === "string") {
+    if (fileType === "image" && typeof imageUrlTemp === "string") {
       // Temporarily store the current video URL before switching tabs.
       setVideoUrlTemp(videoUrl ?? "");
 
       if (imageUrlTemp) {
         onFileUpload([imageUrlTemp], "image");
       }
-    } else if (activeTab === "video") {
+    } else if (fileType === "video") {
       // Temporarily store the current image URL before switching tabs.
       setImageUrlTemp(fileUrl ?? "");
 
       if (videoUrlTemp) {
         onFileUpload([videoUrlTemp], "video");
       }
     }
-    // eslint-disable-next-line react-hooks/exhaustive-deps -- Only run when activeTab changes to avoid infinite loops
-  }, [activeTab]);
+    // eslint-disable-next-line react-hooks/exhaustive-deps -- Only run when file type changes to avoid loops
+  }, [fileType]);
 
   return (
     <div className="w-full cursor-default">
@@ -227,7 +232,7 @@ export const FileInput = ({
           <OptionsSwitch options={options} currentOption={activeTab} handleOptionChange={setActiveTab} />
         )}
         <div>
-          {activeTab === "video" && (
+          {fileType === "video" && (
             <div className={cn(isVideoAllowed && "rounded-b-lg border-x border-b border-slate-200 p-4")}>
               <VideoSettings
                 uploadedVideoUrl={uploadedVideoUrl}
@@ -239,7 +244,7 @@ export const FileInput = ({
             </div>
           )}
 
-          {activeTab === "image" && (
+          {fileType === "image" && (
             <div className={cn(isVideoAllowed && "rounded-b-lg border-x border-b border-slate-200 p-4")}>
               {selectedFiles.length > 0 ? (
                 multiple ? (