From ffd503db947c994b4eb19ca1a51a48a563ce0c7b Mon Sep 17 00:00:00 2001
From: Jerome Thayananthajothy <tjthavarshan@gmail.com>
Date: Sat, 17 Aug 2024 02:14:00 +0100
Subject: [PATCH] Refactor app

---
 .editorconfig                 |   2 +-
 .eslintrc.json                |   8 +-
 forge.config.ts               |   7 ++
 src/App.vue                   |  32 +++----
 src/config.ts                 |  25 ++++++
 src/consts/formats.ts         |   7 ++
 src/enums/channel.ts          |   8 ++
 src/enums/event.ts            |  11 +++
 src/enums/platform.ts         |   5 ++
 src/enums/shortcut.ts         |   5 ++
 src/interfaces/app-config.ts  |   9 ++
 src/lib/conversion-handler.ts |  37 ++++++++
 src/lib/ffmpeg.ts             |  59 +++++++++++++
 src/lib/window-manager.ts     |  45 ++++++++++
 src/main.ts                   | 157 ++++++++++------------------------
 src/preload.ts                |  11 +--
 16 files changed, 291 insertions(+), 137 deletions(-)
 create mode 100644 src/config.ts
 create mode 100644 src/consts/formats.ts
 create mode 100644 src/enums/channel.ts
 create mode 100644 src/enums/event.ts
 create mode 100644 src/enums/platform.ts
 create mode 100644 src/enums/shortcut.ts
 create mode 100644 src/interfaces/app-config.ts
 create mode 100644 src/lib/conversion-handler.ts
 create mode 100644 src/lib/ffmpeg.ts
 create mode 100644 src/lib/window-manager.ts

diff --git a/.editorconfig b/.editorconfig
index 2611576..13fabf0 100644
--- a/.editorconfig
+++ b/.editorconfig
@@ -3,7 +3,7 @@ root = true
 [{*.html,*.js,*.json,*.md,*.ts,*.yml,*eslintrc}]
 indent_style = space
 indent_size = 2
-insert_final_newline = true
+insert_final_newline = false
 max_line_length = 160
 trim_trailing_whitespace = true
 
diff --git a/.eslintrc.json b/.eslintrc.json
index 076062c..4ff49b5 100644
--- a/.eslintrc.json
+++ b/.eslintrc.json
@@ -20,7 +20,13 @@
       {
         "SwitchCase": 1
       }
