feat: refactor plugin utils (#1391)

src/index.ts

@@ -13,7 +13,7 @@ import { parse } from 'node-html-parser';
 import config from './config';
 
 import { refreshMenu, setApplicationMenu } from './menu';
-import { fileExists, injectCSS, injectCSSAsFile } from './plugins/utils';
+import { fileExists, injectCSS, injectCSSAsFile } from './plugins/utils/main';
 import { isTesting } from './utils/testing';
 import { setUpTray } from './tray';
 import { setupSongInfo } from './providers/song-info';

src/menu.ts

@@ -10,7 +10,7 @@ import promptOptions from './providers/prompt-options';
 // eslint-disable-next-line import/order
 import { pluginList as menuList } from 'virtual:MenuPlugins';
 
-import { getAvailablePluginNames } from './plugins/utils';
+import { getAvailablePluginNames } from './plugins/utils/main';
 
 export type MenuTemplate = Electron.MenuItemConstructorOptions[];
 

src/plugins/album-color-theme/back.ts

@@ -2,7 +2,7 @@ import { BrowserWindow } from 'electron';
 
 import style from './style.css';
 
-import { injectCSS } from '../utils';
+import { injectCSS } from '../utils/main';
 
 export default (win: BrowserWindow) => {
   injectCSS(win.webContents, style);

src/plugins/ambient-mode/back.ts

@@ -3,7 +3,7 @@ import { BrowserWindow } from 'electron';
 import config from './config';
 import style from './style.css';
 
-import { injectCSS } from '../utils';
+import { injectCSS } from '../utils/main';
 
 export default (win: BrowserWindow) => {
   config.subscribeAll((newConfig) => {

src/plugins/blur-nav-bar/back.ts

@@ -2,7 +2,7 @@ import { BrowserWindow } from 'electron';
 
 import style from './style.css';
 
-import { injectCSS } from '../utils';
+import { injectCSS } from '../utils/main';
 
 export default (win: BrowserWindow) => {
   injectCSS(win.webContents, style);

src/plugins/captions-selector/front.ts

@@ -2,7 +2,7 @@ import configProvider from './config-renderer';
 
 import CaptionsSettingsButtonHTML from './templates/captions-settings-template.html?raw';
 
-import { ElementFromHtml } from '../utils-renderer';
+import { ElementFromHtml } from '../utils/renderer';
 import { YoutubePlayer } from '../../types/youtube-player';
 
 import type { ConfigType } from '../../config/dynamic';

src/plugins/downloader/back.ts

@@ -35,7 +35,7 @@ import style from './style.css';
 import { fetchFromGenius } from '../lyrics-genius/back';
 import { isEnabled } from '../../config/plugins';
 import { cleanupName, getImage, SongInfo } from '../../providers/song-info';
-import { injectCSS } from '../utils';
+import { injectCSS } from '../utils/main';
 import { cache } from '../../providers/decorators';
 
 import type { FormatOptions } from 'youtubei.js/dist/src/types/FormatUtils';

src/plugins/downloader/front.ts

@@ -2,7 +2,7 @@ import downloadHTML from './templates/download.html?raw';
 
 import defaultConfig from '../../config/defaults';
 import { getSongMenu } from '../../providers/dom-elements';
-import { ElementFromHtml } from '../utils-renderer';
+import { ElementFromHtml } from '../utils/renderer';
 import { getSongInfo } from '../../providers/song-info-front';
 
 let menu: Element | null = null;

src/plugins/in-app-menu/back.ts

@@ -4,7 +4,7 @@ import { BrowserWindow, Menu, MenuItem, ipcMain, nativeImage } from 'electron';
 
 import titlebarStyle from './titlebar.css';
 
-import { injectCSS } from '../utils';
+import { injectCSS } from '../utils/main';
 
 // Tracks menu visibility
 export default (win: BrowserWindow) => {

src/plugins/in-app-menu/menu/panel.ts

@@ -1,6 +1,6 @@
 import Icons from './icons';
 
-import { ElementFromHtml } from '../../utils-renderer';
+import { ElementFromHtml } from '../../utils/renderer';
 
 import type { MenuItem } from 'electron';
 

src/plugins/lyrics-genius/back.ts

@@ -7,7 +7,7 @@ import { GetGeniusLyric } from './types';
 
 import { cleanupName, SongInfo } from '../../providers/song-info';
 
-import { injectCSS } from '../utils';
+import { injectCSS } from '../utils/main';
 
 import type { ConfigType } from '../../config/dynamic';
 

src/plugins/navigation/back.ts

@@ -2,7 +2,7 @@ import { BrowserWindow } from 'electron';
 
 import style from './style.css';
 
-import { injectCSS } from '../utils';
+import { injectCSS } from '../utils/main';
 
 export function handle(win: BrowserWindow) {
   injectCSS(win.webContents, style, () => {

src/plugins/navigation/front.ts

@@ -1,7 +1,7 @@
 import forwardHTML from './templates/forward.html?raw';
 import backHTML from './templates/back.html?raw';
 
-import { ElementFromHtml } from '../utils-renderer';
+import { ElementFromHtml } from '../utils/renderer';
 
 export function run() {
   window.ipcRenderer.on('navigation-css-ready', () => {

src/plugins/no-google-login/back.ts

@@ -2,7 +2,7 @@ import { BrowserWindow } from 'electron';
 
 import style from './style.css';
 
-import { injectCSS } from '../utils';
+import { injectCSS } from '../utils/main';
 
 export default (win: BrowserWindow) => {
   injectCSS(win.webContents, style);

src/plugins/notifications/interactive.ts

@@ -7,7 +7,7 @@ import getSongControls from '../../providers/song-controls';
 import registerCallback, { SongInfo } from '../../providers/song-info';
 import { changeProtocolHandler } from '../../providers/protocol-handler';
 import { setTrayOnClick, setTrayOnDoubleClick } from '../../tray';
-import { mediaIcons } from '../utils';
+import { mediaIcons } from '../../types/media-icons';
 
 import playIcon from '../../../assets/media-icons-black/play.png?asset&asarUnpack';
 import pauseIcon from '../../../assets/media-icons-black/pause.png?asset&asarUnpack';

src/plugins/picture-in-picture/back.ts

@@ -2,7 +2,7 @@ import { app, BrowserWindow, ipcMain } from 'electron';
 
 import style from './style.css';
 
-import { injectCSS } from '../utils';
+import { injectCSS } from '../utils/main';
 import { setOptions as setPluginOptions } from '../../config/plugins';
 
 import type { ConfigType } from '../../config/dynamic';

src/plugins/picture-in-picture/front.ts

@@ -5,7 +5,7 @@ import pipHTML from './templates/picture-in-picture.html?raw';
 
 import { getSongMenu } from '../../providers/dom-elements';
 
-import { ElementFromHtml } from '../utils-renderer';
+import { ElementFromHtml } from '../utils/renderer';
 
 import type { ConfigType } from '../../config/dynamic';
 

src/plugins/playback-speed/front.ts

@@ -1,7 +1,7 @@
 import sliderHTML from './templates/slider.html?raw';
 
 import { getSongMenu } from '../../providers/dom-elements';
-import { ElementFromHtml } from '../utils-renderer';
+import { ElementFromHtml } from '../utils/renderer';
 import { singleton } from '../../providers/decorators';
 
 

src/plugins/precise-volume/back.ts

@@ -2,7 +2,7 @@ import { globalShortcut, BrowserWindow } from 'electron';
 
 import volumeHudStyle from './volume-hud.css';
 
-import { injectCSS } from '../utils';
+import { injectCSS } from '../utils/main';
 
 import type { ConfigType } from '../../config/dynamic';
 

src/plugins/quality-changer/front.ts

@@ -1,6 +1,6 @@
 import qualitySettingsTemplate from './templates/qualitySettingsTemplate.html?raw';
 
-import { ElementFromHtml } from '../utils-renderer';
+import { ElementFromHtml } from '../utils/renderer';
 import { YoutubePlayer } from '../../types/youtube-player';
 
 function $(selector: string): HTMLElement | null {

src/plugins/taskbar-mediacontrol/back.ts

@@ -2,7 +2,7 @@ import { BrowserWindow, nativeImage } from 'electron';
 
 import getSongControls from '../../providers/song-controls';
 import registerCallback, { SongInfo } from '../../providers/song-info';
-import { mediaIcons } from '../utils';
+import { mediaIcons } from '../../types/media-icons';
 
 import playIcon from '../../../assets/media-icons-black/play.png?asset&asarUnpack';
 import pauseIcon from '../../../assets/media-icons-black/pause.png?asset&asarUnpack';

src/plugins/utils/main/css.ts

@@ -1,32 +1,5 @@
 import fs from 'node:fs';
 
-import is from 'electron-is';
-
-import defaultConfig from '../config/defaults';
-
-export const mediaIcons = {
-  play: '\u{1405}', // ᐅ
-  pause: '\u{2016}', // ‖
-  next: '\u{1433}', // ᐳ
-  previous: '\u{1438}', // ᐸ
-} as const;
-
-export const fileExists = (
-  path: fs.PathLike,
-  callbackIfExists: { (): void; (): void; (): void; },
-  callbackIfError: (() => void) | undefined = undefined,
-) => {
-  fs.access(path, fs.constants.F_OK, (error) => {
-    if (error) {
-      callbackIfError?.();
-
-      return;
-    }
-
-    callbackIfExists();
-  });
-};
-
 const cssToInject = new Map<string, (() => void) | undefined>();
 const cssToInjectFile = new Map<string, (() => void) | undefined>();
 export const injectCSS = (webContents: Electron.WebContents, css: string, cb: (() => void) | undefined = undefined) => {
@@ -53,21 +26,8 @@ const setupCssInjection = (webContents: Electron.WebContents) => {
     });
 
     cssToInjectFile.forEach(async (callback, filepath) => {
-      await webContents.insertCSS(fs.readFileSync(filepath, 'utf8'));
+      await webContents.insertCSS(fs.readFileSync(filepath, 'utf-8'));
       callback?.();
     });
   });
 };
-
-export const getAvailablePluginNames = () => {
-  return Object.keys(defaultConfig.plugins).filter((name) => {
-    if (is.windows() && name === 'touchbar') {
-      return false;
-    } else if (is.macOS() && name === 'taskbar-mediacontrol') {
-      return false;
-    } else if (is.linux() && (name === 'taskbar-mediacontrol' || name === 'touchbar')) {
-      return false;
-    }
-    return true;
-  });
-};

src/plugins/utils/main/fs.ts

@@ -0,0 +1,17 @@
+import fs from 'node:fs';
+
+export const fileExists = (
+  path: fs.PathLike,
+  callbackIfExists: { (): void; (): void; (): void; },
+  callbackIfError: (() => void) | undefined = undefined,
+) => {
+  fs.access(path, fs.constants.F_OK, (error) => {
+    if (error) {
+      callbackIfError?.();
+
+      return;
+    }
+
+    callbackIfExists();
+  });
+};

src/plugins/utils/main/index.ts

@@ -0,0 +1,3 @@
+export * from './css';
+export * from './fs';
+export * from './plugin';

src/plugins/utils/main/plugin.ts

@@ -0,0 +1,16 @@
+import is from 'electron-is';
+
+import defaultConfig from '../../../config/defaults';
+
+export const getAvailablePluginNames = () => {
+  return Object.keys(defaultConfig.plugins).filter((name) => {
+    if (is.windows() && name === 'touchbar') {
+      return false;
+    } else if (is.macOS() && name === 'taskbar-mediacontrol') {
+      return false;
+    } else if (is.linux() && (name === 'taskbar-mediacontrol' || name === 'touchbar')) {
+      return false;
+    }
+    return true;
+  });
+};

src/plugins/utils/renderer/index.ts

@@ -0,0 +1 @@
+export * from './html';

src/plugins/video-toggle/back.ts

@@ -3,7 +3,7 @@ import { BrowserWindow } from 'electron';
 import forceHideStyle from './force-hide.css';
 import buttonSwitcherStyle from './button-switcher.css';
 
-import { injectCSS } from '../utils';
+import { injectCSS } from '../utils/main';
 
 import type { ConfigType } from '../../config/dynamic';
 

src/plugins/video-toggle/front.ts

@@ -1,6 +1,6 @@
 import buttonTemplate from './templates/button_template.html?raw';
 
-import { ElementFromHtml } from '../utils-renderer';
+import { ElementFromHtml } from '../utils/renderer';
 
 import { moveVolumeHud as preciseVolumeMoveVolumeHud } from '../precise-volume/front';
 

src/plugins/visualizer/back.ts

@@ -2,7 +2,7 @@ import { BrowserWindow } from 'electron';
 
 import emptyPlayerStyle from './empty-player.css';
 
-import { injectCSS } from '../utils';
+import { injectCSS } from '../utils/main';
 
 export default (win: BrowserWindow) => {
   injectCSS(win.webContents, emptyPlayerStyle);

src/types/media-icons.ts

@@ -0,0 +1,6 @@
+export const mediaIcons = {
+  play: '\u{1405}', // ᐅ
+  pause: '\u{2016}', // ‖
+  next: '\u{1433}', // ᐳ
+  previous: '\u{1438}', // ᐸ
+} as const;