feat: add video converter

src/components/converter-content/index.tsx

@@ -4,7 +4,7 @@ import VideoConverter from '../video-converter';
 
 const items = [
     {
-        label: 'Video To GIF',
+        label: 'Video Converter',
         key: '1',
         children: <VideoConverter/>
     }

src/components/converter/converter-steps/upload-step/upload-step.tsx

@@ -49,6 +49,7 @@ const UploadStep = memo(function UploadStepComponent(props: Readonly<UploadStepP
         props.allowedUploadingFormats.forEach((type, index) => {
             if (index === props.allowedUploadingFormats.length - 1) {
                 types += type
+                return
             }
 
             types += type + ", "

src/components/video-converter/index.tsx

@@ -2,34 +2,31 @@ import { Format } from "../../model/format"
 import Converter from "../converter"
 
 const uploadingFormat: string[] = [
-    ".mp4"
+    "video/mp4",
+    "video/x-m4v",
+    "video/*"
 ]
 
 const optionsToConvertTo: Format[] = [
     {
         name: "GIF",
-        extension: ".gif",
-        mimeType: "image/gif"
+        extension: ".gif"
     },
     {
         name: "MP4",
-        extension: ".mp4",
-        mimeType: "video/mp4"
+        extension: ".mp4"
     },
     {
         name: "AVI",
-        extension: ".avi",
-        mimeType: "video/x-msvideo"
+        extension: ".avi"
     },
     {
         name: "WMV",
-        extension: ".wmv",
-        mimeType: "video/x-ms-asf"
+        extension: ".wmv"
     },
     {
         name: "MP3",
-        extension: ".mp3",
-        mimeType: "audio/mp4"
+        extension: ".mp3"
     }
 ]
 

src/model/format.ts

@@ -4,6 +4,4 @@ export type Format = {
     name: string
     /** Extension with a dot */
     extension: string
-    /** Mime type of this format, that allow it to be downloaded  */
-    mimeType: string
 }

src/services/converter.ts

@@ -2,6 +2,14 @@ import { createFFmpeg } from "@ffmpeg/ffmpeg";
 import { UploadFile } from "antd";
 import { ConvertedFile } from "../model/converted-file";
 
+const mimeType = {
+  ".gif": "image/gif",
+  ".mp4": "video/mp4",
+  ".avi": "video/x-msvideo",
+  ".wmv": "video/x-ms-wmv",
+  ".mp3": "audio/mp3",
+}
+
 async function convertFiles(fileList: UploadFile[], extension: string): Promise<ConvertedFile[]>{
     const blobList: ConvertedFile[] = []
 
@@ -23,12 +31,21 @@ async function convertFiles(fileList: UploadFile[], extension: string): Promise<
           await ffmpeg.run("-i", file.name, outputName);
 
           const output = ffmpeg.FS("readFile", outputName);
-          const blob = new Blob([output.buffer], { type: "image/gif" })
-          blobList.push({
-            newFileName: outputName,
-            blob,
-            result: "success"
-          })
+
+          if (output === null || output.buffer.byteLength <= 0 ) {
+            blobList.push({
+              newFileName: outputName,
+              result: "error",
+              blob: new Blob()
+            })
+          } else {
+            const blob = new Blob([output.buffer], { type: mimeType[extension as keyof typeof mimeType] })
+            blobList.push({
+              newFileName: outputName,
+              blob,
+              result: "success"
+            })
+          }
     }
 
     return blobList