-    ]
+    ],
+    "max-len": [
+      "error",
+      {
+        "code": 80
+      }
+    ],
   },
   "ignorePatterns": [
     "*.test.ts"
diff --git a/forge.config.ts b/forge.config.ts
index 9ed7aaf..d1cf89a 100644
--- a/forge.config.ts
+++ b/forge.config.ts
@@ -13,6 +13,13 @@ const config: ForgeConfig = {
       unpack: '**/node_modules/ffmpeg-static/ffmpeg',
     },
     icon: 'src/assets/images/icon/icon',
+    extraResource: 'node_modules/ffmpeg-static/ffmpeg',
+    osxSign: {},
+    osxNotarize: {
+      appleId: process.env.APPLE_ID,
+      appleIdPassword: process.env.APPLE_ID_PASSWORD,
+      teamId: process.env.TEAM_ID,
+    },
   },
   rebuildConfig: {},
   makers: [
diff --git a/src/App.vue b/src/App.vue
index 33175dd..e424f4c 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -23,6 +23,8 @@ import {
   TrashIcon,
   ReloadIcon,
 } from '@radix-icons/vue';
+import { Channel } from './enums/channel';
+import { SUPPORTED_FORMATS } from './consts/formats';
 
 const files = ref<File[] | undefined>();
 const saveDirectory = ref<string | undefined>();
@@ -35,18 +37,20 @@ onMounted(async () => {
   saveDirectory.value = await window.electron.getDownloadsPath();
 
   // Listen for backend messages
-  window.electron.on('ffmpeg-status', (_event: any, message: string) => {
+  window.electron.on(Channel.FFMPEG_STATUS, (_event: any, message: string) => {
     toast({
       title: 'FFmpeg Status',
       description: message,
     });
   });
 
-  window.electron.on('conversion-progress', (_event: any, { filePath, progress }: { filePath: string, progress: number; }) => {
+  window.electron.on(Channel.CONVERSION_PROGRESS, (
+    _event: any, { filePath, progress }: { filePath: string, progress: number; }
+  ) => {
     conversionProgress.value[filePath] = progress;
   });
 
-  window.electron.on('conversion-error', (_event: any, error: string) => {
+  window.electron.on(Channel.CONVERSION_ERROR, (_event: any, error: string) => {
     converting.value = false;
     toast({
       title: 'Error',
@@ -58,21 +62,13 @@ onMounted(async () => {
 
 onUnmounted(() => {
   // Cleanup IPC listeners to avoid memory leaks
-  window.electron.removeAllListeners('ffmpeg-status');
-  window.electron.removeAllListeners('conversion-progress');
-  window.electron.removeAllListeners('conversion-error');
+  window.electron.removeAllListeners(Channel.FFMPEG_STATUS);
+  window.electron.removeAllListeners(Channel.CONVERSION_PROGRESS);
+  window.electron.removeAllListeners(Channel.CONVERSION_ERROR);
 });
 
 const emit = defineEmits(['files-uploaded']);
 
-const CONVERSION_FORMATS = [
-  'mp4', 'webm', 'ogg', 'flv', 'avi',
-  'mov', 'wmv', '3gp', 'mkv', 'm4v',
-  'mpg', 'mpeg', 'vob', 'ts', 'asf',
-  'f4v', 'h264', 'hevc', 'm2ts', 'm2v',
-  'mts', 'ogv', 'rm', 'swf', 'xvid',
-];
-
 function handleUpload(uploads: FileList) {
   files.value = Array.from(uploads);
 }
@@ -116,7 +112,11 @@ async function convertFiles() {
       const outputFormat = convertTo.value;
       const outputDirectory = saveDirectory.value;
 
-      const outputFilePath = await window.electron.convertVideo(filePath, outputFormat, outputDirectory);
+      const outputFilePath = await window.electron.convertVideo(
+        filePath,
+        outputFormat,
+        outputDirectory
+      );
 
       toast({
         title: 'File converted',
@@ -207,7 +207,7 @@ async function convertFiles() {
                       <div class="h-56 overflow-hidden">
                         <div class="mt-4 h-56 overflow-y-auto">
                           <ul role="list" class="grid grid-cols-3 gap-4">
-                            <li v-for="format in CONVERSION_FORMATS" :key="format" class="flex items-center gap-2">
+                            <li v-for="format in SUPPORTED_FORMATS" :key="format" class="flex items-center gap-2">
                               <button
                                 type="button"
                                 class="flex items-center justify-center p-2 rounded-lg flex-1"
diff --git a/src/config.ts b/src/config.ts
new file mode 100644
index 0000000..f56bf01
--- /dev/null
+++ b/src/config.ts
@@ -0,0 +1,25 @@
+import path from 'path';
+import { AppConfig } from './interfaces/app-config';
+
+const isDev: boolean = process.env.NODE_ENV === 'development';
+
+export const config = {
+  appName: 'Comet',
+  productName: 'comet',
+  title: 'Comet | Video Converter',
+  appId: 'com.github.comet',
+  icons: path.join(__dirname, 'assets', 'images', 'icon', 'icon.png'),
+  isDev,
+  directories: {
+    output: 'out',
+  },
+  width: isDev ? 1200 : 700,
+  height: 600,
+  resizable: false,
+  show: false,
+  webPreferences: {
+    preload: path.join(__dirname, 'preload.js'),
+    nodeIntegration: false,
+    contextIsolation: true,
+  }
+} as AppConfig;
diff --git a/src/consts/formats.ts b/src/consts/formats.ts
new file mode 100644
index 0000000..16a432e
--- /dev/null
+++ b/src/consts/formats.ts
@@ -0,0 +1,7 @@
+export const SUPPORTED_FORMATS = [
+  'mp4', 'webm', 'ogg', 'flv', 'avi',
+  'mov', 'wmv', '3gp', 'mkv', 'm4v',
+  'mpg', 'mpeg', 'vob', 'ts', 'asf',
+  'f4v', 'h264', 'hevc', 'm2ts', 'm2v',
+  'mts', 'ogv', 'rm', 'swf', 'xvid',
+];
diff --git a/src/enums/channel.ts b/src/enums/channel.ts
new file mode 100644
index 0000000..1b40ecf
--- /dev/null
+++ b/src/enums/channel.ts
@@ -0,0 +1,8 @@
+export enum Channel {
+  CONVERSION_PROGRESS = 'conversion-progress',
+  CONVERSION_ERROR = 'conversion-error',
+  DIALOG_SELECT_DIRECTORY = 'dialog:selectDirectory',
+  GET_DOWNLOADS_PATH = 'getDownloadsPath',
+  CONVERT_VIDEO = 'convertVideo',
+  FFMPEG_STATUS = 'ffmpeg-status',
+}
diff --git a/src/enums/event.ts b/src/enums/event.ts
new file mode 100644
index 0000000..f6a018a
--- /dev/null
+++ b/src/enums/event.ts
@@ -0,0 +1,11 @@
+export enum Event {
+  READY = 'ready',
+  WINDOW_ALL_CLOSED = 'window-all-closed',
+  ACTIVATE = 'activate',
+  DIALOG_SELECT_DIRECTORY = 'dialog:selectDirectory',
+  PRROGRESS = 'progress',
+  END = 'end',
+  ERROR = 'error',
+  UNCAUGHT_EXCEPTION = 'uncaughtException',
+  READY_TO_SHOW = 'ready-to-show',
+}
diff --git a/src/enums/platform.ts b/src/enums/platform.ts
new file mode 100644
index 0000000..8c9ef9f
--- /dev/null
+++ b/src/enums/platform.ts
@@ -0,0 +1,5 @@
+export enum Platform {
+  WINDOWS = 'win32',
+  MAC = 'darwin',
+  LINUX = 'linux',
+}
diff --git a/src/enums/shortcut.ts b/src/enums/shortcut.ts
new file mode 100644
index 0000000..dc98268
--- /dev/null
+++ b/src/enums/shortcut.ts
@@ -0,0 +1,5 @@
+export enum ShortCut {
+  RELOAD = 'CmdOrCtrl+R',
+  RELOAD_F5 = 'F5',
+  TOGGLE_DEV_TOOLS = 'CmdOrCtrl+Shift+I',
+}
diff --git a/src/interfaces/app-config.ts b/src/interfaces/app-config.ts
new file mode 100644
index 0000000..e552c80
--- /dev/null
+++ b/src/interfaces/app-config.ts
@@ -0,0 +1,9 @@
+import { BrowserWindowConstructorOptions } from 'electron';
+
+export interface AppConfig extends BrowserWindowConstructorOptions {
+  appName: string,
+  productName: string,
+  title: string,
+  appId: string,
+  isDev: boolean,
+};
diff --git a/src/lib/conversion-handler.ts b/src/lib/conversion-handler.ts
new file mode 100644
index 0000000..6ebe3fb
--- /dev/null
+++ b/src/lib/conversion-handler.ts
@@ -0,0 +1,37 @@
+import { IpcMainInvokeEvent } from 'electron';
+import { FfmpegCommand } from 'fluent-ffmpeg';
+import { Channel } from '../enums/channel';
+import { Event } from '../enums/event';
+
+/**
+ * Handle the video conversion process.
+ */
+export async function handleConversion(
+  ffmpeg: (filePath: string) => FfmpegCommand,
+  event: IpcMainInvokeEvent,
+  filePath: string,
+  outputFilePath: string,
+  outputFormat: string
+): Promise<string> {
+  return new Promise((resolve, reject) => {
+    ffmpeg(filePath)
+      .toFormat(outputFormat)
+      .on(Event.PRROGRESS, (progress) => {
+        if (progress.percent) {
+          event.sender.send(
+            Channel.CONVERSION_PROGRESS,
+            progress
+          );
+        }
+      })
+      .on(Event.END, () => resolve(outputFilePath))
+      .on(Event.ERROR, (error) => {
+        event.sender.send(
+          Channel.CONVERSION_ERROR,
+          `FFmpeg error: ${error.message}`
+        );
+        reject(error);
+      })
+      .save(outputFilePath);
+  });
+}
diff --git a/src/lib/ffmpeg.ts b/src/lib/ffmpeg.ts
new file mode 100644
index 0000000..4547a3d
--- /dev/null
+++ b/src/lib/ffmpeg.ts
@@ -0,0 +1,59 @@
+import fs from 'fs';
+import { execSync } from 'child_process';
+import ffmpeg from 'fluent-ffmpeg';
+import { App, IpcMain, Dialog } from 'electron';
+
+/**
+ * Get the path to the FFmpeg binary.
+ *
+ * @throws {Error} Will throw an error if the FFmpeg binary is not found.
+ */
+export function getFfmpegPath(ipcMain: IpcMain): string {
+  let ffmpegStatic: string | undefined;
+
+  try {
+    const ffmpegPath = execSync('which ffmpeg').toString().trim();
+
+    if (fs.existsSync(ffmpegPath)) {
+      return ffmpegPath;
+    }
+  } catch (error) {
+    ipcMain.emit('ffmpeg-status', 'System FFmpeg not found, using ffmpeg-static');
+  }
+
+  if (typeof process !== 'undefined' && process.versions && process.versions.node) {
+    ffmpegStatic = require('ffmpeg-static');
+  }
+
+  if (ffmpegStatic) {
+    return ffmpegStatic;
+  }
+
+  throw new Error('FFmpeg binary not found');
+}
+
+/**
+ * Create a FFmpeg command instance.
+ */
+export function makeFfmpeg(
+  app: App,
+  ipcMain: IpcMain,
+  dialog: Dialog
+): (filePath: string) => ffmpeg.FfmpegCommand {
+  const ffmpegPath = getFfmpegPath(ipcMain);
+
+  if (ffmpegPath) {
+    try {
+      fs.chmodSync(ffmpegPath, 0o755);
+      ffmpeg.setFfmpegPath(ffmpegPath);
+    } catch (err) {
+      dialog.showErrorBox('FFmpeg Error', `Failed to set executable permissions or FFmpeg path: ${err.message}`);
+      app.quit();
+    }
+  } else {
+    dialog.showErrorBox('FFmpeg Error', 'FFmpeg binary not found');
+    app.quit();
+  }
+
+  return (filePath: string) => ffmpeg(filePath);
+}
diff --git a/src/lib/window-manager.ts b/src/lib/window-manager.ts
new file mode 100644
index 0000000..f637308
--- /dev/null
+++ b/src/lib/window-manager.ts
@@ -0,0 +1,45 @@
+import {
+  BrowserWindow,
+  globalShortcut,
+} from 'electron';
+import path from 'path';
+import { config } from '../config';
+import { ShortCut } from '../enums/shortcut';
+import { Event } from '../enums/event';
+
+/**
+ * The main application window.
+ */
+let mainWindow: BrowserWindow | undefined = undefined;
+
+/**
+ * Create the main application window.
+ */
+export function createWindow(): BrowserWindow {
+  mainWindow = new BrowserWindow({ ...config });
+
+  mainWindow.once(Event.READY_TO_SHOW, () => mainWindow.show());
+
+  const mainWindowUrl: string = config.isDev
+    ? process.env.MAIN_WINDOW_VITE_DEV_SERVER_URL || 'default_dev_url'
+    : `file://${path.join(__dirname, '../renderer', process.env.MAIN_WINDOW_VITE_NAME || 'default_name', 'index.html')}`;
+
+  mainWindow.loadURL(mainWindowUrl);
+
+  if (config.isDev) {
+    mainWindow.webContents.openDevTools();
+  }
+
+  if (!config.isDev) {
+    // eslint-disable-next-line @typescript-eslint/no-empty-function
+    globalShortcut.register(ShortCut.RELOAD, () => { });
+    // eslint-disable-next-line @typescript-eslint/no-empty-function
+    globalShortcut.register(ShortCut.RELOAD_F5, () => { });
+  }
+
+  return mainWindow;
+}
+
+export {
+  mainWindow,
+};
diff --git a/src/main.ts b/src/main.ts
index 35132b5..fd497a2 100644
--- a/src/main.ts
+++ b/src/main.ts
@@ -3,110 +3,35 @@ import {
   BrowserWindow,
   ipcMain,
   dialog,
-  globalShortcut,
+  IpcMainInvokeEvent,
 } from 'electron';
 import path from 'path';
+import { makeFfmpeg } from './lib/ffmpeg';
+import { createWindow } from './lib/window-manager';
+import { handleConversion } from './lib/conversion-handler';
 import os from 'os';
-import fs from 'fs';
-import ffmpeg from 'fluent-ffmpeg';
-import { execSync } from 'child_process';
+import { Event } from './enums/event';
+import { Channel } from './enums/channel';
+import { Platform } from './enums/platform';
 
 app.setName('Comet');
 
-let ffmpegStatic: string | undefined;
-
-/**
- * Get the path to the FFmpeg binary.
- *
- * @throws {Error} Will throw an error if the FFmpeg binary is not found.
- */
-export function getFfmpegPath(): string {
-  try {
-    const ffmpegPath = execSync('which ffmpeg').toString().trim();
-
-    if (fs.existsSync(ffmpegPath)) {
-      return ffmpegPath;
-    }
-  } catch (error) {
-    ipcMain.emit('ffmpeg-status', 'System FFmpeg not found, using ffmpeg-static');
-  }
-
-  if (typeof process !== 'undefined' && process.versions && process.versions.node) {
-    ffmpegStatic = require('ffmpeg-static');
-  }
-
-  if (ffmpegStatic) {
-    return ffmpegStatic;
-  }
-
-  throw new Error('FFmpeg binary not found');
-}
-
-if (process.platform === 'win32' && require('electron-squirrel-startup')) {
+if (
+  process.platform === Platform.WINDOWS
+  && require('electron-squirrel-startup')
+) {
   app.quit();
 }
 
-const ffmpegPath = getFfmpegPath();
-
-if (ffmpegPath) {
-  try {
-    fs.chmodSync(ffmpegPath, 0o755);
-    ffmpeg.setFfmpegPath(ffmpegPath);
-  } catch (err) {
-    dialog.showErrorBox('FFmpeg Error', `Failed to set executable permissions or FFmpeg path: ${err.message}`);
-    app.quit();
-  }
-} else {
-  dialog.showErrorBox('FFmpeg Error', 'FFmpeg binary not found');
-  app.quit();
-}
-
-const isDev = process.env.NODE_ENV === 'development';
-
 /**
- * Create the main application window.
+ * Create a FFmpeg command instance.
  */
-export function createWindow() {
-  const mainWindow = new BrowserWindow({
-    title: 'Comet | Video Converter',
-    icon: path.join(__dirname, 'assets', 'images', 'icon', 'icon.png'),
-    width: isDev ? 1200 : 700,
-    height: 600,
-    resizable: false,
-    show: false,
-    webPreferences: {
-      preload: path.join(__dirname, 'preload.js'),
-      nodeIntegration: false,
-      contextIsolation: true,
-    },
-  });
-
-  mainWindow.once('ready-to-show', () => {
-    mainWindow.show();
-  });
-
-  const mainWindowUrl = isDev
-    ? process.env.MAIN_WINDOW_VITE_DEV_SERVER_URL || 'default_dev_url'
-    : `file://${path.join(__dirname, '../renderer', process.env.MAIN_WINDOW_VITE_NAME || 'default_name', 'index.html')}`;
-
-  mainWindow.loadURL(mainWindowUrl);
+const ffmpeg = makeFfmpeg(app, ipcMain, dialog);
 
-  if (isDev) {
-    mainWindow.webContents.openDevTools();
-  }
-
-  if (!isDev) {
-    // eslint-disable-next-line @typescript-eslint/no-empty-function
-    globalShortcut.register('CmdOrCtrl+R', () => { });
-    // eslint-disable-next-line @typescript-eslint/no-empty-function
-    globalShortcut.register('F5', () => { });
-  }
-}
-
-app.on('ready', () => {
+app.on(Event.READY, () => {
   createWindow();
 
-  ipcMain.handle('dialog:selectDirectory', async () => {
+  ipcMain.handle(Channel.DIALOG_SELECT_DIRECTORY, async () => {
     const result = await dialog.showOpenDialog({
       properties: ['openDirectory'],
     });
@@ -114,46 +39,50 @@ app.on('ready', () => {
     return result.canceled ? null : result.filePaths[0];
   });
 
-  ipcMain.handle('getDownloadsPath', () => path.join(os.homedir(), 'Downloads'));
+  ipcMain.handle(Channel.GET_DOWNLOADS_PATH, () => {
+    return path.join(os.homedir(), 'Downloads');
+  });
 
-  ipcMain.handle('convert-video', async (event, { filePath, outputFormat, saveDirectory }) => {
+  ipcMain.handle(Channel.CONVERT_VIDEO, async (
+    event: IpcMainInvokeEvent,
+    { filePath, outputFormat, saveDirectory }
+  ) => {
     try {
-      const outputFilePath = path.join(saveDirectory, `${path.parse(filePath).name}.${outputFormat}`);
-
-      return await new Promise((resolve, reject) => {
-        ffmpeg(filePath)
-          .toFormat(outputFormat)
-          .on('progress', (progress) => {
-            if (progress.percent) {
-              event.sender.send('conversion-progress', progress);
-            }
-          })
-          .on('end', () => resolve(outputFilePath))
-          .on('error', (error) => {
-            event.sender.send('conversion-error', `FFmpeg error: ${error.message}`);
-            reject(error);
-          })
-          .save(outputFilePath);
-      });
+      const outputFilePath = path.join(
+        saveDirectory,
+        `${path.parse(filePath).name}.${outputFormat}`
+      );
+
+      return await handleConversion(
+        ffmpeg,
+        event,
+        filePath,
+        outputFilePath,
+        outputFormat
+      );
     } catch (error) {
-      event.sender.send('conversion-error', `Error during video conversion: ${error.message}`);
+      event.sender.send(
+        Channel.CONVERSION_ERROR,
+        `Error during video conversion: ${error.message}`
+      );
+
       throw new Error(`Error during video conversion: ${error.message}`);
     }
   });
 });
 
-app.on('window-all-closed', () => {
-  if (process.platform !== 'darwin') {
+app.on(Event.WINDOW_ALL_CLOSED, () => {
+  if (process.platform !== Platform.MAC) {
     app.quit();
   }
 });
 
-app.on('activate', () => {
+app.on(Event.ACTIVATE, () => {
   if (BrowserWindow.getAllWindows().length === 0) {
     createWindow();
   }
 });
 
-process.on('uncaughtException', (error) => {
+process.on(Event.UNCAUGHT_EXCEPTION, (error) => {
   dialog.showErrorBox('An Uncaught Exception Occurred', error.message);
 });
diff --git a/src/preload.ts b/src/preload.ts
index bf088ac..d4faad4 100644
--- a/src/preload.ts
+++ b/src/preload.ts
@@ -1,12 +1,13 @@
-import { contextBridge, ipcRenderer } from 'electron';
+import { contextBridge, ipcRenderer, IpcRendererEvent } from 'electron';
+import { Channel } from './enums/channel';
 
 contextBridge.exposeInMainWorld('electron', {
-  selectDirectory: () => ipcRenderer.invoke('dialog:selectDirectory'),
-  getDownloadsPath: () => ipcRenderer.invoke('getDownloadsPath'),
+  selectDirectory: () => ipcRenderer.invoke(Channel.DIALOG_SELECT_DIRECTORY),
+  getDownloadsPath: () => ipcRenderer.invoke(Channel.GET_DOWNLOADS_PATH),
   convertVideo: (filePath: string, outputFormat: string, saveDirectory: string) => {
-    return ipcRenderer.invoke('convert-video', { filePath, outputFormat, saveDirectory });
+    return ipcRenderer.invoke(Channel.CONVERT_VIDEO, { filePath, outputFormat, saveDirectory });
   },
-  on: (channel: string, callback: (event: Electron.IpcRendererEvent, ...args: unknown[]) => void) => {
+  on: (channel: string, callback: (event: IpcRendererEvent, ...args: unknown[]) => void) => {
     ipcRenderer.on(channel, callback);
   },
   removeAllListeners: (channel: string) => {