Fixed non-image bug

renderer/components/RightPaneInfo.jsx

@@ -3,9 +3,15 @@ import React from "react";
 function RightPaneInfo({ version, batchMode }) {
   return (
     <>
-      <p className="p-5 text-lg font-medium text-neutral-400">
+      <p className="p-5 pb-0 text-lg font-medium text-neutral-400">
         Select {batchMode ? "a Folder" : "an Image"} to Upscale
       </p>
+      {batchMode && (
+        <p className="w-full py-5 text-center text-neutral-500 md:w-96">
+          Make sure that the folder doesn't contain anything except PNG, JPG,
+          JPEG & WEBP images.
+        </p>
+      )}
       <p className="text-neutral-600">Upscayl v{version}</p>
     </>
   );

renderer/pages/index.jsx

@@ -103,6 +103,27 @@ const Home = () => {
     setProgress("");
   }, [batchMode]);
 
+  useEffect(() => {
+    if (imagePath.length > 0) {
+      const filePath = imagePath;
+      console.log(
+        "🚀 => file: index.jsx => line 109 => useEffect => filePath",
+        filePath
+      );
+
+      const extension = imagePath.toLocaleLowerCase().split(".").pop();
+      console.log(
+        "🚀 => file: index.jsx => line 111 => useEffect => extension",
+        extension
+      );
+
+      if (!allowedFileTypes.includes(extension.toLowerCase())) {
+        alert("Please select an image");
+        resetImagePaths();
+      }
+    }
+  }, [imagePath]);
+
   const selectImageHandler = async () => {
     resetImagePaths();