fix: remove snap arm

Currently translated at 100.0% (397 of 397 strings)

Translation: th-ch/youtube-music/i18n
Translate-URL: https://hosted.weblate.org/projects/youtube-music/i18n/es/

.eslintignore

@@ -1,3 +0,0 @@
-.eslintrc.js
-rollup.main.config.ts
-rollup.preload.config.ts

.eslintrc.js

@@ -1,69 +0,0 @@
-module.exports = {
-  extends: [
-    'eslint:recommended',
-    'plugin:import/recommended',
-    'plugin:import/typescript',
-    'plugin:@typescript-eslint/eslint-recommended',
-    'plugin:@typescript-eslint/recommended',
-    'plugin:@typescript-eslint/recommended-requiring-type-checking',
-  ],
-  plugins: ['@typescript-eslint', 'import'],
-  parser: '@typescript-eslint/parser',
-  parserOptions: {
-    project: './tsconfig.json',
-    tsconfigRootDir: __dirname,
-    sourceType: 'module',
-    ecmaVersion: 'latest'
-  },
-  rules: {
-    'arrow-parens': ['error', 'always'],
-    'object-curly-spacing': ['error', 'always'],
-    '@typescript-eslint/no-floating-promises': 'off',
-    '@typescript-eslint/no-misused-promises': ['off', { checksVoidReturn: false }],
-    '@typescript-eslint/no-unused-vars': ['warn', { argsIgnorePattern: '^_' }],
-    "@typescript-eslint/no-non-null-assertion": "off",
-    'import/first': 'error',
-    'import/newline-after-import': 'error',
-    'import/no-default-export': 'off',
-    'import/no-duplicates': 'error',
-    'import/order': [
-      'error',
-      {
-        'groups': ['builtin', 'external', ['internal', 'index', 'sibling'], 'parent', 'type'],
-        'newlines-between': 'always-and-inside-groups',
-        'alphabetize': {order: 'ignore', caseInsensitive: false}
-      }
-    ],
-    'import/prefer-default-export': 'off',
-    'camelcase': ['error', {properties: 'never'}],
-    'class-methods-use-this': 'off',
-    'lines-around-comment': [
-      'error',
-      {
-        beforeBlockComment: false,
-        afterBlockComment: false,
-        beforeLineComment: false,
-        afterLineComment: false,
-      },
-    ],
-    'max-len': 'off',
-    'no-mixed-operators': 'error',
-    'no-multi-spaces': ['error', {ignoreEOLComments: true}],
-    'no-tabs': 'error',
-    'no-void': 'error',
-    'no-empty': 'off',
-    'prefer-promise-reject-errors': 'off',
-    'quotes': ['error', 'single', {
-      avoidEscape: true,
-      allowTemplateLiterals: false,
-    }],
-    'quote-props': ['error', 'consistent'],
-    'semi': ['error', 'always'],
-  },
-  env: {
-    browser: true,
-    node: true,
-    es6: true,
-  },
-  ignorePatterns: ['dist', 'node_modules'],
-};

.github/ISSUE_TEMPLATE/bug_report.yml

@@ -12,16 +12,24 @@ body:
         required: true
       - label: I have searched the [issue tracker](https://github.com/th-ch/youtube-music/issues) for a bug report that matches the one I want to file, without success.
         required: true
+      - label: I understand that **th-ch/youtube-music has NO affiliation with Google or YouTube**
+        required: true
 - type: input
   attributes:
     label: YouTube Music (Application) Version
     description: |
-      What version of YouTube Music Application are you using?
+      What version of the YouTube Music Application are you using?
 
       Note: Please check if this issue is reproducible with the latest stable release.
     placeholder: 2.0.0
   validations:
     required: true
+- type: checkboxes
+  attributes:
+    label: Checklists
+    options:
+      - label: I use the portable version of the YouTube Music Application.
+      - label: I can reproduce this issue in the [official version of (WEB) YTM](https://music.youtube.com).
 - type: dropdown
   attributes:
     label: What operating system are you using?
@@ -36,13 +44,13 @@ body:
 - type: input
   attributes:
     label: Operating System Version
-    description: What operating system version are you using? On Windows, click Start button > Settings > System > About. On macOS, click the Apple Menu > About This Mac. On Linux, use lsb_release or uname -a.
+    description: What operating system version are you using? On Windows, click the Start button > Settings > System > About. On macOS, click the Apple Menu > About This Mac. On Linux, use lsb_release or uname -a.
     placeholder: "e.g. Windows 10 version 1909, macOS Catalina 10.15.7, or Ubuntu 20.04"
   validations:
     required: true
 - type: dropdown
   attributes:
-    label: What arch are you using?
+    label: What CPU architecture are you using?
     options:
       - x64
       - ia32
@@ -55,10 +63,17 @@ body:
     label: Last Known Working YouTube Music (Application) version
     description: (If applicable) What is the last version of YouTube Music this worked in?
     placeholder: 1.20.0
+- type: textarea
+  attributes:
+    label: Reproduction steps
+    description: Provide steps to reproduce the issue.
+    placeholder: 1. Enable the X plugin.
+  validations:
+    required: true
 - type: textarea
   attributes:
     label: Expected Behavior
-    description: A clear and concise description of what you expected to happen. (Add a replication step if applicable)
+    description: A clear and concise description of what you expected to happen.
   validations:
     required: true
 - type: textarea
@@ -67,6 +82,13 @@ body:
     description: A clear description of what actually happens.
   validations:
     required: true
+- type: textarea
+  attributes:
+    label: Enabled plugins
+    description: Provide the list of plugins you enabled.
+    placeholder: 1. Album Color Theme
+  validations:
+    required: true
 - type: textarea
   attributes:
     label: Additional Information

.github/ISSUE_TEMPLATE/feature_request.yml

@@ -15,7 +15,7 @@ body:
 - type: textarea
   attributes:
     label: Problem Description
-    description: Please add a clear and concise description of the problem you are seeking to solve with this feature request.
+    description: A clear and concise description of the problem you are seeking to solve with this feature request.
   validations:
     required: true
 - type: textarea
@@ -33,6 +33,6 @@ body:
 - type: textarea
   attributes:
     label: Additional Information
-    description: Add any other context about the problem here.
+    description: Any other context about the problem.
   validations:
     required: false

.github/workflows/build.yml

@@ -20,59 +20,70 @@ jobs:
     steps:
       - uses: actions/checkout@v4
 
+      - name: Install pnpm
+        uses: pnpm/action-setup@v4
+        with:
+          version: 9
+          run_install: false
+
       - name: Setup NodeJS
-        uses: actions/setup-node@v3
+        if: startsWith(matrix.os, 'macOS') != true
+        uses: actions/setup-node@v4
+        with:
+          node-version: ${{ env.NODE_VERSION }}
+          cache: 'pnpm'
+
+      - name: Setup NodeJS for macOS
+        if: startsWith(matrix.os, 'macOS')
+        uses: actions/setup-node@v4
         with:
           node-version: ${{ env.NODE_VERSION }}
-          cache: 'npm'
 
       - name: Install dependencies
-        run: npm ci
+        run: pnpm install --frozen-lockfile
+
+      # Only vite build without release if it is a fork, or it is a pull-request
+      - name: Vite Build
+        if: github.repository == 'th-ch/youtube-music' && github.event_name == 'pull_request'
+        run: |
+          pnpm build
+
+      # Build and release if it's the main repository and is not pull-request
+      - name: Build and release on Mac
+        if: startsWith(matrix.os, 'macOS') && (github.repository == 'th-ch/youtube-music' && github.event_name != 'pull_request')
+        env:
+          GH_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+        run: |
+          pnpm release:mac
+
+      - name: Build and release on Linux
+        if: startsWith(matrix.os, 'ubuntu') && (github.repository == 'th-ch/youtube-music' && github.event_name != 'pull_request')
+        env:
+          GH_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+        run: |
+          sudo snap install snapcraft --classic
+          sudo apt update
+          sudo apt install -y flatpak flatpak-builder
+          sudo flatpak remote-add --if-not-exists --system flathub https://flathub.org/repo/flathub.flatpakrepo
+          sudo flatpak install -y flathub org.freedesktop.Platform/x86_64/20.08
+          sudo flatpak install -y flathub org.freedesktop.Sdk/x86_64/20.08
+          sudo flatpak install -y flathub org.electronjs.Electron2.BaseApp/x86_64/20.08
+          pnpm release:linux
+
+      - name: Build and release on Windows
+        if: startsWith(matrix.os, 'windows') && (github.repository == 'th-ch/youtube-music' && github.event_name != 'pull_request')
+        env:
+          GH_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+        run: |
+          pnpm release:win
 
       - name: Test
-        uses: GabrielBB/xvfb-action@v1
+        uses: coactions/setup-xvfb@v1
         env:
           PLAYWRIGHT_SKIP_BROWSER_DOWNLOAD: 1
         with:
-          run: npm run test
+          run: pnpm test:debug
 
-      # Build and release if it's the main repository
-      - name: Build and release on Mac
-        if: startsWith(matrix.os, 'macOS') && github.repository == 'th-ch/youtube-music'
-        env:
-          GH_TOKEN: ${{ secrets.GITHUB_TOKEN }}
-        run: |
-          npm run release:mac
-
-      - name: Build and release on Linux
-        if: startsWith(matrix.os, 'ubuntu') && github.repository == 'th-ch/youtube-music'
-        env:
-          GH_TOKEN: ${{ secrets.GITHUB_TOKEN }}
-        run: |
-          npm run release:linux
-
-      - name: Build and release on Windows
-        if: startsWith(matrix.os, 'windows') && github.repository == 'th-ch/youtube-music'
-        env:
-          GH_TOKEN: ${{ secrets.GITHUB_TOKEN }}
-        run: |
-          npm run release:win
-
-      # Only build without release if it is a fork
-      - name: Build on Mac
-        if: startsWith(matrix.os, 'macOS') && github.repository != 'th-ch/youtube-music'
-        run: |
-          npm run build:mac
-
-      - name: Build on Linux
-        if: startsWith(matrix.os, 'ubuntu') && github.repository != 'th-ch/youtube-music'
-        run: |
-          npm run build:linux
-
-      - name: Build on Windows
-        if: startsWith(matrix.os, 'windows') && github.repository != 'th-ch/youtube-music'
-        run: |
-          npm run build:win
 
   release:
     runs-on: ubuntu-latest
@@ -84,14 +95,27 @@ jobs:
         with:
           fetch-depth: 0
 
+      - name: Install pnpm
+        uses: pnpm/action-setup@v4
+        with:
+          version: 9
+          run_install: false
+
       - name: Setup NodeJS
-        uses: actions/setup-node@v3
+        if: startsWith(matrix.os, 'macOS') != true
+        uses: actions/setup-node@v4
+        with:
+          node-version: ${{ env.NODE_VERSION }}
+          cache: 'pnpm'
+
+      - name: Setup NodeJS for macOS
+        if: startsWith(matrix.os, 'macOS')
+        uses: actions/setup-node@v4
         with:
           node-version: ${{ env.NODE_VERSION }}
-          cache: 'npm'
 
       - name: Install dependencies
-        run: npm ci
+        run: pnpm install --frozen-lockfile
 
       - name: Get version
         run: |
@@ -117,7 +141,7 @@ jobs:
         if: ${{ env.VERSION_HASH == '' }}
         uses: irongut/EditRelease@v1.2.0
         with:
-          token: ${{ secrets.GITHUB_TOKEN }}
+          token: ${{ secrets.GH_TOKEN }}
           id: ${{ steps.get_draft_release.outputs.id }}
           draft: false
           prerelease: false
@@ -129,10 +153,12 @@ jobs:
 
             Thanks to all contributors! 🏅
 
+            (Note for Windows: `YouTube-Music-Web-Setup-${{ env.VERSION_TAG }}.exe` is an installer, and `YouTube-Music-${{ env.VERSION_TAG }}.exe` is a portable version)
+
       - name: Update changelog
         if: ${{ env.VERSION_HASH == '' }}
         run: |
-          npm run changelog
+          pnpm changelog
 
       - name: Commit changelog
         if: ${{ env.VERSION_HASH == '' }}

.github/workflows/dependency-review.yml

@@ -17,4 +17,4 @@ jobs:
       - name: "Checkout Repository"
         uses: actions/checkout@v4
       - name: "Dependency Review"
-        uses: actions/dependency-review-action@v3
+        uses: actions/dependency-review-action@v4

.github/workflows/winget-cla.yml

@@ -0,0 +1,20 @@
+name: Submit CLA to Winget PR
+
+on:
+  workflow_dispatch:
+    inputs:
+      pr_url:
+        description: "Specific PR URL"
+        required: true
+        type: string
+
+jobs:
+  comment:
+    name: Comment to PR
+    runs-on: ubuntu-latest
+    steps:
+      - name: Submit CLA to Windows Package Manager Community Repository Pull Request
+        run: gh pr comment $PR_URL --body "@microsoft-github-policy-service agree"
+        env:
+          GITHUB_TOKEN: ${{ secrets.WINGET_ACC_TOKEN }}
+          PR_URL: ${{ inputs.pr_url }}

.github/workflows/winget-submission.yml

@@ -15,12 +15,16 @@ jobs:
     name: Publish winget package
     runs-on: ubuntu-latest
     steps:
+      - name: Set winget version env
+        env:
+          TAG_NAME: ${{ inputs.tag_name || github.event.release.tag_name }}
+        run: echo "WINGET_TAG_NAME=$(echo ${TAG_NAME#v})" >> $GITHUB_ENV
       - name: Submit package to Windows Package Manager Community Repository
         uses: vedantmgoyal2009/winget-releaser@v2
         with:
           identifier: th-ch.YouTubeMusic
-          installers-regex: '^YouTube-Music-Setup-[\d\.]+\.exe$'
-          version: ${{ inputs.tag_name || github.event.release.tag_name }}
+          installers-regex: '^YouTube-Music-Web-Setup-[\d\.]+\.exe$'
+          version: ${{ env.WINGET_TAG_NAME }}
           release-tag: ${{ inputs.tag_name || github.event.release.tag_name }}
           token: ${{ secrets.WINGET_ACC_TOKEN }}
           fork-user: youtube-music-winget

.gitignore

@@ -12,3 +12,4 @@ electron-builder.yml
 !.yarn/releases
 !.yarn/sdks
 !.yarn/versions
+.vite-inspect

.prettierrc

@@ -0,0 +1,5 @@
+{
+  "tabWidth": 2,
+  "useTabs": false,
+  "singleQuote": true
+}

README.md

@@ -0,0 +1,403 @@
+<div align="center">
+
+# YouTube Music
+
+[![GitHub release](https://img.shields.io/github/release/th-ch/youtube-music.svg?style=for-the-badge&logo=youtube-music)](https://github.com/th-ch/youtube-music/releases/)
+[![GitHub license](https://img.shields.io/github/license/th-ch/youtube-music.svg?style=for-the-badge)](https://github.com/th-ch/youtube-music/blob/master/LICENSE)
+[![eslint code style](https://img.shields.io/badge/code_style-eslint-5ed9c7.svg?style=for-the-badge)](https://github.com/th-ch/youtube-music/blob/master/eslint.config.mjs)
+[![Build status](https://img.shields.io/github/actions/workflow/status/th-ch/youtube-music/build.yml?branch=master&style=for-the-badge&logo=youtube-music)](https://GitHub.com/th-ch/youtube-music/releases/)
+[![GitHub All Releases](https://img.shields.io/github/downloads/th-ch/youtube-music/total?style=for-the-badge&logo=youtube-music)](https://GitHub.com/th-ch/youtube-music/releases/)
+[![AUR](https://img.shields.io/aur/version/youtube-music-bin?color=blueviolet&style=for-the-badge&logo=youtube-music)](https://aur.archlinux.org/packages/youtube-music-bin)
+[![Known Vulnerabilities](https://snyk.io/test/github/th-ch/youtube-music/badge.svg)](https://snyk.io/test/github/th-ch/youtube-music)
+
+</div>
+
+![Screenshot](web/screenshot.jpg "Screenshot")
+
+
+<div align="center">
+	<a href="https://github.com/th-ch/youtube-music/releases/latest">
+		<img src="web/youtube-music.svg" width="400" height="100" alt="YouTube Music SVG">
+	</a>
+</div>
+
+Read this in other languages: [🇰🇷](./docs/readme/README-ko.md), [🇮🇸](./docs/readme/README-is.md), [🇨🇱 🇪🇸](./docs/readme/README-es.md), [🇷🇺](./docs/readme/README-ru.md)
+
+**Electron wrapper around YouTube Music featuring:**
+
+- Native look & feel, aims at keeping the original interface
+- Framework for custom plugins: change YouTube Music to your needs (style, content, features), enable/disable plugins in
+  one click
+
+## Demo Image
+
+|                          Player Screen (album color theme & ambient light)                                |
+|:---------------------------------------------------------------------------------------------------------:|
+|![Screenshot1](https://github.com/th-ch/youtube-music/assets/16558115/53efdf73-b8fa-4d7b-a235-b96b91ea77fc)|
+
+## Content
+
+- [Features](#features)
+- [Available plugins](#available-plugins)
+- [Translation](#translation)
+- [Download](#download)
+  - [Arch Linux](#arch-linux)
+  - [MacOS](#macos)
+  - [Windows](#windows)
+    - [How to install without a network connection? (in Windows)](#how-to-install-without-a-network-connection-in-windows)
+- [Themes](#themes)
+- [Dev](#dev)
+- [Build your own plugins](#build-your-own-plugins)
+  - [Creating a plugin](#creating-a-plugin)
+  - [Common use cases](#common-use-cases)
+- [Build](#build)
+- [Production Preview](#production-preview)
+- [Tests](#tests)
+- [License](#license)
+- [FAQ](#faq)
+
+## Features:
+
+- **Auto confirm when paused** (Always Enabled): disable
+  the ["Continue Watching?"](https://user-images.githubusercontent.com/61631665/129977894-01c60740-7ec6-4bf0-9a2c-25da24491b0e.png)
+  popup that pause music after a certain time
+
+ - And more ...
+
+## Available plugins:
+
+- **Ad Blocker**: Block all ads and tracking out of the box
+  
+- **Album Actions**: Adds Undislike, Dislike, Like, and Unlike buttons to apply this to all songs in a playlist or album
+
+- **Album Color Theme**: Applies a dynamic theme and visual effects based on the album color palette
+
+- **Ambient Mode**: Applies a lighting effect by casting gentle colors from the video, into your screen’s background
+
+- **Audio Compressor**: Apply compression to audio (lowers the volume of the loudest parts of the signal and raises the
+  volume of the softest parts)
+
+- **Blur Navigation Bar**: makes navigation bar transparent and blurry
+
+- **Bypass Age Restrictions**: bypass YouTube's age verification
+
+- **Captions Selector**: Enable captions
+
+- **Compact Sidebar**: Always set the sidebar in compact mode
+
+- **Crossfade**: Crossfade between songs
+
+- **Disable Autoplay**: Makes every song start in "paused" mode
+
+- **[Discord](https://discord.com/) Rich Presence**: Show your friends what you listen to
+  with [Rich Presence](https://user-images.githubusercontent.com/28219076/104362104-a7a0b980-5513-11eb-9744-bb89eabe0016.png)
+
+- **Downloader**: downloads
+  MP3 [directly from the interface](https://user-images.githubusercontent.com/61631665/129977677-83a7d067-c192-45e1-98ae-b5a4927393be.png) [(youtube-dl)](https://github.com/ytdl-org/youtube-dl)
+
+- **Exponential Volume**: Makes the volume
+  slider [exponential](https://greasyfork.org/en/scripts/397686-youtube-music-fix-volume-ratio/) so it's easier to
+  select lower volumes
+
+- **In-App Menu**: [gives bars a fancy, dark look](https://user-images.githubusercontent.com/78568641/112215894-923dbf00-8c29-11eb-95c3-3ce15db27eca.png)
+
+  > (see [this post](https://github.com/th-ch/youtube-music/issues/410#issuecomment-952060709) if you have problem
+  accessing the menu after enabling this plugin and hide-menu option)
+
+- **Scrobbler**: Adds scrobbling support for [Last.fm](https://www.last.fm/) and [ListenBrainz](https://listenbrainz.org/)
+
+- **Lumia Stream**: Adds [Lumia Stream](https://lumiastream.com/) support
+
+- **Lyrics Genius**: Adds lyrics support for most songs
+
+- **Music Together**: Share a playlist with others. When the host plays a song, everyone else will hear the same song
+
+- **Navigation**: Next/Back navigation arrows directly integrated in the interface, like in your favorite browser
+
+- **No Google Login**: Remove Google login buttons and links from the interface
+
+- **Notifications**: Display a notification when a song starts
+  playing ([interactive notifications](https://user-images.githubusercontent.com/78568641/114102651-63ce0e00-98d0-11eb-9dfe-c5a02bb54f9c.png)
+  are available on windows)
+
+- **Picture-in-picture**: allows to switch the app to picture-in-picture mode
+
+- **Playback Speed**: Listen fast, listen
+  slow! [Adds a slider that controls song speed](https://user-images.githubusercontent.com/61631665/129976003-e55db5ba-bf42-448c-a059-26a009775e68.png)
+
+- **Precise Volume**: Control the volume precisely using mousewheel/hotkeys, with a custom hud and customizable volume
+  steps
+
+- **Shortcuts (& MPRIS)**: Allows setting global hotkeys for playback (play/pause/next/previous) +
+  disable [media osd](https://user-images.githubusercontent.com/84923831/128601225-afa38c1f-dea8-4209-9f72-0f84c1dd8b54.png)
+  by overriding media keys + enable Ctrl/CMD + F to search + enable linux mpris support for
+  mediakeys + [custom hotkeys](https://github.com/Araxeus/youtube-music/blob/1e591d6a3df98449bcda6e63baab249b28026148/providers/song-controls.js#L13-L50)
+  for [advanced users](https://github.com/th-ch/youtube-music/issues/106#issuecomment-952156902)
+
+- **Skip Disliked Song**: Skips disliked songs
+
+- **Skip Silences**: Automatically skip silenced sections
+
+- [**SponsorBlock**](https://github.com/ajayyy/SponsorBlock): Automatically Skips non-music parts like intro/outro or
+  parts of music videos where the song isn't playing
+
+- **Synced Lyrics**: Provides synced lyrics to songs, using providers like [LRClib](https://lrclib.net).
+
+- **Taskbar Media Control**: Control playback from
+  your [Windows taskbar](https://user-images.githubusercontent.com/78568641/111916130-24a35e80-8a82-11eb-80c8-5021c1aa27f4.png)
+
+- **TouchBar**: Custom TouchBar layout for macOS
+
+- **Tuna OBS**: Integration with [OBS](https://obsproject.com/)'s
+  plugin [Tuna](https://obsproject.com/forum/resources/tuna.843/)
+
+- **Video Quality Changer**: Allows changing the video quality with
+  a [button](https://user-images.githubusercontent.com/78568641/138574366-70324a5e-2d64-4f6a-acdd-dc2a2b9cecc5.png) on
+  the video overlay
+
+- **Video Toggle**: Adds
+  a [button](https://user-images.githubusercontent.com/28893833/173663950-63e6610e-a532-49b7-9afa-54cb57ddfc15.png) to
+  switch between Video/Song mode. can also optionally remove the whole video tab
+
+- **Visualizer**: Different music visualizers
+
+
+## Translation
+
+You can help with translation on [Hosted Weblate](https://hosted.weblate.org/projects/youtube-music/).
+
+<a href="https://hosted.weblate.org/engage/youtube-music/">
+  <img src="https://hosted.weblate.org/widget/youtube-music/i18n/multi-auto.svg" alt="translation status" />
+  <img src="https://hosted.weblate.org/widget/youtube-music/i18n/287x66-black.png" alt="translation status 2" />
+</a>
+
+## Download
+
+You can check out the [latest release](https://github.com/th-ch/youtube-music/releases/latest) to quickly find the
+latest version.
+
+### Arch Linux
+
+Install the [`youtube-music-bin`](https://aur.archlinux.org/packages/youtube-music-bin) package from the AUR. For AUR installation instructions, take a look at
+this [wiki page](https://wiki.archlinux.org/index.php/Arch_User_Repository#Installing_packages).
+
+### macOS
+
+You can install the app using Homebrew (see the [cask definition](https://github.com/th-ch/homebrew-youtube-music)):
+
+```bash
+brew install th-ch/youtube-music/youtube-music
+```
+
+If you install the app manually and get an error "is damaged and can’t be opened." when launching the app, run the following in the Terminal:
+
+```bash
+xattr -cr /Applications/YouTube\ Music.app
+```
+
+### Windows
+
+You can use the [Scoop package manager](https://scoop.sh) to install the `youtube-music` package from
+the [`extras` bucket](https://github.com/ScoopInstaller/Extras).
+
+```bash
+scoop bucket add extras
+scoop install extras/youtube-music
+```
+
+Alternately you can use [Winget](https://learn.microsoft.com/en-us/windows/package-manager/winget/), Windows 11s
+official CLI package manager to install the `th-ch.YouTubeMusic` package.
+
+*Note: Microsoft Defender SmartScreen might block the installation since it is from an "unknown publisher". This is also
+true for the manual installation when trying to run the executable(.exe) after a manual download here on github (same
+file).*
+
+```bash
+winget install th-ch.YouTubeMusic
+```
+
+#### How to install without a network connection? (in Windows)
+
+- Download the `*.nsis.7z` file for _your device architecture_ in [release page](https://github.com/th-ch/youtube-music/releases/latest).
+  - `x64` for 64-bit Windows
+  - `ia32` for 32-bit Windows
+  - `arm64` for ARM64 Windows
+- Download installer in release page. (`*-Setup.exe`)
+- Place them in the **same directory**.
+- Run the installer.
+
+## Themes
+
+You can load CSS files to change the look of the application (Options > Visual Tweaks > Themes).
+
+Some predefined themes are available in https://github.com/kerichdev/themes-for-ytmdesktop-player.
+
+## Dev
+
+```bash
+git clone https://github.com/th-ch/youtube-music
+cd youtube-music
+pnpm install --frozen-lockfile
+pnpm dev
+```
+
+## Build your own plugins
+
+Using plugins, you can:
+
+- manipulate the app - the `BrowserWindow` from electron is passed to the plugin handler
+- change the front by manipulating the HTML/CSS
+
+### Creating a plugin
+
+Create a folder in `src/plugins/YOUR-PLUGIN-NAME`:
+
+- `index.ts`: the main file of the plugin
+```typescript
+import style from './style.css?inline'; // import style as inline
+
+import { createPlugin } from '@/utils';
+
+export default createPlugin({
+  name: 'Plugin Label',
+  restartNeeded: true, // if value is true, ytmusic show restart dialog
+  config: {
+    enabled: false,
+  }, // your custom config
+  stylesheets: [style], // your custom style,
+  menu: async ({ getConfig, setConfig }) => {
+    // All *Config methods are wrapped Promise<T>
+    const config = await getConfig();
+    return [
+      {
+        label: 'menu',
+        submenu: [1, 2, 3].map((value) => ({
+          label: `value ${value}`,
+          type: 'radio',
+          checked: config.value === value,
+          click() {
+            setConfig({ value });
+          },
+        })),
+      },
+    ];
+  },
+  backend: {
+    start({ window, ipc }) {
+      window.maximize();
+
+      // you can communicate with renderer plugin
+      ipc.handle('some-event', () => {
+        return 'hello';
+      });
+    },
+    // it fired when config changed
+    onConfigChange(newConfig) { /* ... */ },
+    // it fired when plugin disabled
+    stop(context) { /* ... */ },
+  },
+  renderer: {
+    async start(context) {
+      console.log(await context.ipc.invoke('some-event'));
+    },
+    // Only renderer available hook
+    onPlayerApiReady(api: YoutubePlayer, context: RendererContext) {
+      // set plugin config easily
+      context.setConfig({ myConfig: api.getVolume() });
+    },
+    onConfigChange(newConfig) { /* ... */ },
+    stop(_context) { /* ... */ },
+  },
+  preload: {
+    async start({ getConfig }) {
+      const config = await getConfig();
+    },
+    onConfigChange(newConfig) {},
+    stop(_context) {},
+  },
+});
+```
+
+### Common use cases
+
+- injecting custom CSS: create a `style.css` file in the same folder then:
+
+```typescript
+// index.ts
+import style from './style.css?inline'; // import style as inline
+
+import { createPlugin } from '@/utils';
+
+export default createPlugin({
+  name: 'Plugin Label',
+  restartNeeded: true, // if value is true, ytmusic will show a restart dialog
+  config: {
+    enabled: false,
+  }, // your custom config
+  stylesheets: [style], // your custom style
+  renderer() {} // define renderer hook
+});
+```
+
+- If you want to change the HTML:
+
+```typescript
+import { createPlugin } from '@/utils';
+
+export default createPlugin({
+  name: 'Plugin Label',
+  restartNeeded: true, // if value is true, ytmusic will show the restart dialog
+  config: {
+    enabled: false,
+  }, // your custom config
+  renderer() {
+    // Remove the login button
+    document.querySelector(".sign-in-link.ytmusic-nav-bar").remove();
+  } // define renderer hook
+});
+```
+
+- communicating between the front and back: can be done using the ipcMain module from electron. See `index.ts` file and
+  example in `sponsorblock` plugin.
+
+## Build
+
+1. Clone the repo
+2. Follow [this guide](https://pnpm.io/installation) to install `pnpm`
+3. Run `pnpm install --frozen-lockfile` to install dependencies
+4. Run `pnpm build:OS`
+
+- `pnpm dist:win` - Windows
+- `pnpm dist:linux` - Linux (amd64)
+- `pnpm dist:linux:deb-arm64` - Linux (arm64 for Debian)
+- `pnpm dist:linux:rpm-arm64` - Linux (arm64 for Fedora)
+- `pnpm dist:mac` - macOS (amd64)
+- `pnpm dist:mac:arm64` - macOS (arm64)
+
+Builds the app for macOS, Linux, and Windows,
+using [electron-builder](https://github.com/electron-userland/electron-builder).
+
+## Production Preview
+
+```bash
+pnpm start
+```
+
+## Tests
+
+```bash
+pnpm test
+```
+
+Uses [Playwright](https://playwright.dev/) to test the app.
+
+## License
+
+MIT © [th-ch](https://github.com/th-ch/youtube-music)
+
+## FAQ
+
+### Why apps menu isn't showing up?
+
+If `Hide Menu` option is on - you can show the menu with the <kbd>alt</kbd> key (or <kbd>\`</kbd> [backtick] if using
+the in-app-menu plugin)

assets/error.html

@@ -0,0 +1,50 @@
+<!doctype html>
+<html>
+  <head>
+    <meta charset="utf-8" />
+    <title>Cannot load YouTube Music</title>
+    <style>
+      body {
+        background: #000;
+      }
+
+      .container {
+        margin: 0;
+        font-family: Roboto, Arial, sans-serif;
+        font-size: 20px;
+        font-weight: 500;
+        color: rgba(255, 255, 255, 0.5);
+        position: absolute;
+        top: 50%;
+        left: 50%;
+        margin-right: -50%;
+        transform: translate(-50%, -50%);
+        text-align: center;
+      }
+
+      .button {
+        background: #065fd4;
+        overflow: hidden;
+        text-overflow: ellipsis;
+        white-space: nowrap;
+        color: white;
+        font: inherit;
+        text-transform: uppercase;
+        text-decoration: none;
+        border-radius: 2px;
+        font-size: 16px;
+        font-weight: normal;
+        text-align: center;
+        padding: 8px 22px;
+        display: inline-block;
+      }
+    </style>
+  </head>
+
+  <body>
+    <div class="container">
+      <p>Cannot load YouTube Music… Internet disconnected?</p>
+      <a class="button" href="#" onclick="reload()">Retry</a>
+    </div>
+  </body>
+</html>

assets/menu.svg

@@ -1,3 +0,0 @@
-<svg width="24" height="24" fill="none" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
-    <path d="M3 17h12a1 1 0 0 1 .117 1.993L15 19H3a1 1 0 0 1-.117-1.993L3 17h12H3Zm0-6h18a1 1 0 0 1 .117 1.993L21 13H3a1 1 0 0 1-.117-1.993L3 11h18H3Zm0-6h15a1 1 0 0 1 .117 1.993L18 7H3a1 1 0 0 1-.117-1.993L3 5h15H3Z" fill="#ffffff"/>
-</svg>

config/defaults.ts

@@ -1,277 +0,0 @@
-export interface WindowSizeConfig {
-  width: number;
-  height: number;
-}
-
-export interface DefaultConfig {
-  'window-size': {
-    width: number;
-    height: number;
-  }
-  'window-maximized': boolean;
-  'window-position': {
-    x: number;
-    y: number;
-  }
-  url: string;
-  options: {
-    tray: boolean;
-    appVisible: boolean;
-    autoUpdates: boolean;
-    alwaysOnTop: boolean;
-    hideMenu: boolean;
-    hideMenuWarned: boolean;
-    startAtLogin: boolean;
-    disableHardwareAcceleration: boolean;
-    removeUpgradeButton: boolean;
-    restartOnConfigChanges: boolean;
-    trayClickPlayPause: boolean;
-    autoResetAppCache: boolean;
-    resumeOnStart: boolean;
-    likeButtons: string;
-    proxy: string;
-    startingPage: string;
-    overrideUserAgent: boolean;
-    themes: string[];
-  }
-}
-
-const defaultConfig = {
-  'window-size': {
-    width: 1100,
-    height: 550,
-  },
-  'window-maximized': false,
-  'window-position': {
-    x: -1,
-    y: -1,
-  },
-  'url': 'https://music.youtube.com',
-  'options': {
-    tray: false,
-    appVisible: true,
-    autoUpdates: true,
-    alwaysOnTop: false,
-    hideMenu: false,
-    hideMenuWarned: false,
-    startAtLogin: false,
-    disableHardwareAcceleration: false,
-    removeUpgradeButton: false,
-    restartOnConfigChanges: false,
-    trayClickPlayPause: false,
-    autoResetAppCache: false,
-    resumeOnStart: true,
-    likeButtons: '',
-    proxy: '',
-    startingPage: '',
-    overrideUserAgent: false,
-    themes: [] as string[],
-  },
-  /** please order alphabetically */
-  'plugins': {
-    'adblocker': {
-      enabled: true,
-      cache: true,
-      blocker: 'With blocklists',
-      additionalBlockLists: [], // Additional list of filters, e.g "https://raw.githubusercontent.com/uBlockOrigin/uAssets/master/filters/filters.txt"
-      disableDefaultLists: false,
-    },
-    'album-color-theme': {},
-    'ambient-mode': {},
-    'audio-compressor': {},
-    'blur-nav-bar': {},
-    'bypass-age-restrictions': {},
-    'captions-selector': {
-      enabled: false,
-      disableCaptions: false,
-      autoload: false,
-      lastCaptionsCode: '',
-    },
-    'compact-sidebar': {},
-    'crossfade': {
-      enabled: false,
-      fadeInDuration: 1500, // Ms
-      fadeOutDuration: 5000, // Ms
-      secondsBeforeEnd: 10, // S
-      fadeScaling: 'linear', // 'linear', 'logarithmic' or a positive number in dB
-    },
-    'disable-autoplay': {
-      applyOnce: false,
-    },
-    'discord': {
-      enabled: false,
-      autoReconnect: true, // If enabled, will try to reconnect to discord every 5 seconds after disconnecting or failing to connect
-      activityTimoutEnabled: true, // If enabled, the discord rich presence gets cleared when music paused after the time specified below
-      activityTimoutTime: 10 * 60 * 1000, // 10 minutes
-      listenAlong: true, // Add a "listen along" button to rich presence
-      hideDurationLeft: false, // Hides the start and end time of the song to rich presence
-    },
-    'downloader': {
-      enabled: false,
-      ffmpegArgs: ['-b:a', '256k'], // E.g. ["-b:a", "192k"] for an audio bitrate of 192kb/s
-      downloadFolder: undefined as string | undefined, // Custom download folder (absolute path)
-      preset: 'mp3',
-      skipExisting: false,
-      playlistMaxItems: undefined as number | undefined,
-    },
-    'exponential-volume': {},
-    'in-app-menu': {},
-    'last-fm': {
-      enabled: false,
-      token: undefined as string | undefined, // Token used for authentication
-      session_key: undefined as string | undefined, // Session key used for scrobbling
-      api_root: 'http://ws.audioscrobbler.com/2.0/',
-      api_key: '04d76faaac8726e60988e14c105d421a', // Api key registered by @semvis123
-      secret: 'a5d2a36fdf64819290f6982481eaffa2',
-    },
-    'lumiastream': {},
-    'lyrics-genius': {
-      romanizedLyrics: false,
-    },
-    'navigation': {
-      enabled: true,
-    },
-    'no-google-login': {},
-    'notifications': {
-      enabled: false,
-      unpauseNotification: false,
-      urgency: 'normal', // Has effect only on Linux
-      // the following has effect only on Windows
-      interactive: true,
-      toastStyle: 1, // See plugins/notifications/utils for more info
-      refreshOnPlayPause: false,
-      trayControls: true,
-      hideButtonText: false,
-    },
-    'picture-in-picture': {
-      'enabled': false,
-      'alwaysOnTop': true,
-      'savePosition': true,
-      'saveSize': false,
-      'hotkey': 'P',
-      'pip-position': [10, 10],
-      'pip-size': [450, 275],
-      'isInPiP': false,
-      'useNativePiP': false,
-    },
-    'playback-speed': {},
-    'precise-volume': {
-      enabled: false,
-      steps: 1, // Percentage of volume to change
-      arrowsShortcut: true, // Enable ArrowUp + ArrowDown local shortcuts
-      globalShortcuts: {
-        volumeUp: '',
-        volumeDown: '',
-      },
-      savedVolume: undefined as number | undefined, // Plugin save volume between session here
-    },
-    'quality-changer': {},
-    'shortcuts': {
-      enabled: false,
-      overrideMediaKeys: false,
-      global: {
-        previous: '',
-        playPause: '',
-        next: '',
-      } as Record<string, string>,
-      local: {
-        previous: '',
-        playPause: '',
-        next: '',
-      } as Record<string, string>,
-    },
-    'skip-silences': {
-      onlySkipBeginning: false,
-    },
-    'sponsorblock': {
-      enabled: false,
-      apiURL: 'https://sponsor.ajay.app',
-      categories: [
-        'sponsor',
-        'intro',
-        'outro',
-        'interaction',
-        'selfpromo',
-        'music_offtopic',
-      ],
-    },
-    'taskbar-mediacontrol': {},
-    'touchbar': {},
-    'tuna-obs': {},
-    'video-toggle': {
-      enabled: false,
-      hideVideo: false,
-      mode: 'custom',
-      forceHide: false,
-      align: '',
-    },
-    'visualizer': {
-      enabled: false,
-      type: 'butterchurn',
-      // Config per visualizer
-      butterchurn: {
-        preset: 'martin [shadow harlequins shape code] - fata morgana',
-        renderingFrequencyInMs: 500,
-        blendTimeInSeconds: 2.7,
-      },
-      vudio: {
-        effect: 'lighting',
-        accuracy: 128,
-        lighting: {
-          maxHeight: 160,
-          maxSize: 12,
-          lineWidth: 1,
-          color: '#49f3f7',
-          shadowBlur: 2,
-          shadowColor: 'rgba(244,244,244,.5)',
-          fadeSide: true,
-          prettify: false,
-          horizontalAlign: 'center',
-          verticalAlign: 'middle',
-          dottify: true,
-        },
-      },
-      wave: {
-        animations: [
-          {
-            type: 'Cubes',
-            config: {
-              bottom: true,
-              count: 30,
-              cubeHeight: 5,
-              fillColor: { gradient: ['#FAD961', '#F76B1C'] },
-              lineColor: 'rgba(0,0,0,0)',
-              radius: 20,
-            },
-          },
-          {
-            type: 'Cubes',
-            config: {
-              top: true,
-              count: 12,
-              cubeHeight: 5,
-              fillColor: { gradient: ['#FAD961', '#F76B1C'] },
-              lineColor: 'rgba(0,0,0,0)',
-              radius: 10,
-            },
-          },
-          {
-            type: 'Circles',
-            config: {
-              lineColor: {
-                gradient: ['#FAD961', '#FAD961', '#F76B1C'],
-                rotate: 90,
-              },
-              lineWidth: 4,
-              diameter: 20,
-              count: 10,
-              frequencyBand: 'base',
-            },
-          },
-        ],
-      },
-    },
-  },
-};
-
-export default defaultConfig;

config/dynamic.ts

@@ -1,241 +0,0 @@
-/* eslint-disable @typescript-eslint/require-await */
-
-import { ipcMain, ipcRenderer } from 'electron';
-
-import defaultConfig from './defaults';
-
-import { getOptions, setMenuOptions, setOptions } from './plugins';
-
-
-import { sendToFront } from '../providers/app-controls';
-import { Entries } from '../utils/type-utils';
-
-export type DefaultPluginsConfig = typeof defaultConfig.plugins;
-export type OneOfDefaultConfigKey = keyof DefaultPluginsConfig;
-export type OneOfDefaultConfig = typeof defaultConfig.plugins[OneOfDefaultConfigKey];
-
-// eslint-disable-next-line @typescript-eslint/no-explicit-any
-const activePlugins: { [key in OneOfDefaultConfigKey]?: PluginConfig<any> } = {};
-
-/**
- * [!IMPORTANT!]
- * The method is **sync** in the main process and **async** in the renderer process.
- */
-export const getActivePlugins
-  = process.type === 'renderer'
-  ? async () => ipcRenderer.invoke('get-active-plugins')
-  : () => activePlugins;
-
-if (process.type === 'browser') {
-  ipcMain.handle('get-active-plugins', getActivePlugins);
-}
-
-/**
- * [!IMPORTANT!]
- * The method is **sync** in the main process and **async** in the renderer process.
- */
-export const isActive
-  = process.type === 'renderer'
-  ? async (plugin: string) =>
-    plugin in (await ipcRenderer.invoke('get-active-plugins'))
-  : (plugin: string): boolean => plugin in activePlugins;
-
-interface PluginConfigOptions {
-  enableFront: boolean;
-  initialOptions?: OneOfDefaultConfig;
-}
-
-/**
- * This class is used to create a dynamic synced config for plugins.
- *
- * [!IMPORTANT!]
- * The methods are **sync** in the main process and **async** in the renderer process.
- *
- * @param {string} name - The name of the plugin.
- * @param {boolean} [options.enableFront] - Whether the config should be available in front.js. Default: false.
- * @param {object} [options.initialOptions] - The initial options for the plugin. Default: loaded from store.
- *
- * @example
- * const { PluginConfig } = require("../../config/dynamic");
- * const config = new PluginConfig("plugin-name", { enableFront: true });
- * module.exports = { ...config };
- *
- * // or
- *
- * module.exports = (win, options) => {
- *  const config = new PluginConfig("plugin-name", {
- *    enableFront: true,
- *    initialOptions: options,
- *  });
- *  setupMyPlugin(win, config);
- * };
- */
-export type ConfigType<T extends OneOfDefaultConfigKey> = typeof defaultConfig.plugins[T];
-type ValueOf<T> = T[keyof T];
-type Mode<T, Mode extends 'r' | 'm'> = Mode extends 'r' ? Promise<T> : T;
-export class PluginConfig<T extends OneOfDefaultConfigKey> {
-  private readonly name: string;
-  private readonly config: ConfigType<T>;
-  private readonly defaultConfig: ConfigType<T>;
-  private readonly enableFront: boolean;
-
-  private subscribers: { [key in keyof ConfigType<T>]?: (config: ConfigType<T>) => void } = {};
-  private allSubscribers: ((config: ConfigType<T>) => void)[] = [];
-
-  constructor(
-    name: T,
-    options: PluginConfigOptions = {
-      enableFront: false,
-    },
-  ) {
-    const pluginDefaultConfig = defaultConfig.plugins[name] ?? {};
-    const pluginConfig = options.initialOptions || getOptions(name) || {};
-
-    this.name = name;
-    this.enableFront = options.enableFront;
-    this.defaultConfig = pluginDefaultConfig;
-    this.config = { ...pluginDefaultConfig, ...pluginConfig };
-
-    if (this.enableFront) {
-      this.setupFront();
-    }
-
-    activePlugins[name] = this;
-  }
-
-  get<Key extends keyof ConfigType<T> = keyof ConfigType<T>>(key: Key): ConfigType<T>[Key] {
-    return this.config?.[key];
-  }
-
-  set(key: keyof ConfigType<T>, value: ValueOf<ConfigType<T>>) {
-    this.config[key] = value;
-    this.onChange(key);
-    this.save();
-  }
-
-  getAll(): ConfigType<T> {
-    return { ...this.config };
-  }
-
-  setAll(options: Partial<ConfigType<T>>) {
-    if (!options || typeof options !== 'object') {
-      throw new Error('Options must be an object.');
-    }
-
-    let changed = false;
-    for (const [key, value] of Object.entries(options) as Entries<typeof options>) {
-      if (this.config[key] !== value) {
-        if (value !== undefined) this.config[key] = value;
-        this.onChange(key, false);
-        changed = true;
-      }
-    }
-
-    if (changed) {
-      for (const fn of this.allSubscribers) {
-        fn(this.config);
-      }
-    }
-
-    this.save();
-  }
-
-  getDefaultConfig() {
-    return this.defaultConfig;
-  }
-
-  /**
-   * Use this method to set an option and restart the app if `appConfig.restartOnConfigChange === true`
-   *
-   * Used for options that require a restart to take effect.
-   */
-  setAndMaybeRestart(key: keyof ConfigType<T>, value: ValueOf<ConfigType<T>>) {
-    this.config[key] = value;
-    setMenuOptions(this.name, this.config);
-    this.onChange(key);
-  }
-
-  subscribe(valueName: keyof ConfigType<T>, fn: (config: ConfigType<T>) => void) {
-    this.subscribers[valueName] = fn;
-  }
-
-  subscribeAll(fn: (config: ConfigType<T>) => void) {
-    this.allSubscribers.push(fn);
-  }
-
-  /** Called only from back */
-  private save() {
-    setOptions(this.name, this.config);
-  }
-
-  private onChange(valueName: keyof ConfigType<T>, single: boolean = true) {
-    this.subscribers[valueName]?.(this.config[valueName] as ConfigType<T>);
-    if (single) {
-      for (const fn of this.allSubscribers) {
-        fn(this.config);
-      }
-    }
-  }
-
-  private setupFront() {
-    const ignoredMethods = ['subscribe', 'subscribeAll'];
-
-    if (process.type === 'renderer') {
-      for (const [fnName, fn] of Object.entries(this) as Entries<this>) {
-        if (typeof fn !== 'function' || fn.name in ignoredMethods) {
-          return;
-        }
-
-        // eslint-disable-next-line @typescript-eslint/no-explicit-any,@typescript-eslint/no-unsafe-return
-        this[fnName] = (async (...args: any) => await ipcRenderer.invoke(
-          `${this.name}-config-${String(fnName)}`,
-          // eslint-disable-next-line @typescript-eslint/no-unsafe-argument
-          ...args,
-        )) as typeof this[keyof this];
-
-        this.subscribe = (valueName, fn: (config: ConfigType<T>) => void) => {
-          if (valueName in this.subscribers) {
-            console.error(`Already subscribed to ${String(valueName)}`);
-          }
-
-          this.subscribers[valueName] = fn;
-          ipcRenderer.on(
-            `${this.name}-config-changed-${String(valueName)}`,
-            (_, value: ConfigType<T>) => {
-              fn(value);
-            },
-          );
-          ipcRenderer.send(`${this.name}-config-subscribe`, valueName);
-        };
-
-        this.subscribeAll = (fn: (config: ConfigType<T>) => void) => {
-          ipcRenderer.on(`${this.name}-config-changed`, (_, value: ConfigType<T>) => {
-            fn(value);
-          });
-          ipcRenderer.send(`${this.name}-config-subscribe-all`);
-        };
-      }
-    } else if (process.type === 'browser') {
-      for (const [fnName, fn] of Object.entries(this) as Entries<this>) {
-        if (typeof fn !== 'function' || fn.name in ignoredMethods) {
-          return;
-        }
-
-        // eslint-disable-next-line @typescript-eslint/no-unsafe-argument,@typescript-eslint/no-unsafe-return
-        ipcMain.handle(`${this.name}-config-${String(fnName)}`, (_, ...args) => fn(...args));
-      }
-
-      ipcMain.on(`${this.name}-config-subscribe`, (_, valueName: keyof ConfigType<T>) => {
-        this.subscribe(valueName, (value) => {
-          sendToFront(`${this.name}-config-changed-${String(valueName)}`, value);
-        });
-      });
-
-      ipcMain.on(`${this.name}-config-subscribe-all`, () => {
-        this.subscribeAll((value) => {
-          sendToFront(`${this.name}-config-changed`, value);
-        });
-      });
-    }
-  }
-}

config/index.ts

@@ -1,53 +0,0 @@
-import Store from 'electron-store';
-
-import defaultConfig from './defaults';
-import plugins from './plugins';
-import store from './store';
-
-import { restart } from '../providers/app-controls';
-
-
-const set = (key: string, value: unknown) => {
-  store.set(key, value);
-};
-
-function setMenuOption(key: string, value: unknown) {
-  set(key, value);
-  if (store.get('options.restartOnConfigChanges')) {
-    restart();
-  }
-}
-
-// MAGIC OF TYPESCRIPT
-
-type Prev = [never, 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10,
-  11, 12, 13, 14, 15, 16, 17, 18, 19, 20, ...0[]]
-type Join<K, P> = K extends string | number ?
-  P extends string | number ?
-    `${K}${'' extends P ? '' : '.'}${P}`
-    : never : never;
-type Paths<T, D extends number = 10> = [D] extends [never] ? never : T extends object ?
-  { [K in keyof T]-?: K extends string | number ?
-    `${K}` | Join<K, Paths<T[K], Prev[D]>>
-    : never
-  }[keyof T] : ''
-
-type SplitKey<K> = K extends `${infer A}.${infer B}` ? [A, B] : [K, string];
-type PathValue<T, K extends string> =
-  SplitKey<K> extends [infer A extends keyof T, infer B extends string]
-    ? PathValue<T[A], B>
-    : T;
-const get = <Key extends Paths<typeof defaultConfig>>(key: Key) => store.get(key) as PathValue<typeof defaultConfig, typeof key>;
-
-export default {
-  defaultConfig,
-  get,
-  set,
-  setMenuOption,
-  edit: () => store.openInEditor(),
-  watch(cb: Parameters<Store['onDidChange']>[1]) {
-    store.onDidChange('options', cb);
-    store.onDidChange('plugins', cb);
-  },
-  plugins,
-};

config/plugins.ts

@@ -1,63 +0,0 @@
-import store from './store';
-import defaultConfig from './defaults';
-
-import { restart } from '../providers/app-controls';
-import { Entries } from '../utils/type-utils';
-
-interface Plugin {
-  enabled: boolean;
-}
-
-type DefaultPluginsConfig = typeof defaultConfig.plugins;
-
-export function getEnabled() {
-  const plugins = store.get('plugins') as DefaultPluginsConfig;
-  return (Object.entries(plugins) as Entries<DefaultPluginsConfig>).filter(([plugin]) =>
-    isEnabled(plugin),
-  );
-}
-
-export function isEnabled(plugin: string) {
-  const pluginConfig = (store.get('plugins') as Record<string, Plugin>)[plugin];
-  return pluginConfig !== undefined && pluginConfig.enabled;
-}
-
-export function setOptions<T>(plugin: string, options: T) {
-  const plugins = store.get('plugins') as Record<string, T>;
-  store.set('plugins', {
-    ...plugins,
-    [plugin]: {
-      ...plugins[plugin],
-      ...options,
-    },
-  });
-}
-
-export function setMenuOptions<T>(plugin: string, options: T) {
-  setOptions(plugin, options);
-  if (store.get('options.restartOnConfigChanges')) {
-    restart();
-  }
-}
-
-export function getOptions<T>(plugin: string): T {
-  return (store.get('plugins') as Record<string, T>)[plugin];
-}
-
-export function enable(plugin: string) {
-  setMenuOptions(plugin, { enabled: true });
-}
-
-export function disable(plugin: string) {
-  setMenuOptions(plugin, { enabled: false });
-}
-
-export default {
-  isEnabled,
-  getEnabled,
-  enable,
-  disable,
-  setOptions,
-  setMenuOptions,
-  getOptions,
-};

config/store.ts

@@ -1,124 +0,0 @@
-import Store from 'electron-store';
-import Conf from 'conf';
-
-import defaults from './defaults';
-
-const setDefaultPluginOptions = (store: Conf<Record<string, unknown>>, plugin: keyof typeof defaults.plugins) => {
-  if (!store.get(`plugins.${plugin}`)) {
-    store.set(`plugins.${plugin}`, defaults.plugins[plugin]);
-  }
-};
-
-const migrations = {
-  '>=1.20.0'(store: Conf<Record<string, unknown>>) {
-    setDefaultPluginOptions(store, 'visualizer');
-
-    if (store.get('plugins.notifications.toastStyle') === undefined) {
-      const pluginOptions = store.get('plugins.notifications') || {};
-      store.set('plugins.notifications', {
-        ...defaults.plugins.notifications,
-        ...pluginOptions,
-      });
-    }
-
-    if (store.get('options.ForceShowLikeButtons')) {
-      store.delete('options.ForceShowLikeButtons');
-      store.set('options.likeButtons', 'force');
-    }
-  },
-  '>=1.17.0'(store: Conf<Record<string, unknown>>) {
-    setDefaultPluginOptions(store, 'picture-in-picture');
-
-    if (store.get('plugins.video-toggle.mode') === undefined) {
-      store.set('plugins.video-toggle.mode', 'custom');
-    }
-  },
-  '>=1.14.0'(store: Conf<Record<string, unknown>>) {
-    if (
-      typeof store.get('plugins.precise-volume.globalShortcuts') !== 'object'
-    ) {
-      store.set('plugins.precise-volume.globalShortcuts', {});
-    }
-
-    if (store.get('plugins.hide-video-player.enabled')) {
-      store.delete('plugins.hide-video-player');
-      store.set('plugins.video-toggle.enabled', true);
-    }
-  },
-  '>=1.13.0'(store: Conf<Record<string, unknown>>) {
-    if (store.get('plugins.discord.listenAlong') === undefined) {
-      store.set('plugins.discord.listenAlong', true);
-    }
-  },
-  '>=1.12.0'(store: Conf<Record<string, unknown>>) {
-    const options = store.get('plugins.shortcuts') as Record<string, {
-      action: string;
-      shortcut: unknown;
-    }[] | Record<string, unknown>>;
-    let updated = false;
-    for (const optionType of ['global', 'local']) {
-      if (Array.isArray(options[optionType])) {
-        const optionsArray = options[optionType] as {
-          action: string;
-          shortcut: unknown;
-        }[];
-        const updatedOptions: Record<string, unknown> = {};
-        for (const optionObject of optionsArray) {
-          if (optionObject.action && optionObject.shortcut) {
-            updatedOptions[optionObject.action] = optionObject.shortcut;
-          }
-        }
-
-        options[optionType] = updatedOptions;
-        updated = true;
-      }
-    }
-
-    if (updated) {
-      store.set('plugins.shortcuts', options);
-    }
-  },
-  '>=1.11.0'(store: Conf<Record<string, unknown>>) {
-    if (store.get('options.resumeOnStart') === undefined) {
-      store.set('options.resumeOnStart', true);
-    }
-  },
-  '>=1.7.0'(store: Conf<Record<string, unknown>>) {
-    const enabledPlugins = store.get('plugins') as string[];
-    if (!Array.isArray(enabledPlugins)) {
-      console.warn('Plugins are not in array format, cannot migrate');
-      return;
-    }
-
-    // Include custom options
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    const plugins: Record<string, any> = {
-      adblocker: {
-        enabled: true,
-        cache: true,
-        additionalBlockLists: [],
-      },
-      downloader: {
-        enabled: false,
-        ffmpegArgs: [], // E.g. ["-b:a", "192k"] for an audio bitrate of 192kb/s
-        downloadFolder: undefined, // Custom download folder (absolute path)
-      },
-    };
-
-    for (const enabledPlugin of enabledPlugins) {
-      // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment
-      plugins[enabledPlugin] = {
-        ...plugins[enabledPlugin],
-        enabled: true,
-      };
-    }
-
-    store.set('plugins', plugins);
-  },
-};
-
-export default new Store({
-  defaults,
-  clearInvalidConfig: false,
-  migrations,
-});

docs/index.html

@@ -478,7 +478,7 @@
                             </a>
                         </li>
                     </ul>
-                    <div class="footer-copyright">© 2021 th-ch</div>
+                    <div class="footer-copyright">© 2024 th-ch</div>
                 </div>
             </div>
         </div>

docs/readme/README-es.md

@@ -0,0 +1,390 @@
+<div align="center">
+
+# YouTube Music
+
+[![GitHub release](https://img.shields.io/github/release/th-ch/youtube-music.svg?style=for-the-badge&logo=youtube-music)](https://github.com/th-ch/youtube-music/releases/)
+[![GitHub license](https://img.shields.io/github/license/th-ch/youtube-music.svg?style=for-the-badge)](https://github.com/th-ch/youtube-music/blob/master/LICENSE)
+[![eslint code style](https://img.shields.io/badge/code_style-eslint-5ed9c7.svg?style=for-the-badge)](https://github.com/th-ch/youtube-music/blob/master/.eslintrc.js)
+[![Build status](https://img.shields.io/github/actions/workflow/status/th-ch/youtube-music/build.yml?branch=master&style=for-the-badge&logo=youtube-music)](https://GitHub.com/th-ch/youtube-music/releases/)
+[![GitHub All Releases](https://img.shields.io/github/downloads/th-ch/youtube-music/total?style=for-the-badge&logo=youtube-music)](https://GitHub.com/th-ch/youtube-music/releases/)
+[![AUR](https://img.shields.io/aur/version/youtube-music-bin?color=blueviolet&style=for-the-badge&logo=youtube-music)](https://aur.archlinux.org/packages/youtube-music-bin)
+[![Known Vulnerabilities](https://snyk.io/test/github/th-ch/youtube-music/badge.svg)](https://snyk.io/test/github/th-ch/youtube-music)
+
+</div>
+
+![Screenshot](/web/screenshot.jpg "Screenshot")
+
+
+<div align="center">
+	<a href="https://github.com/th-ch/youtube-music/releases/latest">
+		<img src="/web/youtube-music.svg" width="400" height="100" alt="YouTube Music SVG">
+	</a>
+</div>
+
+**Electron wrapper de YouTube Music con las siguientes características:**
+
+- Apariencia y sensación nativa, tiene como objetivo mantener la interfaz original
+- Framework para plugins personalizados: cambia YouTube Music según tus necesidades (estilo, contenido, funciones), habilita/deshabilita plugins con un solo clic
+
+## Imagen de demostración
+
+|                  Pantalla del reproductor (color del álbum como tema y luz ambiental)                     |
+|:---------------------------------------------------------------------------------------------------------:|
+|![Screenshot1](https://github.com/th-ch/youtube-music/assets/16558115/53efdf73-b8fa-4d7b-a235-b96b91ea77fc)|
+
+## Contenido
+
+- [Características](#características)
+- [Plugins disponibles](#plugins-disponibles)
+- [Traducción](#traducción)
+- [Descarga](#descarga)
+    - [Arch Linux](#arch-linux)
+    - [macOS](#macos)
+    - [Windows](#windows)
+        - [Cómo instalar sin conexión a internet? (en Windows)](#cómo-instalar-sin-conexión-a-internet-en-windows)
+- [Temas](#temas)
+- [Dev](#dev)
+- [Crea tus propios plugins](#crea-tus-propios-plugins)
+    - [Creación de un plugin](#creación-de-un-plugin)
+    - [Casos de uso comunes](#casos-de-uso-comunes)
+- [Compilar](#compilar)
+- [Vista previa de producción](#vista-previa-de-producción)
+- [Tests](#tests)
+- [Licencia](#licencia)
+- [Preguntas frecuentes](#preguntas-frecuentes)
+
+## Características:
+
+- **Confirmación automática al pausar** (Siempre habilitado): desactiva
+    el mensaje emergente ["¿Continuar reproduciendo?"](https://user-images.githubusercontent.com/61631665/129977894-01c60740-7ec6-4bf0-9a2c-25da24491b0e.png)
+    que pausa la música después de cierto tiempo
+
+- Y más ...
+
+## Plugins disponibles:
+
+- **Bloqueador de Anuncios**: Bloquea todos los anuncios y rastreadores de forma predeterminada
+
+- **Acciones de Álbum**: Agrega botones de deshacer No me gusta, No me gusta, Me gusta, y Deshacer me gusta a todas las canciones de una lista de reproducción o álbum
+
+- **Tema de Color del Álbum**: Aplica un tema dinámico y efectos visuales basados en la paleta de colores del álbum
+
+- **Modo Ambiente**: Aplica un efecto de iluminación proyectando colores suaves del video en el fondo de tu pantalla
+
+- **Compresor de Audio**: Aplica compresión al audio (reduce el volumen de las partes más fuertes de la señal y aumenta el
+    volumen de las partes más suaves)
+
+- **Barra de Navegación Difuminada**: hace que la barra de navegación sea transparente y borrosa
+
+- **Omitir Restricciones de Edades**: omite la verificación de edad de YouTube
+
+- **Selector de Subtítulos**: Habilita los subtítulos
+
+- **Barra Lateral Compacta**: Siempre muestra la barra lateral en modo compacto
+
+- **Crossfade**: Transición suave entre canciones
+
+- **Desactivar Reproducción Automática**: Hace que cada canción comience en modo "pausado"
+
+- **[Discord](https://discord.com/) Rich Presence**: Muestra a tus amigos lo que estás escuchando
+    con [Rich Presence](https://user-images.githubusercontent.com/28219076/104362104-a7a0b980-5513-11eb-9744-bb89eabe0016.png)
+
+- **Descargador**: Descarga
+    MP3 [directamente desde la interfaz](https://user-images.githubusercontent.com/61631665/129977677-83a7d067-c192-45e1-98ae-b5a4927393be.png) [(youtube-dl)](https://github.com/ytdl-org/youtube-dl)
+
+- **Volumen Exponencial**: Hace que el control de volumen
+    sea [exponencial](https://greasyfork.org/en/scripts/397686-youtube-music-fix-volume-ratio/) para facilitar la
+    selección de volúmenes más bajos
+
+- **Menú en la Aplicación**: [da a las barras un aspecto elegante y oscuro](https://user-images.githubusercontent.com/78568641/112215894-923dbf00-8c29-11eb-95c3-3ce15db27eca.png)
+
+    > (consulta [esta publicación](https://github.com/th-ch/youtube-music/issues/410#issuecomment-952060709) si tienes problemas
+    para acceder al menú después de habilitar este plugin y la opción hide-menu)
+
+- **Scrobbler**: Agrega soporte para scrobbling en [Last.fm](https://www.last.fm/) y [ListenBrainz](https://listenbrainz.org/)
+
+- **Lumia Stream**: Agrega soporte para [Lumia Stream](https://lumiastream.com/)
+
+- **Letras Genius**: Agrega soporte de letras para la mayoría de las canciones
+
+- **Music Together**: Comparte una lista de reproducción con otros. Cuando el anfitrión reproduce una canción, todos los demás escucharán la misma canción
+
+- **Navegación**: Flechas de siguiente/anterior integradas directamente en la interfaz, como en tu navegador favorito
+
+- **Sin Inicio de Sesión de Google**: Elimina los botones y enlaces de inicio de sesión de Google de la interfaz
+
+- **Notificaciones**: Muestra una notificación cuando comienza una canción
+    a reproducirse ([notificaciones interactivas](https://user-images.githubusercontent.com/78568641/114102651-63ce0e00-98d0-11eb-9dfe-c5a02bb54f9c.png)
+    están disponibles en Windows)
+
+- **Picture-in-picture**: permite cambiar la aplicación al modo picture-in-picture
+
+- **Velocidad de Reproducción**: Escucha rápido, escucha
+    lento! [Agrega un deslizador que controla la velocidad de reproducción de las canciones](https://user-images.githubusercontent.com/61631665/129976003-e55db5ba-bf42-448c-a059-26a009775e68.png)
+
+- **Volumen Preciso**: Controla el volumen de forma precisa utilizando la rueda del mouse/atajos de teclado, con un HUD personalizado y pasos de volumen personalizables
+
+- **Atajos (& MPRIS)**: Permite configurar atajos globales para la reproducción (reproducir/pausar/siguiente/anterior) +
+    desactivar [osd multimedia](https://user-images.githubusercontent.com/84923831/128601225-afa38c1f-dea8-4209-9f72-0f84c1dd8b54.png)
+    al anular las teclas multimedia + habilitar Ctrl/CMD + F para buscar + habilitar el soporte mpris de Linux para
+    teclas multimedia + [atajos personalizados](https://github.com/Araxeus/youtube-music/blob/1e591d6a3df98449bcda6e63baab249b28026148/providers/song-controls.js#L13-L50)
+    para [usuarios avanzados](https://github.com/th-ch/youtube-music/issues/106#issuecomment-952156902)
+
+- **Saltar Canción no Gustada**: Salta las canciones que no te gustan
+
+- **Saltar Silencios**: Salta automáticamente las secciones de silencio
+
+- [**SponsorBlock**](https://github.com/ajayyy/SponsorBlock): Salta automáticamente las partes que no son de música, como la introducción/final o
+    partes de videos musicales donde no se reproduce la canción
+
+- **Control Multimedia en la Barra de Tareas**: Controla la reproducción desde
+    la [barra de tareas de Windows](https://user-images.githubusercontent.com/78568641/111916130-24a35e80-8a82-11eb-80c8-5021c1aa27f4.png)
+
+- **TouchBar**: Diseño personalizado de TouchBar para macOS
+
+- **Tuna OBS**: Integración con el complemento [Tuna](https://obsproject.com/forum/resources/tuna.843/) de [OBS](https://obsproject.com/)
+
+- **Cambiador de Calidad de Video**: Permite cambiar la calidad del video con
+    un [botón](https://user-images.githubusercontent.com/78568641/138574366-70324a5e-2d64-4f6a-acdd-dc2a2b9cecc5.png) en
+    la superposición de video
+
+- **Alternar Video**: Agrega
+    un [botón](https://user-images.githubusercontent.com/28893833/173663950-63e6610e-a532-49b7-9afa-54cb57ddfc15.png) para
+    alternar entre el modo de video/canción. también puede eliminar opcionalmente toda la pestaña de video
+
+- **Visualizador**: Diferentes visualizadores de música
+
+## Traducción
+
+Puedes ayudar con la traducción en [Hosted Weblate](https://hosted.weblate.org/projects/youtube-music/).
+
+<a href="https://hosted.weblate.org/engage/youtube-music/">
+  <img src="https://hosted.weblate.org/widget/youtube-music/i18n/multi-auto.svg" alt="estado de traducción" />
+  <img src="https://hosted.weblate.org/widget/youtube-music/i18n/287x66-black.png" alt="estado de traducción 2" />
+</a>
+
+## Descarga
+
+Puedes consultar la [última versión](https://github.com/th-ch/youtube-music/releases/latest) para encontrar rápidamente la versión más reciente.
+
+### Arch Linux
+
+Instala el paquete [`youtube-music-bin`](https://aur.archlinux.org/packages/youtube-music-bin) desde AUR. Para obtener instrucciones de instalación de AUR, consulta esta [página del wiki](https://wiki.archlinux.org/index.php/Arch_User_Repository#Installing_packages).
+
+### macOS
+
+Puedes instalar la aplicación usando Homebrew (consulta la [definición de cask](https://github.com/th-ch/homebrew-youtube-music)):
+
+```bash
+brew install th-ch/youtube-music/youtube-music
+```
+
+Si instalas la aplicación manualmente y obtienes un error "está dañado y no se puede abrir" al iniciar la aplicación, ejecuta lo siguiente en la Terminal:
+
+```bash
+xattr -cr /Applications/YouTube\ Music.app
+```
+
+### Windows
+
+Puedes usar el [administrador de paquetes Scoop](https://scoop.sh) para instalar el paquete `youtube-music` desde
+el [`extras` bucket](https://github.com/ScoopInstaller/Extras).
+
+```bash
+scoop bucket add extras
+scoop install extras/youtube-music
+```
+
+Alternativamente, puedes usar [Winget](https://learn.microsoft.com/en-us/windows/package-manager/winget/), el administrador de paquetes CLI oficial de Windows 11 para instalar el paquete `th-ch.YouTubeMusic`.
+
+*Nota: Microsoft Defender SmartScreen podría bloquear la instalación ya que proviene de un "editor desconocido". Esto también esválido para la instalación manual al intentar ejecutar el ejecutable (.exe) después de una descarga manual aquí en GitHub (mismo archivo).*
+
+```bash
+winget install th-ch.YouTubeMusic
+```
+
+#### Cómo instalar sin conexión a Internet? (en Windows)
+
+- Descarga el archivo `*.nsis.7z` para _la arquitectura de tu dispositivo_ en la [página de lanzamientos](https://github.com/th-ch/youtube-music/releases/latest).
+    - `x64` para Windows de 64 bits
+    - `ia32` para Windows de 32 bits
+    - `arm64` para Windows ARM64
+- Descarga el instalador en la página de lanzamientos. (`*-Setup.exe`)
+- Colócalos en el **mismo directorio**.
+- Ejecuta el instalador.
+
+## Temas
+
+Puedes cargar archivos CSS para cambiar la apariencia de la aplicación (Opciones > Ajustes visuales > Tema).
+
+Algunos temas predefinidos están disponibles en https://github.com/kerichdev/themes-for-ytmdesktop-player.
+
+## Dev
+
+```bash
+git clone https://github.com/th-ch/youtube-music
+cd youtube-music
+pnpm install --frozen-lockfile
+pnpm dev
+```
+
+## Crea tus propios plugins
+
+Usando plugins, puedes:
+
+- manipular la aplicación - se pasa el `BrowserWindow` de electron al controlador del plugin
+- cambiar la interfaz manipulando el HTML/CSS
+
+### Creación de un plugin
+
+Crea una carpeta en `src/plugins/NOMBRE-DEL-PLUGIN`:
+
+- `index.ts`: el archivo principal del plugin
+```typescript
+import style from './style.css?inline'; // importar estilo como inline
+
+import { createPlugin } from '@/utils';
+
+export default createPlugin({
+  name: "Plugin Label",
+  restartNeeded: true, // si el valor es true, ytmusic muestra el diálogo de reinicio
+  config: {
+    enabled: false,
+  }, // tu configuración personalizada
+  stylesheets: [style], // tu estilo personalizado,
+  menu: async ({ getConfig, setConfig }) => {
+    // Todos los métodos *Config están envueltos en Promise<T>
+    const config = await getConfig();
+    return [
+      {
+        label: "menu",
+        submenu: [1, 2, 3].map((value) => ({
+          label: `value ${value}`,
+          type: "radio",
+          checked: config.value === value,
+          click() {
+            setConfig({ value });
+          },
+        })),
+      },
+    ];
+  },
+  backend: {
+    start({ window, ipc }) {
+      window.maximize();
+
+      // puedes comunicarte con el plugin de renderizado
+      ipc.handle("some-event", () => {
+        return "hello";
+      });
+    },
+    // se activa cuando cambia la configuración
+    onConfigChange(newConfig) { /* ... */ },
+    // se activa cuando se desactiva el plugin
+    stop(context) { /* ... */ },
+  },
+  renderer: {
+    async start(context) {
+      console.log(await context.ipc.invoke("some-event"));
+    },
+    // Solo disponible en el plugin de renderizado
+    onPlayerApiReady(api: YoutubePlayer, context: RendererContext) {
+      // establecer la configuración del plugin fácilmente
+      context.setConfig({ myConfig: api.getVolume() });
+    },
+    onConfigChange(newConfig) { /* ... */ },
+    stop(_context) { /* ... */ },
+  },
+  preload: {
+    async start({ getConfig }) {
+      const config = await getConfig();
+    },
+    onConfigChange(newConfig) {},
+    stop(_context) {},
+  },
+});
+
+```
+
+### Casos de uso comunes
+
+- inyectar CSS personalizado: crea un archivo `style.css` en la misma carpeta y luego:
+
+```typescript
+// index.ts
+import style from './style.css?inline'; // importar estilo como inline
+
+import { createPlugin } from '@/utils';
+
+export default createPlugin({
+    name: 'Plugin Label',
+    restartNeeded: true, // si el valor es true, ytmusic mostrará el diálogo de reinicio
+    config: {
+        enabled: false,
+    }, // tu configuración personalizada
+    stylesheets: [style], // tu estilo personalizado
+    renderer() {} // define el hook del renderizador
+});
+```
+
+- Si quieres cambiar el HTML:
+
+```typescript
+import { createPlugin } from '@/utils';
+
+export default createPlugin({
+    name: 'Plugin Label',
+    restartNeeded: true, // si el valor es true, ytmusic mostrará el diálogo de reinicio
+    config: {
+        enabled: false,
+    }, // tu configuración personalizada
+    renderer() {
+        // Elimina el botón de inicio de sesión
+        document.querySelector(".sign-in-link.ytmusic-nav-bar").remove();
+    } // define el hook del renderizador
+});
+```
+
+- comunicación entre el front y el back: se puede hacer utilizando el módulo ipcMain de electron. Ver archivo `index.ts` y
+    ejemplo en el plugin `sponsorblock`.
+
+## Compilar
+
+1. Clonar el repositorio
+2. Seguir [esta guía](https://pnpm.io/es/installation) para instalar `pnpm`
+3. Ejecutar `pnpm install --frozen-lockfile` para instalar las dependencias
+4. Ejecutar `pnpm build:OS`
+
+- `pnpm dist:win` - Windows
+- `pnpm dist:linux` - Linux (amd64)
+- `pnpm dist:linux:deb-arm64` - Linux (arm64 para Debian)
+- `pnpm dist:linux:rpm-arm64` - Linux (arm64 para Fedora)
+- `pnpm dist:mac` - macOS (amd64)
+- `pnpm dist:mac:arm64` - macOS (arm64)
+
+Construye la aplicación para macOS, Linux y Windows,
+utilizando [electron-builder](https://github.com/electron-userland/electron-builder).
+
+## Vista previa de producción
+
+```bash
+pnpm start
+```
+
+## Tests
+
+```bash
+pnpm test
+```
+
+Utiliza [Playwright](https://playwright.dev/) para probar la aplicación.
+
+## Licencia
+
+MIT © [th-ch](https://github.com/th-ch/youtube-music)
+
+## Preguntas frecuentes
+
+### ¿Por qué no se muestra el menú de aplicaciones?
+
+Si la opción `Ocultar menú` está activada - puedes mostrar el menú con la tecla <kbd>alt</kbd> (o <kbd>\`</kbd> [acento grave] si estás utilizando el plugin in-app-menu)

docs/readme/README-fr.md

@@ -0,0 +1,388 @@
+<div align="center">
+
+# YouTube Music
+
+[![GitHub release](https://img.shields.io/github/release/th-ch/youtube-music.svg?style=for-the-badge&logo=youtube-music)](https://github.com/th-ch/youtube-music/releases/)
+[![Licence GitHub](https://img.shields.io/github/license/th-ch/youtube-music.svg?style=for-the-badge)](https://github.com/th-ch/youtube-music/blob/master/LICENSE)
+[![style de code eslint](https://img.shields.io/badge/style_de_code-eslint-5ed9c7.svg?style=for-the-badge)](https://github.com/th-ch/youtube-music/blob/master/.eslintrc.js)
+[![Statut de la construction](https://img.shields.io/github/actions/workflow/status/th-ch/youtube-music/build.yml?branch=master&style=for-the-badge&logo=youtube-music)](https://GitHub.com/th-ch/youtube-music/releases/)
+[![Toutes les versions GitHub](https://img.shields.io/github/downloads/th-ch/youtube-music/total?style=for-the-badge&logo=youtube-music)](https://GitHub.com/th-ch/youtube-music/releases/)
+[![AUR](https://img.shields.io/aur/version/youtube-music-bin?color=blueviolet&style=for-the-badge&logo=youtube-music)](https://aur.archlinux.org/packages/youtube-music-bin)
+[![Vulnérabilités connues](https://snyk.io/test/github/th-ch/youtube-music/badge.svg)](https://snyk.io/test/github/th-ch/youtube-music)
+
+</div>
+
+![Capture d'écran](https://github.com/th-ch/youtube-music/raw/master/web/screenshot.jpg "Capture d'écran")
+
+
+<div align="center">
+	<a href="https://github.com/th-ch/youtube-music/releases/latest">
+		<img src="https://github.com/th-ch/youtube-music/raw/master/web/youtube-music.svg" width="400" height="100" alt="SVG YouTube Music">
+	</a>
+</div>
+
+
+**Enveloppe Electron autour de YouTube Music offrant :**
+
+- Aspect & sensation naturels, vise à conserver l'interface originale
+- Cadre pour les plugins personnalisés : modifiez YouTube Music selon vos besoins (style, contenu, fonctionnalités), activez/désactivez les plugins en
+  un clic
+
+## Image de démonstration
+
+|                          Écran du lecteur (thème de couleur de l'album & lumière ambiante)                                |
+|:---------------------------------------------------------------------------------------------------------:|
+|![Capture d'écran1](https://github.com/th-ch/youtube-music/assets/16558115/53efdf73-b8fa-4d7b-a235-b96b91ea77fc)|
+
+## Contenu
+
+- [Fonctionnalités](#fonctionnalités)
+- [Plugins disponibles](#plugins-disponibles)
+- [Traduction](#traduction)
+- [Téléchargement](#téléchargement)
+  - [Arch Linux](#arch-linux)
+  - [MacOS](#macos)
+  - [Windows](#windows)
+    - [Comment installer sans connexion réseau ? (sous Windows)](#comment-installer-sans-connexion-réseau-sous-windows)
+- [Thèmes](#thèmes)
+- [Dev](#dev)
+- [Créez vos propres plugins](#créez-vos-propres-plugins)
+  - [Créer un plugin](#créer-un-plugin)
+  - [Cas d'utilisation courants](#cas-dutilisation-courants)
+- [Construction](#construction)
+- [Aperçu de la production](#aperçu-de-la-production)
+- [Tests](#tests)
+- [Licence](#licence)
+- [FAQ](#faq)
+
+## Fonctionnalités :
+
+- **Confirmation automatique lors de la pause** (Toujours activé) : désactiver
+  la pop-up ["Continuer à regarder ?"](https://user-images.githubusercontent.com/61631665/129977894-01c60740-7ec6-4bf0-9a2c-25da24491b0e.png)
+  qui pause la musique après un certain temps
+
+ - Et plus encore ...
+
+## Plugins disponibles :
+
+- **Bloqueur de publicités** : Bloquez toutes les publicités et le suivi dès le départ
+  
+- **Actions d'album** : Ajoute des boutons Je n'aime pas, Dislike, J'aime, et Unlike pour appliquer cela à toutes les chansons dans une playlist ou un album
+
+- **Thème de couleur d'album** : Applique un thème dynamique et des effets visuels basés sur la palette de couleurs de l'album
+
+- **Mode Ambiant** : Applique un effet d'éclairage en projetant des couleurs douces de la vidéo, sur l'arrière-plan de votre écran
+
+- **Compresseur Audio** : Appliquer une compression audio (diminue le volume des parties les plus fortes du signal et augmente le
+  volume des parties les plus douces)
+
+- **Barre de navigation floue** : rend la barre de navigation transparente et floue
+
+- **Contournement des restrictions d'âge** : contourner la vérification d'âge de YouTube
+
+- **Sélecteur de sous-titres** : Activer les sous-titres
+
+- **Barre latérale compacte** : Toujours définir la barre latérale en mode compact
+
+- **Fondu enchaîné** : Fondu enchaîné entre les chansons
+
+- **Désactiver la lecture automatique** : Fait démarrer chaque chanson en mode "pause"
+
+- **[Discord](https://discord.com/) Présence riche** : Montrez à vos amis ce que vous écoutez
+  avec [Présence riche](https://user-images.githubusercontent.com/28219076/104362104-a7a0b980-5513-11eb-9744-bb89eabe0016.png)
+
+- **Téléchargeur** : télécharge des
+  MP3 [directement depuis l'interface](https://user-images.githubusercontent.com/61631665/129977677-83a7d067-c192-45e1-98ae-b5a4927393be.png) [(youtube-dl)](https://github.com/ytdl-org/youtube-dl)
+
+- **Volume exponentiel** : Rend le curseur de volume
+  [exponentiel](https://greasyfork.org/en/scripts/397686-youtube-music-fix-volume-ratio/) afin qu'il soit plus facile de
+  sélectionner des volumes plus bas
+
+- **Menu In-App** : [donne aux barres un aspect chic et sombre](https://user-images.githubusercontent.com/78568641/112215894-923dbf00-8c29-11eb-95c3-3ce15db27eca.png)
+
+  > (voir [ce poste](https://github.com/th-ch/youtube-music/issues/410#issuecomment-952060709) si vous avez des problèmes
+  pour accéder au menu après avoir activé ce plugin et l'option masquer-menu)
+
+- **Scrobbler** : Ajoute le support de scrobbling pour [Last.fm](https://www.last.fm/) et [ListenBrainz](https://listenbrainz.org/)
+
+- **Lumia Stream** : Ajoute le support de [Lumia Stream](https://lumiastream.com/)
+
+- **Lyrics Genius** : Ajoute le support des paroles pour la plupart des chansons
+
+- **Musique Ensemble** : Partagez une playlist avec d'autres. Lorsque l'hôte joue une chanson, tout le monde entendra la même chanson
+
+- **Navigation** : Flèches de navigation Suivant/Retour directement intégrées dans l'interface, comme dans votre navigateur préféré
+
+- **Pas de connexion Google** : Supprime les boutons et les liens de connexion Google de l'interface
+
+- **Notifications** : Affiche une notification lorsqu'une chanson commence à jouer ([notifications interactives](https://user-images.githubusercontent.com/78568641/114102651-63ce0e00-98d0-11eb-9dfe-c5a02bb54f9c.png)
+  sont disponibles sur Windows)
+
+- **Image dans l'image** : permet de passer l'application en mode image dans l'image
+
+- **Vitesse de lecture** : Écoutez rapidement, écoutez lentement ! [Ajoute un curseur qui contrôle la vitesse des chansons](https://user-images.githubusercontent.com/61631665/129976003-e55db5ba-bf42-448c-a059-26a009775e68.png)
+
+- **Volume précis** : Contrôlez le volume précisément en utilisant la molette de la souris/raccourcis clavier, avec un hud personnalisé et des étapes de volume personnalisables
+
+- **Raccourcis (& MPRIS)** : Permet de définir des raccourcis globaux pour la lecture (lecture/pause/suivant/précédent) +
+  désactive [osd média](https://user-images.githubusercontent.com/84923831/128601225-afa38c1f-dea8-4209-9f72-0f84c1dd8b54.png)
+  en remplaçant les touches multimédias + activer Ctrl/CMD + F pour rechercher + activer le support mpris linux pour
+  les touches multimédias + [raccourcis personnalisés](https://github.com/Araxeus/youtube-music/blob/1e591d6a3df98449bcda6e63baab249b28026148/providers/song-controls.js#L13-L50)
+  pour [utilisateurs avancés](https://github.com/th-ch/youtube-music/issues/106#issuecomment-952156902)
+
+- **Passer la chanson non aimée** : passe les chansons non aimées
+
+- **Passer les silences** : passe automatiquement les sections silencieuses
+
+- [**SponsorBlock**](https://github.com/ajayyy/SponsorBlock) : Saute automatiquement les parties non musicales comme les intros/outros ou
+  les parties des clips vidéo où la chanson n'est pas jouée
+
+- **Contrôle multimédia de la barre des tâches** : Contrôlez la lecture depuis
+  votre [barre des tâches Windows](https://user-images.githubusercontent.com/78568641/111916130-24a35e80-8a82-11eb-80c8-5021c1aa27f4.png)
+
+- **TouchBar** : Disposition personnalisée de la TouchBar pour macOS
+
+- **Tuna OBS** : Intégration avec le
+  plugin [Tuna](https://obsproject.com/forum/resources/tuna.843/) d'[OBS](https://obsproject.com/)
+
+- **Changeur de qualité vidéo** : Permet de changer la qualité vidéo avec
+  un [bouton](https://user-images.githubusercontent.com/78568641/138574366-70324a5e-2d64-4f6a-acdd-dc2a2b9cecc5.png) sur
+  l'overlay vidéo
+
+- **Bascule vidéo** : Ajoute
+  un [bouton](https://user-images.githubusercontent.com/28893833/173663950-63e6610e-a532-49b7-9afa-54cb57ddfc15.png) pour
+  basculer entre le mode Vidéo/Chanson. peut également supprimer l'onglet vidéo entier
+
+- **Visualiseur** : Différents visualiseurs musicaux
+
+## Traduction
+
+Vous pouvez aider à la traduction sur [Hosted Weblate](https://hosted.weblate.org/projects/youtube-music/).
+
+<a href="https://hosted.weblate.org/engage/youtube-music/">
+  <img src="https://hosted.weblate.org/widget/youtube-music/i18n/multi-auto.svg" alt="statut de la traduction" />
+  <img src="https://hosted.weblate.org/widget/youtube-music/i18n/287x66-black.png" alt="statut de la traduction 2" />
+</a>
+
+## Téléchargement
+
+Vous pouvez consulter la [dernière sortie](https://github.com/th-ch/youtube-music/releases/latest) pour trouver rapidement la
+dernière version.
+
+### Arch Linux
+
+Installez le paquet [`youtube-music-bin`](https://aur.archlinux.org/packages/youtube-music-bin) depuis l'AUR. Pour les instructions d'installation de l'AUR, consultez
+cette [page wiki](https://wiki.archlinux.org/index.php/Arch_User_Repository#Installing_packages).
+
+### MacOS
+
+Vous pouvez installer l'application en utilisant Homebrew (voir la [définition du fût](https://github.com/th-ch/homebrew-youtube-music)) :
+
+```bash
+brew install th-ch/youtube-music/youtube-music
+```
+
+Si vous installez l'application manuellement et obtenez une erreur "est endommagé et ne peut pas être ouvert." lors du lancement de l'application, exécutez ce qui suit dans le Terminal :
+
+```bash
+xattr -cr /Applications/YouTube\ Music.app
+```
+
+### Windows
+
+Vous pouvez utiliser le [gestionnaire de paquets Scoop](https://scoop.sh) pour installer le paquet `youtube-music` depuis le [seau `extras`](https://github.com/ScoopInstaller/Extras).
+
+```bash
+scoop bucket add extras
+scoop install extras/youtube-music
+```
+
+Alternativement, vous pouvez utiliser [Winget](https://learn.microsoft.com/fr-fr/windows/package-manager/winget/), le gestionnaire de paquets CLI officiel de Windows 11, pour installer le paquet `th-ch.YouTubeMusic`.
+
+*Note : Microsoft Defender SmartScreen pourrait bloquer l'installation car elle provient d'un "éditeur inconnu". Ceci est également vrai pour l'installation manuelle lors de l'essai d'exécution de l'exécutable (.exe) après un téléchargement manuel ici sur GitHub (même fichier).*
+
+```bash
+winget install th-ch.YouTubeMusic
+```
+
+#### Comment installer sans connexion réseau ? (sous Windows)
+
+- Téléchargez le fichier `*.nsis.7z` pour _l'architecture de votre appareil_ sur la [page des versions](https://github.com/th-ch/youtube-music/releases/latest).
+  - `x64` pour Windows 64 bits
+  - `ia32` pour Windows 32 bits
+  - `arm64` pour Windows ARM64
+- Téléchargez l'installeur sur la page des versions. (`*-Setup.exe`)
+- Placez-les dans le **même dossier**.
+- Exécutez l'installeur.
+
+## Thèmes
+
+Vous pouvez charger des fichiers CSS pour changer l'apparence de l'application (Options > Ajustements visuels > Thèmes).
+
+Certains thèmes prédéfinis sont disponibles sur [https://github.com/kerichdev/themes-for-ytmdesktop-player](https://github.com/kerichdev/themes-for-ytmdesktop-player).
+
+## Dev
+
+```bash
+git clone https://github.com/th-ch/youtube-music
+cd youtube-music
+pnpm install --frozen-lockfile
+pnpm dev
+```
+## Créez vos propres plugins
+
+En utilisant des plugins, vous pouvez :
+
+- manipuler l'application - la `BrowserWindow` d'Electron est passée au gestionnaire de plugin
+- changer le front en manipulant le HTML/CSS
+
+### Créer un plugin
+
+Créez un dossier dans `src/plugins/NOM-DE-VOTRE-PLUGIN` :
+
+- `index.ts` : le fichier principal du plugin
+```typescript
+import style from './style.css?inline'; // importez le style comme inline
+
+import { createPlugin } from '@/utils';
+
+export default createPlugin({
+  name: 'Étiquette du plugin',
+  restartNeeded: true, // si la valeur est vraie, ytmusic affichera la boîte de dialogue de redémarrage
+  config: {
+    enabled: false,
+  }, // votre configuration personnalisée
+  stylesheets: [style], // votre style personnalisé,
+  menu: async ({ getConfig, setConfig }) => {
+    // Toutes les méthodes *Config sont des promesses encapsulées <T>
+    const config = await getConfig();
+    return [
+      {
+        label: 'menu',
+        submenu: [1, 2, 3].map((value) => ({
+          label: `valeur ${value}`,
+          type: 'radio',
+          checked: config.value === value,
+          click() {
+            setConfig({ value });
+          },
+        })),
+      },
+    ];
+  },
+  backend: {
+    start({ window, ipc }) {
+      window.maximize();
+
+      // vous pouvez communiquer avec le plugin du rendu
+      ipc.handle('un événement', () => {
+        return 'bonjour';
+      });
+    },
+    // il est déclenché lorsque la configuration change
+    onConfigChange(newConfig) { /* ... */ },
+    // il est déclenché lorsque le plugin est désactivé
+    stop(context) { /* ... */ },
+  },
+  renderer: {
+    async start(context) {
+      console.log(await context.ipc.invoke('un événement'));
+    },
+    // Seul le crochet disponible pour le rendu
+    onPlayerApiReady(api: YoutubePlayer, context: RendererContext) {
+      // définir facilement la configuration du plugin
+      context.setConfig({ myConfig: api.getVolume() });
+    },
+    onConfigChange(newConfig) { /* ... */ },
+    stop(_context) { /* ... */ },
+  },
+  preload: {
+    async start({ getConfig }) {
+      const config is obtained by `getConfig` method.
+    },
+    onConfigChange(newConfig) {},
+    stop(_context) {},
+  },
+});
+
+```
+
+### Cas d'utilisation courants
+
+- **Injection de CSS personnalisé** : créez un fichier `style.css` dans le même dossier puis :
+
+```typescript
+// index.ts
+import style from './style.css?inline'; // importez le style comme en ligne
+
+import { createPlugin } from '@/utils';
+
+export default createPlugin({
+  name: 'Étiquette du plugin',
+  restartNeeded: true, // si la valeur est vraie, ytmusic affichera la boîte de dialogue de redémarrage
+  config: {
+    enabled: false,
+  }, // votre configuration personnalisée
+  stylesheets: [style], // votre style personnalisé
+  renderer() {} // définissez le crochet de rendu
+});
+```
+
+- **Si vous voulez modifier le HTML** :
+
+```typescript
+import { createPlugin } from '@/utils';
+
+export default createPlugin({
+  name: 'Étiquette du plugin',
+  restartNeeded: true, // si la valeur est vraie, ytmusic affichera la boîte de dialogue de redémarrage
+  config: {
+    enabled: false,
+  }, // votre configuration personnalisée
+  renderer() {
+    // Supprimez le bouton de connexion
+    document.querySelector(".sign-in-link.ytmusic-nav-bar").remove();
+  } // définissez le crochet de rendu
+});
+
+```
+
+- **Communication entre le front et le back** : cela peut se faire en utilisant le module ipcMain d'Electron. Voir le fichier `index.ts` et l'exemple dans le plugin `sponsorblock`.
+
+## Construction
+
+1. Clonez le dépôt
+2. Suivez [ce guide](https://pnpm.io/installation) pour installer `pnpm`
+3. Exécutez `pnpm install --frozen-lockfile` pour installer les dépendances
+4. Exécutez `pnpm build:OS`
+
+- `pnpm dist:win` - pour Windows
+- `pnpm dist:linux` - pour Linux
+- `pnpm dist:mac` - pour MacOS
+
+Construit l'application pour macOS, Linux et Windows,
+en utilisant [electron-builder](https://github.com/electron-userland/electron-builder).
+
+## Aperçu de la production
+
+```bash
+pnpm start
+```
+
+## Tests
+
+```bash
+pnpm test
+```
+
+Utilise [Playwright](https://playwright.dev/) pour tester l'application.
+
+## Licence
+
+MIT © [th-ch](https://github.com/th-ch/youtube-music)
+
+## FAQ
+
+### Pourquoi le menu de l'application ne s'affiche-t-il pas ?
+
+Si l'option `Masquer le menu` est activée - vous pouvez afficher le menu avec la touche <kbd>alt</kbd> (ou <kbd>\`</kbd> [backtick] si vous utilisez le plugin du menu intégré)

docs/readme/README-is.md

@@ -0,0 +1,388 @@
+<div align="center">
+
+# YouTube Tónlist
+
+[![GitHub release](https://img.shields.io/github/release/th-ch/youtube-music.svg?style=for-the-badge&logo=youtube-music)](https://github.com/th-ch/youtube-music/releases/)
+[![GitHub license](https://img.shields.io/github/license/th-ch/youtube-music.svg?style=for-the-badge)](https://github.com/th-ch/youtube-music/blob/master/LICENSE)
+[![eslint code style](https://img.shields.io/badge/code_style-eslint-5ed9c7.svg?style=for-the-badge)](https://github.com/th-ch/youtube-music/blob/master/.eslintrc.js)
+[![Build status](https://img.shields.io/github/actions/workflow/status/th-ch/youtube-music/build.yml?branch=master&style=for-the-badge&logo=youtube-music)](https://GitHub.com/th-ch/youtube-music/releases/)
+[![GitHub All Releases](https://img.shields.io/github/downloads/th-ch/youtube-music/total?style=for-the-badge&logo=youtube-music)](https://GitHub.com/th-ch/youtube-music/releases/)
+[![AUR](https://img.shields.io/aur/version/youtube-music-bin?color=blueviolet&style=for-the-badge&logo=youtube-music)](https://aur.archlinux.org/packages/youtube-music-bin)
+[![Known Vulnerabilities](https://snyk.io/test/github/th-ch/youtube-music/badge.svg)](https://snyk.io/test/github/th-ch/youtube-music)
+
+</div>
+
+![Screenshot](../../web/screenshot.jpg "Screenshot")
+
+
+<div align="center">
+	<a href="https://github.com/th-ch/youtube-music/releases/latest">
+		<img src="../../web/youtube-music.svg" width="400" height="100" alt="YouTube Music SVG">
+	</a>
+</div>
+
+**Electron umbúðir utan um YouTube Tónlist sem inniheldur:**
+
+- Innfæddur útlit og tilfinning, miðar að því að halda upprunalegu viðmótinu
+- Rammi fyrir sérsniðnar tengiforrit: breyttu YouTube Tónlist að þínum þörfum (stíl, efni, eiginleikar), virkjaðu/slökktu á viðbætur í
+   einn smellur
+
+## Sýnishornsmynd
+
+|                          Spilaraskjár (albúmslitaþema & umhverfisljós)                                         |
+|:---------------------------------------------------------------------------------------------------------:|
+|![Screenshot1](https://github.com/th-ch/youtube-music/assets/16558115/53efdf73-b8fa-4d7b-a235-b96b91ea77fc)|
+
+## Efni
+
+- [Eiginleikar](#eiginleikar)
+- [Tiltæk tengiforrit](#tiltæk-tengiforrit)
+- [Þýðing](#þýðing)
+- [Sækja](#sækja)
+  - [Arch Linux](#arch-linux)
+  - [MacOS](#macos)
+  - [Windows](#windows)
+    - [Hvernig á að setja upp án nettengingar? (í Windows)](#hvernig-á-að-setja-upp-án-nettengingar-í-windows)
+- [Þemu](#þemu)
+- [Þróun](#þróun)
+- [Búðu til þín eigin viðbætur](#búðu-til-þín-eigin-viðbætur)
+  - [Er að búa til viðbót](#er-að-búa-til-viðbót)
+  - [Algeng notkunartilvik](#algeng-notkunartilvik)
+- [Byggja](#byggja)
+- [Framleiðsluforskoðun](#framleiðsluforskoðun)
+- [Prófanir](#prófanir)
+- [Leyfi](#leyfi)
+- [Algengustu spurningar](#algengustu-spurningar)
+
+## Eiginleikar:
+
+- **Sjálfvirk staðfesting þegar gert er hlé** (Alltaf virkt): slökkva á
+   ["Halda áfram að horfa?"](https://user-images.githubusercontent.com/61631665/129977894-01c60740-7ec6-4bf0-9a2c-25da24491b0e.png)
+   popup sem gerir hlé á tónlist eftir ákveðinn tíma
+
+ - Og meira...
+
+## Tiltæk tengiforrit:
+
+- **Auglýsingablokkari**: Lokaðu fyrir allar auglýsingar og rakningar úr kassanum
+  
+- **Albúmsaðgerðir**: Bætir Ódíslika, Mislíkt, Líkt, og Ólíkt til að nota þetta á öll lög á spilunarlista eða albúm
+
+- **Albúmslitaþema**: Beitir kraftmikið þema og sjónrænum áhrifum sem byggjast á litavali albúmsins
+
+- **Umhverfishamur**: Beitir lýsingaráhrifum með því að varpa mildum litum úr myndbandinu í bakgrunn skjásins
+
+- **Hljóðþjöppur**: Notaðu þjöppun á hljóð (lækkar hljóðstyrk háværustu hluta merkis og hækkar hljóðstyrk í mýkstu hlutunum)
+
+- **Þoka Leiðsagnarstika**: Gerir leiðsögustikuna gagnsæja og óskýrt
+
+- **Farið Framhjá Aldurstakmörkunum**: Framhjá aldursstaðfestingu YouTube
+
+- **Yfirskriftarval**: Virkja skjátexta
+
+- **Fyrirferðarlítillhliðarstika**: Stilltu hliðarstikuna alltaf í þétta stillingu
+
+- **Krossfæra**: Krossfæra á milli lög
+
+- **Slökkva á Sjálfvirkri Spilun**: Gerir lag að byrja í "hlé" ham
+
+- **[Discord](https://discord.com/) Rík Nærveru**: Sýndu vinum þínum hvað þú hlustar á
+   með [Rík Nærveru](https://user-images.githubusercontent.com/28219076/104362104-a7a0b980-5513-11eb-9744-bb89eabe0016.png)
+
+- **Niðurhalari**: Niðurhalum
+MP3 [beint úr viðmótinu](https://user-images.githubusercontent.com/61631665/129977677-83a7d067-c192-45e1-98ae-b5a4927393be.png) [(youtube-dl)](https://github.com/ytdl-org/youtube-dl)
+
+- **Veldibundiðrúmmál**: Gerir hljóðstyrkssleðann [veldisvísis](https://greasyfork.org/en/scripts/397686-youtube-music-fix-volume-ratio/)
+  svo það er auðveldara að velja lægra hljóðstyrk.
+
+- **Valmynd í Forriti**: [Gefur börum flott, dökkt útlit](https://user-images.githubusercontent.com/78568641/112215894-923dbf00-8c29-11eb-95c3-3ce15db27eca.png)
+
+  > (sjá [þessa færslu](https://github.com/th-ch/youtube-music/issues/410#issuecomment-952060709) ef þú átt í vandræðum
+  með að fá aðgang að valmyndinni eftir að hafa virkjað þessa viðbót og fela valmyndarvalkostinn)
+
+- **Scrobbler**: Bætir við scrobbling stuðningi fyrir [Last.fm](https://www.last.fm/) og [ListenBrainz](https://listenbrainz.org/)
+
+- **Lumia Stream**: Bætir við [Lumia Stream](https://lumiastream.com/) stuðningi
+
+- **Söngtexti Snilld**: Bætir stuðningi við texta fyrir flest lög
+
+- **Tónlist Saman**: Deila spilunarlista með öðrum. Þegar gestgjafinn spilar lag munu allir aðrir heyra sama lagið
+
+- **Leiðsögn**: Næsta/Til baka leiðsagnarörvar beint samþættar í viðmótinu, eins og í uppáhalds vafranum þínum
+
+- **Engin Google Innskráning**: Fjarlægðu Google innskráningarhnappa og tengla úr viðmótinu
+
+- **Tilkynningar**: Birta tilkynningu þegar lag byrjar að spila
+  ([gagnvirkartilkynningar](https://user-images.githubusercontent.com/78568641/114102651-63ce0e00-98d0-11eb-9dfe-c5a02bb54f9c.png) eru fáanlegar á Windows)
+
+- **Mynd-í-Mynd**: Gerir kleift að skipta forritinu yfir í mynd-í-mynd stillingu
+
+- **Spilunarhraði**: Hlustaðu hratt, hlustaðu hægt!
+  [Bætir við sleða sem stjórnar lagahraðanum](https://user-images.githubusercontent.com/61631665/129976003-e55db5ba-bf42-448c-a059-26a009775e68.png)
+
+- **Nákvæmshljóðstyrkur**: Stjórnaðu hljóðstyrknum nákvæmlega með músarhjóli/hraðtökkum, með sérsniðnum HUD og sérsniðnum hljóðstyrksþrepum
+
+- **Flýtileiðir (og MPRIS)**: Leyfir að stilla alþjóðlegarflýtilyklar fyrir spilun (spila/gera hlé/næsta/fyrri) +
+   óvirkja [media osd](https://user-images.githubusercontent.com/84923831/128601225-afa38c1f-dea8-4209-9f72-0f84c1dd8b54.png)
+   með því að hnekkja miðlunarlyklum + virkja Ctrl/CMD + F til að leita + virkja linux mpris stuðning fyrir
+   miðlunarlyklar + [sérsniðnir flýtilyklar](https://github.com/Araxeus/youtube-music/blob/1e591d6a3df98449bcda6e63baab249b28026148/providers/song-controls.js#L13-L50)
+   fyrir [háþróaða notendur](https://github.com/th-ch/youtube-music/issues/106#issuecomment-952156902)
+- **Slepptu Lögum sem Mislíkuðust**: Sleppir mislíkaði lög
+
+- **Slepptu Þögnum**: Slepptu sjálfkrafa þagnarköflum í lögum
+
+- [**Styrktarblokk**](https://github.com/ajayyy/SponsorBlock): Sleppur sjálfkrafa hlutum sem ekki eru tónlist, eins og inngangur/lok
+  eða hlutar af tónlistarmyndböndum þar sem lag er ekki að spila
+
+- **Miðlunarstýringarverkefnastikunnar**: Stjórnaðu spilun frá [Windows verkefnastikunni þinni](https://user-images.githubusercontent.com/78568641/111916130-24a35e80-8a82-11eb-80c8-5021c1aa27f4.png)
+
+- **Snertistiku**: Sérsniðið Snertistikuútlit fyrir macOS
+
+- **Tuna OBS**: Samþætting við [OBS](https://obsproject.com/)
+  viðbótina [Tuna](https://obsproject.com/forum/resources/tuna.843/)
+
+- **Myndbandgæðisbreyting**: Leyfir að breyta myndbandgæðum með
+  [hnappi](https://user-images.githubusercontent.com/78568641/138574366-70324a5e-2d64-4f6a-acdd-dc2a2b9cecc5.png) á
+  myndbandsyfirlaginu
+
+- **Myndbandsrofi**: Bætir við [hnappi](https://user-images.githubusercontent.com/28893833/173663950-63e6610e-a532-49b7-9afa-54cb57ddfc15.png) til
+  að skipta á milli myndbands/lagshams. Getur einnig valfrjálst fjarlægt allan myndbandsflipann
+
+- **Sjónrænir**: Mismunandi tónlist sjónrænir
+
+## Þýðing
+
+Þú getur aðstoðað við þýðingar á [Hosted Weblate](https://hosted.weblate.org/projects/youtube-music/).
+
+<a href="https://hosted.weblate.org/engage/youtube-music/">
+  <img src="https://hosted.weblate.org/widget/youtube-music/i18n/multi-auto.svg" alt="translation status" />
+  <img src="https://hosted.weblate.org/widget/youtube-music/i18n/287x66-black.png" alt="translation status 2" />
+</a>
+
+## Sækja
+
+Þú getur skoðað [nýjustu útgáfuna](https://github.com/th-ch/youtube-music/releases/latest) til að finna fljótt
+nýjustu útgáfuna.
+
+### Arch Linux
+
+Settu upp [`youtube-music-bin`](https://aur.archlinux.org/packages/youtube-music-bin) pakkann frá AUR. Fyrir AUR uppsetningarleiðbeiningar skaltu skoða
+þessa [wiki síðu](https://wiki.archlinux.org/index.php/Arch_User_Repository#Installing_packages).
+
+### MacOS
+
+Þú getur sett upp appið með því að nota Homebrew (sjá [cask skilgreiningu](https://github.com/th-ch/homebrew-youtube-music))
+
+```bash
+brew install th-ch/youtube-music/youtube-music
+```
+
+Ef þú setur upp forritið handvirkt og færð villu "er skemmd og ekki er hægt að opna það," þegar þú ræsir forritið skaltu keyra eftirfarandi í flugstöðinni:
+
+```bash
+xattr -cr /Applications/YouTube\ Music.app
+```
+
+### Windows
+
+Þú getur notað [Scoop pakkastjórnun](https://scoop.sh) til að setja upp `youtube-music` pakkann frá
+[`extras` fötunni](https://github.com/ScoopInstaller/Extras).
+
+```bash
+scoop bucket add extras
+scoop install extras/youtube-music
+```
+
+Að öðrum kosti geturðu notað [Winget](https://learn.microsoft.com/en-us/windows/package-manager/winget/), Windows 11s
+opinber CLI pakkastjóri til að setja upp `th-ch.YouTubeMusic` pakkann.
+
+*Athugið: Microsoft Defender SmartScreen gæti lokað uppsetningunni þar sem hún er frá „óþekktum útgefanda“. Þetta er einnig
+satt fyrir handvirka uppsetningu þegar reynt er að keyra executable(.exe) eftir handvirkt niðurhal hér á github (sama
+skrá).*
+
+```bash
+winget install th-ch.YouTubeMusic
+```
+
+#### Hvernig á að setja upp án nettengingar? (í Windows)
+
+- Sæktu `*.nsis.7z` skrána fyrir _arkitektúr tækisins þíns_ á [útgáfusíðu](https://github.com/th-ch/youtube-music/releases/latest).
+   - `x64` fyrir 64-bita Windows
+   - `ia32` fyrir 32-bita Windows
+   - `arm64` fyrir ARM64 Windows
+- Sæktu uppsetningarforrit á útgáfusíðu. (`*-Setup.exe`)
+- Settu þær í **sömu möppuna**.
+- Keyrðu uppsetningarforritið.
+
+## Þemu
+
+Þú getur hlaðið CSS skrám til að breyta útliti forritsins (Valkostir > Sjónræn klip > Þemu).
+
+Sum fyrirframskilgreind þemu eru fáanleg á https://github.com/kerichdev/themes-for-ytmdesktop-player.
+
+## Þróun
+
+```bash
+git clone https://github.com/th-ch/youtube-music
+cd youtube-music
+pnpm install --frozen-lockfile
+pnpm dev
+```
+
+## Búðu til þín eigin tengiforrit
+
+Með því að nota tengiforrit geturðu:
+
+- vinna með appið - `BrowserWindow` frá electron er sent til tengiforritsstjórans
+- breyttu framhliðinni með því að vinna með HTML/CSS
+
+### Er að búa til tengiforrit
+
+Búðu til möppu í `src/plugins/YOUR-PLUGIN-NAME`:
+
+- `index.ts`: aðal skránni af tengiforritið
+```typescript
+import style from './style.css?inline'; // flytja inn stíl sem inline
+
+import { createPlugin } from '@/utils';
+
+export default createPlugin({
+  name: 'Plugin Label',
+  restartNeeded: true, // ef gildi er satt, ytmusic sjá endurræsa gluggann
+  config: {
+    enabled: false,
+  }, // sérsniðnastillingar þinn
+  stylesheets: [style], // sérsniðnastílinn þinn
+  menu: async ({ getConfig, setConfig }) => {
+    // Allar *stillingaraðferðir eru umvafnar Lofor<T>
+    const config = await getConfig();
+    return [
+      {
+        label: 'menu',
+        submenu: [1, 2, 3].map((value) => ({
+          label: `value ${value}`,
+          type: 'radio',
+          checked: config.value === value,
+          click() {
+            setConfig({ value });
+          },
+        })),
+      },
+    ];
+  },
+  backend: {
+    start({ window, ipc }) {
+      window.maximize();
+
+      // þú getur tengst við renderer tengiforritið
+      ipc.handle('some-event', () => {
+        return 'hello';
+      });
+    },
+    // það kviknaði þegar stillingum var breytt
+    onConfigChange(newConfig) { /* ... */ },
+    // it fired when plugin disabled
+    stop(context) { /* ... */ },
+  },
+  renderer: {
+    async start(context) {
+      console.log(await context.ipc.invoke('some-event'));
+    },
+    // Aðeins krókur sem er í boði fyrir renderer
+    onPlayerApiReady(api: YoutubePlayer, context: RendererContext) {
+      // stilltu stillingar viðbótarinnar auðveldlega
+      context.setConfig({ myConfig: api.getVolume() });
+    },
+    onConfigChange(newConfig) { /* ... */ },
+    stop(_context) { /* ... */ },
+  },
+  preload: {
+    async start({ getConfig }) {
+      const config = await getConfig();
+    },
+    onConfigChange(newConfig) {},
+    stop(_context) {},
+  },
+});
+```
+
+### Algeng notkunartilvik
+
+- er að sprauta sérsniðnum CSS: búðu til `style.css` skrá í sömu möppu þá:
+
+```typescript
+// index.ts
+import style from './style.css?inline'; // flytja inn stíl sem inline
+
+import { createPlugin } from '@/utils';
+
+export default createPlugin({
+  name: 'Plugin Label',
+  restartNeeded: true, // ef gildi er satt, ytmusic sjá endurræsa gluggann
+  config: {
+    enabled: false,
+  }, // sérsniðnastillingar þinn
+  stylesheets: [style], // sérsniðnastílinn þinn
+  renderer() {} // skilgreina renderer krók
+});
+```
+
+- Ef þú vilt breyta HTML:
+
+```typescript
+import { createPlugin } from '@/utils';
+
+export default createPlugin({
+  name: 'Plugin Label',
+  restartNeeded: true, // ef gildi er satt, ytmusic sjá endurræsa gluggann
+  config: {
+    enabled: false,
+  }, // sérsniðnastillingar þinn
+  renderer() {
+    // Fjarlægðu innskráningarhnappinn
+    document.querySelector(".sign-in-link.ytmusic-nav-bar").remove();
+  } // skilgreina renderer krók
+});
+```
+
+- samskipti á milli að framan og aftan: hægt að gera með því að nota ipcMain eininguna frá electron. Sjá `index.ts` skrá og
+   dæmi í 'styrktarblokk' tengiforritinu.
+
+## Byggja
+
+1. Klóna geymsluna
+2. Fylgdu [þessa handbók](https://pnpm.io/installation) til að setja upp 'pnpm'
+3. Keyrðu `pnpm install --frozen-lockfile` til að setja upp ósjálfstæði
+4. Keyrðu `pnpm build:OS`
+
+- `pnpm dist:win` - Windows
+- `pnpm dist:linux` - Linux
+- `pnpm dist:mac` - MacOS
+
+Byggir appið fyrir macOS, Linux og Windows,
+með því að nota [electron-builder](https://github.com/electron-userland/electron-builder).
+
+## Framleiðsluforskoðun
+
+```bash
+pnpm start
+```
+
+## Prófanir
+
+```bash
+pnpm test
+```
+
+Notar [Playwright](https://playwright.dev/) til að prófa forritið.
+
+## Leyfi
+
+MIT © [th-ch](https://github.com/th-ch/youtube-music)
+
+## Algengustu Spurningar
+
+### Hvers vegna forritavalmynd birtist ekki?
+
+Ef valmöguleikinn „Fela valmynd“ er á - þú getur sýnt valmyndina með <kbd>alt</kbd> lyklinum (eða <kbd>\`</kbd> [bakka]
+ef þú notar viðbótina fyrir valmynd í forriti)

docs/readme/README-ko.md

@@ -0,0 +1,348 @@
+<div align="center">
+
+# 유튜브 뮤직 (YouTube Music)
+
+[![GitHub release](https://img.shields.io/github/release/th-ch/youtube-music.svg?style=for-the-badge&logo=youtube-music)](https://github.com/th-ch/youtube-music/releases/)
+[![GitHub license](https://img.shields.io/github/license/th-ch/youtube-music.svg?style=for-the-badge)](https://github.com/th-ch/youtube-music/blob/master/LICENSE)
+[![eslint code style](https://img.shields.io/badge/code_style-eslint-5ed9c7.svg?style=for-the-badge)](https://github.com/th-ch/youtube-music/blob/master/.eslintrc.js)
+[![Build status](https://img.shields.io/github/actions/workflow/status/th-ch/youtube-music/build.yml?branch=master&style=for-the-badge&logo=youtube-music)](https://GitHub.com/th-ch/youtube-music/releases/)
+[![GitHub All Releases](https://img.shields.io/github/downloads/th-ch/youtube-music/total?style=for-the-badge&logo=youtube-music)](https://GitHub.com/th-ch/youtube-music/releases/)
+[![AUR](https://img.shields.io/aur/version/youtube-music-bin?color=blueviolet&style=for-the-badge&logo=youtube-music)](https://aur.archlinux.org/packages/youtube-music-bin)
+[![Known Vulnerabilities](https://snyk.io/test/github/th-ch/youtube-music/badge.svg)](https://snyk.io/test/github/th-ch/youtube-music)
+
+</div>
+
+![Screenshot](../../web/screenshot.jpg "Screenshot")
+
+<div align="center">
+	<a href="https://github.com/th-ch/youtube-music/releases/latest">
+		<img src="../../web/youtube-music.svg" width="400" height="100" alt="YouTube Music SVG">
+	</a>
+</div>
+
+**유튜브 뮤직의 Electron 래퍼; 기능:**
+
+- 원래의 인터페이스를 유지하는 것을 목표로 하는 네이티브 디자인 및 느낌
+- 맞춤 플러그인을 위한 프레임워크: 스타일, 콘텐츠, 기능 등 필요에 따라 유튜브 뮤직을 변경하고, 클릭 한 번으로 플러그인을 활성화/비활성화할 수 있습니다.
+
+## Content
+
+- [기능](#기능)
+- [사용 가능한 플러그인](#사용-가능한-플러그인)
+- [번역](#번역)
+- [다운로드](#다운로드)
+  - [Arch Linux](#arch-linux)
+  - [MacOS](#macos)
+  - [Windows](#windows)
+    - [(Windows에서) 네트워크에 연결하지 않고 설치하는 방법은 무엇인가요?](#windows에서-네트워크에-연결하지-않고-설치하는-방법은-무엇인가요)
+- [테마](#테마)
+- [개발](#개발)
+- [나만의 플러그인 만들기](#나만의-플러그인-만들기)
+  - [플러그인 만들기](#플러그인-만들기)
+  - [일반적인 사용 예](#일반적인-사용-예)
+- [빌드](#빌드)
+- [프로덕션 빌드 미리보기](#프로덕션-빌드-미리보기)
+- [테스트](#테스트)
+- [라이선스](#라이선스)
+- [자주 묻는 질문](#자주-묻는-질문)
+
+## 기능:
+
+- **일시 정지 시 자동 확인** (항상 활성화 됨): 일정 시간이 지나면 음악을 일시 정지하는 ["계속 시청하시겠습니까?"](https://user-images.githubusercontent.com/61631665/129977894-01c60740-7ec6-4bf0-9a2c-25da24491b0e.png) 팝업을 비활성화합니다.
+
+- 이외에 더 많은 기능 ...
+
+## 사용 가능한 플러그인:
+
+- **애드블록**: 모든 광고와 트래커를 즉시 차단합니다
+
+- **앨범 컬러 기반 테마**: 앨범 색상 팔레트를 기반으로 동적 테마 및 시각 효과를 적용합니다
+
+- **앰비언트 모드**: 영상의 간접 조명을 화면 배경에 투사합니다.
+
+- **오디오 컴프레서**: 오디오에 컴프레서를 적용합니다 (신호에서 가장 시끄러운 부분의 음량을 낮추고 가장 조용한 부분의 음량을 높임)
+
+- **네비게이션 바 흐림 효과**: 내비게이션 바를 투명하고 흐릿하게 만듭니다
+
+- **나이 제한 우회**: 유튜브의 나이 제한을 우회합니다
+
+- **자막 선택기**: 자막을 활성화합니다
+
+- **컴팩트 사이드바**: 사이드바를 항상 컴팩트 모드로 설정합니다
+
+- **크로스페이드**: 노래 사이에 크로스페이드 효과를 적용합니다
+
+- **자동 재생 해제**: 노래를 '일시 정지' 모드로 시작하게 합니다
+
+- [**디스코드 활동 상태**](https://discord.com/): [활동 상태 (Rich Presence)](https://user-images.githubusercontent.com/28219076/104362104-a7a0b980-5513-11eb-9744-bb89eabe0016.png)를 사용하여 친구들에게 내가 듣는 음악을 보여주세요
+
+- **다운로더**: UI에서 [직접](https://user-images.githubusercontent.com/61631665/129977677-83a7d067-c192-45e1-98ae-b5a4927393be.png) MP3/소스 오디오를 다운로드하세요
+
+- **지수 볼륨**: 음량 슬라이더를 [지수적](https://greasyfork.org/en/scripts/397686-youtube-music-fix-volume-ratio/)으로 만들어 더 낮은 음량을 쉽게 선택할 수 있도록 합니다.
+
+- **인앱 메뉴**: [메뉴 표시줄을 더 멋지게, 그리고 다크 또는 앨범의 색상으로 만듭니다](https://user-images.githubusercontent.com/78568641/112215894-923dbf00-8c29-11eb-95c3-3ce15db27eca.png)
+
+  > (이 플러그인 및 메뉴 숨기기 옵션을 활성화한 후 메뉴에 액세스하는 데 문제가 있는 경우 [이 글](https://github.com/th-ch/youtube-music/issues/410#issuecomment-952060709)을 참조하세요)
+
+- [**Last.fm**](https://www.last.fm/): Last.fm에 대한 스크러블 지원을 추가합니다
+
+- **Lumia Stream**: [Lumia Stream](https://lumiastream.com/) 지원을 추가합니다
+
+- **Genius 가사**: 더 많은 곡에 대해 가사 지원을 추가합니다
+
+- **네비게이션**: 브라우저에서처럼, UI에 직접 통합된 앞으로/뒤로 탐색하는 화살표를 추가합니다
+
+- **Google 로그인 제거**: UI에서 Google 로그인 버튼 및 링크 제거하기
+
+- **알림**: 노래 재생이 시작되면 알림을 표시 (Windows에서는 [대화형 알림](https://user-images.githubusercontent.com/78568641/114102651-63ce0e00-98d0-11eb-9dfe-c5a02bb54f9c.png) 사용 가능)
+
+- **PiP**: 앱을 PiP 모드로 전환할 수 있게 허용합니다
+
+- **재생 속도**: 빨리 듣거나, 천천히 들어보세요! [노래 속도를 제어하는 슬라이더를 추가합니다](https://user-images.githubusercontent.com/61631665/129976003-e55db5ba-bf42-448c-a059-26a009775e68.png)
+
+- **정확한 음량**: 사용자 지정 HUD와 사용자 지정 음량 단계 및 마우스 휠/단축키를 사용하여 음량을 정확하게 제어하세요
+
+- **영상 품질 체인저**: 영상 오버레이의 [버튼](https://user-images.githubusercontent.com/78568641/138574366-70324a5e-2d64-4f6a-acdd-dc2a2b9cecc5.png)으로 영상 품질을 변경할 수 있게 합니다
+
+- **단축키 (& MPRIS)**: 재생을 위한 전역 단축키 설정 허용 (재생/일시 정지/다음/이전) + 미디어 키를 재정의하여 [미디어 osd](https://user-images.githubusercontent.com/84923831/128601225-afa38c1f-dea8-4209-9f72-0f84c1dd8b54.png) 비활성화 + Ctrl/CMD + F 검색 활성화 + 미디어 키에 대한 리눅스 MPRIS 지원 활성화 + [고급 사용자](https://github.com/th-ch/youtube-music/issues/106#issuecomment-952156902)를 위한 [사용자 지정 단축키](https://github.com/Araxeus/youtube-music/blob/1e591d6a3df98449bcda6e63baab249b28026148/providers/song-controls.js#L13-L50) 지원
+
+- **무음 건너뛰기** - 노래의 무음 부분을 자동으로 건너뜁니다
+
+- [**SponsorBlock**](https://github.com/ajayyy/SponsorBlock): 인트로/아웃트로와 같은 음악이 아닌 부분이나, 노래가 재생되지 않는 뮤직 비디오의 일부를 자동으로 건너뜁니다
+
+- **작업표시줄 미디어 컨트롤**: [Windows 작업표시줄](https://user-images.githubusercontent.com/78568641/111916130-24a35e80-8a82-11eb-80c8-5021c1aa27f4.png)에서 재생을 제어하세요
+
+- **TouchBar**: macOS 사용자를 위한 TouchBar 위젯을 추가합니다
+
+- **Tuna-OBS**: [OBS](https://obsproject.com/)의 플러그인, [Tuna](https://obsproject.com/forum/resources/tuna.843/)와 통합을 활성화합니다
+
+- **영상 전환**: 영상/노래 모드를 전환하는 [버튼](https://user-images.githubusercontent.com/28893833/173663950-63e6610e-a532-49b7-9afa-54cb57ddfc15.png)을 추가합니다. 선택적으로 전체 영상 탭을 제거할 수도 있습니다
+
+- **비주얼라이저**: 플레이어에 시각화 도구 추가
+
+## 번역
+
+[Hosted Weblate](https://hosted.weblate.org/projects/youtube-music/)에서 번역을 도울 수 있습니다.
+
+<a href="https://hosted.weblate.org/engage/youtube-music/">
+  <img src="https://hosted.weblate.org/widget/youtube-music/i18n/multi-auto.svg" alt="번역 상태" />
+  <img src="https://hosted.weblate.org/widget/youtube-music/i18n/287x66-black.png" alt="번역 상태 2" />
+</a>
+
+## 다운로드
+
+[최신 릴리즈](https://github.com/th-ch/youtube-music/releases/latest)를 확인하여 최신 버전을 빠르게 찾을 수 있습니다.
+
+### Arch Linux
+
+AUR에서 [`youtube-music-bin`](https://aur.archlinux.org/packages/youtube-music-bin) 패키지를 설치합니다. AUR 설치 지침은 [이 위키 페이지](https://wiki.archlinux.org/index.php/Arch_User_Repository#Installing_packages)를 참조하세요.
+
+### MacOS
+
+Homebrew를 사용하여 앱을 설치할 수 있습니다:
+```bash
+brew install --cask https://raw.githubusercontent.com/th-ch/youtube-music/master/youtube-music.rb
+```
+
+(앱을 수동으로 설치하고) 앱을 실행할 때 `손상되었기 때문에 열 수 없습니다.`라는 오류가 발생하면 터미널에서 다음을 실행하세요:
+
+```bash
+xattr -cr /Applications/YouTube\ Music.app
+```
+
+### Windows
+
+[Scoop 패키지 매니저](https://scoop.sh)를 사용하여 [`extras` 버킷](https://github.com/ScoopInstaller/Extras)에서 `youtube-music` 패키지를 설치할 수 있습니다.
+
+```bash
+scoop bucket add extras
+scoop install extras/youtube-music
+```
+
+또는 Windows 11의 공식 CLI 패키지 관리자인 [Winget](https://learn.microsoft.com/en-us/windows/package-manager/winget/)을 사용하여 `th-ch.YouTubeMusic` 패키지를 설치할 수 있습니다.
+
+*참고: "알 수 없는 게시자"의 파일이기 때문에 Microsoft Defender의 SmartScreen에서 설치를 차단할 수 있습니다. 이는 GitHub에서 동일 파일을 수동으로 다운로드한 후 실행 파일(.exe)을 실행하려고 할 때도 마찬가지로 발생합니다.*
+
+```bash
+winget install th-ch.YouTubeMusic
+```
+
+#### (Windows에서) 네트워크에 연결하지 않고 설치하는 방법은 무엇인가요?
+
+- [릴리즈 페이지](https://github.com/th-ch/youtube-music/releases/latest)에서 _본인 기기 아키텍처_에 맞는 `*.nsis.7z` 파일을 다운로드하세요.
+  - `x64`는 64비트 Windows 용입니다.
+  - `ia32`는 32비트 Windows 용입니다.
+  - `arm64`는 ARM64 Windows 용입니다.
+- 릴리즈 페이지에서 설치기를 다운로드하세요. (`*-Setup.exe`)
+- 두 파일을 **동일한 위치**에 놓아주세요.
+- 설치기를 실행하세요.
+
+## 테마
+
+CSS 파일을 로드하여 애플리케이션의 모양을 변경할 수 있습니다(설정 > 시각적 변경 > 테마).
+
+일부 사전 정의 테마는 https://github.com/kerichdev/themes-for-ytmdesktop-player 에서 사용할 수 있습니다.
+
+## 개발
+
+```bash
+git clone https://github.com/th-ch/youtube-music
+cd youtube-music
+pnpm install --frozen-lockfile
+pnpm dev
+```
+
+## 나만의 플러그인 만들기
+
+플러그인을 사용하면 할 수 있는 것들:
+
+- 앱 조작 - Electron에서 `BrowserWindow`가 플러그인 핸들러로 전달
+- HTML/CSS를 조작하여 프론트엔드를 변경
+
+### 플러그인 만들기
+
+`plugins/나만의-플러그인-이름`에 폴더를 만듭니다:
+
+- `index.ts`: 플러그인의 메인 파일입니다.
+```typescript
+import style from './style.css?inline'; // 스타일을 인라인으로 가져옵니다
+
+import { createPlugin } from '@/utils';
+
+export default createPlugin({
+  name: 'Plugin Label',
+  restartNeeded: true, // 값이 true면, YTM은 재시작 다이얼로그를 표시합니다
+  config: {
+    enabled: false,
+  }, // 나의 커스텀 config
+  stylesheets: [style], // 나의 스타일
+  menu: async ({ getConfig, setConfig }) => {
+    // 모든 *Config 메서드는 Promise<T>로 래핑됩니다
+    const config = await getConfig();
+    return [
+      {
+        label: 'menu',
+        submenu: [1, 2, 3].map((value) => ({
+          label: `value ${value}`,
+          type: 'radio',
+          checked: config.value === value,
+          click() {
+            setConfig({ value });
+          },
+        })),
+      },
+    ];
+  },
+  backend: {
+    start({ window, ipc }) {
+      window.maximize();
+
+      // 이를 사용하여 렌더러 플러그인과 통신할 수 있습니다
+      ipc.handle('some-event', () => {
+        return 'hello';
+      });
+    },
+    // config가 변경되면 실행됩니다
+    onConfigChange(newConfig) { /* ... */ },
+    // 플러그인이 비활성화되면 실행됩니다
+    stop(context) { /* ... */ },
+  },
+  renderer: {
+    async start(context) {
+      console.log(await context.ipc.invoke('some-event'));
+    },
+    // 렌더러에서만 사용 가능한 훅입니다
+    onPlayerApiReady(api: YoutubePlayer, context: RendererContext<T>) {
+      // 플러그인의 config를 간단하게 설정할 수 있습니다
+      context.setConfig({ myConfig: api.getVolume() });
+    },
+    onConfigChange(newConfig) { /* ... */ },
+    stop(_context) { /* ... */ },
+  },
+  preload: {
+    async start({ getConfig }) {
+      const config = await getConfig();
+    },
+    onConfigChange(newConfig) {},
+    stop(_context) {},
+  },
+});
+```
+
+### 일반적인 사용 예
+
+- 사용자 정의 CSS 삽입: 같은 폴더에 `style.css` 파일을 생성합니다:
+
+```typescript
+// index.ts
+import style from './style.css?inline'; // 스타일을 인라인으로 가져옵니다
+
+import { createPlugin } from '@/utils';
+
+export default createPlugin({
+  name: 'Plugin Label',
+  restartNeeded: true, // 값이 true면, YTM은 재시작 다이얼로그를 표시합니다
+  config: {
+    enabled: false,
+  }, // 나의 커스텀 config
+  stylesheets: [style], // 나의 커스텀 스타일
+  renderer() {} // 렌더러 훅 정의
+});
+```
+
+- HTML을 변경하려는 경우:
+
+```typescript
+import { createPlugin } from '@/utils';
+
+export default createPlugin({
+  name: 'Plugin Label',
+  restartNeeded: true, // 값이 true면, YTM은 재시작 다이얼로그를 표시합니다
+  config: {
+    enabled: false,
+  }, // 나의 커스텀 config
+  renderer() {
+    // 로그인 버튼을 제거합니다
+    document.querySelector(".sign-in-link.ytmusic-nav-bar").remove();
+  } // 렌더러 훅 정의
+});
+```
+
+- 프론트엔드와 백엔드 간의 통신: Electron의 `ipcMain` 모듈을 사용하여 수행할 수 있습니다. `SponsorBlock` 플러그인의 `index.ts` 파일과 예제를 참조하세요.
+
+## 빌드
+
+1. 레포지토리를 복제 (clone) 합니다
+2. [이 가이드](https://pnpm.io/installation)에 따라 `pnpm`을 설치합니다.
+3. `pnpm install --frozen-lockfile`을 실행하여 종속성을 설치합니다.
+4. `pnpm build:OS`을 실행합니다.
+
+- `pnpm dist:win` - Windows
+- `pnpm dist:linux` - Linux
+- `pnpm dist:mac` - MacOS
+
+[electron-builder](https://github.com/electron-userland/electron-builder)를 사용하여 macOS, Linux 및 Windows용 앱을 빌드합니다.
+
+## 프로덕션 빌드 미리보기
+
+```bash
+pnpm start
+```
+
+## 테스트
+
+```bash
+pnpm test
+```
+
+[Playwright](https://playwright.dev/)를 사용하여 앱을 테스트합니다.
+
+## 라이선스
+
+MIT © [th-ch](https://github.com/th-ch/youtube-music)
+
+## 자주 묻는 질문
+
+### 앱 메뉴가 표시되지 않는 이유는 무엇인가요?
+
+`메뉴 숨기기` 옵션이 켜져 있는 경우 - <kbd>alt</kbd> 키(또는 인앱 메뉴 플러그인을 사용하는 경우 <kbd>\`</kbd> [백틱] 키)로 메뉴를 표시할 수 있습니다.

docs/readme/README-ru.md

@@ -0,0 +1,374 @@
+<div align="center">
+
+# YouTube Music
+
+[![GitHub release](https://img.shields.io/github/release/th-ch/youtube-music.svg?style=for-the-badge&logo=youtube-music)](https://github.com/th-ch/youtube-music/releases/)
+[![GitHub license](https://img.shields.io/github/license/th-ch/youtube-music.svg?style=for-the-badge)](https://github.com/th-ch/youtube-music/blob/master/LICENSE)
+[![eslint code style](https://img.shields.io/badge/code_style-eslint-5ed9c7.svg?style=for-the-badge)](https://github.com/th-ch/youtube-music/blob/master/.eslintrc.js)
+[![Build status](https://img.shields.io/github/actions/workflow/status/th-ch/youtube-music/build.yml?branch=master&style=for-the-badge&logo=youtube-music)](https://GitHub.com/th-ch/youtube-music/releases/)
+[![GitHub All Releases](https://img.shields.io/github/downloads/th-ch/youtube-music/total?style=for-the-badge&logo=youtube-music)](https://GitHub.com/th-ch/youtube-music/releases/)
+[![AUR](https://img.shields.io/aur/version/youtube-music-bin?color=blueviolet&style=for-the-badge&logo=youtube-music)](https://aur.archlinux.org/packages/youtube-music-bin)
+[![Known Vulnerabilities](https://snyk.io/test/github/th-ch/youtube-music/badge.svg)](https://snyk.io/test/github/th-ch/youtube-music)
+
+</div>
+
+![Screenshot](web/screenshot.jpg "Screenshot")
+
+
+<div align="center">
+    <a href="https://github.com/th-ch/youtube-music/releases/latest">
+        <img src="web/youtube-music.svg" width="400" height="100" alt="YouTube Music SVG">
+    </a>
+</div>
+
+
+
+**Клиент для YouTube Music основанный на Electron с поддержкой:**
+
+- Нативный вид приложения, нацелен на сохранение оригинального интерфейса
+- Фреймворк для пользовательских плагинов: изменяйте YouTube Music под ваши нужды (внешний вид, контент, возможности), включайте/выключайте плагины в один клик
+
+## Демо-изображение
+
+|                          Экран плеера (цветовая тема альбома & режим Ambient)                                |
+|:---------------------------------------------------------------------------------------------------------:|
+|![Screenshot1](https://github.com/th-ch/youtube-music/assets/16558115/53efdf73-b8fa-4d7b-a235-b96b91ea77fc)|
+
+## Содержание
+
+- [Возможности](#features)
+- [Доступные плагины](#available-plugins)
+- [Перевод](#translation)
+- [Скачать](#download)
+  - [Arch Linux](#arch-linux)
+  - [MacOS](#macos)
+  - [Windows](#windows)
+    - [Как установить без подключения к интернету? (в Windows)](#how-to-install-without-a-network-connection-in-windows)
+- [Темы](#themes)
+- [Для разработчиков](#dev)
+- [Создайте свои собственные плагины](#build-your-own-plugins)
+  - [Создание плагина](#creating-a-plugin)
+  - [Примеры использования](#common-use-cases)
+- [Сборка](#build)
+- [Предварительный просмотр](#production-preview)
+- [Тестирование](#tests)
+- [Лицензия](#license)
+- [Часто задаваемые вопросы](#faq)
+
+## Возможности:
+
+- **Авто-подтверждение при паузе** (Всегда включено): отключает всплывающие уведомление ["Продолжить просмотр?"](https://user-images.githubusercontent.com/61631665/129977894-01c60740-7ec6-4bf0-9a2c-25da24491b0e.png),
+    которое  приостанавливает воспроизведение через определённое время
+
+ - И больше ...
+
+## Доступные плагины:
+
+- **Блокировщик рекламы**: Блокирует всю рекламу и трекеры
+  
+- **Действия с альбомом**: Добавляет кнопки "Убрать дизлайк", "Дизлайк", "Лайк", "Убрать лайк" и применяет их действия ко всем трекам в плейлисте или альбоме
+
+- **Цветовая тема альбома**: Применяет динамическую тему и эффекты, основываясь на цветовой палитре альбома
+
+- **Режим Ambient**: Применяет световой эффект, проецируя нежные цвета из видео на задний фон вашего экрана
+
+- **Нормализация аудио**: Применяет нормализацию к аудио (уменьшает громкость громких частей трека и повышает громкость тихих частей трека)
+
+- **Размытие панели навигации**: Делает панель навигации прозрачной и размытой
+
+- **Обход возрастных ограничений**: Обходит проверку возраста YouTube
+
+- **Выбор субтитров**: Включить субтитры
+
+- **Компактная боковая панель**: Всегда показывать боковую панель компактно
+
+- **Плавный переход**: Плавный переход между треками
+
+- **Отключить автопроигрыш**: Каждый трек начинается в режиме паузы
+
+- **[Discord](https://discord.com/) Rich Presence**: Показывает вашим друзьям, что вы слушаете с помощью [Rich Presence](https://user-images.githubusercontent.com/28219076/104362104-a7a0b980-5513-11eb-9744-bb89eabe0016.png)
+
+- **Загрузчик**: Загрузка MP3 [напрямую из интерфейса](https://user-images.githubusercontent.com/61631665/129977677-83a7d067-c192-45e1-98ae-b5a4927393be.png) [(youtube-dl)](https://github.com/ytdl-org/youtube-dl)
+
+- **Расширенная громкость**: Делает слайдер громкости [расширенным](https://greasyfork.org/en/scripts/397686-youtube-music-fix-volume-ratio/) облегчая выбор громкости
+
+- **Меню в приложении**: [Придаёт панели меню красивый тёмный вид](https://user-images.githubusercontent.com/78568641/112215894-923dbf00-8c29-11eb-95c3-3ce15db27eca.png)
+
+  > (посмотрите [этот пост,](https://github.com/th-ch/youtube-music/issues/410#issuecomment-952060709) если у вас есть проблемы с доступом к меню после включения этого плагина и опции "Скрыть меню")
+
+- **Скробблер**: Добавляет поддержку скробблинга [Last.fm](https://www.last.fm/) и [ListenBrainz](https://listenbrainz.org/)
+
+- **Lumia Stream**: Добавляет поддержку [Lumia Stream](https://lumiastream.com/)
+
+- **Тесты песен Genius**: Добавляет поддержку текстов для большинства песен
+
+- **Music Together**: Делитесь плейлистом с другими. Когда ведущий воспроизводит трек, все остальные будут слушать этот же трек.
+
+- **Навигация**: Кнопки Назад/Вперед интегрированы в интерфейс, как в вашем любимом браузере
+
+- **Без входа в систему Google**: Убирает из интерфейса кнопки и ссылки для входа через Google
+
+- **Уведомления**: Показывает уведомление, когда трек начинает играть ([интерактивные уведомления](https://user-images.githubusercontent.com/78568641/114102651-63ce0e00-98d0-11eb-9dfe-c5a02bb54f9c.png) доступны только для Windows)
+
+- **Картинка в картинке**: Позволяет переключить приложение в режим "картинка в картинке"
+
+- **Скорость воспроизведения**: Слушайте быстрее, слушайте медленнее! [Добавляет слайдер для контроля скорости трека](https://user-images.githubusercontent.com/61631665/129976003-e55db5ba-bf42-448c-a059-26a009775e68.png)
+
+- **Точная громкость**: Точечно управляйте громкостью с помощью колеса мыши/горячих клавиш, с кастомным интерфейсом и настраиваемыми шагами громкости
+
+- **Ярлыки (и MPRIS)**: Позволяет настроить глобальные горячие клавиши управления воспроизведением (плей/пауза/следующий/предыдущий) + отключает [отображение медиа на экране,](https://user-images.githubusercontent.com/84923831/128601225-afa38c1f-dea8-4209-9f72-0f84c1dd8b54.png) переопределяя клавиши управления + включает Ctrl/CMD + F для поиска + включает поддержку linux mpris для клавиш управления медиа + [настраиваемые сочетания клавиш](https://github.com/Araxeus/youtube-music/blob/1e591d6a3df98449bcda6e63baab249b28026148/providers/song-controls.js#L13-L50) для [продвинутых пользователей](https://github.com/th-ch/youtube-music/issues/106#issuecomment-952156902)
+
+- **Пропускать непонравившиеся треки**: Пропускает непонравившиеся треки
+
+- **Пропуск тишины**: Автоматически пропускает тихие моменты в песнях
+
+- [**SponsorBlock**](https://github.com/ajayyy/SponsorBlock): Автоматически пропускает немузыкальные части, такие как интро/аутро музыкальных видео, где трек не играет
+
+- **Управление воспроизведением из панели задач**: Управляйте воспроизведением из [панели задач Windows](https://user-images.githubusercontent.com/78568641/111916130-24a35e80-8a82-11eb-80c8-5021c1aa27f4.png)
+
+- **TouchBar**: Кастомная раскладка TouchBar для MacOS
+
+- **Tuna OBS**: Интеграция с [OBS](https://obsproject.com/) плагином [Tuna](https://obsproject.com/forum/resources/tuna.843/)
+
+- **Изменение качества видео**: Позволяет менять качество видео [кнопкой](https://user-images.githubusercontent.com/78568641/138574366-70324a5e-2d64-4f6a-acdd-dc2a2b9cecc5.png) на медиаплеере видео
+
+- **Переключатель видео**: Добавляет
+  [кнопку](https://user-images.githubusercontent.com/28893833/173663950-63e6610e-a532-49b7-9afa-54cb57ddfc15.png) переключения режимов Трек/Видео. Также может удалять вкладку "Видео" полностью
+
+- **Визуализатор**: Различные визуализаторы музыки
+
+- **Synced Lyrics**: 
+Предоставляет синхронизированные слова для песен из таких источников, как [LRClib](https://lrclib.net).
+
+## Перевод
+
+Вы можете помочь с переводом на ваш язык на [Hosted Weblate](https://hosted.weblate.org/projects/youtube-music/).
+
+<a href="https://hosted.weblate.org/engage/youtube-music/">
+  <img src="https://hosted.weblate.org/widget/youtube-music/i18n/multi-auto.svg" alt="translation status" />
+  <img src="https://hosted.weblate.org/widget/youtube-music/i18n/287x66-black.png" alt="translation status 2" />
+</a>
+
+## Скачать
+
+Вы можете посмотреть [latest release,](https://github.com/th-ch/youtube-music/releases/latest) чтобы быстро найти новую версию.
+
+### Arch Linux
+
+Установите пакет [`youtube-music-bin`](https://aur.archlinux.org/packages/youtube-music-bin) из AUR. Инструкции по установке из AUR можете найти на этой [вики-странице](https://wiki.archlinux.org/index.php/Arch_User_Repository#Installing_packages).
+
+### macOS
+
+Вы можете установить приложение с помощью Homebrew (сморите [cask definition](https://github.com/th-ch/homebrew-youtube-music)):
+
+```bash
+brew install th-ch/youtube-music/youtube-music
+```
+
+Если вы устанавливаете приложение вручную и получаете ошибку "is damaged and can’t be opened.", запустите в терминале следующую команду:
+
+```bash
+xattr -cr /Applications/YouTube\ Music.app
+```
+
+### Windows
+
+Вы можете использовать [пакетный менеджер Scoop](https://scoop.sh) для установки пакета `youtube-music` из [`extras` bucket](https://github.com/ScoopInstaller/Extras).
+
+```bash
+scoop bucket add extras
+scoop install extras/youtube-music
+```
+
+Также для установки вы можете использовать [Winget](https://learn.microsoft.com/en-us/windows/package-manager/winget/), официальный пакетный менеджер командной строки Windows 11, для установки пакета `th-ch.YouTubeMusic`.
+
+*К сведению: SmartScreen защитника Windows может блокировать установку, так как она от "неизвестного издателя". Это также применимо к методу ручной установки, когда вы пытаетесь запустить исполняемый файл(.exe) после загрузки здесь, на GitHub (тот же файл).*
+
+```bash
+winget install th-ch.YouTubeMusic
+```
+
+#### Установка без подключения к Интернету? (в Windows)
+
+- Скачайте файл `*.nsis.7z` из _архетиктура вашего устройства_ на [release page](https://github.com/th-ch/youtube-music/releases/latest).
+  - `x64` для 64-bit Windows
+  - `ia32` для 32-bit Windows
+  - `arm64` для ARM64 Windows
+- Скачайте установщик в release page. (`*-Setup.exe`)
+- Поместите их в **одной директории**.
+- Запустите установщик.
+
+## Темы
+
+Вы можете загрузить файл CSS для смены внешнего вида приложения (Настройки > Визуальные настройки > Тема).
+
+Некоторые предустановленные темы доступны здесь: https://github.com/kerichdev/themes-for-ytmdesktop-player.
+
+## Для разработчиков
+
+```bash
+git clone https://github.com/th-ch/youtube-music
+cd youtube-music
+pnpm install --frozen-lockfile
+pnpm dev
+```
+
+## Создайте свои собственные плагины
+
+Используя плагины вы можете:
+
+- Манипулировать приложением - `BrowserWindow` из electron проброшен обработчику плагинов
+- Изменять внешний вид, манипулируя HTML/CSS
+
+### Создание плагина
+
+Создайте директорию в `src/plugins/YOUR-PLUGIN-NAME`:
+
+- `index.ts`: основной файл плагина
+```typescript
+import style from './style.css?inline'; // import style as inline
+
+import { createPlugin } from '@/utils';
+
+export default createPlugin({
+  name: 'Plugin Label',
+  restartNeeded: true, // if value is true, ytmusic show restart dialog
+  config: {
+    enabled: false,
+  }, // your custom config
+  stylesheets: [style], // your custom style,
+  menu: async ({ getConfig, setConfig }) => {
+    // All *Config methods are wrapped Promise<T>
+    const config = await getConfig();
+    return [
+      {
+        label: 'menu',
+        submenu: [1, 2, 3].map((value) => ({
+          label: `value ${value}`,
+          type: 'radio',
+          checked: config.value === value,
+          click() {
+            setConfig({ value });
+          },
+        })),
+      },
+    ];
+  },
+  backend: {
+    start({ window, ipc }) {
+      window.maximize();
+
+      // you can communicate with renderer plugin
+      ipc.handle('some-event', () => {
+        return 'hello';
+      });
+    },
+    // it fired when config changed
+    onConfigChange(newConfig) { /* ... */ },
+    // it fired when plugin disabled
+    stop(context) { /* ... */ },
+  },
+  renderer: {
+    async start(context) {
+      console.log(await context.ipc.invoke('some-event'));
+    },
+    // Only renderer available hook
+    onPlayerApiReady(api: YoutubePlayer, context: RendererContext) {
+      // set plugin config easily
+      context.setConfig({ myConfig: api.getVolume() });
+    },
+    onConfigChange(newConfig) { /* ... */ },
+    stop(_context) { /* ... */ },
+  },
+  preload: {
+    async start({ getConfig }) {
+      const config = await getConfig();
+    },
+    onConfigChange(newConfig) {},
+    stop(_context) {},
+  },
+});
+```
+
+### Примеры использования
+
+- Кастомный CSS: создайте файл `style.css` в той же директории, затем:
+
+```typescript
+// index.ts
+import style from './style.css?inline'; // import style as inline
+
+import { createPlugin } from '@/utils';
+
+export default createPlugin({
+  name: 'Plugin Label',
+  restartNeeded: true, // if value is true, ytmusic will show a restart dialog
+  config: {
+    enabled: false,
+  }, // your custom config
+  stylesheets: [style], // your custom style
+  renderer() {} // define renderer hook
+});
+```
+
+- Если вы хотите изменить HTML:
+
+```typescript
+import { createPlugin } from '@/utils';
+
+export default createPlugin({
+  name: 'Plugin Label',
+  restartNeeded: true, // if value is true, ytmusic will show the restart dialog
+  config: {
+    enabled: false,
+  }, // your custom config
+  renderer() {
+    // Remove the login button
+    document.querySelector(".sign-in-link.ytmusic-nav-bar").remove();
+  } // define renderer hook
+});
+```
+
+- обмен между фронтом и бэком может быть выполнен с помощью модуля ipcMain из electron. Смотрите файл `index.ts` и
+  пример в плагине `sponsorblock`.
+
+## Сборка
+
+1. Склонируйте репозиторий
+2. Следуйте [этой инструкции,](https://pnpm.io/installation) чтобы установить `pnpm`
+3. Запустите `pnpm install --frozen-lockfile` для установки зависимостей
+4. Запустите `pnpm build:OS`
+
+- `pnpm dist:win` - Windows
+- `pnpm dist:linux` - Linux (amd64)
+- `pnpm dist:linux:deb-arm64` - Linux (arm64 for Debian)
+- `pnpm dist:linux:rpm-arm64` - Linux (arm64 for Fedora)
+- `pnpm dist:mac` - macOS (amd64)
+- `pnpm dist:mac:arm64` - macOS (arm64)
+
+Сборка приложения для macOS, Linux, и Windows,
+используя [electron-builder](https://github.com/electron-userland/electron-builder).
+
+## Предварительный просмотр
+
+```bash
+pnpm start
+```
+
+## Тестирование
+
+```bash
+pnpm test
+```
+
+Использует [Playwright](https://playwright.dev/) для тестирования приложения.
+
+## Лицензия
+
+MIT © [th-ch](https://github.com/th-ch/youtube-music)
+
+## Часто задаваемые вопросы
+
+### Почему меня приложения не отображается?
+
+Если опция `Скрыть меню` включена - вы можете отобразить меню с помощью клавиши <kbd>alt</kbd> (или <kbd>\`</kbd> [обратный апостроф], если используете плагин "Меню в приложении")

electron.vite.config.mts

@@ -0,0 +1,172 @@
+import { resolve, dirname, join } from 'node:path';
+import { fileURLToPath } from 'node:url';
+
+import { UserConfig } from 'vite';
+import { defineConfig, defineViteConfig } from 'electron-vite';
+import builtinModules from 'builtin-modules';
+import viteResolve from 'vite-plugin-resolve';
+import Inspect from 'vite-plugin-inspect';
+import solidPlugin from 'vite-plugin-solid';
+
+import { pluginVirtualModuleGenerator } from './vite-plugins/plugin-importer.mjs';
+import pluginLoader from './vite-plugins/plugin-loader.mjs';
+
+import { i18nImporter } from './vite-plugins/i18n-importer.mjs';
+
+const __dirname = dirname(fileURLToPath(import.meta.url));
+
+const resolveAlias = {
+  '@': resolve(__dirname, './src'),
+  '@assets': resolve(__dirname, './assets'),
+};
+
+export default defineConfig({
+  main: defineViteConfig(({ mode }) => {
+    const commonConfig: UserConfig = {
+      plugins: [
+        pluginLoader('backend'),
+        viteResolve({
+          'virtual:i18n': i18nImporter(),
+          'virtual:plugins': pluginVirtualModuleGenerator('main'),
+        }),
+      ],
+      publicDir: 'assets',
+      build: {
+        lib: {
+          entry: 'src/index.ts',
+          formats: ['cjs'],
+        },
+        outDir: 'dist/main',
+        commonjsOptions: {
+          ignoreDynamicRequires: true,
+        },
+        rollupOptions: {
+          external: ['electron', 'custom-electron-prompt', ...builtinModules],
+          input: './src/index.ts',
+        },
+      },
+      resolve: {
+        alias: resolveAlias,
+      },
+    };
+
+    if (mode === 'development') {
+      commonConfig.build!.sourcemap = 'inline';
+      commonConfig.plugins?.push(
+        Inspect({
+          build: true,
+          outputDir: join(__dirname, '.vite-inspect/backend'),
+        }),
+      );
+      return commonConfig;
+    }
+
+    return {
+      ...commonConfig,
+      build: {
+        ...commonConfig.build,
+        minify: true,
+        cssMinify: true,
+      },
+    };
+  }),
+  preload: defineViteConfig(({ mode }) => {
+    const commonConfig: UserConfig = {
+      plugins: [
+        pluginLoader('preload'),
+        viteResolve({
+          'virtual:i18n': i18nImporter(),
+          'virtual:plugins': pluginVirtualModuleGenerator('preload'),
+        }),
+      ],
+      build: {
+        lib: {
+          entry: 'src/preload.ts',
+          formats: ['cjs'],
+        },
+        outDir: 'dist/preload',
+        commonjsOptions: {
+          ignoreDynamicRequires: true,
+        },
+        rollupOptions: {
+          external: ['electron', 'custom-electron-prompt', ...builtinModules],
+          input: './src/preload.ts',
+        },
+      },
+      resolve: {
+        alias: resolveAlias,
+      },
+    };
+
+    if (mode === 'development') {
+      commonConfig.build!.sourcemap = 'inline';
+      commonConfig.plugins?.push(
+        Inspect({
+          build: true,
+          outputDir: join(__dirname, '.vite-inspect/preload'),
+        }),
+      );
+      return commonConfig;
+    }
+
+    return {
+      ...commonConfig,
+      build: {
+        ...commonConfig.build,
+        minify: true,
+        cssMinify: true,
+      },
+    };
+  }),
+  renderer: defineViteConfig(({ mode }) => {
+    const commonConfig: UserConfig = {
+      plugins: [
+        pluginLoader('renderer'),
+        viteResolve({
+          'virtual:i18n': i18nImporter(),
+          'virtual:plugins': pluginVirtualModuleGenerator('renderer'),
+        }),
+        solidPlugin(),
+      ],
+      root: './src/',
+      build: {
+        lib: {
+          entry: 'src/index.html',
+          formats: ['iife'],
+          name: 'renderer',
+        },
+        outDir: 'dist/renderer',
+        commonjsOptions: {
+          ignoreDynamicRequires: true,
+        },
+        rollupOptions: {
+          external: ['electron', ...builtinModules],
+          input: './src/index.html',
+        },
+      },
+      resolve: {
+        alias: resolveAlias,
+      },
+    };
+
+    if (mode === 'development') {
+      commonConfig.build!.sourcemap = 'inline';
+      commonConfig.plugins?.push(
+        Inspect({
+          build: true,
+          outputDir: join(__dirname, '.vite-inspect/renderer'),
+        }),
+      );
+      return commonConfig;
+    }
+
+    return {
+      ...commonConfig,
+      build: {
+        ...commonConfig.build,
+        minify: true,
+        cssMinify: true,
+      },
+    };
+  }),
+});

error.html

@@ -1,50 +0,0 @@
-<!DOCTYPE html>
-<html>
-<head>
-    <meta charset="utf-8"/>
-    <title>Cannot load YouTube Music</title>
-    <style>
-        body {
-            background: #000;
-        }
-
-        .container {
-            margin: 0;
-            font-family: Roboto, Arial, sans-serif;
-            font-size: 20px;
-            font-weight: 500;
-            color: rgba(255, 255, 255, 0.5);
-            position: absolute;
-            top: 50%;
-            left: 50%;
-            margin-right: -50%;
-            transform: translate(-50%, -50%);
-            text-align: center;
-        }
-
-        .button {
-            background: #065fd4;
-            overflow: hidden;
-            text-overflow: ellipsis;
-            white-space: nowrap;
-            color: white;
-            font: inherit;
-            text-transform: uppercase;
-            text-decoration: none;
-            border-radius: 2px;
-            font-size: 16px;
-            font-weight: normal;
-            text-align: center;
-            padding: 8px 22px;
-            display: inline-block;
-        }
-    </style>
-</head>
-
-<body>
-<div class="container">
-    <p>Cannot load YouTube Music… Internet disconnected?</p>
-    <a class="button" href="#" onclick="reload()">Retry</a>
-</div>
-</body>
-</html>

eslint.config.mjs

@@ -0,0 +1,80 @@
+//@ts-check
+
+import eslint from '@eslint/js';
+import prettier from 'eslint-plugin-prettier/recommended';
+import stylistic from '@stylistic/eslint-plugin-js';
+import tsEslint from 'typescript-eslint';
+
+import * as importPlugin from 'eslint-plugin-import';
+
+export default tsEslint.config(
+  eslint.configs.recommended,
+  tsEslint.configs.eslintRecommended,
+  ...tsEslint.configs.recommendedTypeChecked,
+  prettier,
+  { ignores: ['dist', 'node_modules', '*.config.*js', '*.test.*js'] },
+  {
+    plugins: {
+      stylistic,
+      importPlugin
+    },
+    languageOptions: {
+      parser: tsEslint.parser,
+      parserOptions: {
+        project: true,
+        sourceType: 'module',
+        ecmaVersion: 'latest'
+      }
+    },
+    rules: {
+      'stylistic/arrow-parens': ['error', 'always'],
+      'stylistic/object-curly-spacing': ['error', 'always'],
+      'prettier/prettier': ['error', { singleQuote: true, semi: true, tabWidth: 2, trailingComma: 'all', quoteProps: 'preserve' }],
+      '@typescript-eslint/no-floating-promises': 'off',
+      '@typescript-eslint/no-misused-promises': ['off', { checksVoidReturn: false }],
+      '@typescript-eslint/no-unused-vars': ['warn', { argsIgnorePattern: '^_' }],
+      '@typescript-eslint/no-non-null-assertion': 'off',
+      'importPlugin/first': 'error',
+      'importPlugin/newline-after-import': 'off',
+      'importPlugin/no-default-export': 'off',
+      'importPlugin/no-duplicates': 'error',
+      'importPlugin/no-unresolved': ['error', { ignore: ['^virtual:', '\\?inline$', '\\?raw$', '\\?asset&asarUnpack'] }],
+      'importPlugin/order': ['error', {
+        'groups': ['builtin', 'external', ['internal', 'index', 'sibling'], 'parent', 'type'],
+        'newlines-between': 'always-and-inside-groups',
+        'alphabetize': { order: 'ignore', caseInsensitive: false }
+      }],
+      'importPlugin/prefer-default-export': 'off',
+      'camelcase': ['error', { properties: 'never' }],
+      'class-methods-use-this': 'off',
+      'stylistic/lines-around-comment': ['error', {
+        beforeBlockComment: false,
+        afterBlockComment: false,
+        beforeLineComment: false,
+        afterLineComment: false,
+      }],
+      'stylistic/max-len': 'off',
+      'stylistic/no-mixed-operators': 'warn', // prettier does not support no-mixed-operators
+      'stylistic/no-multi-spaces': ['error', { ignoreEOLComments: true }],
+      'stylistic/no-tabs': 'error',
+      'no-void': 'error',
+      'no-empty': 'off',
+      'prefer-promise-reject-errors': 'off',
+      'stylistic/quotes': ['error', 'single', {
+        avoidEscape: true,
+        allowTemplateLiterals: false,
+      }],
+      'stylistic/quote-props': ['error', 'consistent'],
+      'stylistic/semi': ['error', 'always'],
+    },
+    settings: {
+      'import/parsers': {
+        '@typescript-eslint/parser': ['.ts']
+      },
+      'import/resolver': {
+        typescript: {},
+        exports: {},
+      },
+    },
+  },
+);

index.ts

@@ -1,662 +0,0 @@
-import path from 'node:path';
-
-import { BrowserWindow, app, screen, globalShortcut, session, shell, dialog, ipcMain } from 'electron';
-import enhanceWebRequest from 'electron-better-web-request';
-import is from 'electron-is';
-import unhandled from 'electron-unhandled';
-import { autoUpdater } from 'electron-updater';
-import electronDebug from 'electron-debug';
-
-import { BetterWebRequest } from 'electron-better-web-request/lib/electron-better-web-request';
-
-import config from './config';
-import { setApplicationMenu } from './menu';
-import { fileExists, injectCSS, injectCSSAsFile } from './plugins/utils';
-import { isTesting } from './utils/testing';
-import { setUpTray } from './tray';
-import { setupSongInfo } from './providers/song-info';
-import { restart, setupAppControls } from './providers/app-controls';
-import { APP_PROTOCOL, handleProtocol, setupProtocolHandler } from './providers/protocol-handler';
-
-import adblocker from './plugins/adblocker/back';
-import albumColorTheme from './plugins/album-color-theme/back';
-import ambientMode from './plugins/ambient-mode/back';
-import blurNavigationBar from './plugins/blur-nav-bar/back';
-import captionsSelector from './plugins/captions-selector/back';
-import crossfade from './plugins/crossfade/back';
-import discord from './plugins/discord/back';
-import downloader from './plugins/downloader/back';
-import inAppMenu from './plugins/in-app-menu/back';
-import lastFm from './plugins/last-fm/back';
-import lumiaStream from './plugins/lumiastream/back';
-import lyricsGenius from './plugins/lyrics-genius/back';
-import navigation from './plugins/navigation/back';
-import noGoogleLogin from './plugins/no-google-login/back';
-import notifications from './plugins/notifications/back';
-import pictureInPicture, { setOptions as pipSetOptions } from './plugins/picture-in-picture/back';
-import preciseVolume from './plugins/precise-volume/back';
-import qualityChanger from './plugins/quality-changer/back';
-import shortcuts from './plugins/shortcuts/back';
-import sponsorBlock from './plugins/sponsorblock/back';
-import taskbarMediaControl from './plugins/taskbar-mediacontrol/back';
-import touchbar from './plugins/touchbar/back';
-import tunaObs from './plugins/tuna-obs/back';
-import videoToggle from './plugins/video-toggle/back';
-import visualizer from './plugins/visualizer/back';
-
-import youtubeMusicCSS from './youtube-music.css';
-
-// Catch errors and log them
-unhandled({
-  logger: console.error,
-  showDialog: false,
-});
-
-// Disable Node options if the env var is set
-process.env.NODE_OPTIONS = '';
-
-// Prevent window being garbage collected
-let mainWindow: Electron.BrowserWindow | null;
-autoUpdater.autoDownload = false;
-
-const gotTheLock = app.requestSingleInstanceLock();
-if (!gotTheLock) {
-  app.exit();
-}
-
-// SharedArrayBuffer: Required for downloader (@ffmpeg/core-mt)
-// OverlayScrollbar: Required for overlay scrollbars
-app.commandLine.appendSwitch('enable-features', 'OverlayScrollbar,SharedArrayBuffer');
-if (config.get('options.disableHardwareAcceleration')) {
-  if (is.dev()) {
-    console.log('Disabling hardware acceleration');
-  }
-
-  app.disableHardwareAcceleration();
-}
-
-if (is.linux() && config.plugins.isEnabled('shortcuts')) {
-  // Stops chromium from launching its own MPRIS service
-  app.commandLine.appendSwitch('disable-features', 'MediaSessionService');
-}
-
-if (config.get('options.proxy')) {
-  app.commandLine.appendSwitch('proxy-server', config.get('options.proxy'));
-}
-
-// Adds debug features like hotkeys for triggering dev tools and reload
-electronDebug({
-  showDevTools: false, // Disable automatic devTools on new window
-});
-
-let icon = 'assets/youtube-music.png';
-if (process.platform === 'win32') {
-  icon = 'assets/generated/icon.ico';
-} else if (process.platform === 'darwin') {
-  icon = 'assets/generated/icon.icns';
-}
-
-function onClosed() {
-  // Dereference the window
-  // For multiple Windows store them in an array
-  mainWindow = null;
-}
-
-const mainPlugins = {
-  'adblocker': adblocker,
-  'album-color-theme': albumColorTheme,
-  'ambient-mode': ambientMode,
-  'blur-nav-bar': blurNavigationBar,
-  'captions-selector': captionsSelector,
-  'crossfade': crossfade,
-  'discord': discord,
-  'downloader': downloader,
-  'in-app-menu': inAppMenu,
-  'last-fm': lastFm,
-  'lumiastream': lumiaStream,
-  'lyrics-genius': lyricsGenius,
-  'navigation': navigation,
-  'no-google-login': noGoogleLogin,
-  'notifications': notifications,
-  'picture-in-picture': pictureInPicture,
-  'precise-volume': preciseVolume,
-  'quality-changer': qualityChanger,
-  'shortcuts': shortcuts,
-  'sponsorblock': sponsorBlock,
-  'taskbar-mediacontrol': undefined as typeof taskbarMediaControl | undefined,
-  'touchbar': undefined as typeof touchbar | undefined,
-  'tuna-obs': tunaObs,
-  'video-toggle': videoToggle,
-  'visualizer': visualizer,
-};
-export const mainPluginNames = Object.keys(mainPlugins);
-
-if (is.windows()) {
-  mainPlugins['taskbar-mediacontrol'] = taskbarMediaControl;
-  delete mainPlugins['touchbar'];
-} else if (is.macOS()) {
-  mainPlugins['touchbar'] = touchbar;
-  delete mainPlugins['taskbar-mediacontrol'];
-} else {
-  delete mainPlugins['touchbar'];
-  delete mainPlugins['taskbar-mediacontrol'];
-}
-
-ipcMain.handle('get-main-plugin-names', () => Object.keys(mainPlugins));
-
-function loadPlugins(win: BrowserWindow) {
-  injectCSS(win.webContents, youtubeMusicCSS);
-  // Load user CSS
-  const themes: string[] = config.get('options.themes');
-  if (Array.isArray(themes)) {
-    for (const cssFile of themes) {
-      fileExists(
-        cssFile,
-        () => {
-          injectCSSAsFile(win.webContents, cssFile);
-        },
-        () => {
-          console.warn(`CSS file "${cssFile}" does not exist, ignoring`);
-        },
-      );
-    }
-  }
-
-  win.webContents.once('did-finish-load', () => {
-    if (is.dev()) {
-      console.log('did finish load');
-      win.webContents.openDevTools();
-    }
-  });
-
-  for (const [plugin, options] of config.plugins.getEnabled()) {
-    try {
-      if (Object.hasOwn(mainPlugins, plugin)) {
-        console.log('Loaded plugin - ' + plugin);
-        const handler = mainPlugins[plugin as keyof typeof mainPlugins];
-        if (handler) {
-          handler(win, options as never);
-        }
-      }
-    } catch (e) {
-      console.error(`Failed to load plugin "${plugin}"`, e);
-    }
-  }
-}
-
-function createMainWindow() {
-  const windowSize = config.get('window-size');
-  const windowMaximized = config.get('window-maximized');
-  const windowPosition: Electron.Point = config.get('window-position');
-  const useInlineMenu = config.plugins.isEnabled('in-app-menu');
-
-  const win = new BrowserWindow({
-    icon,
-    width: windowSize.width,
-    height: windowSize.height,
-    backgroundColor: '#000',
-    show: false,
-    webPreferences: {
-      // TODO: re-enable contextIsolation once it can work with FFMpeg.wasm
-      // Possible bundling? https://github.com/ffmpegwasm/ffmpeg.wasm/issues/126
-      contextIsolation: false,
-      preload: path.join(__dirname, 'preload.js'),
-      nodeIntegrationInSubFrames: true,
-      ...(isTesting()
-        ? undefined
-        : {
-          // Sandbox is only enabled in tests for now
-          // See https://www.electronjs.org/docs/latest/tutorial/sandbox#preload-scripts
-          sandbox: false,
-        }),
-    },
-    frame: !is.macOS() && !useInlineMenu,
-    titleBarOverlay: {
-      color: '#00000000',
-      symbolColor: '#ffffff',
-      height: 36,
-    },
-    titleBarStyle: useInlineMenu
-      ? 'hidden'
-      : (is.macOS()
-        ? 'hiddenInset'
-        : 'default'),
-    autoHideMenuBar: config.get('options.hideMenu'),
-  });
-  loadPlugins(win);
-
-  if (windowPosition) {
-    const { x, y } = windowPosition;
-    const winSize = win.getSize();
-    const displaySize
-      = screen.getDisplayNearestPoint(windowPosition).bounds;
-    if (
-      x + winSize[0] < displaySize.x - 8
-      || x - winSize[0] > displaySize.x + displaySize.width
-      || y < displaySize.y - 8
-      || y > displaySize.y + displaySize.height
-    ) {
-      // Window is offscreen
-      if (is.dev()) {
-        console.log(
-          `Window tried to render offscreen, windowSize=${String(winSize)}, displaySize=${String(displaySize)}, position=${String(windowPosition)}`,
-        );
-      }
-    } else {
-      win.setPosition(x, y);
-    }
-  }
-
-  if (windowMaximized) {
-    win.maximize();
-  }
-
-  if (config.get('options.alwaysOnTop')) {
-    win.setAlwaysOnTop(true);
-  }
-
-  const urlToLoad = config.get('options.resumeOnStart')
-    ? config.get('url')
-    : config.defaultConfig.url;
-  win.webContents.loadURL(urlToLoad);
-  win.on('closed', onClosed);
-
-  const scaleFactor = screen.getAllDisplays().length > 1 ? screen.getPrimaryDisplay().scaleFactor : 1;
-  const size = config.get('window-size');
-  const position = config.get('window-position');
-
-  if (size && size.width && size.height) {
-    const scaledSize = {
-      width: size.width / scaleFactor,
-      height: size.height / scaleFactor,
-    };
-    win.setSize(scaledSize.width, scaledSize.height);
-  }
-
-  if (position && position.x && position.y) {
-    const scaledPosition = {
-      x: position.x / scaleFactor,
-      y: position.y / scaleFactor,
-    };
-    win.setPosition(scaledPosition.x, scaledPosition.y);
-  }
-
-  type PiPOptions = typeof config.defaultConfig.plugins['picture-in-picture'];
-  const setPiPOptions = config.plugins.isEnabled('picture-in-picture')
-    // eslint-disable-next-line @typescript-eslint/no-var-requires
-    ? (key: string, value: unknown) => pipSetOptions({ [key]: value })
-    : () => {};
-
-  win.on('move', () => {
-    if (win.isMaximized()) {
-      return;
-    }
-
-    const position = win.getPosition();
-    const isPiPEnabled: boolean
-      = config.plugins.isEnabled('picture-in-picture')
-      && config.plugins.getOptions<PiPOptions>('picture-in-picture').isInPiP;
-    if (!isPiPEnabled) {
-
-      lateSave('window-position', { x: position[0], y: position[1] });
-    } else if (config.plugins.getOptions<PiPOptions>('picture-in-picture').savePosition) {
-      lateSave('pip-position', position, setPiPOptions);
-    }
-  });
-
-  let winWasMaximized: boolean;
-
-  win.on('resize', () => {
-    const windowSize = win.getSize();
-    const isMaximized = win.isMaximized();
-
-    const isPiPEnabled
-      = config.plugins.isEnabled('picture-in-picture')
-      && config.plugins.getOptions<PiPOptions>('picture-in-picture').isInPiP;
-
-    if (!isPiPEnabled && winWasMaximized !== isMaximized) {
-      winWasMaximized = isMaximized;
-      config.set('window-maximized', isMaximized);
-    }
-
-    if (isMaximized) {
-      return;
-    }
-
-    if (!isPiPEnabled) {
-      lateSave('window-size', {
-        width: windowSize[0],
-        height: windowSize[1],
-      });
-    } else if (config.plugins.getOptions<PiPOptions>('picture-in-picture').saveSize) {
-      lateSave('pip-size', windowSize, setPiPOptions);
-    }
-  });
-
-  const savedTimeouts: Record<string, NodeJS.Timeout | undefined> = {};
-
-  function lateSave(key: string, value: unknown, fn: (key: string, value: unknown) => void = config.set) {
-    if (savedTimeouts[key]) {
-      clearTimeout(savedTimeouts[key]);
-    }
-
-    savedTimeouts[key] = setTimeout(() => {
-      fn(key, value);
-      savedTimeouts[key] = undefined;
-    }, 600);
-  }
-
-  app.on('render-process-gone', (event, webContents, details) => {
-    showUnresponsiveDialog(win, details);
-  });
-
-  win.once('ready-to-show', () => {
-    if (config.get('options.appVisible')) {
-      win.show();
-    }
-  });
-
-  removeContentSecurityPolicy();
-
-  return win;
-}
-
-app.once('browser-window-created', (event, win) => {
-  if (config.get('options.overrideUserAgent')) {
-    // User agents are from https://developers.whatismybrowser.com/useragents/explore/
-    const originalUserAgent = win.webContents.userAgent;
-    const userAgents = {
-      mac: 'Mozilla/5.0 (Macintosh; Intel Mac OS X 12.1; rv:95.0) Gecko/20100101 Firefox/95.0',
-      windows: 'Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:95.0) Gecko/20100101 Firefox/95.0',
-      linux: 'Mozilla/5.0 (Linux x86_64; rv:95.0) Gecko/20100101 Firefox/95.0',
-    };
-
-    const updatedUserAgent
-      = is.macOS() ? userAgents.mac
-      : (is.windows() ? userAgents.windows
-        : userAgents.linux);
-
-    win.webContents.userAgent = updatedUserAgent;
-    app.userAgentFallback = updatedUserAgent;
-
-    win.webContents.session.webRequest.onBeforeSendHeaders((details, cb) => {
-      // This will only happen if login failed, and "retry" was pressed
-      if (win.webContents.getURL().startsWith('https://accounts.google.com') && details.url.startsWith('https://accounts.google.com')) {
-        details.requestHeaders['User-Agent'] = originalUserAgent;
-      }
-
-      cb({ requestHeaders: details.requestHeaders });
-    });
-  }
-
-  setupSongInfo(win);
-  setupAppControls();
-
-  win.webContents.on('did-fail-load', (
-    _event,
-    errorCode,
-    errorDescription,
-    validatedURL,
-    isMainFrame,
-    frameProcessId,
-    frameRoutingId,
-  ) => {
-    const log = JSON.stringify({
-      error: 'did-fail-load',
-      errorCode,
-      errorDescription,
-      validatedURL,
-      isMainFrame,
-      frameProcessId,
-      frameRoutingId,
-    }, null, '\t');
-    if (is.dev()) {
-      console.log(log);
-    }
-
-    if (!(config.plugins.isEnabled('in-app-menu') && errorCode === -3)) { // -3 is a false positive with in-app-menu
-      win.webContents.send('log', log);
-      win.webContents.loadFile(path.join(__dirname, 'error.html'));
-    }
-  });
-
-  win.webContents.on('will-prevent-unload', (event) => {
-    event.preventDefault();
-  });
-});
-
-app.on('window-all-closed', () => {
-  if (process.platform !== 'darwin') {
-    app.quit();
-  }
-
-  // Unregister all shortcuts.
-  globalShortcut.unregisterAll();
-});
-
-app.on('activate', () => {
-  // On OS X it's common to re-create a window in the app when the
-  // dock icon is clicked and there are no other windows open.
-  if (mainWindow === null) {
-    mainWindow = createMainWindow();
-  } else if (!mainWindow.isVisible()) {
-    mainWindow.show();
-  }
-});
-
-app.on('ready', () => {
-  if (config.get('options.autoResetAppCache')) {
-    // Clear cache after 20s
-    const clearCacheTimeout = setTimeout(() => {
-      if (is.dev()) {
-        console.log('Clearing app cache.');
-      }
-
-      session.defaultSession.clearCache();
-      clearTimeout(clearCacheTimeout);
-    }, 20_000);
-  }
-
-  // Register appID on windows
-  if (is.windows()) {
-    const appID = 'com.github.th-ch.youtube-music';
-    app.setAppUserModelId(appID);
-    const appLocation = process.execPath;
-    const appData = app.getPath('appData');
-    // Check shortcut validity if not in dev mode / running portable app
-    if (!is.dev() && !appLocation.startsWith(path.join(appData, '..', 'Local', 'Temp'))) {
-      const shortcutPath = path.join(appData, 'Microsoft', 'Windows', 'Start Menu', 'Programs', 'YouTube Music.lnk');
-      try { // Check if shortcut is registered and valid
-        const shortcutDetails = shell.readShortcutLink(shortcutPath); // Throw error if doesn't exist yet
-        if (
-          shortcutDetails.target !== appLocation
-          || shortcutDetails.appUserModelId !== appID
-        ) {
-          throw 'needUpdate';
-        }
-      } catch (error) { // If not valid -> Register shortcut
-        shell.writeShortcutLink(
-          shortcutPath,
-          error === 'needUpdate' ? 'update' : 'create',
-          {
-            target: appLocation,
-            cwd: path.dirname(appLocation),
-            description: 'YouTube Music Desktop App - including custom plugins',
-            appUserModelId: appID,
-          },
-        );
-      }
-    }
-  }
-
-  mainWindow = createMainWindow();
-  setApplicationMenu(mainWindow);
-  setUpTray(app, mainWindow);
-
-  setupProtocolHandler(mainWindow);
-
-  app.on('second-instance', (_, commandLine) => {
-    const uri = `${APP_PROTOCOL}://`;
-    const protocolArgv = commandLine.find((arg) => arg.startsWith(uri));
-    if (protocolArgv) {
-      const lastIndex = protocolArgv.endsWith('/') ? -1 : undefined;
-      const command = protocolArgv.slice(uri.length, lastIndex);
-      if (is.dev()) {
-        console.debug(`Received command over protocol: "${command}"`);
-      }
-
-      handleProtocol(command);
-      return;
-    }
-
-    if (!mainWindow) {
-      return;
-    }
-
-    if (mainWindow.isMinimized()) {
-      mainWindow.restore();
-    }
-
-    if (!mainWindow.isVisible()) {
-      mainWindow.show();
-    }
-
-    mainWindow.focus();
-  });
-
-  // Autostart at login
-  app.setLoginItemSettings({
-    openAtLogin: config.get('options.startAtLogin'),
-  });
-
-  if (!is.dev() && config.get('options.autoUpdates')) {
-    const updateTimeout = setTimeout(() => {
-      autoUpdater.checkForUpdatesAndNotify();
-      clearTimeout(updateTimeout);
-    }, 2000);
-    autoUpdater.on('update-available', () => {
-      const downloadLink
-        = 'https://github.com/th-ch/youtube-music/releases/latest';
-      const dialogOptions: Electron.MessageBoxOptions = {
-        type: 'info',
-        buttons: ['OK', 'Download', 'Disable updates'],
-        title: 'Application Update',
-        message: 'A new version is available',
-        detail: `A new version is available and can be downloaded at ${downloadLink}`,
-      };
-      dialog.showMessageBox(dialogOptions).then((dialogOutput) => {
-        switch (dialogOutput.response) {
-          // Download
-          case 1: {
-            shell.openExternal(downloadLink);
-            break;
-          }
-
-          // Disable updates
-          case 2: {
-            config.set('options.autoUpdates', false);
-            break;
-          }
-
-          default: {
-            break;
-          }
-        }
-      });
-    });
-  }
-
-  if (config.get('options.hideMenu') && !config.get('options.hideMenuWarned')) {
-    dialog.showMessageBox(mainWindow, {
-      type: 'info', title: 'Hide Menu Enabled',
-      message: "Menu is hidden, use 'Alt' to show it (or 'Escape' if using in-app-menu)",
-    });
-    config.set('options.hideMenuWarned', true);
-  }
-
-  // Optimized for Mac OS X
-  if (is.macOS() && !config.get('options.appVisible')) {
-    app.dock.hide();
-  }
-
-  let forceQuit = false;
-  app.on('before-quit', () => {
-    forceQuit = true;
-  });
-
-  if (is.macOS() || config.get('options.tray')) {
-    mainWindow.on('close', (event) => {
-      // Hide the window instead of quitting (quit is available in tray options)
-      if (!forceQuit) {
-        event.preventDefault();
-        mainWindow!.hide();
-      }
-    });
-  }
-});
-
-function showUnresponsiveDialog(win: BrowserWindow, details: Electron.RenderProcessGoneDetails) {
-  if (details) {
-    console.log('Unresponsive Error!\n' + JSON.stringify(details, null, '\t'));
-  }
-
-  dialog.showMessageBox(win, {
-    type: 'error',
-    title: 'Window Unresponsive',
-    message: 'The Application is Unresponsive',
-    detail: 'We are sorry for the inconvenience! please choose what to do:',
-    buttons: ['Wait', 'Relaunch', 'Quit'],
-    cancelId: 0,
-  }).then((result) => {
-    switch (result.response) {
-      case 1: {
-        restart();
-        break;
-      }
-
-      case 2: {
-        app.quit();
-        break;
-      }
-    }
-  });
-}
-
-// HACK: electron-better-web-request's typing is wrong
-type BetterSession = Omit<Electron.Session, 'webRequest'> & { webRequest: BetterWebRequest & Electron.WebRequest };
-function removeContentSecurityPolicy(
-  betterSession: BetterSession = session.defaultSession as BetterSession,
-) {
-  // Allows defining multiple "onHeadersReceived" listeners
-  // by enhancing the session.
-  // Some plugins (e.g. adblocker) also define a "onHeadersReceived" listener
-  enhanceWebRequest(betterSession);
-
-  // Custom listener to tweak the content security policy
-  betterSession.webRequest.onHeadersReceived((details, callback) => {
-    details.responseHeaders ??= {};
-
-    // Remove the content security policy
-    delete details.responseHeaders['content-security-policy-report-only'];
-    delete details.responseHeaders['content-security-policy'];
-
-    callback({ cancel: false, responseHeaders: details.responseHeaders });
-  });
-
-  type ResolverListener = { apply: () => Promise<Record<string, unknown>>; context: unknown };
-  // When multiple listeners are defined, apply them all
-  betterSession.webRequest.setResolver('onHeadersReceived', async (listeners: ResolverListener[]) => {
-    return listeners.reduce<Promise<Record<string, unknown>>>(
-      async (accumulator: Promise<Record<string, unknown>>, listener: ResolverListener) => {
-        const acc = await accumulator;
-        if (acc.cancel) {
-          return acc;
-        }
-
-        const result = await listener.apply();
-        return { ...accumulator, ...result };
-      },
-      Promise.resolve({ cancel: false }),
-    );
-  });
-}

menu.ts

@@ -1,472 +0,0 @@
-import is from 'electron-is';
-import { app, BrowserWindow, clipboard, dialog, Menu } from 'electron';
-import prompt from 'custom-electron-prompt';
-
-import { restart } from './providers/app-controls';
-import config from './config';
-import { startingPages } from './providers/extracted-data';
-import promptOptions from './providers/prompt-options';
-
-import adblockerMenu from './plugins/adblocker/menu';
-import captionsSelectorMenu from './plugins/captions-selector/menu';
-import crossfadeMenu from './plugins/crossfade/menu';
-import disableAutoplayMenu from './plugins/disable-autoplay/menu';
-import discordMenu from './plugins/discord/menu';
-import downloaderMenu from './plugins/downloader/menu';
-import lyricsGeniusMenu from './plugins/lyrics-genius/menu';
-import notificationsMenu from './plugins/notifications/menu';
-import pictureInPictureMenu from './plugins/picture-in-picture/menu';
-import preciseVolumeMenu from './plugins/precise-volume/menu';
-import shortcutsMenu from './plugins/shortcuts/menu';
-import videoToggleMenu from './plugins/video-toggle/menu';
-import visualizerMenu from './plugins/visualizer/menu';
-import { getAvailablePluginNames } from './plugins/utils';
-
-export type MenuTemplate = Electron.MenuItemConstructorOptions[];
-
-// True only if in-app-menu was loaded on launch
-const inAppMenuActive = config.plugins.isEnabled('in-app-menu');
-
-const betaPlugins = ['crossfade', 'lumiastream'];
-
-const pluginMenus = {
-  'adblocker': adblockerMenu,
-  'disable-autoplay': disableAutoplayMenu,
-  'captions-selector': captionsSelectorMenu,
-  'crossfade': crossfadeMenu,
-  'discord': discordMenu,
-  'downloader': downloaderMenu,
-  'lyrics-genius': lyricsGeniusMenu,
-  'notifications': notificationsMenu,
-  'picture-in-picture': pictureInPictureMenu,
-  'precise-volume': preciseVolumeMenu,
-  'shortcuts': shortcutsMenu,
-  'video-toggle': videoToggleMenu,
-  'visualizer': visualizerMenu,
-};
-
-const pluginEnabledMenu = (plugin: string, label = '', hasSubmenu = false, refreshMenu: (() => void ) | undefined = undefined): Electron.MenuItemConstructorOptions => ({
-  label: label || plugin,
-  type: 'checkbox',
-  checked: config.plugins.isEnabled(plugin),
-  click(item: Electron.MenuItem) {
-    if (item.checked) {
-      config.plugins.enable(plugin);
-    } else {
-      config.plugins.disable(plugin);
-    }
-
-    if (hasSubmenu) {
-      refreshMenu?.();
-    }
-  },
-});
-
-export const mainMenuTemplate = (win: BrowserWindow): MenuTemplate => {
-  const refreshMenu = () => {
-    setApplicationMenu(win);
-    if (inAppMenuActive) {
-      win.webContents.send('refreshMenu');
-    }
-  };
-
-  return [
-    {
-      label: 'Plugins',
-      submenu:
-        getAvailablePluginNames().map((pluginName) => {
-          let pluginLabel = pluginName;
-          if (betaPlugins.includes(pluginLabel)) {
-            pluginLabel += ' [beta]';
-          }
-
-          if (Object.hasOwn(pluginMenus, pluginName)) {
-            const getPluginMenu = pluginMenus[pluginName as keyof typeof pluginMenus];
-
-            if (!config.plugins.isEnabled(pluginName)) {
-              return pluginEnabledMenu(pluginName, pluginLabel, true, refreshMenu);
-            }
-
-            return {
-              label: pluginLabel,
-              submenu: [
-                pluginEnabledMenu(pluginName, 'Enabled', true, refreshMenu),
-                { type: 'separator' },
-                ...getPluginMenu(win, config.plugins.getOptions(pluginName), refreshMenu),
-              ],
-            } satisfies Electron.MenuItemConstructorOptions;
-          }
-
-          return pluginEnabledMenu(pluginName, pluginLabel);
-        }),
-    },
-    {
-      label: 'Options',
-      submenu: [
-        {
-          label: 'Auto-update',
-          type: 'checkbox',
-          checked: config.get('options.autoUpdates'),
-          click(item) {
-            config.setMenuOption('options.autoUpdates', item.checked);
-          },
-        },
-        {
-          label: 'Resume last song when app starts',
-          type: 'checkbox',
-          checked: config.get('options.resumeOnStart'),
-          click(item) {
-            config.setMenuOption('options.resumeOnStart', item.checked);
-          },
-        },
-        {
-          label: 'Starting page',
-          submenu: (() => {
-            const subMenuArray: Electron.MenuItemConstructorOptions[] = Object.keys(startingPages).map((name) => ({
-              label: name,
-              type: 'radio',
-              checked: config.get('options.startingPage') === name,
-              click() {
-                config.set('options.startingPage', name);
-              },
-            }));
-            subMenuArray.unshift({
-              label: 'Unset',
-              type: 'radio',
-              checked: config.get('options.startingPage') === '',
-              click() {
-                config.set('options.startingPage', '');
-              },
-            });
-            return subMenuArray;
-          })(),
-        },
-        {
-          label: 'Visual Tweaks',
-          submenu: [
-            {
-              label: 'Remove upgrade button',
-              type: 'checkbox',
-              checked: config.get('options.removeUpgradeButton'),
-              click(item) {
-                config.setMenuOption('options.removeUpgradeButton', item.checked);
-              },
-            },
-            {
-              label: 'Like buttons',
-              submenu: [
-                {
-                  label: 'Default',
-                  type: 'radio',
-                  checked: !config.get('options.likeButtons'),
-                  click() {
-                    config.set('options.likeButtons', '');
-                  },
-                },
-                {
-                  label: 'Force show',
-                  type: 'radio',
-                  checked: config.get('options.likeButtons') === 'force',
-                  click() {
-                    config.set('options.likeButtons', 'force');
-                  },
-                },
-                {
-                  label: 'Hide',
-                  type: 'radio',
-                  checked: config.get('options.likeButtons') === 'hide',
-                  click() {
-                    config.set('options.likeButtons', 'hide');
-                  },
-                },
-              ],
-            },
-            {
-              label: 'Theme',
-              submenu: [
-                {
-                  label: 'No theme',
-                  type: 'radio',
-                  checked: config.get('options.themes')?.length === 0, // Todo rename "themes"
-                  click() {
-                    config.set('options.themes', []);
-                  },
-                },
-                { type: 'separator' },
-                {
-                  label: 'Import custom CSS file',
-                  type: 'normal',
-                  async click() {
-                    const { filePaths } = await dialog.showOpenDialog({
-                      filters: [{ name: 'CSS Files', extensions: ['css'] }],
-                      properties: ['openFile', 'multiSelections'],
-                    });
-                    if (filePaths) {
-                      config.set('options.themes', filePaths);
-                    }
-                  },
-                },
-              ],
-            },
-          ],
-        },
-        {
-          label: 'Single instance lock',
-          type: 'checkbox',
-          checked: true,
-          click(item) {
-            if (!item.checked && app.hasSingleInstanceLock()) {
-              app.releaseSingleInstanceLock();
-            } else if (item.checked && !app.hasSingleInstanceLock()) {
-              app.requestSingleInstanceLock();
-            }
-          },
-        },
-        {
-          label: 'Always on top',
-          type: 'checkbox',
-          checked: config.get('options.alwaysOnTop'),
-          click(item) {
-            config.setMenuOption('options.alwaysOnTop', item.checked);
-            win.setAlwaysOnTop(item.checked);
-          },
-        },
-        ...(is.windows() || is.linux()
-          ? [
-            {
-              label: 'Hide menu',
-              type: 'checkbox',
-              checked: config.get('options.hideMenu'),
-              click(item) {
-                config.setMenuOption('options.hideMenu', item.checked);
-                if (item.checked && !config.get('options.hideMenuWarned')) {
-                  dialog.showMessageBox(win, {
-                    type: 'info', title: 'Hide Menu Enabled',
-                    message: 'Menu will be hidden on next launch, use [Alt] to show it (or backtick [`] if using in-app-menu)',
-                  });
-                }
-              },
-            },
-          ]
-          : []) satisfies Electron.MenuItemConstructorOptions[],
-        ...(is.windows() || is.macOS()
-          ? // Only works on Win/Mac
-          // https://www.electronjs.org/docs/api/app#appsetloginitemsettingssettings-macos-windows
-          [
-            {
-              label: 'Start at login',
-              type: 'checkbox',
-              checked: config.get('options.startAtLogin'),
-              click(item) {
-                config.setMenuOption('options.startAtLogin', item.checked);
-              },
-            },
-          ]
-          : []) satisfies Electron.MenuItemConstructorOptions[],
-        {
-          label: 'Tray',
-          submenu: [
-            {
-              label: 'Disabled',
-              type: 'radio',
-              checked: !config.get('options.tray'),
-              click() {
-                config.setMenuOption('options.tray', false);
-                config.setMenuOption('options.appVisible', true);
-              },
-            },
-            {
-              label: 'Enabled + app visible',
-              type: 'radio',
-              checked: config.get('options.tray') && config.get('options.appVisible'),
-              click() {
-                config.setMenuOption('options.tray', true);
-                config.setMenuOption('options.appVisible', true);
-              },
-            },
-            {
-              label: 'Enabled + app hidden',
-              type: 'radio',
-              checked: config.get('options.tray') && !config.get('options.appVisible'),
-              click() {
-                config.setMenuOption('options.tray', true);
-                config.setMenuOption('options.appVisible', false);
-              },
-            },
-            { type: 'separator' },
-            {
-              label: 'Play/Pause on click',
-              type: 'checkbox',
-              checked: config.get('options.trayClickPlayPause'),
-              click(item) {
-                config.setMenuOption('options.trayClickPlayPause', item.checked);
-              },
-            },
-          ],
-        },
-        { type: 'separator' },
-        {
-          label: 'Advanced options',
-          submenu: [
-            {
-              label: 'Set Proxy',
-              type: 'normal',
-              async click(item) {
-                await setProxy(item, win);
-              },
-            },
-            {
-              label: 'Override useragent',
-              type: 'checkbox',
-              checked: config.get('options.overrideUserAgent'),
-              click(item) {
-                config.setMenuOption('options.overrideUserAgent', item.checked);
-              },
-            },
-            {
-              label: 'Disable hardware acceleration',
-              type: 'checkbox',
-              checked: config.get('options.disableHardwareAcceleration'),
-              click(item) {
-                config.setMenuOption('options.disableHardwareAcceleration', item.checked);
-              },
-            },
-            {
-              label: 'Restart on config changes',
-              type: 'checkbox',
-              checked: config.get('options.restartOnConfigChanges'),
-              click(item) {
-                config.setMenuOption('options.restartOnConfigChanges', item.checked);
-              },
-            },
-            {
-              label: 'Reset App cache when app starts',
-              type: 'checkbox',
-              checked: config.get('options.autoResetAppCache'),
-              click(item) {
-                config.setMenuOption('options.autoResetAppCache', item.checked);
-              },
-            },
-            { type: 'separator' },
-            is.macOS()
-              ? {
-                label: 'Toggle DevTools',
-                // Cannot use "toggleDevTools" role in macOS
-                click() {
-                  const { webContents } = win;
-                  if (webContents.isDevToolsOpened()) {
-                    webContents.closeDevTools();
-                  } else {
-                    webContents.openDevTools();
-                  }
-                },
-              }
-              : { role: 'toggleDevTools' },
-            {
-              label: 'Edit config.json',
-              click() {
-                config.edit();
-              },
-            },
-          ],
-        },
-      ],
-    },
-    {
-      label: 'View',
-      submenu: [
-        { role: 'reload' },
-        { role: 'forceReload' },
-        { type: 'separator' },
-        { role: 'zoomIn', accelerator: process.platform === 'darwin' ? 'Cmd+I' : 'Ctrl+I' },
-        { role: 'zoomOut', accelerator: process.platform === 'darwin' ? 'Cmd+O' : 'Ctrl+O' },
-        { role: 'resetZoom' },
-        { type: 'separator' },
-        { role: 'togglefullscreen' },
-      ],
-    },
-    {
-      label: 'Navigation',
-      submenu: [
-        {
-          label: 'Go back',
-          click() {
-            if (win.webContents.canGoBack()) {
-              win.webContents.goBack();
-            }
-          },
-        },
-        {
-          label: 'Go forward',
-          click() {
-            if (win.webContents.canGoForward()) {
-              win.webContents.goForward();
-            }
-          },
-        },
-        {
-          label: 'Copy current URL',
-          click() {
-            const currentURL = win.webContents.getURL();
-            clipboard.writeText(currentURL);
-          },
-        },
-        {
-          label: 'Restart App',
-          click: restart,
-        },
-        { role: 'quit' },
-      ],
-    },
-  ];
-};
-export const setApplicationMenu = (win: Electron.BrowserWindow) => {
-  const menuTemplate: MenuTemplate = [...mainMenuTemplate(win)];
-  if (process.platform === 'darwin') {
-    const { name } = app;
-    menuTemplate.unshift({
-      label: name,
-      submenu: [
-        { role: 'about' },
-        { type: 'separator' },
-        { role: 'hide' },
-        { role: 'hideOthers' },
-        { role: 'unhide' },
-        { type: 'separator' },
-        { role: 'selectAll' },
-        { role: 'cut' },
-        { role: 'copy' },
-        { role: 'paste' },
-        { type: 'separator' },
-        { role: 'minimize' },
-        { role: 'close' },
-        { role: 'quit' },
-      ],
-    });
-  }
-
-  const menu = Menu.buildFromTemplate(menuTemplate);
-  Menu.setApplicationMenu(menu);
-};
-
-async function setProxy(item: Electron.MenuItem, win: BrowserWindow) {
-  const output = await prompt({
-    title: 'Set Proxy',
-    label: 'Enter Proxy Address: (leave empty to disable)',
-    value: config.get('options.proxy'),
-    type: 'input',
-    inputAttrs: {
-      type: 'url',
-      placeholder: "Example: 'socks5://127.0.0.1:9999",
-    },
-    width: 450,
-    ...promptOptions(),
-  }, win);
-
-  if (typeof output === 'string') {
-    config.setMenuOption('options.proxy', output);
-    item.checked = output !== '';
-  } else { // User pressed cancel
-    item.checked = !item.checked; // Reset checkbox
-  }
-}

package.json

@@ -1,9 +1,9 @@
 {
   "name": "youtube-music",
   "productName": "YouTube Music",
-  "version": "2.0.0",
+  "version": "3.6.1",
   "description": "YouTube Music Desktop App - including custom plugins",
-  "main": "./dist/index.js",
+  "main": "./dist/main/index.js",
   "license": "MIT",
   "repository": "th-ch/youtube-music",
   "author": {
@@ -17,31 +17,18 @@
     "files": [
       "!*",
       "dist",
+      "assets",
       "license",
       "!node_modules",
       "node_modules/custom-electron-prompt/**",
-      "node_modules/youtubei.js/**",
-      "node_modules/undici/**",
-      "node_modules/@fastify/busboy/**",
-      "node_modules/jintr/**",
-      "node_modules/acorn/**",
-      "node_modules/tslib/**",
-      "node_modules/semver/**",
-      "node_modules/lru-cache/**",
-      "node_modules/detect-libc/**",
-      "node_modules/color/**",
-      "node_modules/color-convert/**",
-      "node_modules/color-string/**",
-      "node_modules/color-name/**",
-      "node_modules/simple-swizzle/**",
-      "node_modules/is-arrayish/**",
       "node_modules/@cliqz/adblocker-electron-preload/**",
-      "node_modules/@cliqz/adblocker-content/**",
-      "node_modules/@cliqz/adblocker-extended-selectors/**",
       "node_modules/@ffmpeg.wasm/core-mt/**",
       "!node_modules/**/*.map",
       "!node_modules/**/*.ts"
     ],
+    "asarUnpack": [
+      "assets"
+    ],
     "mac": {
       "identity": null,
       "target": [
@@ -53,13 +40,14 @@
           ]
         }
       ],
-      "icon": "assets/generated/icons/mac/icon.icns"
+      "icon": "assets/generated/icons/mac/icon.icns",
+      "compression": "maximum"
     },
     "win": {
       "icon": "assets/generated/icons/win/icon.ico",
       "target": [
         {
-          "target": "nsis",
+          "target": "nsis-web",
           "arch": [
             "x64",
             "ia32",
@@ -74,20 +62,98 @@
             "arm64"
           ]
         }
-      ]
+      ],
+      "compression": "maximum"
     },
-    "nsis": {
+    "nsisWeb": {
       "runAfterFinish": false
     },
     "linux": {
       "icon": "assets/generated/icons/png",
       "category": "AudioVideo",
       "target": [
-        "AppImage",
-        "snap",
-        "freebsd",
-        "deb",
-        "rpm"
+        {
+          "target": "AppImage",
+          "arch": [
+            "x64",
+            "arm64",
+            "armv7l"
+          ]
+        },
+        {
+          "target": "flatpak",
+          "arch": [
+            "x64"
+          ]
+        },
+        {
+          "target": "deb",
+          "arch": [
+            "x64",
+            "arm64",
+            "armv7l"
+          ]
+        },
+        {
+          "target": "rpm",
+          "arch": [
+            "x64",
+            "arm64"
+          ]
+        },
+        {
+          "target": "snap",
+          "arch": [
+            "x64"
+          ]
+        },
+        {
+          "target": "freebsd",
+          "arch": [
+            "x64",
+            "arm64",
+            "armv7l"
+          ]
+        },
+        {
+          "target": "tar.gz",
+          "arch": [
+            "x64",
+            "arm64",
+            "armv7l"
+          ]
+        }
+      ]
+    },
+    "appImage": {
+      "description": "YouTube Music Desktop App bundled with custom plugins (and built-in ad blocker / downloader)",
+      "category": "AudioVideo"
+    },
+    "flatpak": {
+      "description": "YouTube Music Desktop App bundled with custom plugins (and built-in ad blocker / downloader)",
+      "category": "AudioVideo"
+    },
+    "deb": {
+      "depends": [
+        "libgtk-3-0",
+        "libnotify4",
+        "libnss3",
+        "libxss1",
+        "libxtst6",
+        "xdg-utils",
+        "libatspi2.0-0",
+        "libuuid1",
+        "libasound2",
+        "libgbm1"
+      ]
+    },
+    "rpm": {
+      "depends": [
+        "/usr/lib64/libuuid.so.1"
+      ],
+      "fpm": [
+        "--rpm-rpmbuild-define",
+        "_build_id_links none"
       ]
     },
     "snap": {
@@ -104,104 +170,147 @@
     }
   },
   "scripts": {
-    "test": "npm run build && playwright test",
-    "test:debug": "DEBUG=pw:browser* npm run build && playwright test",
-    "rollup:preload": "rollup -c rollup.preload.config.ts --configPlugin @rollup/plugin-typescript --bundleConfigAsCjs",
-    "rollup:main": "rollup -c rollup.main.config.ts --configPlugin @rollup/plugin-typescript --bundleConfigAsCjs",
-    "build": "npm run rollup:preload && npm run rollup:main",
-    "start": "npm run build && electron ./dist/index.js",
-    "start:debug": "ELECTRON_ENABLE_LOGGING=1 npm run start",
-    "generate:package": "node utils/generate-package-json.js",
-    "postinstall": "npm run plugins && npm run clean",
-    "clean": "del-cli dist && del-cli pack",
-    "dist": "npm run clean && npm run build && electron-builder --win --mac --linux -p never",
-    "dist:linux": "npm run clean && npm run build && electron-builder --linux -p never",
-    "dist:mac": "npm run clean && npm run build && electron-builder --mac dmg:x64 -p never",
-    "dist:mac:arm64": "npm run clean && npm run build && electron-builder --mac dmg:arm64 -p never",
-    "dist:win": "npm run clean && npm run build && electron-builder --win -p never",
-    "dist:win:x64": "npm run clean && npm run build && electron-builder --win nsis:x64 -p never",
+    "test": "playwright test",
+    "test:debug": "cross-env DEBUG=pw:*,-pw:test:protocol playwright test",
+    "build": "electron-vite build",
+    "vite:inspect": "pnpm clean && electron-vite build --mode development && pnpm exec serve .vite-inspect",
+    "start": "electron-vite preview",
+    "start:debug": "cross-env ELECTRON_ENABLE_LOGGING=1 pnpm start",
+    "dev": "cross-env NODE_OPTIONS=--enable-source-maps electron-vite dev --watch",
+    "dev:debug": "cross-env ELECTRON_ENABLE_LOGGING=1 pnpm dev",
+    "clean": "del-cli dist && del-cli pack && del-cli .vite-inspect",
+    "dist": "pnpm clean && pnpm build && pnpm electron-builder --win --mac --linux -p never",
+    "dist:linux": "pnpm clean && pnpm build && pnpm electron-builder --linux -p never",
+    "dist:linux:deb-arm64": "pnpm clean && pnpm build && pnpm electron-builder --linux deb:arm64 -p never",
+    "dist:linux:rpm-arm64": "pnpm clean && pnpm build && pnpm electron-builder --linux rpm:arm64 -p never",
+    "dist:mac": "pnpm clean && pnpm build && pnpm electron-builder --mac dmg:x64 -p never",
+    "dist:mac:arm64": "pnpm clean && pnpm build && pnpm electron-builder --mac dmg:arm64 -p never",
+    "dist:win": "pnpm clean && pnpm build && pnpm electron-builder --win -p never",
+    "dist:win:x64": "pnpm clean && pnpm build && pnpm electron-builder --win nsis-web:x64 -p never",
     "lint": "eslint .",
-    "changelog": "auto-changelog",
-    "plugins": "npm run plugin:bypass-age-restrictions",
-    "plugin:bypass-age-restrictions": "del-cli node_modules/simple-youtube-age-restriction-bypass/package.json && npm run generate:package simple-youtube-age-restriction-bypass",
-    "release:linux": "npm run clean && npm run build && electron-builder --linux -p always -c.snap.publish=github",
-    "release:mac": "npm run clean && npm run build && electron-builder --mac -p always",
-    "release:win": "npm run clean && npm run build && electron-builder --win -p always",
+    "changelog": "npx --yes auto-changelog",
+    "release:linux": "pnpm clean && pnpm build && pnpm electron-builder --linux -p always -c.snap.publish=github",
+    "release:mac": "pnpm clean && pnpm build && pnpm electron-builder --mac -p always",
+    "release:win": "pnpm clean && pnpm build && pnpm electron-builder --win -p always",
     "typecheck": "tsc -p tsconfig.json --noEmit"
   },
   "engines": {
-    "node": ">=16.0.0"
+    "node": ">=18",
+    "pnpm": ">=8"
+  },
+  "pnpm": {
+    "overrides": {
+      "usocket": "1.0.1",
+      "node-gyp": "10.2.0",
+      "xml2js": "0.6.2",
+      "node-fetch": "3.3.2",
+      "@electron/universal": "2.0.1",
+      "@babel/runtime": "7.25.7"
+    },
+    "patchedDependencies": {
+      "vudio@2.1.1": "patches/vudio@2.1.1.patch",
+      "app-builder-lib@24.13.3": "patches/app-builder-lib@24.13.3.patch",
+      "@malept/flatpak-bundler": "patches/@malept__flatpak-bundler.patch"
+    }
   },
   "dependencies": {
-    "@cliqz/adblocker-electron": "1.26.7",
+    "@cliqz/adblocker-electron": "1.27.1",
+    "@cliqz/adblocker-electron-preload": "1.27.1",
+    "@electron-toolkit/tsconfig": "1.0.1",
+    "@electron/remote": "2.1.2",
     "@ffmpeg.wasm/core-mt": "0.12.0",
     "@ffmpeg.wasm/main": "0.12.0",
-    "@foobar404/wave": "2.0.4",
-    "@xhayper/discord-rpc": "1.0.23",
-    "async-mutex": "0.4.0",
-    "butterchurn": "2.6.7",
-    "butterchurn-presets": "2.4.7",
-    "conf": "10.2.0",
-    "custom-electron-prompt": "1.5.7",
-    "electron-better-web-request": "1.0.1",
-    "electron-debug": "3.2.0",
+    "@floating-ui/dom": "1.6.11",
+    "@foobar404/wave": "2.0.5",
+    "@hono/node-server": "1.13.2",
+    "@hono/swagger-ui": "0.4.1",
+    "@hono/zod-openapi": "0.16.4",
+    "@hono/zod-validator": "0.4.1",
+    "@jellybrick/electron-better-web-request": "1.0.4",
+    "@jellybrick/mpris-service": "2.1.4",
+    "@jimp/plugin-invert": "0.22.12",
+    "@skyra/jaro-winkler": "1.1.1",
+    "@xhayper/discord-rpc": "1.2.0",
+    "async-mutex": "0.5.0",
+    "butterchurn": "3.0.0-beta.4",
+    "butterchurn-presets": "3.0.0-beta.4",
+    "color": "4.2.3",
+    "conf": "13.0.1",
+    "custom-electron-prompt": "1.5.8",
+    "dbus-next": "0.10.2",
+    "deepmerge-ts": "7.1.3",
+    "electron-debug": "4.1.0",
     "electron-is": "3.0.0",
     "electron-localshortcut": "3.2.1",
-    "electron-store": "8.1.0",
+    "electron-store": "10.0.0",
     "electron-unhandled": "4.0.1",
-    "electron-updater": "6.1.4",
+    "electron-updater": "6.3.9",
     "fast-average-color": "9.4.0",
+    "fast-equals": "5.0.1",
     "filenamify": "6.0.0",
+    "hono": "4.6.4",
     "howler": "2.2.4",
     "html-to-text": "9.0.5",
+    "i18next": "23.16.0",
+    "jimp": "1.6.0",
     "keyboardevent-from-electron-accelerator": "2.0.0",
     "keyboardevents-areequal": "0.2.2",
-    "mpris-service": "2.1.2",
+    "node-html-parser": "6.1.13",
     "node-id3": "0.2.6",
-    "simple-youtube-age-restriction-bypass": "git+https://github.com/MiepHD/Simple-YouTube-Age-Restriction-Bypass.git#v2.5.5",
+    "peerjs": "1.5.4",
+    "semver": "7.6.3",
+    "serve": "14.2.3",
+    "simple-youtube-age-restriction-bypass": "github:organization/Simple-YouTube-Age-Restriction-Bypass#v2.5.9",
+    "solid-floating-ui": "0.3.1",
+    "solid-js": "1.9.2",
+    "solid-styled-components": "0.28.5",
+    "solid-transition-group": "0.2.3",
+    "ts-morph": "24.0.0",
     "vudio": "2.1.1",
     "x11": "2.3.0",
-    "youtubei.js": "6.4.1",
-    "ytpl": "2.3.0"
-  },
-  "overrides": {
-    "rollup": "4.0.2",
-    "node-gyp": "9.4.0",
-    "xml2js": "0.6.2",
-    "dbus-next": "0.10.2",
-    "node-fetch": "2.7.0",
-    "@electron/universal": "1.4.2",
-    "electron": "27.0.0-beta.9"
+    "youtubei.js": "10.5.0",
+    "zod": "3.23.8"
   },
   "devDependencies": {
-    "@playwright/test": "1.38.1",
-    "@rollup/plugin-commonjs": "25.0.5",
-    "@rollup/plugin-image": "3.0.3",
-    "@rollup/plugin-json": "6.0.1",
-    "@rollup/plugin-node-resolve": "15.2.2",
-    "@rollup/plugin-terser": "0.4.4",
-    "@rollup/plugin-typescript": "11.1.5",
-    "@rollup/plugin-wasm": "6.2.2",
-    "@total-typescript/ts-reset": "0.5.1",
-    "@types/electron-localshortcut": "3.1.1",
-    "@types/howler": "2.2.9",
-    "@types/html-to-text": "9.0.2",
-    "@typescript-eslint/eslint-plugin": "6.7.4",
-    "auto-changelog": "2.4.0",
-    "del-cli": "5.1.0",
-    "electron": "27.0.0-beta.9",
-    "electron-builder": "24.6.4",
+    "@eslint/js": "9.12.0",
+    "@playwright/test": "1.48.0",
+    "@stylistic/eslint-plugin-js": "2.9.0",
+    "@total-typescript/ts-reset": "0.6.1",
+    "@types/color": "3.0.6",
+    "@types/electron-localshortcut": "3.1.3",
+    "@types/eslint__js": "8.42.3",
+    "@types/howler": "2.2.12",
+    "@types/html-to-text": "9.0.4",
+    "@types/semver": "7.5.8",
+    "@types/trusted-types": "2.0.7",
+    "bufferutil": "4.0.8",
+    "builtin-modules": "4.0.0",
+    "cross-env": "7.0.3",
+    "del-cli": "6.0.0",
+    "discord-api-types": "0.37.101",
+    "electron": "32.2.0",
+    "electron-builder": "24.13.3",
     "electron-devtools-installer": "3.2.0",
-    "eslint": "8.51.0",
-    "eslint-plugin-import": "2.28.1",
-    "eslint-plugin-prettier": "5.0.0",
-    "node-gyp": "9.4.0",
-    "playwright": "1.38.1",
-    "rollup": "4.0.2",
-    "rollup-plugin-copy": "3.5.0",
-    "rollup-plugin-import-css": "3.3.4",
-    "rollup-plugin-string": "3.0.0",
-    "typescript": "5.2.2"
+    "electron-vite": "2.3.0",
+    "esbuild": "0.24.0",
+    "eslint": "9.12.0",
+    "eslint-config-prettier": "9.1.0",
+    "eslint-import-resolver-exports": "1.0.0-beta.5",
+    "eslint-import-resolver-typescript": "3.6.3",
+    "eslint-plugin-import": "2.31.0",
+    "eslint-plugin-prettier": "5.2.1",
+    "glob": "11.0.0",
+    "node-gyp": "10.2.0",
+    "playwright": "1.48.0",
+    "rollup": "4.24.0",
+    "typescript": "5.6.3",
+    "typescript-eslint": "8.8.1",
+    "utf-8-validate": "6.0.4",
+    "vite": "5.4.8",
+    "vite-plugin-inspect": "0.8.7",
+    "vite-plugin-resolve": "2.5.2",
+    "vite-plugin-solid": "2.10.2",
+    "ws": "8.18.0"
   },
   "auto-changelog": {
     "hideCredit": true,

patches/@malept__flatpak-bundler.patch

@@ -0,0 +1,29 @@
+diff --git a/index.js b/index.js
+index 5968fcf47b69094993b0f861c03f5560e4a6a9b7..0fe16d4f40612c0abfa57898909ce0083f56944c 100644
+--- a/index.js
++++ b/index.js
+@@ -56,19 +56,23 @@ function getOptionsWithDefaults (options, manifest) {
+ async function spawnWithLogging (options, command, args, allowFail) {
+   return new Promise((resolve, reject) => {
+     logger(`$ ${command} ${args.join(' ')}`)
++    const output = []
+     const child = childProcess.spawn(command, args, { cwd: options['working-dir'] })
+     child.stdout.on('data', (data) => {
++      output.push(data)
+       logger(`1> ${data}`)
+     })
+     child.stderr.on('data', (data) => {
++      output.push(data)
+       logger(`2> ${data}`)
+     })
+     child.on('error', (error) => {
++      logger(`error - ${error.message} ${error.stack}`)
+       reject(error)
+     })
+     child.on('close', (code) => {
+       if (!allowFail && code !== 0) {
+-        reject(new Error(`${command} failed with status code ${code}`))
++        reject(new Error(`${command} ${args.join(' ')} failed with status code ${code} ${output.join(' ')}`))
+       }
+       resolve(code === 0)
+     })

patches/app-builder-lib@24.13.3.patch

@@ -0,0 +1,21 @@
+diff --git a/out/targets/snap.js b/out/targets/snap.js
+index f72c36355d27cd2d69fc5fdf2d8bb2451db0287f..baae112fe25ebb49ab8e25aaa48efd6bc43b598f 100644
+--- a/out/targets/snap.js
++++ b/out/targets/snap.js
+@@ -212,14 +212,14 @@ class SnapTarget extends core_1.Target {
+             args.push("--template-url", `electron4:${snapArch}`);
+         }
+         await (0, builder_util_1.executeAppBuilder)(args);
+-        const publishConfig = findSnapPublishConfig(this.packager.config);
++
+         await packager.info.callArtifactBuildCompleted({
+             file: artifactPath,
+             safeArtifactName: packager.computeSafeArtifactName(artifactName, "snap", arch, false),
+             target: this,
+             arch,
+             packager,
+-            publishConfig: publishConfig == null ? { provider: "snapStore" } : publishConfig,
++            publishConfig: options.publish == null ? { provider: "snapStore" } : null,
+         });
+     }
+     isElectronVersionGreaterOrEqualThan(version) {

patches/eslint-plugin-import@2.29.1.patch

@@ -0,0 +1,161 @@
+diff --git a/lib/importDeclaration.js b/lib/importDeclaration.js
+index afb4de779034cfea080825a5f4320661c48bee32..f10b0a11a39577fbd42569e6b0e768255c1ef276 100644
+--- a/lib/importDeclaration.js
++++ b/lib/importDeclaration.js
+@@ -1,5 +1,5 @@
+-"use strict";Object.defineProperty(exports, "__esModule", { value: true });exports["default"] = importDeclaration;function importDeclaration(context) {
+-  var ancestors = context.getAncestors();
++"use strict";Object.defineProperty(exports, "__esModule", { value: true });exports["default"] = importDeclaration;function importDeclaration(context, node) {
++  var ancestors = context.getSourceCode().getAncestors(node);
+   return ancestors[ancestors.length - 1];
+ }
+ //# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uL3NyYy9pbXBvcnREZWNsYXJhdGlvbi5qcyJdLCJuYW1lcyI6WyJpbXBvcnREZWNsYXJhdGlvbiIsImNvbnRleHQiLCJhbmNlc3RvcnMiLCJnZXRBbmNlc3RvcnMiLCJsZW5ndGgiXSwibWFwcGluZ3MiOiJnR0FBd0JBLGlCLENBQVQsU0FBU0EsaUJBQVQsQ0FBMkJDLE9BQTNCLEVBQW9DO0FBQ2pELE1BQU1DLFlBQVlELFFBQVFFLFlBQVIsRUFBbEI7QUFDQSxTQUFPRCxVQUFVQSxVQUFVRSxNQUFWLEdBQW1CLENBQTdCLENBQVA7QUFDRCIsImZpbGUiOiJpbXBvcnREZWNsYXJhdGlvbi5qcyIsInNvdXJjZXNDb250ZW50IjpbImV4cG9ydCBkZWZhdWx0IGZ1bmN0aW9uIGltcG9ydERlY2xhcmF0aW9uKGNvbnRleHQpIHtcbiAgY29uc3QgYW5jZXN0b3JzID0gY29udGV4dC5nZXRBbmNlc3RvcnMoKTtcbiAgcmV0dXJuIGFuY2VzdG9yc1thbmNlc3RvcnMubGVuZ3RoIC0gMV07XG59XG4iXX0=
+\ No newline at end of file
+diff --git a/lib/rules/first.js b/lib/rules/first.js
+index a77168660cf32c8c3e96f3ff4b8240a36d7de3a6..c0e00d75f9989916057fef3999eeee8d21820292 100644
+--- a/lib/rules/first.js
++++ b/lib/rules/first.js
+@@ -66,7 +66,7 @@ module.exports = {
+                   }
+                 }
+                 if (nonImportCount > 0) {var _iteratorNormalCompletion = true;var _didIteratorError = false;var _iteratorError = undefined;try {
+-                    for (var _iterator = context.getDeclaredVariables(node)[Symbol.iterator](), _step; !(_iteratorNormalCompletion = (_step = _iterator.next()).done); _iteratorNormalCompletion = true) {var variable = _step.value;
++                    for (var _iterator = sourceCode.getDeclaredVariables(node)[Symbol.iterator](), _step; !(_iteratorNormalCompletion = (_step = _iterator.next()).done); _iteratorNormalCompletion = true) {var variable = _step.value;
+                       if (!shouldSort) {break;}
+                       var references = variable.references;
+                       if (references.length) {var _iteratorNormalCompletion2 = true;var _didIteratorError2 = false;var _iteratorError2 = undefined;try {
+diff --git a/lib/rules/namespace.js b/lib/rules/namespace.js
+index 574d89a60d15c7e0e712956ea6a3ad2d0eac7f08..82e7cb3cff4246592d762cce86323f2b72de92e4 100644
+--- a/lib/rules/namespace.js
++++ b/lib/rules/namespace.js
+@@ -86,7 +86,7 @@ module.exports = {
+ 
+         // same as above, but does not add names to local map
+         ExportNamespaceSpecifier: function () {function ExportNamespaceSpecifier(namespace) {
+-            var declaration = (0, _importDeclaration2['default'])(context);
++            var declaration = (0, _importDeclaration2['default'])(context, namespace);
+ 
+             var imports = _ExportMap2['default'].get(declaration.source.value, context);
+             if (imports == null) {return null;}
+diff --git a/lib/rules/newline-after-import.js b/lib/rules/newline-after-import.js
+index 6cc15686464a17803a0b976c35b99627cdbfabee..520eec6d9a375527ab72c459960fe4416c046c17 100644
+--- a/lib/rules/newline-after-import.js
++++ b/lib/rules/newline-after-import.js
+@@ -194,7 +194,7 @@ module.exports = {
+           }return CallExpression;}(),
+         'Program:exit': function () {function ProgramExit() {
+             log('exit processing for', context.getPhysicalFilename ? context.getPhysicalFilename() : context.getFilename());
+-            var scopeBody = getScopeBody(context.getScope());
++            var scopeBody = getScopeBody(context.getSourceCode().getScope(node));
+             log('got scope:', scopeBody);
+ 
+             requireCalls.forEach(function (node, index) {
+diff --git a/lib/rules/no-amd.js b/lib/rules/no-amd.js
+index 7ac108bf812ca4f78bfa6fe5ae8b9cf38e2ff497..346c3105dc70f72c4d76fcc6b96b946d1d4ec6d5 100644
+--- a/lib/rules/no-amd.js
++++ b/lib/rules/no-amd.js
+@@ -23,7 +23,7 @@ module.exports = {
+   create: function () {function create(context) {
+       return {
+         CallExpression: function () {function CallExpression(node) {
+-            if (context.getScope().type !== 'module') {return;}
++            if (context.getSourceCode().getScope(node).type !== 'module') {return;}
+ 
+             if (node.callee.type !== 'Identifier') {return;}
+             if (node.callee.name !== 'require' && node.callee.name !== 'define') {return;}
+diff --git a/lib/rules/no-commonjs.js b/lib/rules/no-commonjs.js
+index befeff0026d61d3ac1e6bbcea29f5c471dc1d353..e91c5ed34e968d5867e884ea800e166cda345aef 100644
+--- a/lib/rules/no-commonjs.js
++++ b/lib/rules/no-commonjs.js
+@@ -107,7 +107,7 @@ module.exports = {
+ 
+             // exports.
+             if (node.object.name === 'exports') {
+-              var isInScope = context.getScope().
++              var isInScope = context.getSourceCode().getScope(node).
+               variables.
+               some(function (variable) {return variable.name === 'exports';});
+               if (!isInScope) {
+@@ -117,7 +117,7 @@ module.exports = {
+ 
+           }return MemberExpression;}(),
+         CallExpression: function () {function CallExpression(call) {
+-            if (!validateScope(context.getScope())) {return;}
++            if (!validateScope(context.getSourceCode().getScope(call))) {return;}
+ 
+             if (call.callee.type !== 'Identifier') {return;}
+             if (call.callee.name !== 'require') {return;}
+diff --git a/lib/rules/no-mutable-exports.js b/lib/rules/no-mutable-exports.js
+index 40bd1b4cfa95d41732bb13bba0ed1969a91cc7ff..8a25abfbfadb299204b36a6cbf283259bcc2e790 100644
+--- a/lib/rules/no-mutable-exports.js
++++ b/lib/rules/no-mutable-exports.js
+@@ -32,7 +32,7 @@ module.exports = {
+       }
+ 
+       function handleExportDefault(node) {
+-        var scope = context.getScope();
++        var scope = context.getSourceCode().getScope(node);
+ 
+         if (node.declaration.name) {
+           checkDeclarationsInScope(scope, node.declaration.name);
+@@ -40,7 +40,7 @@ module.exports = {
+       }
+ 
+       function handleExportNamed(node) {
+-        var scope = context.getScope();
++        var scope = context.getSourceCode().getScope(node);
+ 
+         if (node.declaration) {
+           checkDeclaration(node.declaration);
+diff --git a/lib/rules/no-named-as-default-member.js b/lib/rules/no-named-as-default-member.js
+index 0c15051e027ad7d1d45f1b51c20be1c000b0af01..5b3d6ba415511b7f9f83a52e1acfebe5a1045a7b 100644
+--- a/lib/rules/no-named-as-default-member.js
++++ b/lib/rules/no-named-as-default-member.js
+@@ -35,7 +35,7 @@ module.exports = {
+ 
+       return {
+         ImportDefaultSpecifier: function () {function ImportDefaultSpecifier(node) {
+-            var declaration = (0, _importDeclaration2['default'])(context);
++            var declaration = (0, _importDeclaration2['default'])(context, node);
+             var exportMap = _ExportMap2['default'].get(declaration.source.value, context);
+             if (exportMap == null) {return;}
+ 
+diff --git a/lib/rules/no-named-as-default.js b/lib/rules/no-named-as-default.js
+index 63378a33a1c7da004c57a524cec1a1cddf23e210..c81b1f93b11628676158b79f1c4015911943cc7d 100644
+--- a/lib/rules/no-named-as-default.js
++++ b/lib/rules/no-named-as-default.js
+@@ -18,7 +18,7 @@ module.exports = {
+         // #566: default is a valid specifier
+         if (defaultSpecifier[nameKey].name === 'default') {return;}
+ 
+-        var declaration = (0, _importDeclaration2['default'])(context);
++        var declaration = (0, _importDeclaration2['default'])(context, defaultSpecifier);
+ 
+         var imports = _ExportMap2['default'].get(declaration.source.value, context);
+         if (imports == null) {return;}
+diff --git a/lib/rules/no-namespace.js b/lib/rules/no-namespace.js
+index 2b0c783adea788101b779b17f977bbcb582cfd3f..a7f7b202ac7c4a342febef2a993586c4cc84fc7a 100644
+--- a/lib/rules/no-namespace.js
++++ b/lib/rules/no-namespace.js
+@@ -43,7 +43,7 @@ var _docsUrl = require('../docsUrl');var _docsUrl2 = _interopRequireDefault(_doc
+               return;
+             }
+ 
+-            var scopeVariables = context.getScope().variables;
++            var scopeVariables = context.getSourceCode().getScope(node).variables;
+             var namespaceVariable = scopeVariables.find(function (variable) {return variable.defs[0].node === node;});
+             var namespaceReferences = namespaceVariable.references;
+             var namespaceIdentifiers = namespaceReferences.map(function (reference) {return reference.identifier;});
+diff --git a/package.json b/package.json
+index 5c0af48543483a21791fa23a4a583071d3551772..5deeac3d0accc3878ef0fc93dfb52a8ca7c46e84 100644
+--- a/package.json
++++ b/package.json
+@@ -72,7 +72,7 @@
+     "chai": "^4.3.10",
+     "cross-env": "^4.0.0",
+     "escope": "^3.6.0",
+-    "eslint": "^2 || ^3 || ^4 || ^5 || ^6 || ^7.2.0 || ^8",
++    "eslint": "^2 || ^3 || ^4 || ^5 || ^6 || ^7.2.0 || ^8 || ^9",
+     "eslint-doc-generator": "^1.6.1",
+     "eslint-import-resolver-node": "file:./resolvers/node",
+     "eslint-import-resolver-typescript": "^1.0.2 || ^1.1.1",

patches/vudio@2.1.1.patch

@@ -0,0 +1,20 @@
+diff --git a/umd/vudio.js b/umd/vudio.js
+index d0d1127e57125ad4e77442af2db4a26998c7b385..c0b66bd4327c65c31dc6e588bfa4ae6ec70bd3b8 100644
+--- a/umd/vudio.js
++++ b/umd/vudio.js
+@@ -147,7 +147,6 @@
+ 
+             source.connect(this.analyser);
+             this.analyser.fftSize = this.option.accuracy * 2;
+-            this.analyser.connect(audioContext.destination);
+ 
+             this.freqByteData = new Uint8Array(this.analyser.frequencyBinCount);
+ 
+@@ -207,7 +206,6 @@
+ 
+             source.connect(this.analyser);
+             this.analyser.fftSize = this.option.accuracy * 2;
+-            this.analyser.connect(audioContext.destination);
+         },
+ 
+         __rebuildData : function (freqByteData, horizontalAlign) {

plugins/adblocker/back.ts

@@ -1,19 +0,0 @@
-import { BrowserWindow } from 'electron';
-
-import { loadAdBlockerEngine } from './blocker';
-import { shouldUseBlocklists } from './config';
-
-import type { ConfigType } from '../../config/dynamic';
-
-type AdBlockOptions = ConfigType<'adblocker'>;
-
-export default async (win: BrowserWindow, options: AdBlockOptions) => {
-  if (await shouldUseBlocklists()) {
-    loadAdBlockerEngine(
-      win.webContents.session,
-      options.cache,
-      options.additionalBlockLists,
-      options.disableDefaultLists,
-    );
-  }
-};

plugins/adblocker/blocker.ts

@@ -1,73 +0,0 @@
-// Used for caching
-import path from 'node:path';
-import fs, { promises } from 'node:fs';
-
-import { ElectronBlocker } from '@cliqz/adblocker-electron';
-import { app } from 'electron';
-
-const SOURCES = [
-  'https://raw.githubusercontent.com/kbinani/adblock-youtube-ads/master/signed.txt',
-  // UBlock Origin
-  'https://raw.githubusercontent.com/uBlockOrigin/uAssets/master/filters/filters.txt',
-  'https://raw.githubusercontent.com/uBlockOrigin/uAssets/master/filters/filters-2020.txt',
-  'https://raw.githubusercontent.com/uBlockOrigin/uAssets/master/filters/filters-2021.txt',
-  'https://raw.githubusercontent.com/uBlockOrigin/uAssets/master/filters/filters-2022.txt',
-  'https://raw.githubusercontent.com/uBlockOrigin/uAssets/master/filters/filters-2023.txt',
-  // Fanboy Annoyances
-  'https://secure.fanboy.co.nz/fanboy-annoyance_ubo.txt',
-];
-
-export const loadAdBlockerEngine = (
-  session: Electron.Session | undefined = undefined,
-  cache = true,
-  additionalBlockLists = [],
-  disableDefaultLists: boolean | unknown[] = false,
-) => {
-  // Only use cache if no additional blocklists are passed
-  let cacheDirectory: string;
-  if (app.isPackaged) {
-    cacheDirectory = path.join(app.getPath('userData'), 'adblock_cache');
-  } else {
-    cacheDirectory = path.resolve(__dirname, 'adblock_cache');
-  }
-  if (!fs.existsSync(cacheDirectory)) {
-    fs.mkdirSync(cacheDirectory);
-  }
-  const cachingOptions
-    = cache && additionalBlockLists.length === 0
-    ? {
-      path: path.join(cacheDirectory, 'adblocker-engine.bin'),
-      read: promises.readFile,
-      write: promises.writeFile,
-    }
-    : undefined;
-  const lists = [
-    ...(
-      (disableDefaultLists && !Array.isArray(disableDefaultLists)) ||
-      (Array.isArray(disableDefaultLists) && disableDefaultLists.length > 0) ? [] : SOURCES
-    ),
-    ...additionalBlockLists,
-  ];
-
-  ElectronBlocker.fromLists(
-    fetch,
-    lists,
-    {
-      // When generating the engine for caching, do not load network filters
-      // So that enhancing the session works as expected
-      // Allowing to define multiple webRequest listeners
-      loadNetworkFilters: session !== undefined,
-    },
-    cachingOptions,
-  )
-    .then((blocker) => {
-      if (session) {
-        blocker.enableBlockingInSession(session);
-      } else {
-        console.log('Successfully generated adBlocker engine.');
-      }
-    })
-    .catch((error) => console.log('Error loading adBlocker engine', error));
-};
-
-export default { loadAdBlockerEngine };

plugins/adblocker/config.ts

@@ -1,18 +0,0 @@
-/* eslint-disable @typescript-eslint/await-thenable */
-/* renderer */
-
-import { PluginConfig } from '../../config/dynamic';
-
-const config = new PluginConfig('adblocker', { enableFront: true });
-
-export const blockers = {
-  WithBlocklists: 'With blocklists',
-  InPlayer: 'In player',
-};
-
-export const shouldUseBlocklists = async () => await config.get('blocker') !== blockers.InPlayer;
-
-export default Object.assign(config, {
-  shouldUseBlocklists,
-  blockers,
-});

plugins/adblocker/inject-cliqz-preload.ts

@@ -1,4 +0,0 @@
-export default () => {
-  const path = '@cliqz/adblocker-electron-preload'; // prevent require hoisting
-  require(path);
-};

plugins/adblocker/inject.d.ts

@@ -1,3 +0,0 @@
-const inject: () => void;
-
-export default inject;

plugins/adblocker/inject.js

@@ -1,435 +0,0 @@
-/* eslint-disable */
-
-// Source: https://addons.mozilla.org/en-US/firefox/addon/adblock-for-youtube/
-// https://robwu.nl/crxviewer/?crx=https%3A%2F%2Faddons.mozilla.org%2Fen-US%2Ffirefox%2Faddon%2Fadblock-for-youtube%2F
-
-/*
-  Parts of this code is derived from set-constant.js:
-  https://github.com/gorhill/uBlock/blob/5de0ce975753b7565759ac40983d31978d1f84ca/assets/resources/scriptlets.js#L704
-  */
-module.exports = () => {
-  {
-    const pruner = function (o) {
-      delete o.playerAds;
-      delete o.adPlacements;
-      //
-      if (o.playerResponse) {
-        delete o.playerResponse.playerAds;
-        delete o.playerResponse.adPlacements;
-      }
-
-      //
-      return o;
-    };
-
-    JSON.parse = new Proxy(JSON.parse, {
-      apply() {
-        return pruner(Reflect.apply(...arguments));
-      },
-    });
-
-    Response.prototype.json = new Proxy(Response.prototype.json, {
-      apply() {
-        return Reflect.apply(...arguments).then((o) => pruner(o));
-      },
-    });
-  }
-
-  (function () {
-    let cValue = 'undefined';
-    const chain = 'playerResponse.adPlacements';
-    const thisScript = document.currentScript;
-    //
-    switch (cValue) {
-      case 'null': {
-        cValue = null;
-        break;
-      }
-
-      case "''": {
-        cValue = '';
-        break;
-      }
-
-      case 'true': {
-        cValue = true;
-        break;
-      }
-
-      case 'false': {
-        cValue = false;
-        break;
-      }
-
-      case 'undefined': {
-        cValue = undefined;
-        break;
-      }
-
-      case 'noopFunc': {
-        cValue = function () {
-        };
-
-        break;
-      }
-
-      case 'trueFunc': {
-        cValue = function () {
-          return true;
-        };
-
-        break;
-      }
-
-      case 'falseFunc': {
-        cValue = function () {
-          return false;
-        };
-
-        break;
-      }
-
-      default: {
-        if (/^\d+$/.test(cValue)) {
-          cValue = Number.parseFloat(cValue);
-          //
-          if (isNaN(cValue)) {
-            return;
-          }
-
-          if (Math.abs(cValue) > 0x7F_FF) {
-            return;
-          }
-        } else {
-          return;
-        }
-      }
-    }
-
-    //
-    let aborted = false;
-    const mustAbort = function (v) {
-      if (aborted) {
-        return true;
-      }
-
-      aborted
-        = v !== undefined
-        && v !== null
-        && cValue !== undefined
-        && cValue !== null
-        && typeof v !== typeof cValue;
-      return aborted;
-    };
-
-    /*
-    Support multiple trappers for the same property:
-    https://github.com/uBlockOrigin/uBlock-issues/issues/156
-    */
-
-    const trapProp = function (owner, prop, configurable, handler) {
-      if (handler.init(owner[prop]) === false) {
-        return;
-      }
-
-      //
-      const odesc = Object.getOwnPropertyDescriptor(owner, prop);
-      let previousGetter;
-      let previousSetter;
-      if (odesc instanceof Object) {
-        if (odesc.configurable === false) {
-          return;
-        }
-
-        if (odesc.get instanceof Function) {
-          previousGetter = odesc.get;
-        }
-
-        if (odesc.set instanceof Function) {
-          previousSetter = odesc.set;
-        }
-      }
-
-      //
-      Object.defineProperty(owner, prop, {
-        configurable,
-        get() {
-          if (previousGetter !== undefined) {
-            previousGetter();
-          }
-
-          //
-          return handler.getter();
-        },
-        set(a) {
-          if (previousSetter !== undefined) {
-            previousSetter(a);
-          }
-
-          //
-          handler.setter(a);
-        },
-      });
-    };
-
-    const trapChain = function (owner, chain) {
-      const pos = chain.indexOf('.');
-      if (pos === -1) {
-        trapProp(owner, chain, false, {
-          v: undefined,
-          getter() {
-            return document.currentScript === thisScript ? this.v : cValue;
-          },
-          setter(a) {
-            if (mustAbort(a) === false) {
-              return;
-            }
-
-            cValue = a;
-          },
-          init(v) {
-            if (mustAbort(v)) {
-              return false;
-            }
-
-            //
-            this.v = v;
-            return true;
-          },
-        });
-        //
-        return;
-      }
-
-      //
-      const prop = chain.slice(0, pos);
-      const v = owner[prop];
-      //
-      chain = chain.slice(pos + 1);
-      if (v instanceof Object || (typeof v === 'object' && v !== null)) {
-        trapChain(v, chain);
-        return;
-      }
-
-      //
-      trapProp(owner, prop, true, {
-        v: undefined,
-        getter() {
-          return this.v;
-        },
-        setter(a) {
-          this.v = a;
-          if (a instanceof Object) {
-            trapChain(a, chain);
-          }
-        },
-        init(v) {
-          this.v = v;
-          return true;
-        },
-      });
-    };
-
-    //
-    trapChain(window, chain);
-  })();
-
-  (function () {
-    let cValue = 'undefined';
-    const thisScript = document.currentScript;
-    const chain = 'ytInitialPlayerResponse.adPlacements';
-    //
-    switch (cValue) {
-      case 'null': {
-        cValue = null;
-        break;
-      }
-
-      case "''": {
-        cValue = '';
-        break;
-      }
-
-      case 'true': {
-        cValue = true;
-        break;
-      }
-
-      case 'false': {
-        cValue = false;
-        break;
-      }
-
-      case 'undefined': {
-        cValue = undefined;
-        break;
-      }
-
-      case 'noopFunc': {
-        cValue = function () {
-        };
-
-        break;
-      }
-
-      case 'trueFunc': {
-        cValue = function () {
-          return true;
-        };
-
-        break;
-      }
-
-      case 'falseFunc': {
-        cValue = function () {
-          return false;
-        };
-
-        break;
-      }
-
-      default: {
-        if (/^\d+$/.test(cValue)) {
-          cValue = Number.parseFloat(cValue);
-          //
-          if (isNaN(cValue)) {
-            return;
-          }
-
-          if (Math.abs(cValue) > 0x7F_FF) {
-            return;
-          }
-        } else {
-          return;
-        }
-      }
-    }
-
-    //
-    let aborted = false;
-    const mustAbort = function (v) {
-      if (aborted) {
-        return true;
-      }
-
-      aborted
-        = v !== undefined
-        && v !== null
-        && cValue !== undefined
-        && cValue !== null
-        && typeof v !== typeof cValue;
-      return aborted;
-    };
-
-    /*
-    Support multiple trappers for the same property:
-    https://github.com/uBlockOrigin/uBlock-issues/issues/156
-    */
-
-    const trapProp = function (owner, prop, configurable, handler) {
-      if (handler.init(owner[prop]) === false) {
-        return;
-      }
-
-      //
-      const odesc = Object.getOwnPropertyDescriptor(owner, prop);
-      let previousGetter;
-      let previousSetter;
-      if (odesc instanceof Object) {
-        if (odesc.configurable === false) {
-          return;
-        }
-
-        if (odesc.get instanceof Function) {
-          previousGetter = odesc.get;
-        }
-
-        if (odesc.set instanceof Function) {
-          previousSetter = odesc.set;
-        }
-      }
-
-      //
-      Object.defineProperty(owner, prop, {
-        configurable,
-        get() {
-          if (previousGetter !== undefined) {
-            previousGetter();
-          }
-
-          //
-          return handler.getter();
-        },
-        set(a) {
-          if (previousSetter !== undefined) {
-            previousSetter(a);
-          }
-
-          //
-          handler.setter(a);
-        },
-      });
-    };
-
-    const trapChain = function (owner, chain) {
-      const pos = chain.indexOf('.');
-      if (pos === -1) {
-        trapProp(owner, chain, false, {
-          v: undefined,
-          getter() {
-            return document.currentScript === thisScript ? this.v : cValue;
-          },
-          setter(a) {
-            if (mustAbort(a) === false) {
-              return;
-            }
-
-            cValue = a;
-          },
-          init(v) {
-            if (mustAbort(v)) {
-              return false;
-            }
-
-            //
-            this.v = v;
-            return true;
-          },
-        });
-        //
-        return;
-      }
-
-      //
-      const prop = chain.slice(0, pos);
-      const v = owner[prop];
-      //
-      chain = chain.slice(pos + 1);
-      if (v instanceof Object || (typeof v === 'object' && v !== null)) {
-        trapChain(v, chain);
-        return;
-      }
-
-      //
-      trapProp(owner, prop, true, {
-        v: undefined,
-        getter() {
-          return this.v;
-        },
-        setter(a) {
-          this.v = a;
-          if (a instanceof Object) {
-            trapChain(a, chain);
-          }
-        },
-        init(v) {
-          this.v = v;
-          return true;
-        },
-      });
-    };
-
-    //
-    trapChain(window, chain);
-  })();
-};

plugins/adblocker/menu.ts

@@ -1,19 +0,0 @@
-import config, { blockers } from './config';
-
-import { MenuTemplate } from '../../menu';
-
-export default (): MenuTemplate => {
-  return [
-    {
-      label: 'Blocker',
-      submenu: Object.values(blockers).map((blocker: string) => ({
-        label: blocker,
-        type: 'radio',
-        checked: (config.get('blocker') || blockers.WithBlocklists) === blocker,
-        click() {
-          config.set('blocker', blocker);
-        },
-      })),
-    },
-  ];
-};

plugins/adblocker/preload.ts

@@ -1,13 +0,0 @@
-import config, { blockers } from './config';
-import inject from './inject';
-import injectCliqzPreload from './inject-cliqz-preload';
-
-export default async () => {
-  if (await config.shouldUseBlocklists()) {
-    // Preload adblocker to inject scripts/styles
-    injectCliqzPreload();
-    // eslint-disable-next-line @typescript-eslint/await-thenable
-  } else if ((await config.get('blocker')) === blockers.InPlayer) {
-    inject();
-  }
-};

plugins/album-color-theme/back.ts

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

plugins/album-color-theme/front.ts

@@ -1,127 +0,0 @@
-import { FastAverageColor } from 'fast-average-color';
-
-import { ConfigType } from '../../config/dynamic';
-
-function hexToHSL(H: string) {
-  // Convert hex to RGB first
-  let r = 0;
-  let g = 0;
-  let b = 0;
-  if (H.length == 4) {
-    r = Number('0x' + H[1] + H[1]);
-    g = Number('0x' + H[2] + H[2]);
-    b = Number('0x' + H[3] + H[3]);
-  } else if (H.length == 7) {
-    r = Number('0x' + H[1] + H[2]);
-    g = Number('0x' + H[3] + H[4]);
-    b = Number('0x' + H[5] + H[6]);
-  }
-  // Then to HSL
-  r /= 255;
-  g /= 255;
-  b /= 255;
-  const cmin = Math.min(r, g, b);
-  const cmax = Math.max(r, g, b);
-  const delta = cmax - cmin;
-  let h: number;
-  let s: number;
-  let l: number;
-
-  if (delta == 0) {
-    h = 0;
-  } else if (cmax == r) {
-    h = ((g - b) / delta) % 6;
-  } else if (cmax == g) {
-    h = ((b - r) / delta) + 2;
-  } else {
-    h = ((r - g) / delta) + 4;
-  }
-
-  h = Math.round(h * 60);
-
-  if (h < 0) {
-    h += 360;
-  }
-
-  l = (cmax + cmin) / 2;
-  s = delta == 0 ? 0 : delta / (1 - Math.abs((2 * l) - 1));
-  s = +(s * 100).toFixed(1);
-  l = +(l * 100).toFixed(1);
-
-  //return "hsl(" + h + "," + s + "%," + l + "%)";
-  return [h,s,l];
-}
-
-let hue = 0;
-let saturation = 0;
-let lightness = 0;
-
-function changeElementColor(element: HTMLElement | null, hue: number, saturation: number, lightness: number){
-  if (element) {
-    element.style.backgroundColor = `hsl(${hue}, ${saturation}%, ${lightness}%)`;
-  }
-}
-
-export default (_: ConfigType<'album-color-theme'>) => {
-  // updated elements
-  const playerPage = document.querySelector<HTMLElement>('#player-page');
-  const navBarBackground = document.querySelector<HTMLElement>('#nav-bar-background');
-  const ytmusicPlayerBar = document.querySelector<HTMLElement>('ytmusic-player-bar');
-  const playerBarBackground = document.querySelector<HTMLElement>('#player-bar-background');
-  const sidebarBig = document.querySelector<HTMLElement>('#guide-wrapper');
-  const sidebarSmall = document.querySelector<HTMLElement>('#mini-guide-background');
-  const ytmusicAppLayout = document.querySelector<HTMLElement>('#layout');
-
-  const observer = new MutationObserver((mutationsList) => {
-    for (const mutation of mutationsList) {
-      if (mutation.type === 'attributes') {
-        const isPageOpen = ytmusicAppLayout?.hasAttribute('player-page-open');
-        if (isPageOpen) {
-          changeElementColor(sidebarSmall, hue, saturation, lightness - 30);
-        } else {
-          if (sidebarSmall) {
-            sidebarSmall.style.backgroundColor = 'black';
-          }
-        }
-      }
-    }
-  });
-
-  if (playerPage) {
-    observer.observe(playerPage, { attributes: true });
-  }
-
-  document.addEventListener('apiLoaded', (apiEvent) => {
-    const fastAverageColor = new FastAverageColor();
-
-    apiEvent.detail.addEventListener('videodatachange', (name: string) => {
-      if (name === 'dataloaded') {
-        const playerResponse = apiEvent.detail.getPlayerResponse();
-        const thumbnail = playerResponse?.videoDetails?.thumbnail?.thumbnails?.at(0);
-        if (thumbnail) {
-          fastAverageColor.getColorAsync(thumbnail.url)
-            .then((albumColor) => {
-              if (albumColor) {
-                [hue, saturation, lightness] = hexToHSL(albumColor.hex);
-                changeElementColor(playerPage, hue, saturation, lightness - 30);
-                changeElementColor(navBarBackground, hue, saturation, lightness - 15);
-                changeElementColor(ytmusicPlayerBar, hue, saturation, lightness - 15);
-                changeElementColor(playerBarBackground, hue, saturation, lightness - 15);
-                changeElementColor(sidebarBig, hue, saturation, lightness - 15);
-                if (ytmusicAppLayout?.hasAttribute('player-page-open')) {
-                  changeElementColor(sidebarSmall, hue, saturation, lightness - 30);
-                }
-                const ytRightClickList = document.querySelector<HTMLElement>('tp-yt-paper-listbox');
-                changeElementColor(ytRightClickList, hue, saturation, lightness - 15);
-              } else {
-                if (playerPage) {
-                  playerPage.style.backgroundColor = '#000000';
-                }
-              }
-            })
-            .catch((e) => console.error(e));
-        }
-      }
-    });
-  });
-};

plugins/album-color-theme/style.css

@@ -1,29 +0,0 @@
-yt-page-navigation-progress {
-  --yt-page-navigation-container-color: #00000046 !important;
-  --yt-page-navigation-progress-color: white !important;
-}
-
-#player-page {
-  transition: transform 300ms,background-color 300ms cubic-bezier(0.2,0,0.6,1) !important;
-}
-
-#nav-bar-background {
-  transition: opacity 200ms,background-color 300ms cubic-bezier(0.2,0,0.6,1) !important;
-}
-
-#mini-guide-background {
-  transition: opacity 200ms,background-color 300ms cubic-bezier(0.2,0,0.6,1) !important;
-  border-right: 0px !important;
-}
-
-#guide-wrapper {
-  transition: opacity 200ms,background-color 300ms cubic-bezier(0.2,0,0.6,1) !important;
-}
-
-#img, #player, .song-media-controls.style-scope.ytmusic-player {
-  border-radius: 2% !important;
-}
-
-#items {
-  border-radius: 10px !important;
-}

plugins/ambient-mode/back.ts

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

plugins/ambient-mode/front.ts

@@ -1,138 +0,0 @@
-import { ConfigType } from '../../config/dynamic';
-
-export default (_: ConfigType<'ambient-mode'>) => {
-  const interpolationTime = 3000; // interpolation time (ms)
-  const framerate = 30; // frame
-  const qualityRatio = 50; // width size (pixel)
-
-  let unregister: (() => void) | null = null;
-
-  const injectBlurVideo = (): (() => void) | null => {
-    const songVideo = document.querySelector<HTMLDivElement>('#song-video');
-    const video = document.querySelector<HTMLVideoElement>('#song-video .html5-video-container > video');
-    const wrapper = document.querySelector('#song-video > .player-wrapper');
-
-    if (!songVideo) return null;
-    if (!video) return null;
-    if (!wrapper) return null;
-
-    const blurCanvas = document.createElement('canvas');
-    blurCanvas.classList.add('html5-blur-canvas');
-
-    const context = blurCanvas.getContext('2d', { willReadFrequently: true });
-
-    /* effect */
-    let lastEffectWorkId: number | null = null;
-    let lastImageData: ImageData | null = null;
-    
-    const onSync = () => {
-      if (typeof lastEffectWorkId === 'number') cancelAnimationFrame(lastEffectWorkId);
-
-      lastEffectWorkId = requestAnimationFrame(() => {
-        if (!context) return;
-
-        const width = qualityRatio;
-        let height = Math.max(Math.floor(blurCanvas.height / blurCanvas.width * width), 1);
-        if (!Number.isFinite(height)) height = width;
-
-        context.globalAlpha = 1;
-        if (lastImageData) {
-          const frameOffset = (1 / framerate) * (1000 / interpolationTime);
-          context.globalAlpha = 1 - (frameOffset * 2); // because of alpha value must be < 1
-          context.putImageData(lastImageData, 0, 0);
-          context.globalAlpha = frameOffset;
-        }
-        context.drawImage(video, 0, 0, width, height);
-
-        const nowImageData = context.getImageData(0, 0, width, height);
-        lastImageData = nowImageData;
-
-        lastEffectWorkId = null;
-      });
-    };
-
-    const applyVideoAttributes = () => {
-      const rect = video.getBoundingClientRect();
-
-      const newWidth = Math.floor(video.width || rect.width);
-      const newHeight = Math.floor(video.height || rect.height);
-
-      if (newWidth === 0 || newHeight === 0) return;
-
-      blurCanvas.width = qualityRatio;
-      blurCanvas.height = Math.floor(newHeight / newWidth * qualityRatio);
-      blurCanvas.style.width = `${newWidth}px`;
-      blurCanvas.style.height = `${newHeight}px`;
-    };
-
-    const observer = new MutationObserver((mutations) => {
-      mutations.forEach((mutation) => {
-        if (mutation.type === 'attributes') {
-          applyVideoAttributes();
-        }
-      });
-    });
-    const resizeObserver = new ResizeObserver(() => {
-      applyVideoAttributes();
-    });
-
-    /* hooking */
-    let canvasInterval: NodeJS.Timeout | null = null;
-    canvasInterval = setInterval(onSync, Math.max(1, Math.ceil(1000 / framerate)));
-    applyVideoAttributes();
-    observer.observe(songVideo, { attributes: true });
-    resizeObserver.observe(songVideo);
-    window.addEventListener('resize', applyVideoAttributes);
-
-    const onPause = () => {
-      if (canvasInterval) clearInterval(canvasInterval);
-      canvasInterval = null;
-    };
-    const onPlay = () => {
-      if (canvasInterval) clearInterval(canvasInterval);
-      canvasInterval = setInterval(onSync, Math.max(1, Math.ceil(1000 / framerate)));
-    };
-    songVideo.addEventListener('pause', onPause);
-    songVideo.addEventListener('play', onPlay);
-
-    /* injecting */
-    wrapper.prepend(blurCanvas);
-
-    /* cleanup */
-    return () => {
-      if (canvasInterval) clearInterval(canvasInterval);
-
-      songVideo.removeEventListener('pause', onPause);
-      songVideo.removeEventListener('play', onPlay);
-
-      observer.disconnect();
-      resizeObserver.disconnect();
-      window.removeEventListener('resize', applyVideoAttributes);
-
-      wrapper.removeChild(blurCanvas);
-    };
-  };
-
-  
-  const playerPage = document.querySelector<HTMLElement>('#player-page');
-  const ytmusicAppLayout = document.querySelector<HTMLElement>('#layout');
-  
-  const observer = new MutationObserver((mutationsList) => {
-    for (const mutation of mutationsList) {
-      if (mutation.type === 'attributes') {
-        const isPageOpen = ytmusicAppLayout?.hasAttribute('player-page-open');
-        if (isPageOpen) {
-          unregister?.();
-          unregister = injectBlurVideo() ?? null;
-        } else {
-          unregister?.();
-          unregister = null;
-        }
-      }
-    }
-  });
-
-  if (playerPage) {
-    observer.observe(playerPage, { attributes: true });
-  }
-};

plugins/ambient-mode/style.css

@@ -1,7 +0,0 @@
-#song-video canvas.html5-blur-canvas{
-  position: absolute;
-  left: 0;
-  top: 0;
-
-  filter: blur(100px);
-}

plugins/audio-compressor/front.ts

@@ -1,17 +0,0 @@
-export default () =>
-  document.addEventListener('audioCanPlay', (e) => {
-    const { audioContext } = e.detail;
-
-    const compressor = audioContext.createDynamicsCompressor();
-    compressor.threshold.value = -50;
-    compressor.ratio.value = 12;
-    compressor.knee.value = 40;
-    compressor.attack.value = 0;
-    compressor.release.value = 0.25;
-
-    e.detail.audioSource.connect(compressor);
-    compressor.connect(audioContext.destination);
-  }, {
-    once: true, // Only create the audio compressor once, not on each video
-    passive: true,
-  });

plugins/blur-nav-bar/back.ts

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

plugins/blur-nav-bar/style.css

@@ -1,10 +0,0 @@
-#nav-bar-background,
-#header.ytmusic-item-section-renderer,
-ytmusic-tabs {
-  background: rgba(0, 0, 0, 0.3) !important;
-  backdrop-filter: blur(8px) !important;
-}
-
-#nav-bar-divider {
-  display: none !important;
-}

plugins/bypass-age-restrictions/front.ts

@@ -1,4 +0,0 @@
-export default () => {
-  // See https://github.com/zerodytrash/Simple-YouTube-Age-Restriction-Bypass#userscript
-  require('simple-youtube-age-restriction-bypass/dist/Simple-YouTube-Age-Restriction-Bypass.user.js');
-};

plugins/captions-selector/back.ts

@@ -1,19 +0,0 @@
-import { BrowserWindow, ipcMain } from 'electron';
-import prompt from 'custom-electron-prompt';
-
-import promptOptions from '../../providers/prompt-options';
-
-export default (win: BrowserWindow) => {
-  ipcMain.handle('captionsSelector', async (_, captionLabels: Record<string, string>, currentIndex: string) => await prompt(
-    {
-      title: 'Choose Caption',
-      label: `Current Caption: ${captionLabels[currentIndex] || 'None'}`,
-      type: 'select',
-      value: currentIndex,
-      selectOptions: captionLabels,
-      resizable: true,
-      ...promptOptions(),
-    },
-    win,
-  ));
-};

plugins/captions-selector/config.ts

@@ -1,4 +0,0 @@
-import { PluginConfig } from '../../config/dynamic';
-
-const config = new PluginConfig('captions-selector', { enableFront: true });
-export default config;

plugins/captions-selector/front.ts

@@ -1,101 +0,0 @@
-/* eslint-disable @typescript-eslint/await-thenable */
-/* renderer */
-
-import { ipcRenderer } from 'electron';
-
-import configProvider from './config';
-
-import CaptionsSettingsButtonHTML from './templates/captions-settings-template.html';
-
-import { ElementFromHtml } from '../utils';
-import { YoutubePlayer } from '../../types/youtube-player';
-
-import type { ConfigType } from '../../config/dynamic';
-
-interface LanguageOptions {
-  displayName: string;
-  id: string | null;
-  is_default: boolean;
-  is_servable: boolean;
-  is_translateable: boolean;
-  kind: string;
-  languageCode: string; // 2 length
-  languageName: string;
-  name: string | null;
-  vss_id: string;
-}
-
-let config: ConfigType<'captions-selector'>;
-
-const $ = <Element extends HTMLElement>(selector: string): Element => document.querySelector(selector)!;
-
-const captionsSettingsButton = ElementFromHtml(CaptionsSettingsButtonHTML);
-
-export default async () => {
-  // RENDERER
-  config = await configProvider.getAll();
-
-  configProvider.subscribeAll((newConfig) => {
-    config = newConfig;
-  });
-  document.addEventListener('apiLoaded', (event) => setup(event.detail), { once: true, passive: true });
-};
-
-function setup(api: YoutubePlayer) {
-  $('.right-controls-buttons').append(captionsSettingsButton);
-
-  let captionTrackList = api.getOption<LanguageOptions[]>('captions', 'tracklist') ?? [];
-
-  $('video').addEventListener('srcChanged', () => {
-    if (config.disableCaptions) {
-      setTimeout(() => api.unloadModule('captions'), 100);
-      captionsSettingsButton.style.display = 'none';
-      return;
-    }
-
-    api.loadModule('captions');
-
-    setTimeout(() => {
-      captionTrackList = api.getOption('captions', 'tracklist') ?? [];
-
-      if (config.autoload && config.lastCaptionsCode) {
-        api.setOption('captions', 'track', {
-          languageCode: config.lastCaptionsCode,
-        });
-      }
-
-      captionsSettingsButton.style.display = captionTrackList?.length
-        ? 'inline-block'
-        : 'none';
-    }, 250);
-  });
-
-  captionsSettingsButton.addEventListener('click', async () => {
-    if (captionTrackList?.length) {
-      const currentCaptionTrack = api.getOption<LanguageOptions>('captions', 'track')!;
-      let currentIndex = currentCaptionTrack
-        ? captionTrackList.indexOf(captionTrackList.find((track) => track.languageCode === currentCaptionTrack.languageCode)!)
-        : null;
-
-      const captionLabels = [
-        ...captionTrackList.map((track) => track.displayName),
-        'None',
-      ];
-
-      currentIndex = await ipcRenderer.invoke('captionsSelector', captionLabels, currentIndex) as number;
-      if (currentIndex === null) {
-        return;
-      }
-
-      const newCaptions = captionTrackList[currentIndex];
-      configProvider.set('lastCaptionsCode', newCaptions?.languageCode);
-      if (newCaptions) {
-        api.setOption('captions', 'track', { languageCode: newCaptions.languageCode });
-      } else {
-        api.setOption('captions', 'track', {});
-      }
-
-      setTimeout(() => api.playVideo());
-    }
-  });
-}

plugins/captions-selector/menu.ts

@@ -1,22 +0,0 @@
-import config from './config';
-
-import { MenuTemplate } from '../../menu';
-
-export default (): MenuTemplate => [
-  {
-    label: 'Automatically select last used caption',
-    type: 'checkbox',
-    checked: config.get('autoload'),
-    click(item) {
-      config.set('autoload', item.checked);
-    },
-  },
-  {
-    label: 'No captions by default',
-    type: 'checkbox',
-    checked: config.get('disableCaptions'),
-    click(item) {
-      config.set('disableCaptions', item.checked);
-    },
-  },
-];

plugins/captions-selector/templates/captions-settings-template.html

@@ -1,17 +0,0 @@
-<tp-yt-paper-icon-button aria-disabled="false" aria-label="Open captions selector"
-                         class="player-captions-button style-scope ytmusic-player" icon="yt-icons:subtitles"
-                         role="button" tabindex="0"
-                         title="Open captions selector">
-  <tp-yt-iron-icon class="style-scope tp-yt-paper-icon-button" id="icon">
-    <svg class="style-scope yt-icon"
-         focusable="false" preserveAspectRatio="xMidYMid meet"
-         style="pointer-events: none; display: block; width: 100%; height: 100%;"
-         viewBox="0 0 24 24">
-      <g class="style-scope yt-icon">
-        <path
-          class="style-scope tp-yt-iron-icon"
-          d="M20 4H4c-1.103 0-2 .897-2 2v12c0 1.103.897 2 2 2h16c1.103 0 2-.897 2-2V6c0-1.103-.897-2-2-2zm-9 6H8v4h3v2H8c-1.103 0-2-.897-2-2v-4c0-1.103.897-2 2-2h3v2zm7 0h-3v4h3v2h-3c-1.103 0-2-.897-2-2v-4c0-1.103.897-2 2-2h3v2z"></path>
-      </g>
-    </svg>
-  </tp-yt-iron-icon>
-</tp-yt-paper-icon-button>

plugins/compact-sidebar/front.ts

@@ -1,10 +0,0 @@
-export default () => {
-  const compactSidebar = document.querySelector('#mini-guide');
-  const isCompactSidebarDisabled
-    = compactSidebar === null
-    || window.getComputedStyle(compactSidebar).display === 'none';
-
-  if (isCompactSidebarDisabled) {
-    document.querySelector<HTMLButtonElement>('#button')?.click();
-  }
-};

plugins/crossfade/back.ts

@@ -1,11 +0,0 @@
-import { ipcMain } from 'electron';
-import { Innertube } from 'youtubei.js';
-
-export default async () => {
-  const yt = await Innertube.create();
-
-  ipcMain.handle('audio-url', async (_, videoID: string) => {
-    const info = await yt.getBasicInfo(videoID);
-    return info.streaming_data?.formats[0].decipher(yt.session.player);
-  });
-};

plugins/crossfade/config.ts

@@ -1,4 +0,0 @@
-import { PluginConfig } from '../../config/dynamic';
-
-const config = new PluginConfig('crossfade', { enableFront: true });
-export default config;

plugins/crossfade/front.ts

@@ -1,164 +0,0 @@
-/* eslint-disable @typescript-eslint/await-thenable */
-/* renderer */
-
-import { ipcRenderer } from 'electron';
-import { Howl } from 'howler';
-
-// Extracted from https://github.com/bitfasching/VolumeFader
-import { VolumeFader } from './fader';
-
-import configProvider from './config';
-
-import defaultConfigs from '../../config/defaults';
-
-import type { ConfigType } from '../../config/dynamic';
-
-let transitionAudio: Howl; // Howler audio used to fade out the current music
-let firstVideo = true;
-let waitForTransition: Promise<unknown>;
-
-const defaultConfig = defaultConfigs.plugins.crossfade;
-
-let config: ConfigType<'crossfade'>;
-
-const configGetNumber = (key: keyof ConfigType<'crossfade'>): number => Number(config[key]) || (defaultConfig[key] as number);
-
-const getStreamURL = async (videoID: string) => ipcRenderer.invoke('audio-url', videoID) as Promise<string>;
-
-const getVideoIDFromURL = (url: string) => new URLSearchParams(url.split('?')?.at(-1)).get('v');
-
-const isReadyToCrossfade = () => transitionAudio && transitionAudio.state() === 'loaded';
-
-const watchVideoIDChanges = (cb: (id: string) => void) => {
-  window.navigation.addEventListener('navigate', (event) => {
-    const currentVideoID = getVideoIDFromURL(
-      (event.currentTarget as Navigation).currentEntry?.url ?? '',
-    );
-    const nextVideoID = getVideoIDFromURL(event.destination.url ?? '');
-
-    if (
-      nextVideoID
-      && currentVideoID
-      && (firstVideo || nextVideoID !== currentVideoID)
-    ) {
-      if (isReadyToCrossfade()) {
-        crossfade(() => {
-          cb(nextVideoID);
-        });
-      } else {
-        cb(nextVideoID);
-        firstVideo = false;
-      }
-    }
-  });
-};
-
-const createAudioForCrossfade = (url: string) => {
-  if (transitionAudio) {
-    transitionAudio.unload();
-  }
-
-  transitionAudio = new Howl({
-    src: url,
-    html5: true,
-    volume: 0,
-  });
-  syncVideoWithTransitionAudio();
-};
-
-const syncVideoWithTransitionAudio = () => {
-  const video = document.querySelector('video')!;
-
-  const videoFader = new VolumeFader(video, {
-    fadeScaling: configGetNumber('fadeScaling'),
-    fadeDuration: configGetNumber('fadeInDuration'),
-  });
-
-  transitionAudio.play();
-  transitionAudio.seek(video.currentTime);
-
-  video.addEventListener('seeking', () => {
-    transitionAudio.seek(video.currentTime);
-  });
-
-  video.addEventListener('pause', () => {
-    transitionAudio.pause();
-  });
-
-  video.addEventListener('play', () => {
-    transitionAudio.play();
-    transitionAudio.seek(video.currentTime);
-
-    // Fade in
-    const videoVolume = video.volume;
-    video.volume = 0;
-    videoFader.fadeTo(videoVolume);
-  });
-
-  // Exit just before the end for the transition
-  const transitionBeforeEnd = () => {
-    if (
-      video.currentTime >= video.duration - configGetNumber('secondsBeforeEnd')
-      && isReadyToCrossfade()
-    ) {
-      video.removeEventListener('timeupdate', transitionBeforeEnd);
-
-      // Go to next video - XXX: does not support "repeat 1" mode
-      document.querySelector<HTMLButtonElement>('.next-button')?.click();
-    }
-  };
-
-  video.addEventListener('timeupdate', transitionBeforeEnd);
-};
-
-const onApiLoaded = () => {
-  watchVideoIDChanges(async (videoID) => {
-    await waitForTransition;
-    const url = await getStreamURL(videoID);
-    if (!url) {
-      return;
-    }
-
-    await createAudioForCrossfade(url);
-  });
-};
-
-const crossfade = (cb: () => void) => {
-  if (!isReadyToCrossfade()) {
-    cb();
-    return;
-  }
-
-  let resolveTransition: () => void;
-  waitForTransition = new Promise<void>((resolve) => {
-    resolveTransition = resolve;
-  });
-
-  const video = document.querySelector('video')!;
-
-  const fader = new VolumeFader(transitionAudio._sounds[0]._node, {
-    initialVolume: video.volume,
-    fadeScaling: configGetNumber('fadeScaling'),
-    fadeDuration: configGetNumber('fadeOutDuration'),
-  });
-
-  // Fade out the music
-  video.volume = 0;
-  fader.fadeOut(() => {
-    resolveTransition();
-    cb();
-  });
-};
-
-export default async () => {
-  config = await configProvider.getAll();
-
-  configProvider.subscribeAll((newConfig) => {
-    config = newConfig;
-  });
-
-  document.addEventListener('apiLoaded', onApiLoaded, {
-    once: true,
-    passive: true,
-  });
-};

plugins/crossfade/menu.ts

@@ -1,86 +0,0 @@
-import prompt from 'custom-electron-prompt';
-
-import { BrowserWindow } from 'electron';
-
-import config from './config';
-
-import promptOptions from '../../providers/prompt-options';
-import configOptions from '../../config/defaults';
-
-import { MenuTemplate } from '../../menu';
-
-import type { ConfigType } from '../../config/dynamic';
-
-const defaultOptions = configOptions.plugins.crossfade;
-
-export default (win: BrowserWindow): MenuTemplate => [
-  {
-    label: 'Advanced',
-    async click() {
-      const newOptions = await promptCrossfadeValues(win, config.getAll());
-      if (newOptions) {
-        config.setAll(newOptions);
-      }
-    },
-  },
-];
-
-async function promptCrossfadeValues(win: BrowserWindow, options: ConfigType<'crossfade'>): Promise<Partial<ConfigType<'crossfade'>> | undefined> {
-  const res = await prompt(
-    {
-      title: 'Crossfade Options',
-      type: 'multiInput',
-      multiInputOptions: [
-        {
-          label: 'Fade in duration (ms)',
-          value: options.fadeInDuration || defaultOptions.fadeInDuration,
-          inputAttrs: {
-            type: 'number',
-            required: true,
-            min: '0',
-            step: '100',
-          },
-        },
-        {
-          label: 'Fade out duration (ms)',
-          value: options.fadeOutDuration || defaultOptions.fadeOutDuration,
-          inputAttrs: {
-            type: 'number',
-            required: true,
-            min: '0',
-            step: '100',
-          },
-        },
-        {
-          label: 'Crossfade x seconds before end',
-          value:
-            options.secondsBeforeEnd || defaultOptions.secondsBeforeEnd,
-          inputAttrs: {
-            type: 'number',
-            required: true,
-            min: '0',
-          },
-        },
-        {
-          label: 'Fade scaling',
-          selectOptions: { linear: 'Linear', logarithmic: 'Logarithmic' },
-          value: options.fadeScaling || defaultOptions.fadeScaling,
-        },
-      ],
-      resizable: true,
-      height: 360,
-      ...promptOptions(),
-    },
-    win,
-  ).catch(console.error);
-  if (!res) {
-    return undefined;
-  }
-
-  return {
-    fadeInDuration: Number(res[0]),
-    fadeOutDuration: Number(res[1]),
-    secondsBeforeEnd: Number(res[2]),
-    fadeScaling: res[3],
-  };
-}

plugins/disable-autoplay/front.ts

@@ -1,23 +0,0 @@
-import type { ConfigType } from '../../config/dynamic';
-
-export default (options: ConfigType<'disable-autoplay'>) => {
-  const timeUpdateListener = (e: Event) => {
-    if (e.target instanceof HTMLVideoElement) {
-      e.target.pause();
-    }
-  };
-
-  document.addEventListener('apiLoaded', (apiEvent) => {
-    const eventListener = (name: string) => {
-      if (options.applyOnce) {
-        apiEvent.detail.removeEventListener('videodatachange', eventListener);
-      }
-
-      if (name === 'dataloaded') {
-        apiEvent.detail.pauseVideo();
-        document.querySelector<HTMLVideoElement>('video')?.addEventListener('timeupdate', timeUpdateListener, { once: true });
-      }
-    };
-    apiEvent.detail.addEventListener('videodatachange', eventListener);
-  }, { once: true, passive: true });
-};

plugins/disable-autoplay/menu.ts

@@ -1,20 +0,0 @@
-import { BrowserWindow } from 'electron';
-
-import { setMenuOptions } from '../../config/plugins';
-
-import { MenuTemplate } from '../../menu';
-
-import type { ConfigType } from '../../config/dynamic';
-
-export default (_: BrowserWindow, options: ConfigType<'disable-autoplay'>): MenuTemplate => [
-  {
-    label: 'Applies only on startup',
-    type: 'checkbox',
-    checked: options.applyOnce,
-    click() {
-      setMenuOptions('disable-autoplay', {
-        applyOnce: !options.applyOnce,
-      });
-    }
-  }
-];

plugins/discord/back.ts

@@ -1,206 +0,0 @@
-import { app, dialog } from 'electron';
-import { Client as DiscordClient } from '@xhayper/discord-rpc';
-import { dev } from 'electron-is';
-
-import { SetActivity } from '@xhayper/discord-rpc/dist/structures/ClientUser';
-
-import registerCallback from '../../providers/song-info';
-
-import type { ConfigType } from '../../config/dynamic';
-
-// Application ID registered by @Zo-Bro-23
-const clientId = '1043858434585526382';
-
-export interface Info {
-  rpc: DiscordClient;
-  ready: boolean;
-  autoReconnect: boolean;
-  lastSongInfo?: import('../../providers/song-info').SongInfo;
-}
-
-const info: Info = {
-  rpc: new DiscordClient({
-    clientId,
-  }),
-  ready: false,
-  autoReconnect: true,
-  lastSongInfo: undefined,
-};
-
-/**
- * @type {(() => void)[]}
- */
-const refreshCallbacks: (() => void)[] = [];
-
-const resetInfo = () => {
-  info.ready = false;
-  clearTimeout(clearActivity);
-  if (dev()) {
-    console.log('discord disconnected');
-  }
-
-  for (const cb of refreshCallbacks) {
-    cb();
-  }
-};
-
-info.rpc.on('connected', () => {
-  if (dev()) {
-    console.log('discord connected');
-  }
-
-  for (const cb of refreshCallbacks) {
-    cb();
-  }
-});
-
-info.rpc.on('ready', () => {
-  info.ready = true;
-  if (info.lastSongInfo) {
-    updateActivity(info.lastSongInfo);
-  }
-});
-
-info.rpc.on('disconnected', () => {
-  resetInfo();
-
-  if (info.autoReconnect) {
-    connectTimeout();
-  }
-});
-
-const connectTimeout = () => new Promise((resolve, reject) => setTimeout(() => {
-  if (!info.autoReconnect || info.rpc.isConnected) {
-    return;
-  }
-
-  info.rpc.login().then(resolve).catch(reject);
-}, 5000));
-
-const connectRecursive = () => {
-  if (!info.autoReconnect || info.rpc.isConnected) {
-    return;
-  }
-
-  connectTimeout().catch(connectRecursive);
-};
-
-let window: Electron.BrowserWindow;
-export const connect = (showError = false) => {
-  if (info.rpc.isConnected) {
-    if (dev()) {
-      console.log('Attempted to connect with active connection');
-    }
-
-    return;
-  }
-
-  info.ready = false;
-
-  // Startup the rpc client
-  info.rpc.login().catch((error: Error) => {
-    resetInfo();
-    if (dev()) {
-      console.error(error);
-    }
-
-    if (info.autoReconnect) {
-      connectRecursive();
-    } else if (showError) {
-      dialog.showMessageBox(window, {
-        title: 'Connection failed',
-        message: error.message || String(error),
-        type: 'error',
-      });
-    }
-  });
-};
-
-let clearActivity: NodeJS.Timeout | undefined;
-let updateActivity: import('../../providers/song-info').SongInfoCallback;
-
-type DiscordOptions = ConfigType<'discord'>;
-
-export default (
-  win: Electron.BrowserWindow,
-  options: DiscordOptions,
-) => {
-  info.autoReconnect = options.autoReconnect;
-
-  window = win;
-  // We get multiple events
-  // Next song: PAUSE(n), PAUSE(n+1), PLAY(n+1)
-  // Skip time: PAUSE(N), PLAY(N)
-  updateActivity = (songInfo) => {
-    if (songInfo.title.length === 0 && songInfo.artist.length === 0) {
-      return;
-    }
-
-    info.lastSongInfo = songInfo;
-
-    // Stop the clear activity timout
-    clearTimeout(clearActivity);
-
-    // Stop early if discord connection is not ready
-    // do this after clearTimeout to avoid unexpected clears
-    if (!info.rpc || !info.ready) {
-      return;
-    }
-
-    // Clear directly if timeout is 0
-    if (songInfo.isPaused && options.activityTimoutEnabled && options.activityTimoutTime === 0) {
-      info.rpc.user?.clearActivity().catch(console.error);
-      return;
-    }
-
-    // Song information changed, so lets update the rich presence
-    // @see https://discord.com/developers/docs/topics/gateway#activity-object
-    // not all options are transfered through https://github.com/discordjs/RPC/blob/6f83d8d812c87cb7ae22064acd132600407d7d05/src/client.js#L518-530
-    const activityInfo: SetActivity = {
-      details: songInfo.title,
-      state: songInfo.artist,
-      largeImageKey: songInfo.imageSrc ?? '',
-      largeImageText: songInfo.album ?? '',
-      buttons: [
-        ...(options.listenAlong ? [{ label: 'Listen Along', url: songInfo.url ?? '' }] : []),
-        { label: 'View App On GitHub', url: 'https://github.com/th-ch/youtube-music' },
-      ],
-    };
-
-    if (songInfo.isPaused) {
-      // Add a paused icon to show that the song is paused
-      activityInfo.smallImageKey = 'paused';
-      activityInfo.smallImageText = 'Paused';
-      // Set start the timer so the activity gets cleared after a while if enabled
-      if (options.activityTimoutEnabled) {
-        clearActivity = setTimeout(() => info.rpc.user?.clearActivity().catch(console.error), options.activityTimoutTime ?? 10_000);
-      }
-    } else if (!options.hideDurationLeft) {
-      // Add the start and end time of the song
-      const songStartTime = Date.now() - ((songInfo.elapsedSeconds ?? 0) * 1000);
-      activityInfo.startTimestamp = songStartTime;
-      activityInfo.endTimestamp
-        = songStartTime + (songInfo.songDuration * 1000);
-    }
-
-    info.rpc.user?.setActivity(activityInfo).catch(console.error);
-  };
-
-  // If the page is ready, register the callback
-  win.once('ready-to-show', () => {
-    registerCallback(updateActivity);
-    connect();
-  });
-  app.on('window-all-closed', clear);
-};
-
-export const clear = () => {
-  if (info.rpc) {
-    info.rpc.user?.clearActivity();
-  }
-
-  clearTimeout(clearActivity);
-};
-
-export const registerRefresh = (cb: () => void) => refreshCallbacks.push(cb);
-export const isConnected = () => info.rpc !== null;

plugins/discord/menu.ts

@@ -1,89 +0,0 @@
-import prompt from 'custom-electron-prompt';
-
-import { clear, connect, isConnected, registerRefresh } from './back';
-
-import { setMenuOptions } from '../../config/plugins';
-import promptOptions from '../../providers/prompt-options';
-import { singleton } from '../../providers/decorators';
-import { MenuTemplate } from '../../menu';
-
-import type { ConfigType } from '../../config/dynamic';
-
-const registerRefreshOnce = singleton((refreshMenu: () => void) => {
-  registerRefresh(refreshMenu);
-});
-
-type DiscordOptions = ConfigType<'discord'>;
-
-export default (win: Electron.BrowserWindow, options: DiscordOptions, refreshMenu: () => void): MenuTemplate => {
-  registerRefreshOnce(refreshMenu);
-
-  return [
-    {
-      label: isConnected() ? 'Connected' : 'Reconnect',
-      enabled: !isConnected(),
-      click: () => connect(),
-    },
-    {
-      label: 'Auto reconnect',
-      type: 'checkbox',
-      checked: options.autoReconnect,
-      click(item: Electron.MenuItem) {
-        options.autoReconnect = item.checked;
-        setMenuOptions('discord', options);
-      },
-    },
-    {
-      label: 'Clear activity',
-      click: clear,
-    },
-    {
-      label: 'Clear activity after timeout',
-      type: 'checkbox',
-      checked: options.activityTimoutEnabled,
-      click(item: Electron.MenuItem) {
-        options.activityTimoutEnabled = item.checked;
-        setMenuOptions('discord', options);
-      },
-    },
-    {
-      label: 'Listen Along',
-      type: 'checkbox',
-      checked: options.listenAlong,
-      click(item: Electron.MenuItem) {
-        options.listenAlong = item.checked;
-        setMenuOptions('discord', options);
-      },
-    },
-    {
-      label: 'Hide duration left',
-      type: 'checkbox',
-      checked: options.hideDurationLeft,
-      click(item: Electron.MenuItem) {
-        options.hideDurationLeft = item.checked;
-        setMenuOptions('discord', options);
-      },
-    },
-    {
-      label: 'Set inactivity timeout',
-      click: () => setInactivityTimeout(win, options),
-    },
-  ];
-};
-
-async function setInactivityTimeout(win: Electron.BrowserWindow, options: DiscordOptions) {
-  const output = await prompt({
-    title: 'Set Inactivity Timeout',
-    label: 'Enter inactivity timeout in seconds:',
-    value: String(Math.round((options.activityTimoutTime ?? 0) / 1e3)),
-    type: 'counter',
-    counterOptions: { minimum: 0, multiFire: true },
-    width: 450,
-    ...promptOptions(),
-  }, win);
-
-  if (output) {
-    options.activityTimoutTime = Math.round(~~output * 1e3);
-    setMenuOptions('discord', options);
-  }
-}

plugins/downloader/back.ts

@@ -1,587 +0,0 @@
-import { createWriteStream, existsSync, mkdirSync, writeFileSync, } from 'node:fs';
-import { join } from 'node:path';
-import { randomBytes } from 'node:crypto';
-
-import { app, BrowserWindow, dialog, ipcMain, net } from 'electron';
-import { ClientType, Innertube, UniversalCache, Utils } from 'youtubei.js';
-import is from 'electron-is';
-import ytpl from 'ytpl';
-// REPLACE with youtubei getplaylist https://github.com/LuanRT/YouTube.js#getplaylistid
-import filenamify from 'filenamify';
-import { Mutex } from 'async-mutex';
-import { createFFmpeg } from '@ffmpeg.wasm/main';
-
-import NodeID3, { TagConstants } from 'node-id3';
-
-import PlayerErrorMessage from 'youtubei.js/dist/src/parser/classes/PlayerErrorMessage';
-import { FormatOptions } from 'youtubei.js/dist/src/types/FormatUtils';
-
-import TrackInfo from 'youtubei.js/dist/src/parser/ytmusic/TrackInfo';
-
-import { VideoInfo } from 'youtubei.js/dist/src/parser/youtube';
-
-import { cropMaxWidth, getFolder, presets, sendFeedback as sendFeedback_, setBadge } from './utils';
-
-import config from './config';
-
-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 { cache } from '../../providers/decorators';
-
-import type { GetPlayerResponse } from '../../types/get-player-response';
-
-
-type CustomSongInfo = SongInfo & { trackId?: string };
-
-const ffmpeg = createFFmpeg({
-  log: false,
-  logger() {
-  }, // Console.log,
-  progress() {
-  }, // Console.log,
-});
-const ffmpegMutex = new Mutex();
-
-let yt: Innertube;
-let win: BrowserWindow;
-let playingUrl: string;
-
-const sendError = (error: Error, source?: string) => {
-  win.setProgressBar(-1); // Close progress bar
-  setBadge(0); // Close badge
-  sendFeedback_(win); // Reset feedback
-
-  const songNameMessage = source ? `\nin ${source}` : '';
-  const cause = error.cause ? `\n\n${String(error.cause)}` : '';
-  const message = `${error.toString()}${songNameMessage}${cause}`;
-
-  console.error(message, error, error?.stack);
-  dialog.showMessageBox({
-    type: 'info',
-    buttons: ['OK'],
-    title: 'Error in download!',
-    message: 'Argh! Apologies, download failed…',
-    detail: message,
-  });
-};
-
-export default async (win_: BrowserWindow) => {
-  win = win_;
-  injectCSS(win.webContents, style);
-
-  const cookie = (await win.webContents.session.cookies.get({ url: 'https://music.youtube.com' })).map((it) =>
-    it.name + '=' + it.value + ';'
-  ).join('');
-  yt = await Innertube.create({
-    cache: new UniversalCache(false),
-    cookie,
-    generate_session_locally: true,
-    fetch: async (input: RequestInfo | URL, init?: RequestInit) => {
-      const url =
-        typeof input === 'string' ?
-          new URL(input) :
-          input instanceof URL ?
-            input : new URL(input.url);
-
-      if (init?.body && !init.method) {
-        init.method = 'POST';
-      }
-
-      const request = new Request(
-        url,
-        input instanceof Request ? input : undefined,
-      );
-
-      return net.fetch(request, init);
-    }
-  });
-  ipcMain.on('download-song', (_, url: string) => downloadSong(url));
-  ipcMain.on('video-src-changed', (_, data: GetPlayerResponse) => {
-    playingUrl = data.microformat.microformatDataRenderer.urlCanonical;
-  });
-  ipcMain.on('download-playlist-request', async (_event, url: string) =>
-    downloadPlaylist(url),
-  );
-};
-
-export async function downloadSong(
-  url: string,
-  playlistFolder: string | undefined = undefined,
-  trackId: string | undefined = undefined,
-  increasePlaylistProgress: (value: number) => void = () => {
-  },
-) {
-  let resolvedName;
-  try {
-    await downloadSongUnsafe(
-      url,
-      (name: string) => resolvedName = name,
-      playlistFolder,
-      trackId,
-      increasePlaylistProgress,
-    );
-  } catch (error: unknown) {
-    sendError(error as Error, resolvedName || url);
-  }
-}
-
-async function downloadSongUnsafe(
-  url: string,
-  setName: (name: string) => void,
-  playlistFolder: string | undefined = undefined,
-  trackId: string | undefined = undefined,
-  increasePlaylistProgress: (value: number) => void = () => {},
-) {
-  const sendFeedback = (message: unknown, progress?: number) => {
-    if (!playlistFolder) {
-      sendFeedback_(win, message);
-      if (progress && !isNaN(progress)) {
-        win.setProgressBar(progress);
-      }
-    }
-  };
-
-  sendFeedback('Downloading...', 2);
-
-  const id = getVideoId(url);
-  if (typeof id !== 'string') throw new Error('Video not found');
-
-  let info: TrackInfo | VideoInfo = await yt.music.getInfo(id);
-
-  if (!info) {
-    throw new Error('Video not found');
-  }
-
-  const metadata = getMetadata(info);
-  if (metadata.album === 'N/A') {
-    metadata.album = '';
-  }
-
-  metadata.trackId = trackId;
-
-  const dir
-    = playlistFolder || config.get('downloadFolder') || app.getPath('downloads');
-  const name = `${metadata.artist ? `${metadata.artist} - ` : ''}${
-    metadata.title
-  }`;
-  setName(name);
-
-  let playabilityStatus = info.playability_status;
-  let bypassedResult = null;
-  if (playabilityStatus.status === 'LOGIN_REQUIRED') {
-    // Try to bypass the age restriction
-    bypassedResult = await getAndroidTvInfo(id);
-    playabilityStatus = bypassedResult.playability_status;
-
-    if (playabilityStatus.status === 'LOGIN_REQUIRED') {
-      throw new Error(
-        `[${playabilityStatus.status}] ${playabilityStatus.reason}`,
-      );
-    }
-
-    info = bypassedResult;
-  }
-
-  if (playabilityStatus.status === 'UNPLAYABLE') {
-    const errorScreen = playabilityStatus.error_screen as PlayerErrorMessage | null;
-    throw new Error(
-      `[${playabilityStatus.status}] ${errorScreen?.reason.text}: ${errorScreen?.subreason.text}`,
-    );
-  }
-
-  const preset = config.get('preset') ?? 'mp3';
-  let presetSetting: { extension: string; ffmpegArgs: string[] } | null = null;
-  if (preset === 'opus') {
-    presetSetting = presets[preset];
-  }
-
-  const filename = filenamify(`${name}.${presetSetting?.extension ?? 'mp3'}`, {
-    replacement: '_',
-    maxLength: 255,
-  });
-  const filePath = join(dir, filename);
-
-  if (config.get('skipExisting') && existsSync(filePath)) {
-    sendFeedback(null, -1);
-    return;
-  }
-
-  const downloadOptions: FormatOptions = {
-    type: 'audio', // Audio, video or video+audio
-    quality: 'best', // Best, bestefficiency, 144p, 240p, 480p, 720p and so on.
-    format: 'any', // Media container format
-  };
-
-  const format = info.chooseFormat(downloadOptions);
-  const stream = await info.download(downloadOptions);
-
-  console.info(
-    `Downloading ${metadata.artist} - ${metadata.title} [${metadata.videoId}]`,
-  );
-
-  const iterableStream = Utils.streamToIterable(stream);
-
-  if (!existsSync(dir)) {
-    mkdirSync(dir);
-  }
-
-  const ffmpegArgs = config.get('ffmpegArgs');
-
-  if (presetSetting && presetSetting?.extension !== 'mp3') {
-    const file = createWriteStream(filePath);
-    let downloaded = 0;
-    const total: number = format.content_length ?? 1;
-
-    for await (const chunk of iterableStream) {
-      downloaded += chunk.length;
-      const ratio = downloaded / total;
-      const progress = Math.floor(ratio * 100);
-      sendFeedback(`Download: ${progress}%`, ratio);
-      increasePlaylistProgress(ratio);
-      file.write(chunk);
-    }
-
-    await ffmpegWriteTags(
-      filePath,
-      metadata,
-      presetSetting.ffmpegArgs,
-      ffmpegArgs,
-    );
-    sendFeedback(null, -1);
-  } else {
-    const fileBuffer = await iterableStreamToMP3(
-      iterableStream,
-      metadata,
-      ffmpegArgs,
-      format.content_length ?? 0,
-      sendFeedback,
-      increasePlaylistProgress,
-    );
-    if (fileBuffer) {
-      const buffer = await writeID3(Buffer.from(fileBuffer), metadata, sendFeedback);
-      if (buffer) {
-        writeFileSync(filePath, buffer);
-      }
-    }
-  }
-
-  sendFeedback(null, -1);
-  console.info(`Done: "${filePath}"`);
-}
-
-async function iterableStreamToMP3(
-  stream: AsyncGenerator<Uint8Array, void>,
-  metadata: CustomSongInfo,
-  ffmpegArgs: string[],
-  contentLength: number,
-  sendFeedback: (str: string, value?: number) => void,
-  increasePlaylistProgress: (value: number) => void = () => {
-  },
-) {
-  const chunks = [];
-  let downloaded = 0;
-  for await (const chunk of stream) {
-    downloaded += chunk.length;
-    chunks.push(chunk);
-    const ratio = downloaded / contentLength;
-    const progress = Math.floor(ratio * 100);
-    sendFeedback(`Download: ${progress}%`, ratio);
-    // 15% for download, 85% for conversion
-    // This is a very rough estimate, trying to make the progress bar look nice
-    increasePlaylistProgress(ratio * 0.15);
-  }
-
-  sendFeedback('Loading…', 2); // Indefinite progress bar after download
-
-  const buffer = Buffer.concat(chunks);
-  const safeVideoName = randomBytes(32).toString('hex');
-  const releaseFFmpegMutex = await ffmpegMutex.acquire();
-
-  try {
-    if (!ffmpeg.isLoaded()) {
-      await ffmpeg.load();
-    }
-
-    sendFeedback('Preparing file…');
-    ffmpeg.FS('writeFile', safeVideoName, buffer);
-
-    sendFeedback('Converting…');
-
-    ffmpeg.setProgress(({ ratio }) => {
-      sendFeedback(`Converting: ${Math.floor(ratio * 100)}%`, ratio);
-      increasePlaylistProgress(0.15 + (ratio * 0.85));
-    });
-
-    try {
-      await ffmpeg.run(
-        '-i',
-        safeVideoName,
-        ...ffmpegArgs,
-        ...getFFmpegMetadataArgs(metadata),
-        `${safeVideoName}.mp3`,
-      );
-    } finally {
-      ffmpeg.FS('unlink', safeVideoName);
-    }
-
-    sendFeedback('Saving…');
-
-    try {
-      return ffmpeg.FS('readFile', `${safeVideoName}.mp3`);
-    } finally {
-      ffmpeg.FS('unlink', `${safeVideoName}.mp3`);
-    }
-  } catch (error: unknown) {
-    sendError(error as Error, safeVideoName);
-  } finally {
-    releaseFFmpegMutex();
-  }
-}
-
-const getCoverBuffer = cache(async (url: string) => {
-  const nativeImage = cropMaxWidth(await getImage(url));
-  return nativeImage && !nativeImage.isEmpty() ? nativeImage.toPNG() : null;
-});
-
-async function writeID3(buffer: Buffer, metadata: CustomSongInfo, sendFeedback: (str: string, value?: number) => void) {
-  try {
-    sendFeedback('Writing ID3 tags...');
-    const tags: NodeID3.Tags = {};
-
-    // Create the metadata tags
-    tags.title = metadata.title;
-    tags.artist = metadata.artist;
-
-    if (metadata.album) {
-      tags.album = metadata.album;
-    }
-
-    const coverBuffer = await getCoverBuffer(metadata.imageSrc ?? '');
-    if (coverBuffer) {
-      tags.image = {
-        mime: 'image/png',
-        type: {
-          id: TagConstants.AttachedPicture.PictureType.FRONT_COVER,
-        },
-        description: 'thumbnail',
-        imageBuffer: coverBuffer,
-      };
-    }
-
-    if (isEnabled('lyrics-genius')) {
-      const lyrics = await fetchFromGenius(metadata);
-      if (lyrics) {
-        tags.unsynchronisedLyrics = {
-          language: '',
-          text: lyrics,
-        };
-      }
-    }
-
-    if (metadata.trackId) {
-      tags.trackNumber = metadata.trackId;
-    }
-
-    return NodeID3.write(tags, buffer);
-  } catch (error: unknown) {
-    sendError(error as Error, `${metadata.artist} - ${metadata.title}`);
-    return null;
-  }
-}
-
-export async function downloadPlaylist(givenUrl?: string | URL) {
-  try {
-    givenUrl = new URL(givenUrl ?? '');
-  } catch {
-    return;
-  }
-
-  const playlistId
-    = getPlaylistID(givenUrl)
-    || getPlaylistID(new URL(win.webContents.getURL()))
-    || getPlaylistID(new URL(playingUrl));
-
-  if (!playlistId) {
-    sendError(new Error('No playlist ID found'));
-    return;
-  }
-
-  const sendFeedback = (message?: unknown) => sendFeedback_(win, message);
-
-  console.log(`trying to get playlist ID: '${playlistId}'`);
-  sendFeedback('Getting playlist info…');
-  let playlist: ytpl.Result;
-  try {
-    playlist = await ytpl(playlistId, {
-      limit: config.get('playlistMaxItems') || Number.POSITIVE_INFINITY,
-    });
-  } catch (error: unknown) {
-    sendError(
-      Error(`Error getting playlist info: make sure it isn't a private or "Mixed for you" playlist\n\n${String(error)}`),
-    );
-    return;
-  }
-
-  if (playlist.items.length === 0) {
-    sendError(new Error('Playlist is empty'));
-  }
-
-  if (playlist.items.length === 1) {
-    sendFeedback('Playlist has only one item, downloading it directly');
-    await downloadSong(playlist.items[0].url);
-    return;
-  }
-
-  const isAlbum = playlist.title.startsWith('Album - ');
-  if (isAlbum) {
-    playlist.title = playlist.title.slice(8);
-  }
-
-  const safePlaylistTitle = filenamify(playlist.title, { replacement: ' ' });
-
-  const folder = getFolder(config.get('downloadFolder') ?? '');
-  const playlistFolder = join(folder, safePlaylistTitle);
-  if (existsSync(playlistFolder)) {
-    if (!config.get('skipExisting')) {
-      sendError(new Error(`The folder ${playlistFolder} already exists`));
-      return;
-    }
-  } else {
-    mkdirSync(playlistFolder, { recursive: true });
-  }
-
-  dialog.showMessageBox({
-    type: 'info',
-    buttons: ['OK'],
-    title: 'Started Download',
-    message: `Downloading Playlist "${playlist.title}"`,
-    detail: `(${playlist.items.length} songs)`,
-  });
-
-  if (is.dev()) {
-    console.log(
-      `Downloading playlist "${playlist.title}" - ${playlist.items.length} songs (${playlistId})`,
-    );
-  }
-
-  win.setProgressBar(2); // Starts with indefinite bar
-
-  setBadge(playlist.items.length);
-
-  let counter = 1;
-
-  const progressStep = 1 / playlist.items.length;
-
-  const increaseProgress = (itemPercentage: number) => {
-    const currentProgress = (counter - 1) / (playlist.items.length ?? 1);
-    const newProgress = currentProgress + (progressStep * itemPercentage);
-    win.setProgressBar(newProgress);
-  };
-
-  try {
-    for (const song of playlist.items) {
-      sendFeedback(`Downloading ${counter}/${playlist.items.length}...`);
-      const trackId = isAlbum ? counter : undefined;
-      await downloadSong(
-        song.url,
-        playlistFolder,
-        trackId?.toString(),
-        increaseProgress,
-      ).catch((error) =>
-        sendError(
-          new Error(`Error downloading "${song.author.name} - ${song.title}":\n  ${error}`)
-        ),
-      );
-
-      win.setProgressBar(counter / playlist.items.length);
-      setBadge(playlist.items.length - counter);
-      counter++;
-    }
-  } catch (error: unknown) {
-    sendError(error as Error);
-  } finally {
-    win.setProgressBar(-1); // Close progress bar
-    setBadge(0); // Close badge counter
-    sendFeedback(); // Clear feedback
-  }
-}
-
-async function ffmpegWriteTags(filePath: string, metadata: CustomSongInfo, presetFFmpegArgs: string[] = [], ffmpegArgs: string[] = []) {
-  const releaseFFmpegMutex = await ffmpegMutex.acquire();
-
-  try {
-    if (!ffmpeg.isLoaded()) {
-      await ffmpeg.load();
-    }
-
-    await ffmpeg.run(
-      '-i',
-      filePath,
-      ...getFFmpegMetadataArgs(metadata),
-      ...presetFFmpegArgs,
-      ...ffmpegArgs,
-      filePath,
-    );
-  } catch (error: unknown) {
-    sendError(error as Error);
-  } finally {
-    releaseFFmpegMutex();
-  }
-}
-
-function getFFmpegMetadataArgs(metadata: CustomSongInfo) {
-  if (!metadata) {
-    return [];
-  }
-
-  return [
-    ...(metadata.title ? ['-metadata', `title=${metadata.title}`] : []),
-    ...(metadata.artist ? ['-metadata', `artist=${metadata.artist}`] : []),
-    ...(metadata.album ? ['-metadata', `album=${metadata.album}`] : []),
-    ...(metadata.trackId ? ['-metadata', `track=${metadata.trackId}`] : []),
-  ];
-}
-
-// Playlist radio modifier needs to be cut from playlist ID
-const INVALID_PLAYLIST_MODIFIER = 'RDAMPL';
-
-const getPlaylistID = (aURL: URL) => {
-  const result
-    = aURL?.searchParams.get('list') || aURL?.searchParams.get('playlist');
-  if (result?.startsWith(INVALID_PLAYLIST_MODIFIER)) {
-    return result.slice(INVALID_PLAYLIST_MODIFIER.length);
-  }
-
-  return result;
-};
-
-const getVideoId = (url: URL | string): string | null => {
-  return (new URL(url)).searchParams.get('v');
-};
-
-const getMetadata = (info: TrackInfo): CustomSongInfo => ({
-  videoId: info.basic_info.id!,
-  title: cleanupName(info.basic_info.title!),
-  artist: cleanupName(info.basic_info.author!),
-  // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access,@typescript-eslint/no-explicit-any
-  album: (info.player_overlays?.browser_media_session as any)?.album?.text as string | undefined,
-  imageSrc: info.basic_info.thumbnail?.find((t) => !t.url.endsWith('.webp'))?.url,
-  views: info.basic_info.view_count!,
-  songDuration: info.basic_info.duration!,
-});
-
-// This is used to bypass age restrictions
-const getAndroidTvInfo = async (id: string): Promise<VideoInfo> => {
-  const innertube = await Innertube.create({
-    client_type: ClientType.TV_EMBEDDED,
-    generate_session_locally: true,
-    retrieve_player: true,
-  });
-  // GetInfo 404s with the bypass, so we use getBasicInfo instead
-  // that's fine as we only need the streaming data
-  return await innertube.getBasicInfo(id, 'TV_EMBEDDED');
-};

plugins/downloader/config.ts

@@ -1,4 +0,0 @@
-import { PluginConfig } from '../../config/dynamic';
-
-const config = new PluginConfig('downloader');
-export default config;

plugins/downloader/front.ts

@@ -1,83 +0,0 @@
-import { ipcRenderer } from 'electron';
-
-import downloadHTML from './templates/download.html';
-
-import defaultConfig from '../../config/defaults';
-import { getSongMenu } from '../../providers/dom-elements';
-import { ElementFromHtml } from '../utils';
-import { getSongInfo } from '../../providers/song-info-front';
-
-let menu: Element | null = null;
-let progress: Element | null = null;
-const downloadButton = ElementFromHtml(downloadHTML);
-
-let doneFirstLoad = false;
-
-const menuObserver = new MutationObserver(() => {
-  if (!menu) {
-    menu = getSongMenu();
-    if (!menu) {
-      return;
-    }
-  }
-
-  if (menu.contains(downloadButton)) {
-    return;
-  }
-
-  const menuUrl = document.querySelector<HTMLAnchorElement>('tp-yt-paper-listbox [tabindex="0"] #navigation-endpoint')?.href;
-  if (!menuUrl?.includes('watch?') && doneFirstLoad) {
-    return;
-  }
-
-  menu.prepend(downloadButton);
-  progress = document.querySelector('#ytmcustom-download');
-
-  if (doneFirstLoad) {
-    return;
-  }
-
-  setTimeout(() => doneFirstLoad ||= true, 500);
-});
-
-// TODO: re-enable once contextIsolation is set to true
-// contextBridge.exposeInMainWorld("downloader", {
-// download: () => {
-// eslint-disable-next-line @typescript-eslint/no-explicit-any,@typescript-eslint/no-unsafe-member-access
-(global as any).download = () => {
-  let videoUrl = getSongMenu()
-    // Selector of first button which is always "Start Radio"
-    ?.querySelector('ytmusic-menu-navigation-item-renderer[tabindex="0"] #navigation-endpoint')
-    ?.getAttribute('href');
-  if (videoUrl) {
-    if (videoUrl.startsWith('watch?')) {
-      videoUrl = defaultConfig.url + '/' + videoUrl;
-    }
-
-    if (videoUrl.includes('?playlist=')) {
-      ipcRenderer.send('download-playlist-request', videoUrl);
-      return;
-    }
-  } else {
-    videoUrl = getSongInfo().url || window.location.href;
-  }
-
-  ipcRenderer.send('download-song', videoUrl);
-};
-
-export default () => {
-  document.addEventListener('apiLoaded', () => {
-    menuObserver.observe(document.querySelector('ytmusic-popup-container')!, {
-      childList: true,
-      subtree: true,
-    });
-  }, { once: true, passive: true });
-
-  ipcRenderer.on('downloader-feedback', (_, feedback: string) => {
-    if (progress) {
-      progress.innerHTML = feedback || 'Download';
-    } else {
-      console.warn('Cannot update progress');
-    }
-  });
-};

plugins/downloader/menu.ts

@@ -1,45 +0,0 @@
-import { dialog } from 'electron';
-
-import { downloadPlaylist } from './back';
-import { defaultMenuDownloadLabel, getFolder, presets } from './utils';
-import config from './config';
-
-import { MenuTemplate } from '../../menu';
-
-export default (): MenuTemplate => [
-  {
-    label: defaultMenuDownloadLabel,
-    click: () => downloadPlaylist(),
-  },
-  {
-    label: 'Choose download folder',
-    click() {
-      const result = dialog.showOpenDialogSync({
-        properties: ['openDirectory', 'createDirectory'],
-        defaultPath: getFolder(config.get('downloadFolder') ?? ''),
-      });
-      if (result) {
-        config.set('downloadFolder', result[0]);
-      } // Else = user pressed cancel
-    },
-  },
-  {
-    label: 'Presets',
-    submenu: Object.keys(presets).map((preset) => ({
-      label: preset,
-      type: 'radio',
-      checked: config.get('preset') === preset,
-      click() {
-        config.set('preset', preset);
-      },
-    })),
-  },
-  {
-    label: 'Skip existing files',
-    type: 'checkbox',
-    checked: config.get('skipExisting'),
-    click(item) {
-      config.set('skipExisting', item.checked);
-    },
-  },
-];

plugins/exponential-volume/front.ts

@@ -1,45 +0,0 @@
-// "YouTube Music fix volume ratio 0.4" by Marco Pfeiffer
-// https://greasyfork.org/en/scripts/397686-youtube-music-fix-volume-ratio/
-
-const exponentialVolume = () => {
-  // Manipulation exponent, higher value = lower volume
-  // 3 is the value used by pulseaudio, which Barteks2x figured out this gist here: https://gist.github.com/Barteks2x/a4e189a36a10c159bb1644ffca21c02a
-  // 0.05 (or 5%) is the lowest you can select in the UI which with an exponent of 3 becomes 0.000125 or 0.0125%
-  const EXPONENT = 3;
-
-  const storedOriginalVolumes = new WeakMap<HTMLMediaElement, number>();
-  const propertyDescriptor = Object.getOwnPropertyDescriptor(
-    HTMLMediaElement.prototype,
-    'volume',
-  );
-  Object.defineProperty(HTMLMediaElement.prototype, 'volume', {
-    get(this: HTMLMediaElement) {
-      const lowVolume = propertyDescriptor?.get?.call(this) as number ?? 0;
-      const calculatedOriginalVolume = lowVolume ** (1 / EXPONENT);
-
-      // The calculated value has some accuracy issues which can lead to problems for implementations that expect exact values.
-      // To avoid this, I'll store the unmodified volume to return it when read here.
-      // This mostly solves the issue, but the initial read has no stored value and the volume can also change though external influences.
-      // To avoid ill effects, I check if the stored volume is somewhere in the same range as the calculated volume.
-      const storedOriginalVolume = storedOriginalVolumes.get(this) ?? 0;
-      const storedDeviation = Math.abs(
-        storedOriginalVolume - calculatedOriginalVolume,
-      );
-
-      return storedDeviation < 0.01
-        ? storedOriginalVolume
-        : calculatedOriginalVolume;
-    },
-    set(this: HTMLMediaElement, originalVolume: number) {
-      const lowVolume = originalVolume ** EXPONENT;
-      storedOriginalVolumes.set(this, originalVolume);
-      propertyDescriptor?.set?.call(this, lowVolume);
-    },
-  });
-};
-
-export default () =>
-  document.addEventListener('apiLoaded', exponentialVolume, {
-    once: true,
-    passive: true,
-  });

plugins/in-app-menu/back.ts

@@ -1,60 +0,0 @@
-import path from 'node:path';
-
-import { register } from 'electron-localshortcut';
-
-import { BrowserWindow, Menu, MenuItem, ipcMain } from 'electron';
-
-import titlebarStyle from './titlebar.css';
-
-import { injectCSS } from '../utils';
-
-// Tracks menu visibility
-export default (win: BrowserWindow) => {
-  injectCSS(win.webContents, titlebarStyle);
-
-  win.once('ready-to-show', () => {
-    register(win, '`', () => {
-      win.webContents.send('toggleMenu');
-    });
-  });
-
-  ipcMain.handle(
-    'get-menu',
-    () => JSON.parse(JSON.stringify(
-      Menu.getApplicationMenu(),
-      (key: string, value: unknown) => (key !== 'commandsMap' && key !== 'menu') ? value : undefined),
-    ),
-  );
-  
-  const getMenuItemById = (commandId: number): MenuItem | null => {
-    const menu = Menu.getApplicationMenu();
-
-    let target: MenuItem | null = null;
-    const stack = [...menu?.items ?? []];
-    while (stack.length > 0) {
-      const now = stack.shift();
-      now?.submenu?.items.forEach((item) => stack.push(item));
-
-      if (now?.commandId === commandId) {
-        target = now;
-        break;
-      }
-    }
-    
-    return target;
-  };
-
-  ipcMain.handle('menu-event', (event, commandId: number) => {
-    const target = getMenuItemById(commandId);
-    if (target) target.click(undefined, BrowserWindow.fromWebContents(event.sender), event.sender);
-  });
-
-  ipcMain.handle('get-menu-by-id', (_, commandId: number) => {
-    const result = getMenuItemById(commandId);
-
-    return JSON.parse(JSON.stringify(
-      result,
-      (key: string, value: unknown) => (key !== 'commandsMap' && key !== 'menu') ? value : undefined),
-    );
-  });
-};

plugins/in-app-menu/front.ts

@@ -1,95 +0,0 @@
-import { ipcRenderer, Menu } from 'electron';
-
-import { createPanel } from './menu/panel';
-
-import logo from '../../assets/menu.svg';
-import { isEnabled } from '../../config/plugins';
-import config from '../../config';
-
-function $<E extends Element = Element>(selector: string) {
-  return document.querySelector<E>(selector);
-}
-
-const isMacOS = navigator.userAgent.includes('Macintosh');
-
-export default () => {
-  let hideMenu = config.get('options.hideMenu');
-  const titleBar = document.createElement('title-bar');
-  const navBar = document.querySelector<HTMLDivElement>('#nav-bar-background');
-  if (isMacOS) titleBar.style.setProperty('--offset-left', '70px');
-
-  logo.classList.add('title-bar-icon');
-  const logoClick = () => {
-    hideMenu = !hideMenu;
-    let visibilityStyle: string;
-    if (hideMenu) {
-      visibilityStyle = 'hidden';
-    } else {
-      visibilityStyle = 'visible';
-    }
-    const menus = document.querySelectorAll<HTMLElement>('menu-button');
-    menus.forEach((menu) => {
-      menu.style.visibility = visibilityStyle;
-    });
-  };
-  logo.onclick = logoClick;
-
-  ipcRenderer.on('toggleMenu', logoClick);
-
-  if (!isMacOS) titleBar.appendChild(logo);
-  document.body.appendChild(titleBar);
-
-  if (navBar) {
-    const observer = new MutationObserver((mutations) => {
-      mutations.forEach(() => {
-        titleBar.style.setProperty('--titlebar-background-color', navBar.style.backgroundColor);
-        document.querySelector('html')!.style.setProperty('--titlebar-background-color', navBar.style.backgroundColor);
-      });
-    });
-
-    observer.observe(navBar, { attributes : true, attributeFilter : ['style'] });
-  }
-
-  const updateMenu = async () => {
-    const children = [...titleBar.children];
-    children.forEach((child) => {
-      if (child !== logo) child.remove();
-    });
-
-    const menu = await ipcRenderer.invoke('get-menu') as Menu | null;
-    if (!menu) return;
-
-    menu.items.forEach((menuItem) => {
-      const menu = document.createElement('menu-button');
-      createPanel(titleBar, menu, menuItem.submenu?.items ?? []);
-
-      menu.append(menuItem.label);
-      titleBar.appendChild(menu);
-      if (hideMenu) {
-        menu.style.visibility = 'hidden';
-      }
-    });
-  };
-  updateMenu();
-
-  document.title = 'Youtube Music';
-
-  ipcRenderer.on('refreshMenu', () => {
-    updateMenu();
-  });
-
-  if (isEnabled('picture-in-picture')) {
-    ipcRenderer.on('pip-toggle', () => {
-      updateMenu();
-    });
-  }
-
-  // Increases the right margin of Navbar background when the scrollbar is visible to avoid blocking it (z-index doesn't affect it)
-  document.addEventListener('apiLoaded', () => {
-    const htmlHeadStyle = $('head > div > style');
-    if (htmlHeadStyle) {
-      // HACK: This is a hack to remove the scrollbar width
-      htmlHeadStyle.innerHTML = htmlHeadStyle.innerHTML.replace('html::-webkit-scrollbar {width: var(--ytmusic-scrollbar-width);', 'html::-webkit-scrollbar {');
-    }
-  }, { once: true, passive: true });
-};

plugins/in-app-menu/menu/icons.ts

@@ -1,10 +0,0 @@
-const Icons = {
-  submenu: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none" /><polyline points="9 6 15 12 9 18" /></svg>',
-  checkbox: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M5 12l5 5l10 -10" /></svg>',
-  radio: {
-    checked: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" style="padding: 2px"><path fill="currentColor" d="M10,5 C7.2,5 5,7.2 5,10 C5,12.8 7.2,15 10,15 C12.8,15 15,12.8 15,10 C15,7.2 12.8,5 10,5 L10,5 Z M10,0 C4.5,0 0,4.5 0,10 C0,15.5 4.5,20 10,20 C15.5,20 20,15.5 20,10 C20,4.5 15.5,0 10,0 L10,0 Z M10,18 C5.6,18 2,14.4 2,10 C2,5.6 5.6,2 10,2 C14.4,2 18,5.6 18,10 C18,14.4 14.4,18 10,18 L10,18 Z" /></svg>',
-    unchecked: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" style="padding: 2px"><path fill="currentColor" d="M10,0 C4.5,0 0,4.5 0,10 C0,15.5 4.5,20 10,20 C15.5,20 20,15.5 20,10 C20,4.5 15.5,0 10,0 L10,0 Z M10,18 C5.6,18 2,14.4 2,10 C2,5.6 5.6,2 10,2 C14.4,2 18,5.6 18,10 C18,14.4 14.4,18 10,18 L10,18 Z" /></svg>',
-  },
-};
-
-export default Icons;

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

@@ -1,125 +0,0 @@
-import { nativeImage, type MenuItem, ipcRenderer, Menu } from 'electron';
-
-import Icons from './icons';
-
-import { ElementFromHtml } from '../../utils';
-
-interface PanelOptions {
-  placement?: 'bottom' | 'right';
-  order?: number;
-}
-
-export const createPanel = (
-  parent: HTMLElement,
-  anchor: HTMLElement,
-  items: MenuItem[],
-  options: PanelOptions = { placement: 'bottom', order: 0 },
-) => {
-  const childPanels: HTMLElement[] = [];
-  const panel = document.createElement('menu-panel');
-  panel.style.zIndex = `${options.order}`;
-
-  const updateIconState = (iconWrapper: HTMLElement, item: MenuItem) => {
-    if (item.type === 'checkbox') {
-      if (item.checked) iconWrapper.innerHTML = Icons.checkbox;
-      else iconWrapper.innerHTML = '';
-    } else if (item.type === 'radio') {
-      if (item.checked) iconWrapper.innerHTML = Icons.radio.checked;
-      else iconWrapper.innerHTML = Icons.radio.unchecked;
-    } else {
-      const nativeImageIcon = typeof item.icon === 'string' ? nativeImage.createFromPath(item.icon) : item.icon;
-      const iconURL = nativeImageIcon?.toDataURL();
-
-      if (iconURL) iconWrapper.style.background = `url(${iconURL})`;
-    }
-  };
-
-  const radioGroups: [MenuItem, HTMLElement][] = [];
-  items.map((item) => {
-    if (item.type === 'separator') return panel.appendChild(document.createElement('menu-separator'));
-
-    const menu = document.createElement('menu-item');
-    const iconWrapper = document.createElement('menu-icon');
-
-    updateIconState(iconWrapper, item);
-    menu.appendChild(iconWrapper);
-    menu.append(item.label);
-
-    menu.addEventListener('click', async () => {
-      await ipcRenderer.invoke('menu-event', item.commandId);
-      const menuItem = await ipcRenderer.invoke('get-menu-by-id', item.commandId) as MenuItem | null;
-
-      if (menuItem) {
-        updateIconState(iconWrapper, menuItem);
-
-        if (menuItem.type === 'radio') {
-          await Promise.all(
-            radioGroups.map(async ([item, iconWrapper]) => {
-              if (item.commandId === menuItem.commandId) return;
-              const newItem = await ipcRenderer.invoke('get-menu-by-id', item.commandId) as MenuItem | null;
-
-              if (newItem) updateIconState(iconWrapper, newItem);
-            })
-          );
-        }
-      }
-    });
-
-    if (item.type === 'radio') {
-      radioGroups.push([item, iconWrapper]);
-    }
-
-    if (item.type === 'submenu') {
-      const subMenuIcon = document.createElement('menu-icon');
-      subMenuIcon.appendChild(ElementFromHtml(Icons.submenu));
-      menu.appendChild(subMenuIcon);
-
-      const [child, , children] = createPanel(parent, menu, item.submenu?.items ?? [], {
-        placement: 'right',
-        order: (options?.order ?? 0) + 1,
-      });
-
-      childPanels.push(child);
-      children.push(...children);
-    }
-
-    panel.appendChild(menu);
-  });
-
-  /* methods */
-  const isOpened = () => panel.getAttribute('open') === 'true';
-  const close = () => panel.setAttribute('open', 'false');
-  const open = () => {
-    const rect = anchor.getBoundingClientRect();
-
-    if (options.placement === 'bottom') {
-      panel.style.setProperty('--x', `${rect.x}px`);
-      panel.style.setProperty('--y', `${rect.y + rect.height}px`);
-    } else {
-      panel.style.setProperty('--x', `${rect.x + rect.width}px`);
-      panel.style.setProperty('--y', `${rect.y}px`);
-    }
-
-    panel.setAttribute('open', 'true');
-  };
-
-  anchor.addEventListener('click', () => {
-    if (isOpened()) close();
-    else open();
-  });
-
-  document.body.addEventListener('click', (event) => {
-    const path = event.composedPath();
-    const isInside = path.some((it) => it === panel || it === anchor || childPanels.includes(it as HTMLElement));
-
-    if (!isInside) close();
-  });
-
-  parent.appendChild(panel);
-
-  return [
-    panel,
-    { isOpened, close, open },
-    childPanels,
-  ] as const;
-};

plugins/in-app-menu/titlebar.css

@@ -1,148 +0,0 @@
-:root {
-  --titlebar-background-color: #030303;
-  --menu-bar-height: 36px;
-}
-
-title-bar {
-  -webkit-app-region: drag;
-  box-sizing: border-box;
-
-  position: fixed;
-  top: 0;
-  z-index: 10000000;
-
-  width: 100%;
-  height: var(--menu-bar-height, 36px);
-
-  display: flex;
-  flex-flow: row;
-  justify-content: flex-start;
-  align-items: center;
-  gap: 4px;
-
-  color: #f1f1f1;
-  font-size: 14px;
-  padding: 4px 12px;
-  padding-left: var(--offset-left, 12px);
-  background-color: var(--titlebar-background-color, #030303);
-  user-select: none;
-
-  transition: opacity 200ms ease 0s, background-color 300ms cubic-bezier(0.2, 0, 0.6, 1) 0s;
-}
-
-menu-button {
-  -webkit-app-region: none;
-
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  align-self: stretch;
-
-  padding: 2px 8px;
-  border-radius: 4px;
-
-  cursor: pointer;
-}
-menu-button:hover {
-  background-color: rgba(255, 255, 255, 0.1);
-}
-
-menu-panel {
-  position: fixed;
-  top: var(--y, 0);
-  left: var(--x, 0);
-
-  max-height: calc(100vh - var(--menu-bar-height, 36px) - 16px - var(--y, 0));
-
-  display: flex;
-  flex-flow: column;
-  justify-content: flex-start;
-  align-items: stretch;
-  gap: 0;
-
-  overflow: auto;
-  padding: 4px;
-  border-radius: 8px;
-  pointer-events: none;
-  background-color: color-mix(in srgb, var(--titlebar-background-color, #030303) 50%, rgba(0, 0, 0, 0.1));
-  backdrop-filter: blur(8px);
-  box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.05), 0 2px 8px rgba(0, 0, 0, 0.2);
-
-  z-index: 0;
-  opacity: 0;
-  transform: scale(0.8);
-  transform-origin: top left;
-
-  transition: opacity 200ms ease 0s, transform 200ms ease 0s;
-}
-menu-panel[open="true"] {
-  pointer-events: all;
-  opacity: 1;
-  transform: scale(1);
-}
-
-menu-item {
-  -webkit-app-region: none;
-  min-height: 32px;
-  height: 32px;
-
-  display: grid;
-  grid-template-columns: 32px 1fr minmax(32px, auto);
-  justify-content: flex-start;
-  align-items: center;
-
-  border-radius: 4px;
-  cursor: pointer;
-}
-menu-item:hover {
-  background-color: rgba(255, 255, 255, 0.1);
-}
-
-menu-item > menu-icon {
-  height: 32px;
-  padding: 4px;
-
-  box-sizing: border-box;
-}
-
-menu-separator {
-  min-height: 1px;
-  height: 1px;
-  margin: 4px 0;
-
-  background-color: rgba(255, 255, 255, 0.2);
-}
-
-/* classes */
-
-.title-bar-icon {
-  height: calc(100% - 8px);
-  object-fit: cover;
-  margin-left: -4px;
-}
-
-/* youtube-music style */
-
-ytmusic-app-layout {
-  margin-top: var(--menu-bar-height, 36px) !important;
-}
-
-ytmusic-app-layout>[slot=nav-bar], #nav-bar-background.ytmusic-app-layout {
-  top: var(--menu-bar-height, 36px) !important;
-}
-#nav-bar-divider.ytmusic-app-layout {
-  top: calc(var(--ytmusic-nav-bar-height) + var(--menu-bar-height, 36px)) !important;
-}
-ytmusic-app[is-bauhaus-sidenav-enabled] #guide-spacer.ytmusic-app,
-ytmusic-app[is-bauhaus-sidenav-enabled] #mini-guide-spacer.ytmusic-app {
-  margin-top: calc(var(--ytmusic-nav-bar-height) + var(--menu-bar-height, 36px)) !important;
-}
-
-ytmusic-app-layout>[slot=player-page] {
-  margin-top: var(--menu-bar-height);
-  height: calc(100vh - var(--menu-bar-height) - var(--ytmusic-nav-bar-height) - var(--ytmusic-player-bar-height)) !important;
-}
-
-ytmusic-guide-renderer {
-  height: calc(100vh - var(--menu-bar-height) - var(--ytmusic-nav-bar-height)) !important;
-}

plugins/last-fm/back.ts

@@ -1,189 +0,0 @@
-import crypto from 'node:crypto';
-
-import { BrowserWindow, net, shell } from 'electron';
-
-import { setOptions } from '../../config/plugins';
-import registerCallback, { SongInfo } from '../../providers/song-info';
-import defaultConfig from '../../config/defaults';
-
-import type { ConfigType } from '../../config/dynamic';
-
-type LastFMOptions = ConfigType<'last-fm'>;
-
-interface LastFmData {
-  method: string,
-  timestamp?: number,
-}
-
-const createFormData = (parameters: Record<string, unknown>) => {
-  // Creates the body for in the post request
-  const formData = new URLSearchParams();
-  for (const key in parameters) {
-    formData.append(key, String(parameters[key]));
-  }
-
-  return formData;
-};
-
-const createQueryString = (parameters: Record<string, unknown>, apiSignature: string) => {
-  // Creates a querystring
-  const queryData = [];
-  parameters.api_sig = apiSignature;
-  for (const key in parameters) {
-    queryData.push(`${encodeURIComponent(key)}=${encodeURIComponent(String(parameters[key]))}`);
-  }
-
-  return '?' + queryData.join('&');
-};
-
-const createApiSig = (parameters: Record<string, unknown>, secret: string) => {
-  // This function creates the api signature, see: https://www.last.fm/api/authspec
-  const keys = Object.keys(parameters);
-
-  keys.sort();
-  let sig = '';
-  for (const key of keys) {
-    if (String(key) === 'format') {
-      continue;
-    }
-
-    sig += `${key}${String(parameters[key])}`;
-  }
-
-  sig += secret;
-  sig = crypto.createHash('md5').update(sig, 'utf-8').digest('hex');
-  return sig;
-};
-
-const createToken = async ({ api_key: apiKey, api_root: apiRoot, secret }: LastFMOptions) => {
-  // Creates and stores the auth token
-  const data = {
-    method: 'auth.gettoken',
-    apiKey,
-    format: 'json',
-  };
-  const apiSigature = createApiSig(data, secret);
-  const response = await net.fetch(`${apiRoot}${createQueryString(data, apiSigature)}`);
-  const json = await response.json() as Record<string, string>;
-  return json?.token;
-};
-
-const authenticateAndGetToken = async (config: LastFMOptions) => {
-  // Asks the user for authentication
-  await shell.openExternal(`https://www.last.fm/api/auth/?api_key=${config.api_key}&token=${config.token}`);
-  return await createToken(config);
-};
-
-const getAndSetSessionKey = async (config: LastFMOptions) => {
-  // Get and store the session key
-  const data = {
-    api_key: config.api_key,
-    format: 'json',
-    method: 'auth.getsession',
-    token: config.token,
-  };
-  const apiSignature = createApiSig(data, config.secret);
-  const response = await net.fetch(`${config.api_root}${createQueryString(data, apiSignature)}`);
-  const json = await response.json() as {
-    error?: string,
-      session?: {
-        key: string,
-      }
-  };
-  if (json.error) {
-    config.token = await authenticateAndGetToken(config);
-    setOptions('last-fm', config);
-  }
-  if (json.session) {
-    config.session_key = json?.session?.key;
-    setOptions('last-fm', config);
-  }
-  return config;
-};
-
-const postSongDataToAPI = async (songInfo: SongInfo, config: LastFMOptions, data: LastFmData) => {
-  // This sends a post request to the api, and adds the common data
-  if (!config.session_key) {
-    await getAndSetSessionKey(config);
-  }
-
-  const postData = {
-    track: songInfo.title,
-    duration: songInfo.songDuration,
-    artist: songInfo.artist,
-    ...(songInfo.album ? { album: songInfo.album } : undefined), // Will be undefined if current song is a video
-    api_key: config.api_key,
-    api_sig: '',
-    sk: config.session_key,
-    format: 'json',
-    ...data,
-  };
-
-  postData.api_sig = createApiSig(postData, config.secret);
-  net.fetch('https://ws.audioscrobbler.com/2.0/', { method: 'POST', body: createFormData(postData) })
-    .catch(async (error: {
-      response?: {
-        data?: {
-          error: number,
-        }
-      }
-    }) => {
-      if (error?.response?.data?.error === 9) {
-        // Session key is invalid, so remove it from the config and reauthenticate
-        config.session_key = undefined;
-        config.token = await authenticateAndGetToken(config);
-        setOptions('last-fm', config);
-      }
-    });
-};
-
-const addScrobble = (songInfo: SongInfo, config: LastFMOptions) => {
-  // This adds one scrobbled song to last.fm
-  const data = {
-    method: 'track.scrobble',
-    timestamp: Math.trunc((Date.now() - (songInfo.elapsedSeconds ?? 0)) / 1000),
-  };
-  postSongDataToAPI(songInfo, config, data);
-};
-
-const setNowPlaying = (songInfo: SongInfo, config: LastFMOptions) => {
-  // This sets the now playing status in last.fm
-  const data = {
-    method: 'track.updateNowPlaying',
-  };
-  postSongDataToAPI(songInfo, config, data);
-};
-
-// This will store the timeout that will trigger addScrobble
-let scrobbleTimer: NodeJS.Timeout | undefined;
-
-const lastfm = async (_win: BrowserWindow, config: LastFMOptions) => {
-  if (!config.api_root) {
-    // Settings are not present, creating them with the default values
-    config = defaultConfig.plugins['last-fm'];
-    config.enabled = true;
-    setOptions('last-fm', config);
-  }
-
-  if (!config.session_key) {
-    // Not authenticated
-    config = await getAndSetSessionKey(config);
-  }
-
-  registerCallback((songInfo) => {
-    // Set remove the old scrobble timer
-    clearTimeout(scrobbleTimer);
-    if (!songInfo.isPaused) {
-      setNowPlaying(songInfo, config);
-      // Scrobble when the song is halfway through, or has passed the 4-minute mark
-      const scrobbleTime = Math.min(Math.ceil(songInfo.songDuration / 2), 4 * 60);
-      if (scrobbleTime > (songInfo.elapsedSeconds ?? 0)) {
-        // Scrobble still needs to happen
-        const timeToWait = (scrobbleTime - (songInfo.elapsedSeconds ?? 0)) * 1000;
-        scrobbleTimer = setTimeout(addScrobble, timeToWait, songInfo, config);
-      }
-    }
-  });
-};
-
-export default lastfm;

plugins/lumiastream/back.ts

@@ -1,82 +0,0 @@
-import { BrowserWindow , net } from 'electron';
-
-import registerCallback from '../../providers/song-info';
-
-const secToMilisec = (t?: number) => t ? Math.round(Number(t) * 1e3) : undefined;
-const previousStatePaused = null;
-
-type LumiaData = {
-  origin: string;
-  eventType: string;
-  url?: string;
-  videoId?: string;
-  playlistId?: string;
-  cover?: string|null;
-  cover_url?: string|null;
-  title?: string;
-  artists?: string[];
-  status?: string;
-  progress?: number;
-  duration?: number;
-  album_url?: string|null;
-  album?: string|null;
-  views?: number;
-  isPaused?: boolean;
-}
-const data: LumiaData = {
-  origin: 'youtubemusic',
-  eventType: 'switchSong',
-};
-
-
-const post = (data: LumiaData) => {
-  const port = 39231;
-  const headers = {
-    'Content-Type': 'application/json',
-    'Accept': 'application/json',
-    'Access-Control-Allow-Headers': '*',
-    'Access-Control-Allow-Origin': '*',
-  };
-  const url = `http://localhost:${port}/api/media`;
-
-  net.fetch(url, { method: 'POST', body: JSON.stringify({ token: 'lsmedia_ytmsI7812', data }), headers })
-    .catch((error: { code: number, errno: number }) => {
-      console.log(
-        `Error: '${
-          error.code || error.errno
-        }' - when trying to access lumiastream webserver at port ${port}`
-      );
-    });
-};
-
-export default (_: BrowserWindow) => {
-  registerCallback((songInfo) => {
-    if (!songInfo.title && !songInfo.artist) {
-      return;
-    }
-
-    if (previousStatePaused === null) {
-      data.eventType = 'switchSong';
-    } else if (previousStatePaused !== songInfo.isPaused) {
-      data.eventType = 'playPause';
-    }
-
-    data.duration = secToMilisec(songInfo.songDuration);
-    data.progress = secToMilisec(songInfo.elapsedSeconds);
-    data.url = songInfo.url;
-    data.videoId = songInfo.videoId;
-    data.playlistId = songInfo.playlistId;
-    data.cover = songInfo.imageSrc;
-    data.cover_url = songInfo.imageSrc;
-    data.album_url = songInfo.imageSrc;
-    data.title = songInfo.title;
-    data.artists = [songInfo.artist];
-    data.status = songInfo.isPaused ? 'stopped' : 'playing';
-    data.isPaused = songInfo.isPaused;
-    data.album = songInfo.album;
-    data.views = songInfo.views;
-    post(data);
-  });
-};
-
-

plugins/lyrics-genius/menu.ts

@@ -1,19 +0,0 @@
-import { BrowserWindow, MenuItem } from 'electron';
-
-import { LyricGeniusType, toggleRomanized } from './back';
-
-import { setOptions } from '../../config/plugins';
-import { MenuTemplate } from '../../menu';
-
-export default (_: BrowserWindow, options: LyricGeniusType): MenuTemplate => [
-  {
-    label: 'Romanized Lyrics',
-    type: 'checkbox',
-    checked: options.romanizedLyrics,
-    click(item: MenuItem) {
-      options.romanizedLyrics = item.checked;
-      setOptions('lyrics-genius', options);
-      toggleRomanized();
-    },
-  },
-];

plugins/navigation/back.ts

@@ -1,13 +0,0 @@
-import { BrowserWindow } from 'electron';
-
-import style from './style.css';
-
-import { injectCSS } from '../utils';
-
-export function handle(win: BrowserWindow) {
-  injectCSS(win.webContents, style, () => {
-    win.webContents.send('navigation-css-ready');
-  });
-}
-
-export default handle;

plugins/navigation/front.ts

@@ -1,20 +0,0 @@
-import { ipcRenderer } from 'electron';
-
-import forwardHTML from './templates/forward.html';
-import backHTML from './templates/back.html';
-
-import { ElementFromHtml } from '../utils';
-
-export function run() {
-  ipcRenderer.on('navigation-css-ready', () => {
-    const forwardButton = ElementFromHtml(forwardHTML);
-    const backButton = ElementFromHtml(backHTML);
-    const menu = document.querySelector('#right-content');
-
-    if (menu) {
-      menu.prepend(backButton, forwardButton);
-    }
-  });
-}
-
-export default run;

plugins/navigation/templates/back.html

@@ -1,33 +0,0 @@
-<div
-        class="style-scope ytmusic-pivot-bar-renderer navigation-item"
-        onclick="history.back()"
-        role="tab"
-        tab-id="FEmusic_back"
->
-    <div
-            aria-disabled="false"
-            class="search-icon style-scope ytmusic-search-box"
-            role="button"
-            tabindex="0"
-            title="Go to previous page"
-    >
-        <div
-                class="tab-icon style-scope paper-icon-button navigation-icon"
-                id="icon"
-        >
-            <svg
-                    class="style-scope iron-icon"
-                    focusable="false"
-                    preserveAspectRatio="xMidYMid meet"
-                    style="pointer-events: none; display: block; width: 100%; height: 100%"
-                    viewBox="0 0 492 492"
-            >
-                <g class="style-scope iron-icon">
-                    <path
-                            d="M109.3 265.2l218.9 218.9c5.1 5.1 11.8 7.9 19 7.9s14-2.8 19-7.9l16.1-16.1c10.5-10.5 10.5-27.6 0-38.1L198.6 246.1 382.7 62c5.1-5.1 7.9-11.8 7.9-19 0-7.2-2.8-14-7.9-19L366.5 7.9c-5.1-5.1-11.8-7.9-19-7.9-7.2 0-14 2.8-19 7.9L109.3 227c-5.1 5.1-7.9 11.9-7.8 19.1 0 7.2 2.8 14 7.8 19.1z"
-                    ></path>
-                </g>
-            </svg>
-        </div>
-    </div>
-</div>

plugins/no-google-login/back.ts

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

plugins/no-google-login/front.ts

@@ -1,37 +0,0 @@
-function removeLoginElements() {
-  const elementsToRemove = [
-    '.sign-in-link.ytmusic-nav-bar',
-    '.ytmusic-pivot-bar-renderer[tab-id="FEmusic_liked"]',
-  ];
-
-  for (const selector of elementsToRemove) {
-    const node = document.querySelector(selector);
-    if (node) {
-      node.remove();
-    }
-  }
-
-  // Remove the library button
-  const libraryIconPath
-    = 'M16,6v2h-2v5c0,1.1-0.9,2-2,2s-2-0.9-2-2s0.9-2,2-2c0.37,0,0.7,0.11,1,0.28V6H16z M18,20H4V6H3v15h15V20z M21,3H6v15h15V3z M7,4h13v13H7V4z';
-  const observer = new MutationObserver(() => {
-    const menuEntries = document.querySelectorAll(
-      '#items ytmusic-guide-entry-renderer',
-    );
-    menuEntries.forEach((item) => {
-      const icon = item.querySelector('path');
-      if (icon) {
-        observer.disconnect();
-        if (icon.getAttribute('d') === libraryIconPath) {
-          item.remove();
-        }
-      }
-    });
-  });
-  observer.observe(document.documentElement, {
-    childList: true,
-    subtree: true,
-  });
-}
-
-export default removeLoginElements;

plugins/notifications/config.ts

@@ -1,5 +0,0 @@
-import { PluginConfig } from '../../config/dynamic';
-
-const config = new PluginConfig('notifications');
-
-export default config;

plugins/notifications/interactive.ts

@@ -1,257 +0,0 @@
-import path from 'node:path';
-
-import { app, BrowserWindow, ipcMain, Notification } from 'electron';
-
-import { icons, notificationImage, saveTempIcon, secondsToMinutes, ToastStyles } from './utils';
-import config from './config';
-
-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 { getMediaIconLocation } from '../utils';
-
-let songControls: ReturnType<typeof getSongControls>;
-let savedNotification: Notification | undefined;
-
-export default (win: BrowserWindow) => {
-  songControls = getSongControls(win);
-
-  let currentSeconds = 0;
-  ipcMain.on('apiLoaded', () => win.webContents.send('setupTimeChangedListener'));
-
-  ipcMain.on('timeChanged', (_, t: number) => currentSeconds = t);
-
-  if (app.isPackaged) {
-    saveTempIcon();
-  }
-
-  let savedSongInfo: SongInfo;
-  let lastUrl: string | undefined;
-
-  // Register songInfoCallback
-  registerCallback((songInfo) => {
-    if (!songInfo.artist && !songInfo.title) {
-      return;
-    }
-
-    savedSongInfo = { ...songInfo };
-    if (!songInfo.isPaused
-      && (songInfo.url !== lastUrl || config.get('unpauseNotification'))
-    ) {
-      lastUrl = songInfo.url;
-      sendNotification(songInfo);
-    }
-  });
-
-  if (config.get('trayControls')) {
-    setTrayOnClick(() => {
-      if (savedNotification) {
-        savedNotification.close();
-        savedNotification = undefined;
-      } else if (savedSongInfo) {
-        sendNotification({
-          ...savedSongInfo,
-          elapsedSeconds: currentSeconds,
-        });
-      }
-    });
-
-    setTrayOnDoubleClick(() => {
-      if (win.isVisible()) {
-        win.hide();
-      } else {
-        win.show();
-      }
-    });
-  }
-
-  app.once('before-quit', () => {
-    savedNotification?.close();
-  });
-
-  changeProtocolHandler(
-    (cmd) => {
-      if (Object.keys(songControls).includes(cmd)) {
-        songControls[cmd as keyof typeof songControls]();
-        if (config.get('refreshOnPlayPause') && (
-          cmd === 'pause'
-          || (cmd === 'play' && !config.get('unpauseNotification'))
-        )
-        ) {
-          setImmediate(() =>
-            sendNotification({
-              ...savedSongInfo,
-              isPaused: cmd === 'pause',
-              elapsedSeconds: currentSeconds,
-            }),
-          );
-        }
-      }
-    },
-  );
-};
-
-function sendNotification(songInfo: SongInfo) {
-  const iconSrc = notificationImage(songInfo);
-
-  savedNotification?.close();
-
-  let icon: string;
-  if (typeof iconSrc === 'object') {
-    icon = iconSrc.toDataURL();
-  } else {
-    icon = iconSrc;
-  }
-
-  savedNotification = new Notification({
-    title: songInfo.title || 'Playing',
-    body: songInfo.artist,
-    icon: iconSrc,
-    silent: true,
-    // https://learn.microsoft.com/en-us/uwp/schemas/tiles/toastschema/schema-root
-    // https://learn.microsoft.com/en-us/windows/apps/design/shell/tiles-and-notifications/toast-schema
-    // https://learn.microsoft.com/en-us/windows/apps/design/shell/tiles-and-notifications/adaptive-interactive-toasts?tabs=xml
-    // https://learn.microsoft.com/en-us/uwp/api/windows.ui.notifications.toasttemplatetype
-    toastXml: getXml(songInfo, icon),
-  });
-
-  savedNotification.on('close', () => {
-    savedNotification = undefined;
-  });
-
-  savedNotification.show();
-}
-
-const getXml = (songInfo: SongInfo, iconSrc: string) => {
-  switch (config.get('toastStyle')) {
-    default:
-    case ToastStyles.logo:
-    case ToastStyles.legacy: {
-      return xmlLogo(songInfo, iconSrc);
-    }
-
-    case ToastStyles.banner_top_custom: {
-      return xmlBannerTopCustom(songInfo, iconSrc);
-    }
-
-    case ToastStyles.hero: {
-      return xmlHero(songInfo, iconSrc);
-    }
-
-    case ToastStyles.banner_bottom: {
-      return xmlBannerBottom(songInfo, iconSrc);
-    }
-
-    case ToastStyles.banner_centered_bottom: {
-      return xmlBannerCenteredBottom(songInfo, iconSrc);
-    }
-
-    case ToastStyles.banner_centered_top: {
-      return xmlBannerCenteredTop(songInfo, iconSrc);
-    }
-  }
-};
-const display = (kind: keyof typeof icons) => {
-  if (config.get('toastStyle') === ToastStyles.legacy) {
-    return `content="${icons[kind]}"`;
-  }
-
-  return `\
-            content="${config.get('hideButtonText') ? '' : kind.charAt(0).toUpperCase() + kind.slice(1)}"\
-            imageUri="file:///${path.resolve(getMediaIconLocation(), `${kind}.png`)}"
-        `;
-};
-
-const getButton = (kind: keyof typeof icons) =>
-  `<action ${display(kind)} activationType="protocol" arguments="youtubemusic://${kind}"/>`;
-
-const getButtons = (isPaused: boolean) => `\
-    <actions>
-        ${getButton('previous')}
-        ${isPaused ? getButton('play') : getButton('pause')}
-        ${getButton('next')}
-    </actions>\
-`;
-
-const toast = (content: string, isPaused: boolean) => `\
-<toast>
-    <audio silent="true" />
-    <visual>
-        <binding template="ToastGeneric">
-            ${content}
-        </binding>
-    </visual>
-
-    ${getButtons(isPaused)}
-</toast>`;
-
-const xmlImage = ({ title, artist, isPaused }: SongInfo, imgSrc: string, placement: string) => toast(`\
-            <image id="1" src="${imgSrc}" name="Image" ${placement}/>
-            <text id="1">${title}</text>
-            <text id="2">${artist}</text>\
-`, isPaused ?? false);
-
-const xmlLogo = (songInfo: SongInfo, imgSrc: string) => xmlImage(songInfo, imgSrc, 'placement="appLogoOverride"');
-
-const xmlHero = (songInfo: SongInfo, imgSrc: string) => xmlImage(songInfo, imgSrc, 'placement="hero"');
-
-const xmlBannerBottom = (songInfo: SongInfo, imgSrc: string) => xmlImage(songInfo, imgSrc, '');
-
-const xmlBannerTopCustom = (songInfo: SongInfo, imgSrc: string) => toast(`\
-            <image id="1" src="${imgSrc}" name="Image" />
-            <text>ㅤ</text>
-            <group>
-                <subgroup>
-                    <text hint-style="body">${songInfo.title}</text>
-                    <text hint-style="captionSubtle">${songInfo.artist}</text>
-                </subgroup>
-                ${xmlMoreData(songInfo)}
-            </group>\
-`, songInfo.isPaused ?? false);
-
-const xmlMoreData = ({ album, elapsedSeconds, songDuration }: SongInfo) => `\
-<subgroup hint-textStacking="bottom">
-    ${album
-  ? `<text hint-style="captionSubtle" hint-wrap="true" hint-align="right">${album}</text>` : ''}
-    <text hint-style="captionSubtle" hint-wrap="true" hint-align="right">${secondsToMinutes(elapsedSeconds ?? 0)} / ${secondsToMinutes(songDuration)}</text>
-</subgroup>\
-`;
-
-const xmlBannerCenteredBottom = ({ title, artist, isPaused }: SongInfo, imgSrc: string) => toast(`\
-            <text>ㅤ</text>
-            <group>
-                <subgroup hint-weight="1" hint-textStacking="center">
-                    <text hint-align="center" hint-style="${titleFontPicker(title)}">${title}</text>
-                    <text hint-align="center" hint-style="SubtitleSubtle">${artist}</text>
-                </subgroup>
-            </group>
-            <image id="1" src="${imgSrc}" name="Image"  hint-removeMargin="true" />\
-`, isPaused ?? false);
-
-const xmlBannerCenteredTop = ({ title, artist, isPaused }: SongInfo, imgSrc: string) => toast(`\
-            <image id="1" src="${imgSrc}" name="Image" />
-            <text>ㅤ</text>
-            <group>
-                <subgroup hint-weight="1" hint-textStacking="center">
-                    <text hint-align="center" hint-style="${titleFontPicker(title)}">${title}</text>
-                    <text hint-align="center" hint-style="SubtitleSubtle">${artist}</text>
-                </subgroup>
-            </group>\
-`, isPaused ?? false);
-
-const titleFontPicker = (title: string) => {
-  if (title.length <= 13) {
-    return 'Header';
-  }
-
-  if (title.length <= 22) {
-    return 'Subheader';
-  }
-
-  if (title.length <= 26) {
-    return 'Title';
-  }
-
-  return 'Subtitle';
-};

plugins/notifications/menu.ts

@@ -1,93 +0,0 @@
-import is from 'electron-is';
-
-import { BrowserWindow, MenuItem } from 'electron';
-
-import { snakeToCamel, ToastStyles, urgencyLevels } from './utils';
-
-import config from './config';
-
-import { MenuTemplate } from '../../menu';
-
-import type { ConfigType } from '../../config/dynamic';
-
-const getMenu = (options: ConfigType<'notifications'>): MenuTemplate => {
-  if (is.linux()) {
-    return [
-      {
-        label: 'Notification Priority',
-        submenu: urgencyLevels.map((level) => ({
-          label: level.name,
-          type: 'radio',
-          checked: options.urgency === level.value,
-          click: () => config.set('urgency', level.value),
-        })),
-      }
-    ];
-  } else if (is.windows()) {
-    return [
-      {
-        label: 'Interactive Notifications',
-        type: 'checkbox',
-        checked: options.interactive,
-        // Doesn't update until restart
-        click: (item: MenuItem) => config.setAndMaybeRestart('interactive', item.checked),
-      },
-      {
-        // Submenu with settings for interactive notifications (name shouldn't be too long)
-        label: 'Interactive Settings',
-        submenu: [
-          {
-            label: 'Open/Close on tray click',
-            type: 'checkbox',
-            checked: options.trayControls,
-            click: (item: MenuItem) => config.set('trayControls', item.checked),
-          },
-          {
-            label: 'Hide Button Text',
-            type: 'checkbox',
-            checked: options.hideButtonText,
-            click: (item: MenuItem) => config.set('hideButtonText', item.checked),
-          },
-          {
-            label: 'Refresh on Play/Pause',
-            type: 'checkbox',
-            checked: options.refreshOnPlayPause,
-            click: (item: MenuItem) => config.set('refreshOnPlayPause', item.checked),
-          },
-        ],
-      },
-      {
-        label: 'Style',
-        submenu: getToastStyleMenuItems(options),
-      },
-    ];
-  } else {
-    return [];
-  }
-};
-
-export default (_win: BrowserWindow, options: ConfigType<'notifications'>): MenuTemplate => [
-  ...getMenu(options),
-  {
-    label: 'Show notification on unpause',
-    type: 'checkbox',
-    checked: options.unpauseNotification,
-    click: (item: MenuItem) => config.set('unpauseNotification', item.checked),
-  },
-];
-
-export function getToastStyleMenuItems(options: ConfigType<'notifications'>) {
-  const array = Array.from({ length: Object.keys(ToastStyles).length });
-
-  // ToastStyles index starts from 1
-  for (const [name, index] of Object.entries(ToastStyles)) {
-    array[index - 1] = {
-      label: snakeToCamel(name),
-      type: 'radio',
-      checked: options.toastStyle === index,
-      click: () => config.set('toastStyle', index),
-    } satisfies Electron.MenuItemConstructorOptions;
-  }
-
-  return array as Electron.MenuItemConstructorOptions[];
-}

plugins/notifications/utils.ts

@@ -1,108 +0,0 @@
-import path from 'node:path';
-import fs from 'node:fs';
-
-import { app, NativeImage } from 'electron';
-
-import config from './config';
-
-import { cache } from '../../providers/decorators';
-import { SongInfo } from '../../providers/song-info';
-import { getAssetsDirectoryLocation } from '../utils';
-
-const icon = 'assets/youtube-music.png';
-const userData = app.getPath('userData');
-const temporaryIcon = path.join(userData, 'tempIcon.png');
-const temporaryBanner = path.join(userData, 'tempBanner.png');
-
-
-export const ToastStyles = {
-  logo: 1,
-  banner_centered_top: 2,
-  hero: 3,
-  banner_top_custom: 4,
-  banner_centered_bottom: 5,
-  banner_bottom: 6,
-  legacy: 7,
-};
-
-export const icons = {
-  play: '\u{1405}', // ᐅ
-  pause: '\u{2016}', // ‖
-  next: '\u{1433}', // ᐳ
-  previous: '\u{1438}', // ᐸ
-};
-
-export const urgencyLevels = [
-  { name: 'Low', value: 'low' },
-  { name: 'Normal', value: 'normal' },
-  { name: 'High', value: 'critical' },
-];
-
-const nativeImageToLogo = cache((nativeImage: NativeImage) => {
-  const temporaryImage = nativeImage.resize({ height: 256 });
-  const margin = Math.max(temporaryImage.getSize().width - 256, 0);
-
-  return temporaryImage.crop({
-    x: Math.round(margin / 2),
-    y: 0,
-    width: 256,
-    height: 256,
-  });
-});
-
-export const notificationImage = (songInfo: SongInfo) => {
-  if (!songInfo.image) {
-    return icon;
-  }
-
-  if (!config.get('interactive')) {
-    return nativeImageToLogo(songInfo.image);
-  }
-
-  switch (config.get('toastStyle')) {
-    case ToastStyles.logo:
-    case ToastStyles.legacy: {
-      return saveImage(nativeImageToLogo(songInfo.image), temporaryIcon);
-    }
-
-    default: {
-      return saveImage(songInfo.image, temporaryBanner);
-    }
-  }
-};
-
-export const saveImage = cache((img: NativeImage, savePath: string) => {
-  try {
-    fs.writeFileSync(savePath, img.toPNG());
-  } catch (error: unknown) {
-    console.log(`Error writing song icon to disk:\n${String(error)}`);
-    return icon;
-  }
-
-  return savePath;
-});
-
-export const saveTempIcon = () => {
-  for (const kind of Object.keys(icons)) {
-    const destinationPath = path.join(userData, 'icons', `${kind}.png`);
-    if (fs.existsSync(destinationPath)) {
-      continue;
-    }
-
-    const iconPath = path.resolve(path.resolve(getAssetsDirectoryLocation(), 'media-icons-black'), `${kind}.png`);
-    fs.mkdirSync(path.dirname(destinationPath), { recursive: true });
-    fs.copyFile(iconPath, destinationPath, () => {});
-  }
-};
-
-export const snakeToCamel = (string_: string) => string_.replaceAll(/([-_][a-z]|^[a-z])/g, (group) =>
-  group.toUpperCase()
-    .replace('-', ' ')
-    .replace('_', ' '),
-);
-
-export const secondsToMinutes = (seconds: number) => {
-  const minutes = Math.floor(seconds / 60);
-  const secondsLeft = seconds % 60;
-  return `${minutes}:${secondsLeft < 10 ? '0' : ''}${secondsLeft}`;
-};

plugins/picture-in-picture/back.ts

@@ -1,111 +0,0 @@
-import { app, BrowserWindow, ipcMain } from 'electron';
-
-import style from './style.css';
-
-import { injectCSS } from '../utils';
-import { setOptions as setPluginOptions } from '../../config/plugins';
-
-import type { ConfigType } from '../../config/dynamic';
-
-let isInPiP = false;
-let originalPosition: number[];
-let originalSize: number[];
-let originalFullScreen: boolean;
-let originalMaximized: boolean;
-
-let win: BrowserWindow;
-
-type PiPOptions = ConfigType<'picture-in-picture'>;
-
-let options: Partial<PiPOptions>;
-
-const pipPosition = () => (options.savePosition && options['pip-position']) || [10, 10];
-const pipSize = () => (options.saveSize && options['pip-size']) || [450, 275];
-
-const setLocalOptions = (_options: Partial<PiPOptions>) => {
-  options = { ...options, ..._options };
-  setPluginOptions('picture-in-picture', _options);
-};
-
-const togglePiP = () => {
-  isInPiP = !isInPiP;
-  setLocalOptions({ isInPiP });
-
-  if (isInPiP) {
-    originalFullScreen = win.isFullScreen();
-    if (originalFullScreen) {
-      win.setFullScreen(false);
-    }
-
-    originalMaximized = win.isMaximized();
-    if (originalMaximized) {
-      win.unmaximize();
-    }
-
-    originalPosition = win.getPosition();
-    originalSize = win.getSize();
-
-    win.webContents.on('before-input-event', blockShortcutsInPiP);
-
-    win.setMaximizable(false);
-    win.setFullScreenable(false);
-
-    win.webContents.send('pip-toggle', true);
-
-    app.dock?.hide();
-    win.setVisibleOnAllWorkspaces(true, {
-      visibleOnFullScreen: true,
-    });
-    app.dock?.show();
-    if (options.alwaysOnTop) {
-      win.setAlwaysOnTop(true, 'screen-saver', 1);
-    }
-  } else {
-    win.webContents.removeListener('before-input-event', blockShortcutsInPiP);
-    win.setMaximizable(true);
-    win.setFullScreenable(true);
-
-    win.webContents.send('pip-toggle', false);
-
-    win.setVisibleOnAllWorkspaces(false);
-    win.setAlwaysOnTop(false);
-
-    if (originalFullScreen) {
-      win.setFullScreen(true);
-    }
-
-    if (originalMaximized) {
-      win.maximize();
-    }
-  }
-
-  const [x, y] = isInPiP ? pipPosition() : originalPosition;
-  const [w, h] = isInPiP ? pipSize() : originalSize;
-  win.setPosition(x, y);
-  win.setSize(w, h);
-
-  win.setWindowButtonVisibility?.(!isInPiP);
-};
-
-const blockShortcutsInPiP = (event: Electron.Event, input: Electron.Input) => {
-  const key = input.key.toLowerCase();
-
-  if (key === 'f') {
-    event.preventDefault();
-  } else if (key === 'escape') {
-    togglePiP();
-    event.preventDefault();
-  }
-};
-
-export default (_win: BrowserWindow, _options: PiPOptions) => {
-  options ??= _options;
-  win ??= _win;
-  setLocalOptions({ isInPiP });
-  injectCSS(win.webContents, style);
-  ipcMain.on('picture-in-picture', () => {
-    togglePiP();
-  });
-};
-
-export const setOptions = setLocalOptions;

plugins/picture-in-picture/menu.ts

@@ -1,75 +0,0 @@
-import prompt from 'custom-electron-prompt';
-
-import { BrowserWindow } from 'electron';
-
-import { setOptions } from './back';
-
-import promptOptions from '../../providers/prompt-options';
-
-import { MenuTemplate } from '../../menu';
-
-import type { ConfigType } from '../../config/dynamic';
-
-export default (win: BrowserWindow, options: ConfigType<'picture-in-picture'>): MenuTemplate => [
-  {
-    label: 'Always on top',
-    type: 'checkbox',
-    checked: options.alwaysOnTop,
-    click(item) {
-      setOptions({ alwaysOnTop: item.checked });
-      win.setAlwaysOnTop(item.checked);
-    },
-  },
-  {
-    label: 'Save window position',
-    type: 'checkbox',
-    checked: options.savePosition,
-    click(item) {
-      setOptions({ savePosition: item.checked });
-    },
-  },
-  {
-    label: 'Save window size',
-    type: 'checkbox',
-    checked: options.saveSize,
-    click(item) {
-      setOptions({ saveSize: item.checked });
-    },
-  },
-  {
-    label: 'Hotkey',
-    type: 'checkbox',
-    checked: !!options.hotkey,
-    async click(item) {
-      const output = await prompt({
-        title: 'Picture in Picture Hotkey',
-        label: 'Choose a hotkey for toggling Picture in Picture',
-        type: 'keybind',
-        keybindOptions: [{
-          value: 'hotkey',
-          label: 'Hotkey',
-          default: options.hotkey,
-        }],
-        ...promptOptions(),
-      }, win);
-
-      if (output) {
-        const { value, accelerator } = output[0];
-        setOptions({ [value]: accelerator });
-
-        item.checked = !!accelerator;
-      } else {
-        // Reset checkbox if prompt was canceled
-        item.checked = !item.checked;
-      }
-    },
-  },
-  {
-    label: 'Use native PiP',
-    type: 'checkbox',
-    checked: options.useNativePiP,
-    click(item) {
-      setOptions({ useNativePiP: item.checked });
-    },
-  },
-];

plugins/playback-speed/front.ts

@@ -1,117 +0,0 @@
-import sliderHTML from './templates/slider.html';
-
-import { getSongMenu } from '../../providers/dom-elements';
-import { ElementFromHtml } from '../utils';
-import { singleton } from '../../providers/decorators';
-
-
-function $<E extends Element = Element>(selector: string) {
-  return document.querySelector<E>(selector);
-}
-
-const slider = ElementFromHtml(sliderHTML);
-
-const roundToTwo = (n: number) => Math.round(n * 1e2) / 1e2;
-
-const MIN_PLAYBACK_SPEED = 0.07;
-const MAX_PLAYBACK_SPEED = 16;
-
-let playbackSpeed = 1;
-
-const updatePlayBackSpeed = () => {
-  const videoElement = $<HTMLVideoElement>('video');
-  if (videoElement) {
-    videoElement.playbackRate = playbackSpeed;
-  }
-
-  const playbackSpeedElement = $('#playback-speed-value');
-  if (playbackSpeedElement) {
-    playbackSpeedElement.innerHTML = String(playbackSpeed);
-  }
-};
-
-let menu: Element | null = null;
-
-const setupSliderListener = singleton(() => {
-  $('#playback-speed-slider')?.addEventListener('immediate-value-changed', (e) => {
-    playbackSpeed = (e as CustomEvent<{ value: number; }>).detail.value || MIN_PLAYBACK_SPEED;
-    if (isNaN(playbackSpeed)) {
-      playbackSpeed = 1;
-    }
-
-    updatePlayBackSpeed();
-  });
-});
-
-const observePopupContainer = () => {
-  const observer = new MutationObserver(() => {
-    if (!menu) {
-      menu = getSongMenu();
-    }
-
-    if (
-      menu &&
-      (menu.parentElement as HTMLElement & { eventSink_: Element | null })
-        ?.eventSink_
-        ?.matches('ytmusic-menu-renderer.ytmusic-player-bar')&& !menu.contains(slider)
-    ) {
-      menu.prepend(slider);
-      setupSliderListener();
-    }
-  });
-
-  const popupContainer = $('ytmusic-popup-container');
-  if (popupContainer) {
-    observer.observe(popupContainer, {
-      childList: true,
-      subtree: true,
-    });
-  }
-};
-
-const observeVideo = () => {
-  const video = $<HTMLVideoElement>('video');
-  if (video) {
-    video.addEventListener('ratechange', forcePlaybackRate);
-    video.addEventListener('srcChanged', forcePlaybackRate);
-  }
-};
-
-const setupWheelListener = () => {
-  slider.addEventListener('wheel', (e) => {
-    e.preventDefault();
-    if (isNaN(playbackSpeed)) {
-      playbackSpeed = 1;
-    }
-
-    // E.deltaY < 0 means wheel-up
-    playbackSpeed = roundToTwo(e.deltaY < 0
-      ? Math.min(playbackSpeed + 0.01, MAX_PLAYBACK_SPEED)
-      : Math.max(playbackSpeed - 0.01, MIN_PLAYBACK_SPEED),
-    );
-
-    updatePlayBackSpeed();
-    // Update slider position
-    const playbackSpeedSilder = $<HTMLElement & { value: number }>('#playback-speed-slider');
-    if (playbackSpeedSilder) {
-      playbackSpeedSilder.value = playbackSpeed;
-    }
-  });
-};
-
-function forcePlaybackRate(e: Event) {
-  if (e.target instanceof HTMLVideoElement) {
-    const videoElement = e.target;
-    if (videoElement.playbackRate !== playbackSpeed) {
-      videoElement.playbackRate = playbackSpeed;
-    }
-  }
-}
-
-export default () => {
-  document.addEventListener('apiLoaded', () => {
-    observePopupContainer();
-    observeVideo();
-    setupWheelListener();
-  }, { once: true, passive: true });
-};

plugins/precise-volume/back.ts

@@ -1,28 +0,0 @@
-import { globalShortcut, BrowserWindow } from 'electron';
-
-import volumeHudStyle from './volume-hud.css';
-
-import { injectCSS } from '../utils';
-
-import type { ConfigType } from '../../config/dynamic';
-
-/*
-This is used to determine if plugin is actually active
-(not if it's only enabled in options)
-*/
-let isEnabled = false;
-
-export const enabled = () => isEnabled;
-
-export default (win: BrowserWindow, options: ConfigType<'precise-volume'>) => {
-  isEnabled = true;
-  injectCSS(win.webContents, volumeHudStyle);
-
-  if (options.globalShortcuts?.volumeUp) {
-    globalShortcut.register((options.globalShortcuts.volumeUp), () => win.webContents.send('changeVolume', true));
-  }
-
-  if (options.globalShortcuts?.volumeDown) {
-    globalShortcut.register((options.globalShortcuts.volumeDown), () => win.webContents.send('changeVolume', false));
-  }
-};

plugins/precise-volume/front.ts

@@ -1,270 +0,0 @@
-import { ipcRenderer } from 'electron';
-
-import { setOptions, setMenuOptions, isEnabled } from '../../config/plugins';
-import { debounce } from '../../providers/decorators';
-
-import { YoutubePlayer } from '../../types/youtube-player';
-
-import type { ConfigType } from '../../config/dynamic';
-
-function $<E extends Element = Element>(selector: string) {
-  return document.querySelector<E>(selector);
-}
-
-let api: YoutubePlayer;
-let options: ConfigType<'precise-volume'>;
-
-export default (_options: ConfigType<'precise-volume'>) => {
-  options = _options;
-  document.addEventListener('apiLoaded', (e) => {
-    api = e.detail;
-    ipcRenderer.on('changeVolume', (_, toIncrease: boolean) => changeVolume(toIncrease));
-    ipcRenderer.on('setVolume', (_, value: number) => setVolume(value));
-    firstRun();
-  }, { once: true, passive: true });
-};
-
-// Without this function it would rewrite config 20 time when volume change by 20
-const writeOptions = debounce(() => {
-  setOptions('precise-volume', options);
-}, 1000);
-
-export const moveVolumeHud = debounce((showVideo: boolean) => {
-  const volumeHud = $<HTMLElement>('#volumeHud');
-  if (!volumeHud) {
-    return;
-  }
-
-  volumeHud.style.top = showVideo
-    ? `${($('ytmusic-player')!.clientHeight - $('video')!.clientHeight) / 2}px`
-    : '0';
-}, 250);
-
-const hideVolumeHud = debounce((volumeHud: HTMLElement) => {
-  volumeHud.style.opacity = '0';
-}, 2000);
-
-const hideVolumeSlider = debounce((slider: HTMLElement) => {
-  slider.classList.remove('on-hover');
-}, 2500);
-
-/** Restore saved volume and setup tooltip */
-function firstRun() {
-  if (typeof options.savedVolume === 'number') {
-    // Set saved volume as tooltip
-    setTooltip(options.savedVolume);
-
-    if (api.getVolume() !== options.savedVolume) {
-      setVolume(options.savedVolume);
-    }
-  }
-
-  setupPlaybar();
-
-  setupLocalArrowShortcuts();
-
-  // Workaround: computedStyleMap().get(string) returns CSSKeywordValue instead of CSSStyleValue
-  const noVid = ($('#main-panel')?.computedStyleMap().get('display') as CSSKeywordValue)?.value === 'none';
-  injectVolumeHud(noVid);
-  if (!noVid) {
-    setupVideoPlayerOnwheel();
-    if (!isEnabled('video-toggle')) {
-      // Video-toggle handles hud positioning on its own
-      const videoMode = () => api.getPlayerResponse().videoDetails?.musicVideoType !== 'MUSIC_VIDEO_TYPE_ATV';
-      $('video')?.addEventListener('srcChanged', () => moveVolumeHud(videoMode()));
-    }
-  }
-
-  // Change options from renderer to keep sync
-  ipcRenderer.on('setOptions', (_event, newOptions = {}) => {
-    Object.assign(options, newOptions);
-    setMenuOptions('precise-volume', options);
-  });
-}
-
-function injectVolumeHud(noVid: boolean) {
-  if (noVid) {
-    const position = 'top: 18px; right: 60px;';
-    const mainStyle = 'font-size: xx-large;';
-
-    $('.center-content.ytmusic-nav-bar')?.insertAdjacentHTML(
-      'beforeend',
-      `<span id="volumeHud" style="${position + mainStyle}"></span>`,
-    );
-  } else {
-    const position = 'top: 10px; left: 10px;';
-    const mainStyle = 'font-size: xxx-large; webkit-text-stroke: 1px black; font-weight: 600;';
-
-    $('#song-video')?.insertAdjacentHTML(
-      'afterend',
-      `<span id="volumeHud" style="${position + mainStyle}"></span>`,
-    );
-  }
-}
-
-function showVolumeHud(volume: number) {
-  const volumeHud = $<HTMLElement>('#volumeHud');
-  if (!volumeHud) {
-    return;
-  }
-
-  volumeHud.textContent = `${volume}%`;
-  volumeHud.style.opacity = '1';
-
-  hideVolumeHud(volumeHud);
-}
-
-/** Add onwheel event to video player */
-function setupVideoPlayerOnwheel() {
-  const panel = $<HTMLElement>('#main-panel');
-  if (!panel) return;
-
-  panel.addEventListener('wheel', (event) => {
-    event.preventDefault();
-    // Event.deltaY < 0 means wheel-up
-    changeVolume(event.deltaY < 0);
-  });
-}
-
-function saveVolume(volume: number) {
-  options.savedVolume = volume;
-  writeOptions();
-}
-
-/** Add onwheel event to play bar and also track if play bar is hovered */
-function setupPlaybar() {
-  const playerbar = $<HTMLElement>('ytmusic-player-bar');
-  if (!playerbar) return;
-
-  playerbar.addEventListener('wheel', (event) => {
-    event.preventDefault();
-    // Event.deltaY < 0 means wheel-up
-    changeVolume(event.deltaY < 0);
-  });
-
-  // Keep track of mouse position for showVolumeSlider()
-  playerbar.addEventListener('mouseenter', () => {
-    playerbar.classList.add('on-hover');
-  });
-
-  playerbar.addEventListener('mouseleave', () => {
-    playerbar.classList.remove('on-hover');
-  });
-
-  setupSliderObserver();
-}
-
-/** Save volume + Update the volume tooltip when volume-slider is manually changed */
-function setupSliderObserver() {
-  const sliderObserver = new MutationObserver((mutations) => {
-    for (const mutation of mutations) {
-      if (mutation.target instanceof HTMLInputElement) {
-        // This checks that volume-slider was manually set
-        const target = mutation.target;
-        const targetValueNumeric = Number(target.value);
-        if (mutation.oldValue !== target.value
-          && (typeof options.savedVolume !== 'number' || Math.abs(options.savedVolume - targetValueNumeric) > 4)) {
-          // Diff>4 means it was manually set
-          setTooltip(targetValueNumeric);
-          saveVolume(targetValueNumeric);
-        }
-      }
-    }
-  });
-
-  const slider = $('#volume-slider');
-  if (!slider) return;
-
-  // Observing only changes in 'value' of volume-slider
-  sliderObserver.observe(slider, {
-    attributeFilter: ['value'],
-    attributeOldValue: true,
-  });
-}
-
-function setVolume(value: number) {
-  api.setVolume(value);
-  // Save the new volume
-  saveVolume(value);
-
-  // Change slider position (important)
-  updateVolumeSlider();
-
-  // Change tooltips to new value
-  setTooltip(value);
-  // Show volume slider
-  showVolumeSlider();
-  // Show volume HUD
-  showVolumeHud(value);
-}
-
-/** If (toIncrease = false) then volume decrease */
-function changeVolume(toIncrease: boolean) {
-  // Apply volume change if valid
-  const steps = Number(options.steps || 1);
-  setVolume(toIncrease
-    ? Math.min(api.getVolume() + steps, 100)
-    : Math.max(api.getVolume() - steps, 0));
-}
-
-function updateVolumeSlider() {
-  const savedVolume = options.savedVolume ?? 0;
-  // Slider value automatically rounds to multiples of 5
-  for (const slider of ['#volume-slider', '#expand-volume-slider']) {
-    const silderElement = $<HTMLInputElement>(slider);
-    if (silderElement) {
-      silderElement.value = String(savedVolume > 0 && savedVolume < 5 ? 5 : savedVolume);
-    }
-  }
-}
-
-function showVolumeSlider() {
-  const slider = $<HTMLElement>('#volume-slider');
-  if (!slider) return;
-
-  // This class display the volume slider if not in minimized mode
-  slider.classList.add('on-hover');
-
-  hideVolumeSlider(slider);
-}
-
-// Set new volume as tooltip for volume slider and icon + expanding slider (appears when window size is small)
-const tooltipTargets = [
-  '#volume-slider',
-  'tp-yt-paper-icon-button.volume',
-  '#expand-volume-slider',
-  '#expand-volume',
-];
-
-function setTooltip(volume: number) {
-  for (const target of tooltipTargets) {
-    const tooltipTargetElement = $<HTMLElement>(target);
-    if (tooltipTargetElement) {
-      tooltipTargetElement.title = `${volume}%`;
-    }
-  }
-}
-
-function setupLocalArrowShortcuts() {
-  if (options.arrowsShortcut) {
-    window.addEventListener('keydown', (event) => {
-      if ($<HTMLElement & { opened: boolean }>('ytmusic-search-box')?.opened) {
-        return;
-      }
-
-      switch (event.code) {
-        case 'ArrowUp': {
-          event.preventDefault();
-          changeVolume(true);
-          break;
-        }
-
-        case 'ArrowDown': {
-          event.preventDefault();
-          changeVolume(false);
-          break;
-        }
-      }
-    });
-  }
-}

plugins/precise-volume/menu.ts

@@ -1,94 +0,0 @@
-import prompt, { KeybindOptions } from 'custom-electron-prompt';
-
-import { BrowserWindow, MenuItem } from 'electron';
-
-import { enabled } from './back';
-
-import { setMenuOptions } from '../../config/plugins';
-import promptOptions from '../../providers/prompt-options';
-import { MenuTemplate } from '../../menu';
-
-import type { ConfigType } from '../../config/dynamic';
-
-function changeOptions(changedOptions: Partial<ConfigType<'precise-volume'>>, options: ConfigType<'precise-volume'>, win: BrowserWindow) {
-  for (const option in changedOptions) {
-    // HACK: Weird TypeScript error
-    (options as Record<string, unknown>)[option] = (changedOptions as Record<string, unknown>)[option];
-  }
-  // Dynamically change setting if plugin is enabled
-  if (enabled()) {
-    win.webContents.send('setOptions', changedOptions);
-  } else { // Fallback to usual method if disabled
-    setMenuOptions('precise-volume', options);
-  }
-}
-
-export default (win: BrowserWindow, options: ConfigType<'precise-volume'>): MenuTemplate => [
-  {
-    label: 'Local Arrowkeys Controls',
-    type: 'checkbox',
-    checked: Boolean(options.arrowsShortcut),
-    click(item) {
-      changeOptions({ arrowsShortcut: item.checked }, options, win);
-    },
-  },
-  {
-    label: 'Global Hotkeys',
-    type: 'checkbox',
-    checked: Boolean(options.globalShortcuts?.volumeUp ?? options.globalShortcuts?.volumeDown),
-    click: (item) => promptGlobalShortcuts(win, options, item),
-  },
-  {
-    label: 'Set Custom Volume Steps',
-    click: () => promptVolumeSteps(win, options),
-  },
-];
-
-// Helper function for globalShortcuts prompt
-const kb = (label_: string, value_: string, default_: string): KeybindOptions => ({ 'value': value_, 'label': label_, 'default': default_ || undefined });
-
-async function promptVolumeSteps(win: BrowserWindow, options: ConfigType<'precise-volume'>) {
-  const output = await prompt({
-    title: 'Volume Steps',
-    label: 'Choose Volume Increase/Decrease Steps',
-    value: options.steps || 1,
-    type: 'counter',
-    counterOptions: { minimum: 0, maximum: 100, multiFire: true },
-    width: 380,
-    ...promptOptions(),
-  }, win);
-
-  if (output || output === 0) { // 0 is somewhat valid
-    changeOptions({ steps: output }, options, win);
-  }
-}
-
-async function promptGlobalShortcuts(win: BrowserWindow, options: ConfigType<'precise-volume'>, item: MenuItem) {
-  const output = await prompt({
-    title: 'Global Volume Keybinds',
-    label: 'Choose Global Volume Keybinds:',
-    type: 'keybind',
-    keybindOptions: [
-      kb('Increase Volume', 'volumeUp', options.globalShortcuts?.volumeUp),
-      kb('Decrease Volume', 'volumeDown', options.globalShortcuts?.volumeDown),
-    ],
-    ...promptOptions(),
-  }, win);
-
-  if (output) {
-    const newGlobalShortcuts: {
-      volumeUp: string;
-      volumeDown: string;
-    } = { volumeUp: '', volumeDown: '' };
-    for (const { value, accelerator } of output) {
-      newGlobalShortcuts[value as keyof typeof newGlobalShortcuts] = accelerator;
-    }
-
-    changeOptions({ globalShortcuts: newGlobalShortcuts }, options, win);
-
-    item.checked = Boolean(options.globalShortcuts.volumeUp) || Boolean(options.globalShortcuts.volumeDown);
-  } else {
-    // Reset checkbox if prompt was canceled
-    item.checked = !item.checked;
-  }
-}

plugins/precise-volume/preload.ts

@@ -1,41 +0,0 @@
-/* what */
-/* eslint-disable @typescript-eslint/ban-ts-comment */
-
-import is from 'electron-is';
-
-const ignored = {
-  id: ['volume-slider', 'expand-volume-slider'],
-  types: ['mousewheel', 'keydown', 'keyup'],
-};
-
-function overrideAddEventListener() {
-  // YO WHAT ARE YOU DOING NOW?!?!
-  // Save native addEventListener
-  // @ts-ignore
-  // eslint-disable-next-line @typescript-eslint/unbound-method
-  Element.prototype._addEventListener = Element.prototype.addEventListener;
-  // Override addEventListener to Ignore specific events in volume-slider
-  Element.prototype.addEventListener = function (type: string, listener: (event: Event) => void, useCapture = false) {
-    if (!(
-      ignored.id.includes(this.id)
-      && ignored.types.includes(type)
-    )) {
-      // eslint-disable-next-line @typescript-eslint/no-explicit-any,@typescript-eslint/no-unsafe-call,@typescript-eslint/no-unsafe-member-access
-      (this as any)._addEventListener(type, listener, useCapture);
-    } else if (is.dev()) {
-      console.log(`Ignoring event: "${this.id}.${type}()"`);
-    }
-  };
-}
-
-export default () => {
-  overrideAddEventListener();
-  // Restore original function after finished loading to avoid keeping Element.prototype altered
-  window.addEventListener('load', () => {
-    // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment,@typescript-eslint/no-explicit-any,@typescript-eslint/no-unsafe-member-access
-    Element.prototype.addEventListener = (Element.prototype as any)._addEventListener;
-    // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment,@typescript-eslint/no-explicit-any,@typescript-eslint/no-unsafe-member-access
-    (Element.prototype as any)._addEventListener = undefined;
-
-  }, { once: true });
-};

plugins/quality-changer/back.ts

@@ -1,13 +0,0 @@
-import { ipcMain, dialog } from 'electron';
-
-export default () => {
-  ipcMain.handle('qualityChanger', async (_, qualityLabels: string[], currentIndex: number) => await dialog.showMessageBox({
-    type: 'question',
-    buttons: qualityLabels,
-    defaultId: currentIndex,
-    title: 'Choose Video Quality',
-    message: 'Choose Video Quality:',
-    detail: `Current Quality: ${qualityLabels[currentIndex]}`,
-    cancelId: -1,
-  }));
-};