fix: Bump to ESM and update all deps (#1851)

* chore: Bump various packages

* feat: Update everything to ESM

* fix: building and porting js to cjs

.prettierignore

@@ -1,5 +1,6 @@
 src/renderer/*hls*.js
 build/*
+dist/*
 src/renderer/lib/*
 *.min.*
 .pnpm-store

.yarnrc.yml

@@ -1,5 +1,5 @@
-nodeLinker: node-modules
+compressionLevel: mixed
 
-plugins:
+enableGlobalCache: false
-  - path: .yarn/plugins/@yarnpkg/plugin-workspace-tools.cjs
+
-    spec: "@yarnpkg/plugin-workspace-tools"
+nodeLinker: node-modules

package.json

@@ -5,9 +5,11 @@
   "version": "1.6.2",
   "description": "A new cross-platform Apple Music experience based on Electron and Vue.js written from scratch with performance in mind.",
   "license": "AGPL-3.0",
+  "exports": "./build/index.js",
   "main": "./build/index.js",
   "author": "Cider Collective <cryptofyre@cider.sh> (https://cider.sh)",
   "repository": "github:ciderapp/Cider",
+  "type": "module",
   "bugs": {
     "url": "https://github.com/ciderapp/Cider/issues?q=is%3Aopen+is%3Aissue+label%3Abug"
   },
@@ -29,29 +31,29 @@
     "format:write": "npx prettier --write \"src/**/*.{js,json,ts,less}\""
   },
   "dependencies": {
-    "@achingbrain/ssdp": "^4.0.4",
+    "@achingbrain/ssdp": "^4.0.6",
-    "@crowdin/ota-client": "^1.1.0",
+    "@crowdin/ota-client": "^1.1.1",
-    "@sentry/electron": "^4.6.0",
+    "@sentry/electron": "^4.24.0",
-    "@sentry/integrations": "^7.69.0",
+    "@sentry/integrations": "7.114.0",
-    "adm-zip": "^0.5.10",
+    "adm-zip": "^0.5.12",
-    "airtunes2": "github:ciderapp/node_airtunes2",
+    "airtunes2": "ciderapp/node_airtunes2",
-    "castv2-client": "^1.2.0",
+    "castv2-client": "ciderapp/node-castv2-client",
-    "chokidar": "^3.5.3",
+    "chokidar": "^3.6.0",
     "discord-auto-rpc": "^1.0.17",
-    "ejs": "^3.1.9",
+    "ejs": "^3.1.10",
-    "electron-fetch": "^1.9.1",
+    "electron-log": "^5.1.4",
-    "electron-log": "^4.4.8",
     "electron-notarize": "^1.2.2",
-    "electron-store": "^8.1.0",
+    "electron-store": "^9.0.0",
-    "electron-updater": "^5.3.0",
+    "electron-updater": "6.2.1",
     "electron-window-state": "^5.0.3",
-    "express": "^4.18.2",
+    "express": "^4.19.2",
-    "get-port": "5.1.1",
+    "get-port": "7.1.0",
-    "jimp": "^0.22.8",
+    "jimp": "^0.22.12",
     "lastfmapi": "^0.1.1",
-    "mdns-js": "github:ciderapp/node-mdns-js",
+    "mdns-js": "ciderapp/node-mdns-js",
-    "mpris-service": "^2.1.2",
+    "mpris-service": "ciderapp/mpris-service",
-    "music-metadata": "7.12.6",
+    "music-metadata": "7.14.0",
+    "node-fetch": "^3.3.2",
     "node-ssdp": "^4.0.1",
     "node-ssdp-js": "^0.9.6",
     "qrcode": "^1.5.3",
@@ -60,31 +62,35 @@
     "source-map-support": "^0.5.21",
     "ssdp-js": "^1.0.1",
     "ts-md5": "1.3.1",
-    "upnp-mediarenderer-client": "github:vapormusic/node-upnp-mediarenderer-client",
+    "upnp-mediarenderer-client": "vapormusic/node-upnp-mediarenderer-client",
-    "v8-compile-cache": "^2.3.0",
+    "v8-compile-cache": "^2.4.0",
-    "wallpaper": "5.0.1",
+    "wallpaper": "7.2.1",
-    "ws": "^8.14.1",
+    "ws": "^8.17.0",
-    "xml2js": "^0.6.0",
+    "xml2js": "^0.6.2",
-    "youtube-search-without-api-key": "^1.1.0"
+    "youtube-search-without-api-key": "^2.0.1"
   },
   "devDependencies": {
-    "@types/adm-zip": "^0.5.0",
+    "@types/adm-zip": "^0.5.5",
-    "@types/discord-rpc": "4.0.4",
+    "@types/discord-rpc": "4.0.8",
-    "@types/express": "^4.17.17",
+    "@types/express": "^4.17.21",
-    "@types/musickit": "github:ciderapp/musickit-types",
+    "@types/musickit": "ciderapp/musickit-types",
-    "@types/node": "^20.2.5",
+    "@types/node": "^20.12.12",
-    "@types/qrcode-terminal": "^0.12.0",
+    "@types/node-ssdp": "^4.0.4",
-    "@types/ws": "^8.5.4",
+    "@types/qrcode-terminal": "^0.12.2",
-    "electron": "github:castlabs/electron-releases",
+    "@types/request": "^2.48.12",
-    "electron-builder": "^23.6.0",
+    "@types/upnp-mediarenderer-client": "^1.4.3",
+    "@types/ws": "^8.5.10",
+    "@types/xml2js": "^0.4.14",
+    "electron": "github:castlabs/electron-releases#v30.0.4+wvcus",
+    "electron-builder": "^24.13.3",
     "electron-builder-notarize-pkg": "^1.2.0",
     "electron-webpack": "^2.8.2",
-    "less": "^4.1.3",
+    "less": "^4.2.0",
-    "node-gyp": "^9.4.0",
+    "node-gyp": "^10.1.0",
-    "prettier": "2.8.8",
+    "prettier": "3.2.5",
-    "typescript": "^5.1.3",
+    "typescript": "^5.4.5",
     "vue-devtools": "^5.1.4",
-    "webpack": "~5.85.0"
+    "webpack": "~5.91.0"
   },
   "fileAssociations": [
     {
@@ -109,14 +115,14 @@
     }
   ],
   "build": {
-    "electronVersion": "25.0.0",
+    "electronVersion": "30.0.6",
     "electronDownload": {
-      "version": "25.0.0+wvcus",
+      "version": "30.0.6+wvcus",
       "mirror": "https://github.com/castlabs/electron-releases/releases/download/v"
     },
     "appId": "cider",
-    "afterPack": "./resources/afterPack.js",
+    "afterPack": "./resources/afterPack.cjs",
-    "afterSign": "./resources/notarize.js",
+    "afterSign": "./resources/notarize.cjs",
     "protocols": [
       {
         "name": "Cider",
@@ -224,7 +230,7 @@
     "devtool": "source-map"
   },
   "engines": {
-    "node": ">= 16",
+    "node": ">= 18",
     "npm": ">= 6.13.4",
     "yarn": ">= 1.21.1"
   }

src/main/base/app.ts

@@ -1,9 +1,10 @@
-import { app, Menu, nativeImage, Tray, ipcMain, clipboard, shell } from "electron";
+import { Menu, Tray, app, clipboard, ipcMain, nativeImage, shell } from "electron";
-import { readFileSync } from "fs";
+import log from "electron-log";
-import * as path from "path";
+import { readFileSync } from "node:fs";
-import * as log from "electron-log";
+import { dirname, join, resolve } from "node:path";
-import * as os from "os";
+import { fileURLToPath } from "node:url";
-import { utils } from "./utils";
+import os from "os";
+import { utils } from "../base/utils.js";
 
 /**
  * @file Creates App instance
@@ -45,7 +46,7 @@ export class AppEvents {
 
     // Log File Location
     if (app.commandLine.hasSwitch("log") || app.commandLine.hasSwitch("l")) {
-      console.log(path.join(app.getPath("userData"), "logs"));
+      console.log(join(app.getPath("userData"), "logs"));
       app.exit();
     }
 
@@ -107,7 +108,7 @@ export class AppEvents {
     if (process.defaultApp) {
       if (process.argv.length >= 2) {
         this.protocols.forEach((protocol: string) => {
-          app.setAsDefaultProtocolClient(protocol, process.execPath, [path.resolve(process.argv[1])]);
+          app.setAsDefaultProtocolClient(protocol, process.execPath, [resolve(process.argv[1])]);
         });
       }
     } else {
@@ -263,15 +264,15 @@ export class AppEvents {
    */
   private InitTray() {
     const icons = {
-      win32: nativeImage.createFromPath(path.join(__dirname, `../../resources/icons/icon.ico`)).resize({
+      win32: nativeImage.createFromPath(join(dirname(fileURLToPath(import.meta.url)), `../../resources/icons/icon.ico`)).resize({
         width: 32,
         height: 32,
       }),
-      linux: nativeImage.createFromPath(path.join(__dirname, `../../resources/icons/icon.png`)).resize({
+      linux: nativeImage.createFromPath(join(dirname(fileURLToPath(import.meta.url)), `../../resources/icons/icon.png`)).resize({
         width: 32,
         height: 32,
       }),
-      darwin: nativeImage.createFromPath(path.join(__dirname, `../../resources/icons/icon.png`)).resize({
+      darwin: nativeImage.createFromPath(join(dirname(fileURLToPath(import.meta.url)), `../../resources/icons/icon.png`)).resize({
         width: 20,
         height: 20,
       }),
@@ -314,7 +315,7 @@ export class AppEvents {
   private setTray(visible: boolean = utils.getWindow().isVisible()) {
     this.i18n = utils.getLocale(utils.getStoreValue("general.language"));
 
-    const ciderIcon = nativeImage.createFromPath(path.join(__dirname, `../../resources/icons/icon.png`)).resize({
+    const ciderIcon = nativeImage.createFromPath(join(dirname(fileURLToPath(import.meta.url)), `../../resources/icons/icon.png`)).resize({
       width: 24,
       height: 24,
     });

src/main/base/browserwindow.ts

@@ -1,22 +1,21 @@
-import { join } from "path";
+import AdmZip from "adm-zip";
-import { app, BrowserWindow as bw, ipcMain, ShareMenu, shell, screen, dialog, nativeTheme, ipcRenderer } from "electron";
-import * as windowStateKeeper from "electron-window-state";
-import * as express from "express";
-import * as getPort from "get-port";
-import { search } from "youtube-search-without-api-key";
-import { existsSync, rmSync, mkdirSync, readdirSync, readFileSync, writeFileSync, statSync, unlinkSync, rmdirSync, lstatSync } from "fs";
-import { Stream } from "stream";
-import { networkInterfaces } from "os";
-import * as mm from "music-metadata";
-import fetch from "electron-fetch";
-import { wsapi } from "./wsapi";
-import { utils } from "./utils";
-import { Plugins } from "./plugins";
 import { watch } from "chokidar";
-import * as os from "os";
+import { ShareMenu, app, BrowserWindow as bw, dialog, ipcMain, nativeTheme, screen, shell } from "electron";
-import wallpaper from "wallpaper";
+import windowStateKeeper from "electron-window-state";
-import * as AdmZip from "adm-zip";
+import express from "express";
-import { LocalFiles } from "../providers/local/";
+import { existsSync, lstatSync, mkdirSync, readFileSync, readdirSync, rmSync, rmdirSync, statSync, unlinkSync, writeFileSync } from "fs";
+import getPort from "get-port";
+import { LocalFiles } from "../providers/local/index.js";
+import mm from "music-metadata";
+import fetch from "node-fetch";
+import os, { networkInterfaces } from "os";
+import { join } from "path";
+import { Stream } from "stream";
+import { getWallpaper } from "wallpaper";
+import { search } from "youtube-search-without-api-key";
+import { Plugins } from "./plugins.js";
+import { utils } from "./utils.js";
+import { wsapi } from "./wsapi.js";
 
 /**
  * @file Creates the BrowserWindow
@@ -792,8 +791,8 @@ export class BrowserWindow {
     });
 
     ipcMain.on("get-wallpaper", async (event, args) => {
-      const wpPath: string = await wallpaper.get();
+      const wpPath: string = await getWallpaper();
-      const Jimp = require("jimp");
+      const Jimp = (await import("jimp")).default;
       const img = await Jimp.read(wpPath);
       const blurAmount = args.blurAmount ?? 256;
       if (blurAmount) {
@@ -885,7 +884,7 @@ export class BrowserWindow {
         if (url.endsWith("/")) url = url.slice(0, -1);
         let response = await utils.fetch(`${url}/archive/refs/heads/main.zip`);
         let repo = url.split("/").slice(-2).join("/");
-        let apiRepo = await utils.fetch(`https://api.github.com/repos/${repo}`).then((res) => res.json());
+        let apiRepo = await utils.fetch(`https://api.github.com/repos/${repo}`).then((res) => res.json()) as { id: number};
         console.debug(`REPO ID: ${apiRepo.id}`);
         // extract the files from the first folder in the zip response
         let zip = new AdmZip(await response.buffer());
@@ -895,7 +894,7 @@ export class BrowserWindow {
         }
         console.log(join(utils.getPath("plugins"), "gh_" + apiRepo.id));
         zip.extractEntryTo(entry, join(utils.getPath("plugins"), "gh_" + apiRepo.id), false, true);
-        let commit = await utils.fetch(`https://api.github.com/repos/${repo}/commits`).then((res) => res.json());
+        let commit = await utils.fetch(`https://api.github.com/repos/${repo}/commits`).then((res) => res.json()) as { sha: string }[];
         console.debug(`COMMIT SHA: ${commit[0].sha}`);
         let theme = JSON.parse(readFileSync(join(utils.getPath("plugins"), "gh_" + apiRepo.id, "package.json"), "utf8"));
         theme.id = apiRepo.id;
@@ -928,7 +927,7 @@ export class BrowserWindow {
               "User-Agent": utils.getWindow().webContents.getUserAgent(),
             },
           })
-          .then((res) => res.json());
+          .then((res) => res.json()) as { id: number}
         console.error(apiRepo);
         console.debug(`REPO ID: ${apiRepo.id}`);
         // extract the files from the first folder in the zip response
@@ -942,7 +941,7 @@ export class BrowserWindow {
           let subFolder = entry.entryName.split("/").slice(1, -1).join("/");
           zip.extractEntryTo(entry, join(utils.getPath("themes"), "gh_" + apiRepo.id, "/", subFolder), false, true);
         });
-        let commit = await utils.fetch(`https://api.github.com/repos/${repo}/commits`).then((res) => res.json());
+        let commit = await utils.fetch(`https://api.github.com/repos/${repo}/commits`).then((res) => res.json()) as { sha: string }[];
         console.debug(`COMMIT SHA: ${commit[0].sha}`);
         let theme = JSON.parse(readFileSync(join(utils.getPath("themes"), "gh_" + apiRepo.id, "theme.json"), "utf8"));
         theme.id = apiRepo.id;
@@ -1355,6 +1354,7 @@ export class BrowserWindow {
     }
     // Get previews for normalization
     ipcMain.on("getPreviewURL", (_event, url) => {
+
       fetch(url)
         .then((res) => res.buffer())
         .then(async (buffer) => {
@@ -1664,7 +1664,7 @@ export class BrowserWindow {
    */
   private async broadcastRemote() {
     const myString = `http://${BrowserWindow.getIP()}:${this.remotePort}`;
-    const mdns = require("mdns-js");
+    const mdns = (await import("mdns-js")).default;
     const encoded = Buffer.from(myString).toString("base64");
     const x = mdns.tcp("cider-remote");
     const txt_record = {

src/main/base/castcontroller.js

@@ -1,32 +0,0 @@
-var util = require("util");
-var castv2Cli = require("castv2-client");
-var RequestResponseController = castv2Cli.RequestResponseController;
-
-function CiderCastController(client, sourceId, destinationId) {
-  RequestResponseController.call(this, client, sourceId, destinationId, "urn:x-cast:com.ciderapp.customdata");
-  this.once("close", onclose);
-  var self = this;
-  function onclose() {
-    self.stop();
-  }
-}
-
-util.inherits(CiderCastController, RequestResponseController);
-
-CiderCastController.prototype.sendIp = function (ip) {
-  // TODO: Implement Callback
-  let data = {
-    ip: ip,
-  };
-  this.request(data);
-};
-
-CiderCastController.prototype.kill = function () {
-  // TODO: Implement Callback
-  let data = {
-    action: "stop",
-  };
-  this.request(data);
-};
-
-module.exports = CiderCastController;

src/main/base/castcontroller.ts

@@ -0,0 +1,32 @@
+// @ts-nocheck
+import castv2Cli from "castv2-client";
+const RequestResponseController = castv2Cli.RequestResponseController;
+
+
+
+export class CiderCastController extends RequestResponseController {
+  constructor(client: string, sourceId: string, destinationId: string) {
+    super(client, sourceId, destinationId, "urn:x-cast:com.ciderapp.customdata");
+    this.once("close", onclose);
+    var self = this;
+    function onclose() {
+      self.stop();
+    }
+  }
+
+  sendIp(ip: string) {
+    // TODO: Implement Callback
+    let data = {
+      ip: ip,
+    };
+    this.request(data);
+  }
+
+  kill() {
+    // TODO: Implement Callback
+    let data = {
+      action: "stop",
+    };
+    this.request(data);
+  }
+}

src/main/base/castreceiver.js

@@ -1,80 +0,0 @@
-//@ts-nocheck
-var util = require("util");
-// var debug       = require('debug')('castv2-client');
-var Application = require("castv2-client").Application;
-var MediaController = require("castv2-client").MediaController;
-var CiderCastController = require("./castcontroller");
-
-function CiderReceiver(client, session) {
-  Application.apply(this, arguments);
-
-  this.media = this.createController(MediaController);
-  this.mediaReceiver = this.createController(CiderCastController);
-
-  this.media.on("status", onstatus);
-
-  var self = this;
-
-  function onstatus(status) {
-    self.emit("status", status);
-  }
-}
-// FE96A351
-// 27E1334F
-CiderReceiver.APP_ID = "FE96A351";
-
-util.inherits(CiderReceiver, Application);
-
-CiderReceiver.prototype.getStatus = function (callback) {
-  this.media.getStatus.apply(this.media, arguments);
-};
-
-CiderReceiver.prototype.load = function (media, options, callback) {
-  this.media.load.apply(this.media, arguments);
-};
-
-CiderReceiver.prototype.play = function (callback) {
-  this.media.play.apply(this.media, arguments);
-};
-
-CiderReceiver.prototype.pause = function (callback) {
-  this.media.pause.apply(this.media, arguments);
-};
-
-CiderReceiver.prototype.stop = function (callback) {
-  this.media.stop.apply(this.media, arguments);
-};
-
-CiderReceiver.prototype.seek = function (currentTime, callback) {
-  this.media.seek.apply(this.media, arguments);
-};
-
-CiderReceiver.prototype.queueLoad = function (items, options, callback) {
-  this.media.queueLoad.apply(this.media, arguments);
-};
-
-CiderReceiver.prototype.queueInsert = function (items, options, callback) {
-  this.media.queueInsert.apply(this.media, arguments);
-};
-
-CiderReceiver.prototype.queueRemove = function (itemIds, options, callback) {
-  this.media.queueRemove.apply(this.media, arguments);
-};
-
-CiderReceiver.prototype.queueReorder = function (itemIds, options, callback) {
-  this.media.queueReorder.apply(this.media, arguments);
-};
-
-CiderReceiver.prototype.queueUpdate = function (items, callback) {
-  this.media.queueUpdate.apply(this.media, arguments);
-};
-
-CiderReceiver.prototype.sendIp = function (opts) {
-  this.mediaReceiver.sendIp.apply(this.mediaReceiver, arguments);
-};
-
-CiderReceiver.prototype.kill = function (opts) {
-  this.mediaReceiver.kill.apply(this.mediaReceiver, arguments);
-};
-
-module.exports = CiderReceiver;

src/main/base/castreceiver.ts

@@ -0,0 +1,80 @@
+// @ts-nocheck
+import castv2Cli from "castv2-client";
+import { CiderCastController } from "./castcontroller.js";
+
+const Application = castv2Cli.Application;
+const MediaController = castv2Cli.MediaController;
+
+export class CiderReceiver extends Application {
+  // FE96A351
+  // 27E1334F
+  public APP_ID = "FE96A351";
+
+  constructor(_client: unknown, _session: unknown) {
+    super();
+    super.apply(this, arguments);
+
+    this.media = this.createController(MediaController);
+    this.mediaReceiver = this.createController(CiderCastController);
+
+    this.media.on("status", onstatus);
+
+    var self = this;
+
+    function onstatus(status: string) {
+      self.emit("status", status);
+    }
+  }
+
+  getStatus(callback: unknown) {
+    this.media.getStatus.apply(this.media, arguments);
+  }
+
+  load(media: unknown, options: unknown, callback: unknown) {
+    this.media.load.apply(this.media, arguments);
+  }
+
+  play(callback: unknown) {
+    this.media.play.apply(this.media, arguments);
+  }
+
+  pause(callback: unknown) {
+    this.media.pause.apply(this.media, arguments);
+  }
+
+  stop(callback: unknown) {
+    this.media.stop.apply(this.media, arguments);
+  }
+
+  seek(currentTime: unknown, callback: unknown) {
+    this.media.seek.apply(this.media, arguments);
+  }
+
+  queueLoad(items: unknown, options: unknown, callback: unknown) {
+    this.media.queueLoad.apply(this.media, arguments);
+  }
+
+  queueInsert(items: unknown, options: unknown, callback: unknown) {
+    this.media.queueInsert.apply(this.media, arguments);
+  }
+
+  queueRemove(itemIds: unknown, options: unknown, callback: unknown) {
+    this.media.queueRemove.apply(this.media, arguments);
+  }
+
+  queueReorder(itemIds: unknown, options: unknown, callback: unknown) {
+    this.media.queueReorder.apply(this.media, arguments);
+  }
+
+  queueUpdate(items: unknown, callback: unknown) {
+    this.media.queueUpdate.apply(this.media, arguments);
+  }
+
+  sendIp(opts: unknown) {
+    this.mediaReceiver.sendIp.apply(this.mediaReceiver, arguments);
+  }
+
+  kill(opts: unknown) {
+    this.mediaReceiver.kill.apply(this.mediaReceiver, arguments);
+  }
+}

src/main/base/plugins.ts

@@ -1,7 +1,8 @@
-import * as fs from "fs";
+import {app} from "electron";
-import * as path from "path";
+import { existsSync, lstatSync, readdirSync } from "node:fs";
-import * as electron from "electron";
+import { dirname, join } from "node:path";
-import { utils } from "./utils";
+import { fileURLToPath } from "node:url";
+import { utils } from "./utils.js";
 
 //
 // Hello, this is our loader for the various plugins that the Cider Development Team built for our
@@ -17,8 +18,8 @@ import { utils } from "./utils";
  */
 export class Plugins {
   private static PluginMap: any = {};
-  private basePluginsPath = path.join(__dirname, "../plugins");
+  private basePluginsPath = join(dirname(fileURLToPath(import.meta.url)), "../plugins");
-  private userPluginsPath = path.join(electron.app.getPath("userData"), "Plugins");
+  private userPluginsPath = join(app.getPath("userData"), "Plugins");
   private readonly pluginsList: any = {};
 
   constructor() {
@@ -36,10 +37,10 @@ export class Plugins {
   public getPlugins(): any {
     let plugins: any = {};
 
-    if (fs.existsSync(this.basePluginsPath)) {
+    if (existsSync(this.basePluginsPath)) {
-      fs.readdirSync(this.basePluginsPath).forEach((file) => {
+      readdirSync(this.basePluginsPath).forEach(async (file) => {
         if (file.endsWith(".ts") || file.endsWith(".js")) {
-          const plugin = require(path.join(this.basePluginsPath, file)).default;
+          const plugin = (await import(join(this.basePluginsPath, file))).default;
           if (plugins[file] || plugin.name in plugins) {
             console.log(`[${plugin.name}] Plugin already loaded / Duplicate Class Name`);
           } else {
@@ -49,12 +50,12 @@ export class Plugins {
       });
     }
 
-    if (fs.existsSync(this.userPluginsPath)) {
+    if (existsSync(this.userPluginsPath)) {
-      fs.readdirSync(this.userPluginsPath).forEach((file) => {
+      readdirSync(this.userPluginsPath).forEach(async (file) => {
         // Plugins V1
         if (file.endsWith(".ts") || file.endsWith(".js")) {
-          if (!electron.app.isPackaged) {
+          if (!app.isPackaged) {
-            const plugin = require(path.join(this.userPluginsPath, file)).default;
+            const plugin = (await import(join(this.userPluginsPath, file))).default;
             file = file.replace(".ts", "").replace(".js", "");
             if (plugins[file] || plugin in plugins) {
               console.log(`[${plugin.name}] Plugin already loaded / Duplicate Class Name`);
@@ -62,7 +63,7 @@ export class Plugins {
               plugins[file] = new plugin(utils);
             }
           } else {
-            const plugin = require(path.join(this.userPluginsPath, file));
+            const plugin = await import(join(this.userPluginsPath, file));
             file = file.replace(".ts", "").replace(".js", "");
             if (plugins[file] || plugin in plugins) {
               console.log(`[${plugin.name}] Plugin already loaded / Duplicate Class Name`);
@@ -72,17 +73,17 @@ export class Plugins {
           }
         }
         // Plugins V2
-        else if (fs.lstatSync(path.join(this.userPluginsPath, file)).isDirectory()) {
+        else if (lstatSync(join(this.userPluginsPath, file)).isDirectory()) {
-          const pluginPath = path.join(this.userPluginsPath, file);
+          const pluginPath = join(this.userPluginsPath, file);
-          if (fs.existsSync(path.join(pluginPath, "package.json"))) {
+          if (existsSync(join(pluginPath, "package.json"))) {
-            const pluginPackage = require(path.join(pluginPath, "package.json"));
+            const pluginPackage = await import(join(pluginPath, "package.json"));
-            const plugin = require(path.join(pluginPath, pluginPackage.main));
+            const plugin = await import(join(pluginPath, pluginPackage.main));
             if (plugins[plugin.name] || plugin.name in plugins) {
               console.log(`[${plugin.name}] Plugin already loaded / Duplicate Class Name`);
             } else {
               Plugins.PluginMap[pluginPackage.name] = file;
               const pluginEnv = {
-                app: electron.app,
+                app: app,
                 store: utils.getStore(),
                 utils: utils,
                 win: utils.getWindow(),

src/main/base/store.ts

@@ -1,11 +1,11 @@
-import * as ElectronStore from "electron-store";
+import ElectronStore from "electron-store";
 import { app, ipcMain } from "electron";
-import fetch from "electron-fetch";
+import fetch from "node-fetch";
 
 export class Store {
-  static cfg: ElectronStore;
+  static cfg: ElectronStore<any>;
 
-  private defaults: any = {
+  private defaults = {
     main: {
       PLATFORM: process.platform,
       UPDATABLE: app.isPackaged && (!process.mas || !process.windowsStore || !process.env.FLATPAK_ID),
@@ -236,18 +236,13 @@ export class Store {
       },
     },
   };
-  private migrations: any = {};
+  private migrations = {};
-  private schema: ElectronStore.Schema<any> = {
+
-    "connectivity.discord_rpc": {
-      type: "object",
-    },
-  };
 
   constructor() {
     Store.cfg = new ElectronStore({
       name: "cider-config",
       defaults: this.defaults,
-      schema: this.schema,
       migrations: this.migrations,
       clearInvalidConfig: false, //disabled for now
     });

src/main/base/utils.ts

@@ -1,14 +1,14 @@
-import * as fs from "fs";
+import { BrowserWindow, app, ipcMain } from "electron";
-import * as path from "path";
-import { Store } from "./store";
-import { BrowserWindow as bw } from "./browserwindow";
-import { app, BrowserWindow, ipcMain } from "electron";
-import OtaClient from "@crowdin/ota-client";
-import fetch from "electron-fetch";
 import ElectronStore from "electron-store";
+import fetch from "node-fetch";
+import { readFileSync } from "node:fs";
+import { join, resolve,dirname } from "node:path";
+import { BrowserWindow as bw } from "./browserwindow.js";
+import { Store } from "./store.js";
+import { fileURLToPath } from "node:url";
 
 export class utils {
-  static crowdinClient: OtaClient = new OtaClient("fda9a6528649ea90dee35390wog");
+  static hash = "fda9a6528649ea90dee35390wog"
   static i18n: any = {};
 
   /**
@@ -38,14 +38,14 @@ export class utils {
    * Paths for the application to use
    */
   static paths: any = {
-    srcPath: path.join(__dirname, "../../src"),
+    srcPath: join(dirname(fileURLToPath(import.meta.url)), "../../src"),
-    rendererPath: path.join(__dirname, "../../src/renderer"),
+    rendererPath: join(dirname(fileURLToPath(import.meta.url)), "../../src/renderer"),
-    mainPath: path.join(__dirname, "../../src/main"),
+    mainPath: join(dirname(fileURLToPath(import.meta.url)), "../../src/main"),
-    resourcePath: path.join(__dirname, "../../resources"),
+    resourcePath: join(dirname(fileURLToPath(import.meta.url)), "../../resources"),
-    ciderCache: path.resolve(app.getPath("userData"), "CiderCache"),
+    ciderCache: resolve(app.getPath("userData"), "CiderCache"),
-    themes: path.resolve(app.getPath("userData"), "Themes"),
+    themes: resolve(app.getPath("userData"), "Themes"),
-    plugins: path.resolve(app.getPath("userData"), "Plugins"),
+    plugins: resolve(app.getPath("userData"), "Plugins"),
-    externals: path.resolve(app.getPath("userData"), "externals"),
+    externals: resolve(app.getPath("userData"), "externals"),
   };
 
   /**
@@ -83,10 +83,8 @@ export class utils {
   /**
    * MitM the electron fetch for a function that proxies github.
    * Written in TS so Maikiwi doesn't fuck up
-   * @param url {string} URL param
-   * @param opts {object} Other options
    */
-  static async fetch(url: string, opts = {}) {
+  static async fetch(url: string, opts: object = {}) {
     Object.assign(opts, {
       headers: {
         "User-Agent": utils.getWindow().webContents.getUserAgent(),
@@ -106,7 +104,10 @@ export class utils {
   }
 
   static async initializeTranslations() {
-    this.i18n = await this.crowdinClient.getTranslations();
+    const otaClient = (await import('@crowdin/ota-client')).default.default;
+    const crowdin = new otaClient(this.hash)
+
+    this.i18n = await crowdin.getTranslations();
   }
 
   /**
@@ -186,6 +187,6 @@ export class utils {
   static loadPluginFrontend(path: string): void {}
 
   static loadJSFrontend(path: string): void {
-    bw.win.webContents.executeJavaScript(fs.readFileSync(path, "utf8"));
+    bw.win.webContents.executeJavaScript(readFileSync(path, "utf8"));
   }
 }

src/main/base/wsapi.ts

@@ -1,7 +1,5 @@
-import * as ws from "ws";
+import WebSocket, { WebSocketServer } from 'ws';
-import * as electron from "electron";
+import electron from "electron";
-
-const WebSocketServer = ws.Server;
 
 interface standardResponse {
   status?: Number;

src/main/index.ts

@@ -1,17 +1,22 @@
-require("v8-compile-cache");
+// @ts-ignore
+await import("v8-compile-cache");
 
 import { app, components, ipcMain } from "electron";
 import { join } from "path";
-import { Store } from "./base/store";
+import { Store } from "./base/store.js";
-import { AppEvents } from "./base/app";
+import { AppEvents } from "./base/app.js";
-import { Plugins } from "./base/plugins";
+import { Plugins } from "./base/plugins.js";
-import { BrowserWindow } from "./base/browserwindow";
+import { BrowserWindow } from "./base/browserwindow.js";
 import { init as Sentry } from "@sentry/electron";
 import { RewriteFrames } from "@sentry/integrations";
-import { utils } from "./base/utils";
+import { utils } from "./base/utils.js";
+
+const appName = 'sh.cider.classic';
 
 if (!app.isPackaged) {
-  app.setPath("userData", join(app.getPath("appData"), "Cider"));
+  app.setPath('userData', join(app.getPath('appData'), `${appName}.dev`));
+} else {
+  app.setPath('userData', join(app.getPath('appData'), appName));
 }
 
 // Analytics for debugging fun yeah.
@@ -38,7 +43,8 @@ app.on("ready", async () => {
   console.log("[Cider] Application is Ready. Creating Window.");
   if (!app.isPackaged) {
     console.info("[Cider] Running in development mode.");
-    require("vue-devtools").install();
+    // @ts-ignore
+    (await import("vue-devtools")).default.install();
   }
   console.log("aa");
   components.whenReady().then(async () => {
@@ -88,27 +94,3 @@ app.on("before-quit", () => {
   CiderPlug.callPlugins("onBeforeQuit");
   console.warn(`${app.getName()} exited.`);
 });
-
-/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
- * Widevine Event Handlers
- * ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
-
-// @ts-ignore
-app.on("widevine-ready", (version, lastVersion) => {
-  if (null !== lastVersion) {
-    console.log("[Cider][Widevine] Widevine " + version + ", upgraded from " + lastVersion + ", is ready to be used!");
-  } else {
-    console.log("[Cider][Widevine] Widevine " + version + " is ready to be used!");
-  }
-});
-
-// @ts-ignore
-app.on("widevine-update-pending", (currentVersion, pendingVersion) => {
-  console.log("[Cider][Widevine] Widevine " + currentVersion + " is ready to be upgraded to " + pendingVersion + "!");
-});
-
-// @ts-ignore
-app.on("widevine-error", (error) => {
-  console.log("[Cider][Widevine] Widevine installation encountered an error: " + error);
-  app.exit();
-});

src/main/plugins/chromecast.ts

@@ -1,8 +1,10 @@
-import * as electron from "electron";
+import electron from "electron";
-import * as os from "os";
+import os from "os";
-import { resolve } from "path";
+import {CiderReceiver} from "../base/castreceiver.js";
-import * as CiderReceiver from "../base/castreceiver";
+import MediaRendererClient from "upnp-mediarenderer-client";
-const MediaRendererClient = require("upnp-mediarenderer-client");
+import request from "request";
+import castv2 from "castv2-client";
+import mdnsjs from "mdns-js";
 
 export default class ChromecastPlugin {
   /**
@@ -13,8 +15,8 @@ export default class ChromecastPlugin {
   private _lastfm: any;
   private _store: any;
   private _timer: any;
-  private audioClient = require("castv2-client").Client;
+  private audioClient = castv2.Client;
-  private mdns = require("mdns-js");
+  private mdns = mdnsjs;
 
   private devices: any = [];
   private castDevices: any = [];
@@ -35,7 +37,7 @@ export default class ChromecastPlugin {
   // private bufcount2 = 0;
   // private headerSent = false;
 
-  private searchForGCDevices() {
+  private async searchForGCDevices() {
     try {
       let browser = this.mdns.createBrowser(this.mdns.tcp("googlecast"));
       browser.on("ready", browser.discover);
@@ -47,7 +49,7 @@ export default class ChromecastPlugin {
           this.ondeviceup(service.addresses[0], name + " (" + (service.type[0]?.description ?? "") + ")", "", "googlecast");
         }
       });
-      const Client = require("node-ssdp").Client;
+      const Client = (await import("node-ssdp")).Client;
       // also do a SSDP/UPnP search
       let ssdpBrowser = new Client();
       ssdpBrowser.on("response", (headers: any, statusCode: any, rinfo: any) => {
@@ -84,7 +86,6 @@ export default class ChromecastPlugin {
   }
 
   private getServiceDescription(url: any, address: any) {
-    const request = require("request");
     request.get(url, (error: any, response: any, body: any) => {
       if (!error && response.statusCode === 200) {
         this.parseServiceDescription(body, address, url);
@@ -113,8 +114,8 @@ export default class ChromecastPlugin {
     }
   }
 
-  private parseServiceDescription(body: any, address: any, url: any) {
+  private async parseServiceDescription(body: any, address: any, url: any) {
-    const parseString = require("xml2js").parseString;
+    const parseString = (await import("xml2js")).parseString;
     parseString(body, (err: any, result: any) => {
       if (!err && result && result.root && result.root.device) {
         const device = result.root.device[0];

src/main/plugins/discordrpc.ts

@@ -1,6 +1,6 @@
 import { AutoClient } from "discord-auto-rpc";
 import { ipcMain } from "electron";
-import fetch from "electron-fetch";
+import fetch from "node-fetch";
 
 export default class DiscordRPC {
   /**
@@ -67,8 +67,8 @@ export default class DiscordRPC {
           url: artworkUrl,
         },
       })
-        .then((res) => res.json())
+        .then(async (res) => {
-        .then(function (json) {
+          const json = await res.json() as { imageUrl: string };
           self._activityCache.largeImageKey = "https://images.weserv.nl/?url=" + json.imageUrl + "&w=1024&h=1024&output=jpg";
           self._client.setActivity(self._activityCache);
         });

src/main/plugins/lastfm.ts

@@ -1,3 +1,6 @@
+// @ts-ignore
+import LastfmAPI from "lastfmapi";
+
 export default class lastfm {
   /**
    * Base Plugin Information
@@ -73,7 +76,6 @@ export default class lastfm {
    */
   private initializeLastFM(token: string, api: { key: string; secret: string }): void {
     console.debug(`[${lastfm.name}:initialize] Initializing LastFM`);
-    const LastfmAPI = require("lastfmapi");
     this._lfm = new LastfmAPI({
       api_key: api.key,
       secret: api.secret,

src/main/plugins/menubar.ts

@@ -1,5 +1,5 @@
 import { app, Menu, shell } from "electron";
-import { utils } from "../base/utils";
+import { utils } from "../base/utils.js";
 
 export default class Thumbar {
   /**

src/main/plugins/mpris.ts

@@ -1,5 +1,4 @@
-// @ts-ignore
+import Player from 'mpris-service';
-import * as Player from "mpris-service";
 
 export default class mpris {
   /**
@@ -9,7 +8,7 @@ export default class mpris {
   /**
    * MPRIS Service
    */
-  private static player: Player.Player;
+  private static player: Player;
   /**
    * Base Plugin Details (Eventually implemented into a GUI in settings)
    */
@@ -47,7 +46,7 @@ export default class mpris {
    * Connects to MPRIS Service
    */
   private static connect() {
-    const player = Player({
+    const player = new Player({
       name: "cider",
       identity: "Cider",
       supportedInterfaces: ["player"],

src/main/plugins/playbackNotifications.ts

@@ -1,4 +1,4 @@
-import fetch from "electron-fetch";
+import fetch from "node-fetch";
 import { app, nativeImage, Notification } from "electron";
 import NativeImage = Electron.NativeImage;
 import { createWriteStream } from "fs";
@@ -17,7 +17,7 @@ export default class playbackNotifications {
   private _utils: any;
   private _notification: Notification | undefined;
   private _artworkImage: { [key: string]: NativeImage } = {};
-  private _artworkNums: Array<string> = [];
+  private _artworkNums: string[] = [];
 
   /**
    * Creates playback notification

src/main/plugins/raop.ts

@@ -1,13 +1,8 @@
-import * as electron from "electron";
+import electron from "electron";
-import * as os from "os";
+import fetch from "node-fetch";
-import * as fs from "fs";
-import { join, resolve } from "path";
-import * as CiderReceiver from "../base/castreceiver";
-import fetch from "electron-fetch";
 import { Stream } from "stream";
-import { spawn } from "child_process";
 import { Worker } from "worker_threads";
-import { Blob } from "buffer";
+import mdnsjs from "mdns-js";
 
 export default class RAOP {
   /**
@@ -24,7 +19,7 @@ export default class RAOP {
 
   private airtunes: any;
   // private device: any;
-  private mdns = require("mdns-js");
+  private mdns = mdnsjs;
   private ok: any = 1;
   private devices: any = [];
   private castDevices: any = [];
@@ -163,8 +158,8 @@ export default class RAOP {
   /**
    * Runs on app ready
    */
-  onReady(win: any): void {
+  async onReady(win: any): Promise<void> {
-    this.u = require("airtunes2");
+    this.u = (await import("airtunes2")).default;
     this._win = win;
 
     electron.ipcMain.on("getKnownAirplayDevices", (event) => {

src/main/plugins/thumbar.ts

@@ -1,5 +1,5 @@
 import { nativeImage, nativeTheme } from "electron";
-import { utils } from "../base/utils";
+import { utils } from "../base/utils.js";
 import { join } from "path";
 
 export default class Thumbar {

src/main/plugins/webNowPlaying.ts

@@ -1,4 +1,4 @@
-import * as WebSocket from "ws";
+import WebSocket from "ws";
 
 /**
  * 0-pad a number.

src/main/providers/local/db/index.ts

@@ -1,12 +0,0 @@
-// import * as PouchDB from "pouchdb-node";
-// import { join } from "path";
-// import { app } from "electron";
-// PouchDB.plugin(require("pouchdb-upsert"));
-// export class ProviderDB {
-//   public static db: any = null;
-//   static init() {
-//     if (ProviderDB.db == null) {
-//       ProviderDB.db = new PouchDB(join(app.getPath("userData"), "tracksdb"));
-//     }
-//   }
-// }

src/main/providers/local/index.ts

@@ -1,11 +1,10 @@
 // import { ProviderDB } from "./db";
-import * as path from "path";
-const { readdir } = require("fs").promises;
-import { utils } from "../../base/utils";
-import * as mm from "music-metadata";
-import { Md5 } from "ts-md5";
-import e from "express";
 import { EventEmitter } from "events";
+import mm from "music-metadata";
+import { resolve } from "node:path";
+import { Md5 } from "ts-md5";
+import { utils } from "../../base/utils.js";
+import { readdirSync } from "node:fs";
 
 export class LocalFiles {
   static localSongs: any = [];
@@ -127,11 +126,12 @@ export class LocalFiles {
     this.localSongsArts = metadatalistart;
     return metadatalist;
   }
-  static async getFiles(dir: any) {
+
-    const dirents = await readdir(dir, { withFileTypes: true });
+  static async getFiles(dir: string): Promise<string[]> {
+    const dirents = readdirSync(dir, { withFileTypes: true });
     const files = await Promise.all(
       dirents.map((dirent: any) => {
-        const res = path.resolve(dir, dirent.name);
+        const res = resolve(dir, dirent.name);
         return dirent.isDirectory() ? this.getFiles(res) : res;
       }),
     );

tsconfig.json

@@ -1,22 +1,30 @@
 {
   "compilerOptions": {
-    "experimentalDecorators": true,
+    "outDir": "build",
-    "target": "es6",
-    "module": "commonjs",
-    "allowJs": true,
-    "noImplicitAny": true,
-    "strict": true,
     "inlineSources": true,
-    "sourceMap": true,
+    "allowJs": true,
-    "outDir": "./build",
+    "esModuleInterop": true,
-    "baseUrl": ".",
+    "module": "NodeNext",
+    "moduleResolution": "NodeNext",
+    // Needed to address https://github.com/quasarframework/app-extension-typescript/issues/36
+    "noEmit": false,
     "resolveJsonModule": true,
-    "paths": {
+    // Avoid cross-os errors due to inconsistent file casing
-      "*": ["node_modules/*"]
+    "forceConsistentCasingInFileNames": true,
-    },
+    "sourceMap": true,
-    "skipLibCheck": true,
+    "strict": true,
+    "target": "esnext",
+    "isolatedModules": true,
+    "useDefineForClassFields": true,
+    // Fix Volar issue https://github.com/johnsoncodehk/volar/issues/1153
+    "jsx": "preserve",
+    "lib": ["esnext", "dom"],
+    "experimentalDecorators": true,
+    "baseUrl": "./",
     "allowSyntheticDefaultImports": true,
-    "typeRoots": ["node_modules/musickit-typescript", "node_modules/@types"]
+    "noImplicitThis": true,
+    "skipLibCheck": true /* Skip type checking of declaration files. */,
+    "typeRoots": ["node_modules/musickit-typescript", "node_modules/@types"],
   },
-  "include": ["src/main/**/*"]
+  "include": ["src/**/*.ts"],
 }

winget.json

@@ -5,8 +5,8 @@
     "mirror": "https://github.com/castlabs/electron-releases/releases/download/v"
   },
   "appId": "cider",
-  "afterPack": "./resources/afterPack.js",
+  "afterPack": "./resources/afterPack.cjs",
-  "afterSign": "./resources/notarize.js",
+  "afterSign": "./resources/notarize.cjs",
   "protocols": [
     {
       "name": "Cider",