Merge branch 'master' into synced-lyrics/netease

Currently translated at 100.0% (457 of 457 strings)

Translation: pear-devs/pear-desktop/i18n
Translate-URL: https://hosted.weblate.org/projects/youtube-music/i18n/zh_Hans/

.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

@@ -1,5 +1,5 @@
 name: Bug Report
-description: Report a YouTube Music bug
+description: Report a Pear Desktop bug
 title: "[Bug]: "
 labels: "bug :beetle:"
 body:
@@ -8,20 +8,28 @@ body:
     label: Preflight Checklist
     description: Please ensure you've completed all of the following.
     options:
-      - label: I use the latest version of YouTube Music (Application).
+      - label: I use the latest version of Pear Desktop (Application).
         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.
+      - label: I have searched the [issue tracker](https://github.com/pear-devs/pear-desktop/issues) for a bug report that matches the one I want to file, without success.
+        required: true
+      - label: I understand that **pear-devs/pear-desktop has NO affiliation with Google or YouTube**
         required: true
 - type: input
   attributes:
-    label: YouTube Music (Application) Version
+    label: Pear Desktop (Application) Version
     description: |
-      What version of YouTube Music Application are you using?
+      What version of the Pear Desktop 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 Pear Desktop 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
@@ -52,13 +60,20 @@ body:
     required: true
 - type: input
   attributes:
-    label: Last Known Working YouTube Music (Application) version
-    description: (If applicable) What is the last version of YouTube Music this worked in?
+    label: Last Known Working Pear Desktop (Application) version
+    description: (If applicable) What is the last version of Pear Desktop 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,7 +82,14 @@ 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
-    description: If your problem needs further explanation, or if the issue you're seeing cannot be reproduced in a gist, please add more information here. 
+    description: If your problem needs further explanation, or if the issue you're seeing cannot be reproduced in a gist, please add more information here.

.github/ISSUE_TEMPLATE/feature_request.yml

@@ -1,5 +1,5 @@
 name: Feature Request
-description: Suggest an idea for YouTube Music
+description: Suggest an idea for Pear Desktop
 title: "[Feature Request]: "
 labels: "enhancement :sparkles:"
 body:
@@ -8,14 +8,14 @@ body:
     label: Preflight Checklist
     description: Please ensure you've completed all of the following.
     options:
-      - label: I use the latest version of YouTube Music (Application).
+      - label: I use the latest version of Pear Desktop (Application).
         required: true
-      - label: I have searched the [issue tracker](https://github.com/th-ch/youtube-music/issues) for a feature request that matches the one I want to file, without success.
+      - label: I have searched the [issue tracker](https://github.com/pear-devs/pear-desktop/issues) for a feature request that matches the one I want to file, without success.
         required: true
 - 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

@@ -1,4 +1,4 @@
-name: Build YouTube Music
+name: Build Pear Desktop
 
 on:
   push:
@@ -6,11 +6,12 @@ on:
   pull_request:
 
 env:
-  NODE_VERSION: "20.x"
+  NODE_VERSION: "22.x"
 
 jobs:
   build:
-    name: Build YouTube Music
+    if: github.event.pull_request.draft == false
+    name: Build Pear Desktop
     runs-on: ${{ matrix.os }}
     strategy:
       fail-fast: true
@@ -18,80 +19,104 @@ jobs:
         os: [ macos-latest, ubuntu-latest, windows-latest ]
 
     steps:
-      - uses: actions/checkout@v4
+      - uses: actions/checkout@v5
+
+      - name: Install pnpm
+        uses: pnpm/action-setup@v4
+        with:
+          version: 10
+          run_install: false
 
       - name: Setup NodeJS
-        uses: actions/setup-node@v3
+        if: startsWith(matrix.os, 'macOS') != true
+        uses: actions/setup-node@v5
+        with:
+          node-version: ${{ env.NODE_VERSION }}
+          cache: 'pnpm'
+
+      - name: Setup NodeJS for macOS
+        if: startsWith(matrix.os, 'macOS')
+        uses: actions/setup-node@v5
         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 == 'pear-devs/pear-desktop' && 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 == 'pear-devs/pear-desktop' && 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 == 'pear-devs/pear-desktop' && 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/24.08
+          sudo flatpak install -y flathub org.freedesktop.Sdk/x86_64/24.08
+          sudo flatpak install -y flathub org.electronjs.Electron2.BaseApp/x86_64/24.08
+          pnpm release:linux
+
+      - name: Build and release on Windows
+        if: startsWith(matrix.os, 'windows') && (github.repository == 'pear-devs/pear-desktop' && 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
-    name: Release YouTube Music
-    if: github.repository == 'th-ch/youtube-music' && github.ref == 'refs/heads/master'
+    name: Release Pear Desktop
+    if: github.repository == 'pear-devs/pear-desktop' && github.ref == 'refs/heads/master'
     needs: build
     steps:
-      - uses: actions/checkout@v4
+      - uses: actions/checkout@v5
         with:
           fetch-depth: 0
 
+      - name: Install pnpm
+        uses: pnpm/action-setup@v4
+        with:
+          version: 10
+          run_install: false
+
       - name: Setup NodeJS
-        uses: actions/setup-node@v3
+        if: startsWith(matrix.os, 'macOS') != true
+        uses: actions/setup-node@v5
+        with:
+          node-version: ${{ env.NODE_VERSION }}
+          cache: 'pnpm'
+
+      - name: Setup NodeJS for macOS
+        if: startsWith(matrix.os, 'macOS')
+        uses: actions/setup-node@v5
         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 +142,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
@@ -125,18 +150,20 @@ jobs:
           name: ${{ env.VERSION_TAG }}
           replacebody: true
           body: |
-            See [changelog](https://github.com/th-ch/youtube-music/blob/master/changelog.md#${{ env.CHANGELOG_ANCHOR }}) for the list of updates and the full diff.
+            See [changelog](https://github.com/pear-devs/pear-desktop/blob/master/changelog.md#${{ env.CHANGELOG_ANCHOR }}) for the list of updates and the full diff.
 
             Thanks to all contributors! 🏅
 
+            (Note for Windows: `Pear-Desktop-Web-Setup-${{ env.VERSION_TAG }}.exe` is an installer, and `Pear-Desktop-${{ 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 == '' }}
-        uses: stefanzweifel/git-auto-commit-action@v5
+        uses: stefanzweifel/git-auto-commit-action@v6
         with:
           commit_message: Update changelog for ${{ env.VERSION_TAG }}
           file_pattern: "changelog.md"

.github/workflows/dependency-review.yml

@@ -12,9 +12,11 @@ permissions:
 
 jobs:
   dependency-review:
+    if: github.event.pull_request.draft == false
     runs-on: ubuntu-latest
     steps:
       - name: "Checkout Repository"
-        uses: actions/checkout@v4
+        uses: actions/checkout@v5
+
       - name: "Dependency Review"
-        uses: actions/dependency-review-action@v3
+        uses: actions/dependency-review-action@v4

.github/workflows/pr-build-artifacts.yml

@@ -0,0 +1,147 @@
+name: Build PR Artifacts
+
+on:
+  pull_request:
+    types: [opened, synchronize, reopened]
+
+env:
+  NODE_VERSION: "22.x"
+
+jobs:
+  check-permissions:
+    if: github.event.pull_request.draft == false
+    name: Check if user has write access
+    runs-on: ubuntu-latest
+    outputs:
+      has-write-access: ${{ steps.check.outputs.require-result }}
+    steps:
+      - name: Check user permission
+        id: check
+        uses: actions-cool/check-user-permission@v2
+        with:
+          require: write
+          username: ${{ github.event.pull_request.user.login }}
+
+  build:
+    name: Build ${{ matrix.os }}
+    needs: check-permissions
+    if: needs.check-permissions.outputs.has-write-access == 'true'
+    runs-on: ${{ matrix.os }}
+    strategy:
+      fail-fast: false
+      matrix:
+        os: [macos-latest, ubuntu-latest, windows-latest]
+
+    steps:
+      - uses: actions/checkout@v5
+
+      - name: Install pnpm
+        uses: pnpm/action-setup@v4
+        with:
+          version: 10
+          run_install: false
+
+      - name: Setup NodeJS
+        if: startsWith(matrix.os, 'macOS') != true
+        uses: actions/setup-node@v5
+        with:
+          node-version: ${{ env.NODE_VERSION }}
+          cache: 'pnpm'
+
+      - name: Setup NodeJS for macOS
+        if: startsWith(matrix.os, 'macOS')
+        uses: actions/setup-node@v5
+        with:
+          node-version: ${{ env.NODE_VERSION }}
+
+      - name: Install dependencies
+        run: pnpm install --frozen-lockfile
+
+      - name: Build on macOS
+        if: startsWith(matrix.os, 'macOS')
+        run: |
+          pnpm dist:mac
+          pnpm dist:mac:arm64
+
+      - name: Install Linux dependencies
+        if: startsWith(matrix.os, 'ubuntu')
+        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/24.08
+          sudo flatpak install -y flathub org.freedesktop.Sdk/x86_64/24.08
+          sudo flatpak install -y flathub org.electronjs.Electron2.BaseApp/x86_64/24.08
+
+      - name: Build on Linux
+        if: startsWith(matrix.os, 'ubuntu')
+        run: |
+          pnpm dist:linux
+          pnpm dist:linux:deb-arm64
+          pnpm dist:linux:rpm-arm64
+
+      - name: Build on Windows
+        if: startsWith(matrix.os, 'windows')
+        run: |
+          pnpm dist:win
+
+      - name: Upload artifacts
+        uses: actions/upload-artifact@v4
+        with:
+          name: build-artifacts-${{ matrix.os }}
+          path: pack/
+          retention-days: 7
+          if-no-files-found: error
+
+  comment:
+    name: Comment on PR
+    needs: [check-permissions, build]
+    if: always() && needs.check-permissions.outputs.has-write-access == 'true'
+    runs-on: ubuntu-latest
+    permissions:
+      pull-requests: write
+    steps:
+      - name: Create comment
+        uses: actions/github-script@v7
+        with:
+          script: |
+            const runId = context.runId;
+            const runUrl = `https://github.com/${context.repo.owner}/${context.repo.repo}/actions/runs/${runId}`;
+
+            const buildResult = '${{ needs.build.result }}';
+
+            let comment;
+            if (buildResult === 'success') {
+              comment = `## 🚀 Build Artifacts Ready!
+
+            The builds have completed successfully. You can download the artifacts from the workflow run:
+
+            **[📦 Download Artifacts](${runUrl})**
+
+            ### Available builds:
+            - **Windows**: \`build-artifacts-windows-latest\`
+            - **macOS**: \`build-artifacts-macos-latest\`
+            - **Linux**: \`build-artifacts-ubuntu-latest\`
+
+            *Note: Artifacts are available for 7 days.*`;
+            } else if (buildResult === 'failure') {
+              comment = `## ❌ Build Failed
+
+            Unfortunately, one or more builds failed. Please check the workflow run for details:
+
+            **[View Workflow Run](${runUrl})**`;
+            } else {
+              comment = `## ⚠️ Build Status: ${buildResult}
+
+            The build process completed with status: **${buildResult}**
+
+            **[View Workflow Run](${runUrl})**`;
+            }
+
+            github.rest.issues.createComment({
+              issue_number: context.issue.number,
+              owner: context.repo.owner,
+              repo: context.repo.repo,
+              body: comment
+            });

.github/workflows/reviewdog.yml

@@ -0,0 +1,42 @@
+name: reviewdog
+
+on: [pull_request_target]
+
+env:
+  NODE_VERSION: "22.x"
+
+jobs:
+  eslint:
+    if: github.event.pull_request.draft == false
+    name: runner / eslint
+    runs-on: ubuntu-latest
+    permissions:
+      contents: read
+      pull-requests: write
+      checks: write
+    steps:
+      - uses: actions/checkout@v5
+        with:
+          ref: ${{ github.event.pull_request.head.sha }}
+
+      - name: Install pnpm
+        uses: pnpm/action-setup@v4
+        with:
+          version: 10
+          run_install: false
+
+      - name: Setup NodeJS
+        uses: actions/setup-node@v5
+        with:
+          node-version: ${{ env.NODE_VERSION }}
+          cache: 'pnpm'
+
+      - name: Install dependencies
+        run: pnpm install --frozen-lockfile
+
+      - uses: reviewdog/action-eslint@v1.34.0
+        with:
+          github_token: ${{ secrets.GITHUB_TOKEN }}
+          reporter: github-pr-review # Change reporter.
+          eslint_flags: './src'
+          fail_level: error

.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
+        uses: vedantmgoyal2009/winget-releaser@main
         with:
-          identifier: th-ch.YouTubeMusic
-          installers-regex: '^YouTube-Music-Setup-[\d\.]+\.exe$'
-          version: ${{ inputs.tag_name || github.event.release.tag_name }}
+          identifier: pear-devs.PearDesktop
+          installers-regex: '^Pear-Desktop-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
+          fork-user: pear-desktop-winget

.gitignore

@@ -1,7 +1,6 @@
 node_modules
 /dist
 /pack
-electron-builder.yml
 .vscode/settings.json
 .idea
 
@@ -12,3 +11,6 @@ electron-builder.yml
 !.yarn/releases
 !.yarn/sdks
 !.yarn/versions
+.vite-inspect
+
+.DS_Store

.prettierrc

@@ -0,0 +1,7 @@
+{
+  "tabWidth": 2,
+  "useTabs": false,
+  "singleQuote": true,
+  "trailingComma": "all",
+  "quoteProps": "consistent"
+}

README.md

@@ -0,0 +1,291 @@
+<div align="center">
+
+# :pear: Pear Desktop
+
+[![GitHub release](https://img.shields.io/github/release/pear-devs/pear-desktop.svg?style=for-the-badge)](https://github.com/pear-devs/pear-desktop/releases/)
+[![GitHub license](https://img.shields.io/github/license/pear-devs/pear-desktop.svg?style=for-the-badge)](https://github.com/pear-devs/pear-desktop/blob/master/license)
+[![eslint code style](https://img.shields.io/badge/code_style-eslint-5ed9c7.svg?style=for-the-badge)](https://github.com/pear-devs/pear-desktop/blob/master/eslint.config.mjs)
+[![Build status](https://img.shields.io/github/actions/workflow/status/pear-devs/pear-desktop/build.yml?branch=master&style=for-the-badge)](https://GitHub.com/pear-devs/pear-desktop/releases/)
+[![GitHub All Releases](https://img.shields.io/github/downloads/pear-devs/pear-desktop/total?style=for-the-badge)](https://GitHub.com/pear-devs/pear-desktop/releases/)
+<!--[![AUR](https://img.shields.io/aur/version/pear-desktop-bin?color=blueviolet&style=for-the-badge)](https://aur.archlinux.org/packages/pear-desktop-bin)-->
+[![Known Vulnerabilities](https://snyk.io/test/github/pear-devs/pear-desktop/badge.svg)](https://snyk.io/test/github/pear-devs/pear-desktop)
+
+</div>
+
+<!--![Screenshot](web/screenshot.png "Screenshot")-->
+
+- Native look & feel extension
+
+> [!IMPORTANT]
+> ⚠️ Disclaimer
+>
+> **No Affiliation**
+>
+> This project, and its contributors, are not affiliated with, authorized by, endorsed by, or in any way officially connected with Google LLC, YouTube, or any of their subsidiaries or affiliates. **This is an independent, non-profit, and unofficial extension developed by a team of volunteers with the goal of providing a desktop experience.**
+>
+> **Trademarks**
+>
+> The names "Google" and "YouTube Music", as well as related names, marks, emblems, and images, are registered trademarks of their respective owners. Any use of these trademarks is for identification and reference purposes only and does not imply any association with the trademark holder. We have no intention of infringing upon these trademarks or causing harm to the trademark holders.
+>
+> **Limitation of Liability**
+>
+> This application (extension) is provided "AS IS", and you use it at your own risk. In no event shall the developers or contributors be liable for any claim, damages, or other liability, including any legal consequences, arising from, out of, or in connection with the software or the use or other dealings in the software. The responsibility for any and all outcomes of using this software rests entirely with the user.
+
+## Content
+
+- [Features](#features)
+- [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)
+
+## Translation
+
+You can help with translation on [Hosted Weblate](https://bit.ly/48n5YF7).
+
+<a href="https://bit.ly/48n5YF7/">
+  <img src="https://bit.ly/4q83L6S" alt="translation status" />
+  <img src="https://bit.ly/4h3zBxo" alt="translation status 2" />
+</a>
+
+## Download
+
+You can check out the [latest release](https://github.com/pear-devs/pear-desktop/releases/latest) to quickly find the
+latest version.
+
+### Arch Linux
+
+Install the [`pear-desktop`](https://aur.archlinux.org/packages/pear-desktop) 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/pear-devs/pear-desktop-homebrew)):
+
+```bash
+brew install pear-devs/pear-desktop
+```
+
+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
+/usr/bin/xattr -cr /Applications/Pear\ Desktop.app
+```
+
+### Windows
+
+You can use the [Scoop package manager](https://scoop.sh) to install the `pear-desktop` package from
+the [`extras` bucket](https://github.com/ScoopInstaller/Extras).
+
+```bash
+scoop bucket add extras
+scoop install extras/pear-desktop
+```
+
+Alternately you can use [Winget](https://learn.microsoft.com/en-us/windows/package-manager/winget/), Windows 11s
+official CLI package manager to install the `pear-devs.pear-desktop` 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 pear-devs.pear-desktop
+```
+
+#### How to install without a network connection? (in Windows)
+
+- Download the `*.nsis.7z` file for _your device architecture_ in [release page](https://github.com/pear-devs/pear-desktop/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/pear-devs/pear-desktop
+cd pear-desktop
+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, context) {
+      // 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, pear-desktop 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() {
+    console.log('hello from renderer');
+  } // 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 © [pear-devs](https://github.com/pear-devs/pear-desktop)
+
+## 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 Pear Desktop</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 Pear Desktop… Internet disconnected?</p>
+      <a class="button" href="#" onclick="reload()">Retry</a>
+    </div>
+  </body>
+</html>

assets/mdui.css

@@ -0,0 +1,607 @@
+:root {
+  --mdui-breakpoint-xs: 0px;
+  --mdui-breakpoint-sm: 600px;
+  --mdui-breakpoint-md: 840px;
+  --mdui-breakpoint-lg: 1080px;
+  --mdui-breakpoint-xl: 1440px;
+  --mdui-breakpoint-xxl: 1920px;
+}
+
+:root {
+  --mdui-color-primary-light: 103, 80, 164;
+  --mdui-color-primary-container-light: 234, 221, 255;
+  --mdui-color-on-primary-light: 255, 255, 255;
+  --mdui-color-on-primary-container-light: 33, 0, 94;
+  --mdui-color-inverse-primary-light: 208, 188, 255;
+  --mdui-color-secondary-light: 98, 91, 113;
+  --mdui-color-secondary-container-light: 232, 222, 248;
+  --mdui-color-on-secondary-light: 255, 255, 255;
+  --mdui-color-on-secondary-container-light: 30, 25, 43;
+  --mdui-color-tertiary-light: 125, 82, 96;
+  --mdui-color-tertiary-container-light: 255, 216, 228;
+  --mdui-color-on-tertiary-light: 255, 255, 255;
+  --mdui-color-on-tertiary-container-light: 55, 11, 30;
+  --mdui-color-surface-light: 254, 247, 255;
+  --mdui-color-surface-dim-light: 222, 216, 225;
+  --mdui-color-surface-bright-light: 254, 247, 255;
+  --mdui-color-surface-container-lowest-light: 255, 255, 255;
+  --mdui-color-surface-container-low-light: 247, 242, 250;
+  --mdui-color-surface-container-light: 243, 237, 247;
+  --mdui-color-surface-container-high-light: 236, 230, 240;
+  --mdui-color-surface-container-highest-light: 230, 224, 233;
+  --mdui-color-surface-variant-light: 231, 224, 236;
+  --mdui-color-on-surface-light: 28, 27, 31;
+  --mdui-color-on-surface-variant-light: 73, 69, 78;
+  --mdui-color-inverse-surface-light: 49, 48, 51;
+  --mdui-color-inverse-on-surface-light: 244, 239, 244;
+  --mdui-color-background-light: 254, 247, 255;
+  --mdui-color-on-background-light: 28, 27, 31;
+  --mdui-color-error-light: 179, 38, 30;
+  --mdui-color-error-container-light: 249, 222, 220;
+  --mdui-color-on-error-light: 255, 255, 255;
+  --mdui-color-on-error-container-light: 65, 14, 11;
+  --mdui-color-outline-light: 121, 116, 126;
+  --mdui-color-outline-variant-light: 196, 199, 197;
+  --mdui-color-shadow-light: 0, 0, 0;
+  --mdui-color-surface-tint-color-light: 103, 80, 164;
+  --mdui-color-scrim-light: 0, 0, 0;
+  --mdui-color-primary-dark: 208, 188, 255;
+  --mdui-color-primary-container-dark: 79, 55, 139;
+  --mdui-color-on-primary-dark: 55, 30, 115;
+  --mdui-color-on-primary-container-dark: 234, 221, 255;
+  --mdui-color-inverse-primary-dark: 103, 80, 164;
+  --mdui-color-secondary-dark: 204, 194, 220;
+  --mdui-color-secondary-container-dark: 74, 68, 88;
+  --mdui-color-on-secondary-dark: 51, 45, 65;
+  --mdui-color-on-secondary-container-dark: 232, 222, 248;
+  --mdui-color-tertiary-dark: 239, 184, 200;
+  --mdui-color-tertiary-container-dark: 99, 59, 72;
+  --mdui-color-on-tertiary-dark: 73, 37, 50;
+  --mdui-color-on-tertiary-container-dark: 255, 216, 228;
+  --mdui-color-surface-dark: 20, 18, 24;
+  --mdui-color-surface-dim-dark: 20, 18, 24;
+  --mdui-color-surface-bright-dark: 59, 56, 62;
+  --mdui-color-surface-container-lowest-dark: 15, 13, 19;
+  --mdui-color-surface-container-low-dark: 29, 27, 32;
+  --mdui-color-surface-container-dark: 33, 31, 38;
+  --mdui-color-surface-container-high-dark: 43, 41, 48;
+  --mdui-color-surface-container-highest-dark: 54, 52, 59;
+  --mdui-color-surface-variant-dark: 73, 69, 79;
+  --mdui-color-on-surface-dark: 230, 225, 229;
+  --mdui-color-on-surface-variant-dark: 202, 196, 208;
+  --mdui-color-inverse-surface-dark: 230, 225, 229;
+  --mdui-color-inverse-on-surface-dark: 49, 48, 51;
+  --mdui-color-background-dark: 20, 18, 24;
+  --mdui-color-on-background-dark: 230, 225, 229;
+  --mdui-color-error-dark: 242, 184, 181;
+  --mdui-color-error-container-dark: 140, 29, 24;
+  --mdui-color-on-error-dark: 96, 20, 16;
+  --mdui-color-on-error-container-dark: 249, 222, 220;
+  --mdui-color-outline-dark: 147, 143, 153;
+  --mdui-color-outline-variant-dark: 68, 71, 70;
+  --mdui-color-shadow-dark: 0, 0, 0;
+  --mdui-color-surface-tint-color-dark: 208, 188, 255;
+  --mdui-color-scrim-dark: 0, 0, 0;
+}
+
+.mdui-theme-dark,
+:root {
+  color-scheme: dark;
+  --mdui-color-primary: var(--mdui-color-primary-dark);
+  --mdui-color-primary-container: var(--mdui-color-primary-container-dark);
+  --mdui-color-on-primary: var(--mdui-color-on-primary-dark);
+  --mdui-color-on-primary-container: var(
+    --mdui-color-on-primary-container-dark
+  );
+  --mdui-color-inverse-primary: var(--mdui-color-inverse-primary-dark);
+  --mdui-color-secondary: var(--mdui-color-secondary-dark);
+  --mdui-color-secondary-container: var(--mdui-color-secondary-container-dark);
+  --mdui-color-on-secondary: var(--mdui-color-on-secondary-dark);
+  --mdui-color-on-secondary-container: var(
+    --mdui-color-on-secondary-container-dark
+  );
+  --mdui-color-tertiary: var(--mdui-color-tertiary-dark);
+  --mdui-color-tertiary-container: var(--mdui-color-tertiary-container-dark);
+  --mdui-color-on-tertiary: var(--mdui-color-on-tertiary-dark);
+  --mdui-color-on-tertiary-container: var(
+    --mdui-color-on-tertiary-container-dark
+  );
+  --mdui-color-surface: var(--mdui-color-surface-dark);
+  --mdui-color-surface-dim: var(--mdui-color-surface-dim-dark);
+  --mdui-color-surface-bright: var(--mdui-color-surface-bright-dark);
+  --mdui-color-surface-container-lowest: var(
+    --mdui-color-surface-container-lowest-dark
+  );
+  --mdui-color-surface-container-low: var(
+    --mdui-color-surface-container-low-dark
+  );
+  --mdui-color-surface-container: var(--mdui-color-surface-container-dark);
+  --mdui-color-surface-container-high: var(
+    --mdui-color-surface-container-high-dark
+  );
+  --mdui-color-surface-container-highest: var(
+    --mdui-color-surface-container-highest-dark
+  );
+  --mdui-color-surface-variant: var(--mdui-color-surface-variant-dark);
+  --mdui-color-on-surface: var(--mdui-color-on-surface-dark);
+  --mdui-color-on-surface-variant: var(--mdui-color-on-surface-variant-dark);
+  --mdui-color-inverse-surface: var(--mdui-color-inverse-surface-dark);
+  --mdui-color-inverse-on-surface: var(--mdui-color-inverse-on-surface-dark);
+  --mdui-color-background: var(--mdui-color-background-dark);
+  --mdui-color-on-background: var(--mdui-color-on-background-dark);
+  --mdui-color-error: var(--mdui-color-error-dark);
+  --mdui-color-error-container: var(--mdui-color-error-container-dark);
+  --mdui-color-on-error: var(--mdui-color-on-error-dark);
+  --mdui-color-on-error-container: var(--mdui-color-on-error-container-dark);
+  --mdui-color-outline: var(--mdui-color-outline-dark);
+  --mdui-color-outline-variant: var(--mdui-color-outline-variant-dark);
+  --mdui-color-shadow: var(--mdui-color-shadow-dark);
+  --mdui-color-surface-tint-color: var(--mdui-color-surface-tint-color-dark);
+  --mdui-color-scrim: var(--mdui-color-scrim-dark);
+  color: rgb(var(--mdui-color-on-background));
+  background-color: rgb(var(--mdui-color-background));
+}
+
+:root {
+  --mdui-elevation-level0: none;
+  --mdui-elevation-level1: 0 0.5px 1.5px 0 rgba(var(--mdui-color-shadow), 19%),
+    0 0 1px 0 rgba(var(--mdui-color-shadow), 3.9%);
+  --mdui-elevation-level2: 0 0.85px 3px 0 rgba(var(--mdui-color-shadow), 19%),
+    0 0.25px 1px 0 rgba(var(--mdui-color-shadow), 3.9%);
+  --mdui-elevation-level3: 0 1.25px 5px 0 rgba(var(--mdui-color-shadow), 19%),
+    0 0.3333px 1.5px 0 rgba(var(--mdui-color-shadow), 3.9%);
+  --mdui-elevation-level4: 0 1.85px 6.25px 0 rgba(var(--mdui-color-shadow), 19%),
+    0 0.5px 1.75px 0 rgba(var(--mdui-color-shadow), 3.9%);
+  --mdui-elevation-level5: 0 2.75px 9px 0 rgba(var(--mdui-color-shadow), 19%),
+    0 0.25px 3px 0 rgba(var(--mdui-color-shadow), 3.9%);
+}
+
+:root {
+  --mdui-motion-easing-linear: cubic-bezier(0, 0, 1, 1);
+  --mdui-motion-easing-standard: cubic-bezier(0.2, 0, 0, 1);
+  --mdui-motion-easing-standard-accelerate: cubic-bezier(0.3, 0, 1, 1);
+  --mdui-motion-easing-standard-decelerate: cubic-bezier(0, 0, 0, 1);
+  --mdui-motion-easing-emphasized: var(--mdui-motion-easing-standard);
+  --mdui-motion-easing-emphasized-accelerate: cubic-bezier(0.3, 0, 0.8, 0.15);
+  --mdui-motion-easing-emphasized-decelerate: cubic-bezier(0.05, 0.7, 0.1, 1);
+  --mdui-motion-duration-short1: 50ms;
+  --mdui-motion-duration-short2: 100ms;
+  --mdui-motion-duration-short3: 150ms;
+  --mdui-motion-duration-short4: 200ms;
+  --mdui-motion-duration-medium1: 250ms;
+  --mdui-motion-duration-medium2: 300ms;
+  --mdui-motion-duration-medium3: 350ms;
+  --mdui-motion-duration-medium4: 400ms;
+  --mdui-motion-duration-long1: 450ms;
+  --mdui-motion-duration-long2: 500ms;
+  --mdui-motion-duration-long3: 550ms;
+  --mdui-motion-duration-long4: 600ms;
+  --mdui-motion-duration-extra-long1: 700ms;
+  --mdui-motion-duration-extra-long2: 800ms;
+  --mdui-motion-duration-extra-long3: 900ms;
+  --mdui-motion-duration-extra-long4: 1000ms;
+}
+
+.mdui-prose {
+  line-height: 1.75;
+  word-wrap: break-word;
+}
+
+.mdui-prose :first-child {
+  margin-top: 0;
+}
+
+.mdui-prose :last-child {
+  margin-bottom: 0;
+}
+
+.mdui-prose code,
+.mdui-prose kbd,
+.mdui-prose pre,
+.mdui-prose pre tt,
+.mdui-prose samp {
+  font-family: Consolas, Courier, 'Courier New', monospace;
+}
+
+.mdui-prose caption {
+  text-align: left;
+}
+.mdui-prose [draggable='true'],
+.mdui-prose [draggable] {
+  cursor: move;
+}
+.mdui-prose [draggable='false'] {
+  cursor: inherit;
+}
+.mdui-prose dl,
+.mdui-prose form,
+.mdui-prose ol,
+.mdui-prose p,
+.mdui-prose ul {
+  margin-top: 1.25em;
+  margin-bottom: 1.25em;
+}
+.mdui-prose a {
+  text-decoration: none;
+  outline: 0;
+  color: rgb(var(--mdui-color-primary));
+}
+.mdui-prose a:focus,
+.mdui-prose a:hover {
+  border-bottom: 0.0625rem solid rgb(var(--mdui-color-primary));
+}
+.mdui-prose small {
+  font-size: 0.875em;
+}
+.mdui-prose strong {
+  font-weight: 600;
+}
+.mdui-prose blockquote {
+  margin: 1.6em 2em;
+  padding-left: 1em;
+  border-left: 0.25rem solid rgb(var(--mdui-color-surface-variant));
+}
+@media only screen and (max-width: 599.98px) {
+  .mdui-prose blockquote {
+    margin: 1.6em 0;
+  }
+}
+.mdui-prose blockquote footer {
+  font-size: 86%;
+  color: rgb(var(--mdui-color-on-surface-variant));
+}
+.mdui-prose mark {
+  color: inherit;
+  background-color: rgb(var(--mdui-color-secondary-container));
+  border-bottom: 0.0625rem solid rgb(var(--mdui-color-secondary));
+  margin: 0 0.375rem;
+  padding: 0.125rem;
+}
+.mdui-prose h1,
+.mdui-prose h2,
+.mdui-prose h3,
+.mdui-prose h4,
+.mdui-prose h5,
+.mdui-prose h6 {
+  font-weight: 400;
+}
+.mdui-prose h1 small,
+.mdui-prose h2 small,
+.mdui-prose h3 small,
+.mdui-prose h4 small,
+.mdui-prose h5 small,
+.mdui-prose h6 small {
+  font-weight: inherit;
+  font-size: 65%;
+  color: rgb(var(--mdui-color-on-surface-variant));
+}
+.mdui-prose h1 strong,
+.mdui-prose h2 strong,
+.mdui-prose h3 strong,
+.mdui-prose h4 strong,
+.mdui-prose h5 strong,
+.mdui-prose h6 strong {
+  font-weight: 600;
+}
+.mdui-prose h1 {
+  font-size: 2.5em;
+  margin-top: 0;
+  margin-bottom: 1.25em;
+  line-height: 1.1111;
+}
+.mdui-prose h2 {
+  font-size: 1.875em;
+  margin-top: 2.25em;
+  margin-bottom: 1.125em;
+  line-height: 1.3333;
+}
+.mdui-prose h3 {
+  font-size: 1.5em;
+  margin-top: 2em;
+  margin-bottom: 1em;
+  line-height: 1.6;
+}
+.mdui-prose h4 {
+  font-size: 1.25em;
+  margin-top: 1.875em;
+  margin-bottom: 0.875em;
+  line-height: 1.5;
+}
+.mdui-prose h2 + *,
+.mdui-prose h3 + *,
+.mdui-prose h4 + *,
+.mdui-prose hr + * {
+  margin-top: 0;
+}
+.mdui-prose code,
+.mdui-prose kbd {
+  font-size: 0.875em;
+  color: rgb(var(--mdui-color-on-surface-container));
+  background-color: rgba(var(--mdui-color-surface-variant), 0.28);
+  padding: 0.125rem 0.375rem;
+  border-radius: var(--mdui-shape-corner-extra-small);
+}
+.mdui-prose kbd {
+  font-size: 0.9em;
+}
+.mdui-prose abbr[title] {
+  text-decoration: none;
+  cursor: help;
+  border-bottom: 0.0625rem dotted rgb(var(--mdui-color-on-surface-variant));
+}
+.mdui-prose ins,
+.mdui-prose u {
+  text-decoration: none;
+  border-bottom: 0.0625rem solid rgb(var(--mdui-color-on-surface-variant));
+}
+.mdui-prose del {
+  text-decoration: line-through;
+}
+.mdui-prose hr {
+  margin-top: 3em;
+  margin-bottom: 3em;
+  border: none;
+  border-bottom: 0.0625rem solid rgb(var(--mdui-color-surface-variant));
+}
+.mdui-prose pre {
+  margin-top: 1.7143em;
+  margin-bottom: 1.7143em;
+}
+.mdui-prose pre code {
+  padding: 0.8571em 1.1429em;
+  overflow-x: auto;
+  -webkit-overflow-scrolling: touch;
+  background-color: rgb(var(--mdui-color-surface-container));
+  color: rgb(var(--mdui-color-on-surface-container));
+  border-radius: var(--mdui-shape-corner-extra-small);
+}
+.mdui-prose ol,
+.mdui-prose ul {
+  padding-left: 1.625em;
+}
+.mdui-prose ul {
+  list-style-type: disc;
+}
+.mdui-prose ol {
+  list-style-type: decimal;
+}
+.mdui-prose ol[type='A'] {
+  list-style-type: upper-alpha;
+}
+.mdui-prose ol[type='a'] {
+  list-style-type: lower-alpha;
+}
+.mdui-prose ol[type='I'] {
+  list-style-type: upper-roman;
+}
+.mdui-prose ol[type='i'] {
+  list-style-type: lower-roman;
+}
+.mdui-prose ol[type='1'] {
+  list-style-type: decimal;
+}
+.mdui-prose li {
+  margin-top: 0.5em;
+  margin-bottom: 0.5em;
+}
+.mdui-prose ol > li,
+.mdui-prose ul > li {
+  padding-left: 0.375em;
+}
+.mdui-prose ol > li > p,
+.mdui-prose ul > li > p {
+  margin-top: 0.75em;
+  margin-bottom: 0.75em;
+}
+.mdui-prose ol > li > :first-child,
+.mdui-prose ul > li > :first-child {
+  margin-top: 1.25em;
+}
+.mdui-prose ol > li > :last-child,
+.mdui-prose ul > li > :last-child {
+  margin-bottom: 1.25em;
+}
+.mdui-prose ol > li::marker {
+  font-weight: 400;
+  color: rgb(var(--mdui-color-on-surface-variant));
+}
+.mdui-prose ul > li::marker {
+  color: rgb(var(--mdui-color-on-surface-variant));
+}
+.mdui-prose ol ol,
+.mdui-prose ol ul,
+.mdui-prose ul ol,
+.mdui-prose ul ul {
+  margin-top: 0.75em;
+  margin-bottom: 0.75em;
+}
+.mdui-prose fieldset,
+.mdui-prose img {
+  border: none;
+}
+.mdui-prose figure,
+.mdui-prose img,
+.mdui-prose video {
+  margin-top: 2em;
+  margin-bottom: 2em;
+  max-width: 100%;
+}
+.mdui-prose figure > * {
+  margin-top: 0;
+  margin-bottom: 0;
+}
+.mdui-prose figcaption {
+  font-size: 0.875em;
+  line-height: 1.4286;
+  margin-top: 0.8571em;
+  color: rgb(var(--mdui-color-on-surface-variant));
+}
+.mdui-prose figcaption:empty::before {
+  z-index: -1;
+  cursor: text;
+  content: attr(placeholder);
+  color: rgb(var(--mdui-color-on-surface-variant));
+}
+.mdui-prose table {
+  margin-top: 2em;
+  margin-bottom: 2em;
+  border: 0.0625rem solid rgb(var(--mdui-color-surface-variant));
+  border-radius: var(--mdui-shape-corner-large);
+}
+.mdui-table {
+  width: 100%;
+  overflow-x: auto;
+  margin-top: 2em;
+  margin-bottom: 2em;
+  border: 0.0625rem solid rgb(var(--mdui-color-surface-variant));
+  border-radius: var(--mdui-shape-corner-large);
+}
+.mdui-table table {
+  margin-top: 0;
+  margin-bottom: 0;
+  border: none;
+  border-radius: 0;
+}
+.mdui-prose table,
+.mdui-table table {
+  width: 100%;
+  text-align: left;
+  border-collapse: collapse;
+  border-spacing: 0;
+}
+.mdui-prose td,
+.mdui-prose th,
+.mdui-table td,
+.mdui-table th {
+  border-top: 0.0625rem solid rgb(var(--mdui-color-surface-variant));
+}
+.mdui-prose td:not(:first-child),
+.mdui-prose th:not(:first-child),
+.mdui-table td:not(:first-child),
+.mdui-table th:not(:first-child) {
+  border-left: 0.0625rem solid rgb(var(--mdui-color-surface-variant));
+}
+.mdui-prose td:not(:last-child),
+.mdui-prose th:not(:last-child),
+.mdui-table td:not(:last-child),
+.mdui-table th:not(:last-child) {
+  border-right: 0.0625rem solid rgb(var(--mdui-color-surface-variant));
+}
+.mdui-prose tfoot td,
+.mdui-prose tfoot th,
+.mdui-prose thead td,
+.mdui-prose thead th,
+.mdui-table tfoot td,
+.mdui-table tfoot th,
+.mdui-table thead td,
+.mdui-table thead th {
+  position: relative;
+  vertical-align: middle;
+  padding: 1.125rem 1rem;
+  font-weight: var(--mdui-typescale-title-medium-weight);
+  letter-spacing: var(--mdui-typescale-title-medium-tracking);
+  line-height: var(--mdui-typescale-title-medium-line-height);
+  color: rgb(var(--mdui-color-on-surface-variant));
+  box-shadow: var(--mdui-elevation-level1);
+}
+.mdui-prose tbody td,
+.mdui-prose tbody th,
+.mdui-table tbody td,
+.mdui-table tbody th {
+  padding: 0.875rem 1rem;
+}
+.mdui-prose tbody th,
+.mdui-table tbody th {
+  vertical-align: middle;
+  font-weight: inherit;
+}
+.mdui-prose tbody td,
+.mdui-table tbody td {
+  vertical-align: baseline;
+}
+.mdui-prose tbody:first-child tr:first-child td,
+.mdui-prose thead:first-child tr:first-child th,
+.mdui-table tbody:first-child tr:first-child td,
+.mdui-table thead:first-child tr:first-child th {
+  border-top: 0;
+}
+:root {
+  --mdui-shape-corner-none: 0;
+  --mdui-shape-corner-extra-small: 0.25rem;
+  --mdui-shape-corner-small: 0.5rem;
+  --mdui-shape-corner-medium: 0.75rem;
+  --mdui-shape-corner-large: 1rem;
+  --mdui-shape-corner-extra-large: 1.75rem;
+  --mdui-shape-corner-full: 1000rem;
+}
+:root {
+  --mdui-state-layer-hover: 0.08;
+  --mdui-state-layer-focus: 0.12;
+  --mdui-state-layer-pressed: 0.12;
+  --mdui-state-layer-dragged: 0.16;
+}
+:root {
+  --mdui-typescale-display-large-weight: 400;
+  --mdui-typescale-display-medium-weight: 400;
+  --mdui-typescale-display-small-weight: 400;
+  --mdui-typescale-display-large-line-height: 4rem;
+  --mdui-typescale-display-medium-line-height: 3.25rem;
+  --mdui-typescale-display-small-line-height: 2.75rem;
+  --mdui-typescale-display-large-size: 3.5625rem;
+  --mdui-typescale-display-medium-size: 2.8125rem;
+  --mdui-typescale-display-small-size: 2.25rem;
+  --mdui-typescale-display-large-tracking: 0rem;
+  --mdui-typescale-display-medium-tracking: 0rem;
+  --mdui-typescale-display-small-tracking: 0rem;
+  --mdui-typescale-headline-large-weight: 400;
+  --mdui-typescale-headline-medium-weight: 400;
+  --mdui-typescale-headline-small-weight: 400;
+  --mdui-typescale-headline-large-line-height: 2.5rem;
+  --mdui-typescale-headline-medium-line-height: 2.25rem;
+  --mdui-typescale-headline-small-line-height: 2rem;
+  --mdui-typescale-headline-large-size: 2rem;
+  --mdui-typescale-headline-medium-size: 1.75rem;
+  --mdui-typescale-headline-small-size: 1.5rem;
+  --mdui-typescale-headline-large-tracking: 0rem;
+  --mdui-typescale-headline-medium-tracking: 0rem;
+  --mdui-typescale-headline-small-tracking: 0rem;
+  --mdui-typescale-title-large-weight: 400;
+  --mdui-typescale-title-medium-weight: 500;
+  --mdui-typescale-title-small-weight: 500;
+  --mdui-typescale-title-large-line-height: 1.75rem;
+  --mdui-typescale-title-medium-line-height: 1.5rem;
+  --mdui-typescale-title-small-line-height: 1.25rem;
+  --mdui-typescale-title-large-size: 1.375rem;
+  --mdui-typescale-title-medium-size: 1rem;
+  --mdui-typescale-title-small-size: 0.875rem;
+  --mdui-typescale-title-large-tracking: 0rem;
+  --mdui-typescale-title-medium-tracking: 0.009375rem;
+  --mdui-typescale-title-small-tracking: 0.00625rem;
+  --mdui-typescale-label-large-weight: 500;
+  --mdui-typescale-label-medium-weight: 500;
+  --mdui-typescale-label-small-weight: 500;
+  --mdui-typescale-label-large-line-height: 1.25rem;
+  --mdui-typescale-label-medium-line-height: 1rem;
+  --mdui-typescale-label-small-line-height: 0.375rem;
+  --mdui-typescale-label-large-size: 0.875rem;
+  --mdui-typescale-label-medium-size: 0.75rem;
+  --mdui-typescale-label-small-size: 0.6875rem;
+  --mdui-typescale-label-large-tracking: 0.00625rem;
+  --mdui-typescale-label-medium-tracking: 0.03125rem;
+  --mdui-typescale-label-small-tracking: 0.03125rem;
+  --mdui-typescale-body-large-weight: 400;
+  --mdui-typescale-body-medium-weight: 400;
+  --mdui-typescale-body-small-weight: 400;
+  --mdui-typescale-body-large-line-height: 1.5rem;
+  --mdui-typescale-body-medium-line-height: 1.25rem;
+  --mdui-typescale-body-small-line-height: 1rem;
+  --mdui-typescale-body-large-size: 1rem;
+  --mdui-typescale-body-medium-size: 0.875rem;
+  --mdui-typescale-body-small-size: 0.75rem;
+  --mdui-typescale-body-large-tracking: 0.009375rem;
+  --mdui-typescale-body-medium-tracking: 0.015625rem;
+  --mdui-typescale-body-small-tracking: 0.025rem;
+}
+.mdui-lock-screen {
+  overflow: hidden !important;
+}

assets/youtube-music.svg

@@ -1,6 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 176 176" width="32" height="32">
-	<circle fill="red" cx="88" cy="88" r="88"/>
-	<path fill="#FFF"
-		  d="M88 46c23.1 0 42 18.8 42 42s-18.8 42-42 42-42-18.8-42-42 18.9-42 42-42m0-4c-25.4 0-46 20.6-46 46s20.6 46 46 46 46-20.6 46-46-20.6-46-46-46z"/>
-	<path fill="#FFF" d="M72 111l39-24-39-22z"/>
-</svg>

config/defaults.ts

@@ -1,280 +0,0 @@
-import { blockers } from '../plugins/adblocker/blocker-types';
-
-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: blockers.WithBlocklists as string,
-      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
-      hideGitHubButton: false, // Disable the "View App On GitHub" button
-      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/img/adblock.svg

@@ -1,9 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="400" height="400">
-  <g transform="translate(183.604 196.396)" stroke="#fff" stroke-width="2.23">
-    <path
-      style="line-height:normal;-inkscape-font-specification:Sans;text-indent:0;text-align:start;text-decoration-line:none;text-transform:none;block-progression:tb;marker:none"
-      d="M-116.99 106.245l31.82 31.82 236.31-236.31-31.82-31.82z" color="#000" font-weight="400"
-      font-family="Sans" overflow="visible" fill="#fff" stroke="none"/>
-    <circle r="171.304" cy="4" cx="16" fill="none" stroke-width="44.6"/>
-  </g>
-</svg>

docs/img/bg-bottom.svg

@@ -1,23 +0,0 @@
-<svg width="1440" height="347" xmlns="http://www.w3.org/2000/svg">
-  <defs>
-    <linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="a">
-      <stop stop-color="#606483" stop-opacity="0" offset="0%"/>
-      <stop stop-color="#0B0D19" stop-opacity=".72" offset="100%"/>
-    </linearGradient>
-    <linearGradient x1="50%" y1="0%" x2="39.334%" y2="79.282%" id="b">
-      <stop stop-color="#0B0D19" offset="0%"/>
-      <stop stop-color="#0B0D19" stop-opacity="0" offset="100%"/>
-    </linearGradient>
-  </defs>
-  <g fill="none" fill-rule="evenodd">
-    <path
-      d="M177.486 208.219c78.18 89.285 218.65-81.067 218.65-119.337 0-38.27-86.408-69.295-193-69.295-106.59 0-193 31.024-193 69.295 0 38.27 89.17 30.051 167.35 119.337z"
-      transform="rotate(6 -140.175 3980.948)" fill="url(#a)"/>
-    <path
-      d="M252.464 335.471c101.27 115.965 283.227-105.29 283.227-154.996 0-49.705-111.929-90-250-90s-250 40.295-250 90c0 49.706 115.503 39.032 216.773 154.996z"
-      fill="url(#a)" transform="rotate(24 321.92 -247.724)"/>
-    <path
-      d="M302.512 242.909c88.025 32.428 156-25.04 156-55.93 0-30.888-69.844-55.928-156-55.928-86.157 0-156 25.04-156 55.929 0 30.888 67.974 23.5 156 55.929z"
-      fill="url(#b)" transform="rotate(24 338.741 -285.505)"/>
-  </g>
-</svg>

docs/img/bg-top.svg

@@ -1,32 +0,0 @@
-<svg width="1440" height="318" xmlns="http://www.w3.org/2000/svg">
-    <defs>
-        <linearGradient x1="38.706%" y1="-187.115%" x2="18.675%" y2="110.984%" id="a">
-            <stop stop-color="#FFF" stop-opacity="0" offset="0%"/>
-            <stop stop-color="#c3352e" offset="100%"/>
-        </linearGradient>
-        <linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="c">
-            <stop stop-color="#606483" stop-opacity="0" offset="0%"/>
-            <stop stop-color="#0B0D19" stop-opacity=".72" offset="100%"/>
-        </linearGradient>
-        <linearGradient x1="50%" y1="0%" x2="39.334%" y2="79.282%" id="d">
-            <stop stop-color="#0B0D19" stop-opacity=".32" offset="0%"/>
-            <stop stop-color="#0B0D19" stop-opacity="0" offset="100%"/>
-        </linearGradient>
-        <filter id="b">
-            <feTurbulence type="fractalNoise" numOctaves="2" baseFrequency=".3" result="turb"/>
-            <feComposite in="turb" operator="arithmetic" k1=".1" k2=".1" k3=".1" k4=".1" result="result1"/>
-            <feComposite operator="in" in="result1" in2="SourceGraphic" result="finalFilter"/>
-            <feBlend mode="multiply" in="finalFilter" in2="SourceGraphic"/>
-        </filter>
-    </defs>
-    <g fill="none" fill-rule="evenodd">
-        <path d="M88.494 90c67.04 7.177 161.094-24.753 224.996-90H.2c25.3 48.079 42.361 85.083 88.294 90z"
-              transform="translate(1051)" fill="url(#a)" filter="url(#b)"/>
-        <path
-                d="M250.464 367.471c101.27 115.965 283.227-105.29 283.227-154.996 0-49.705-111.929-90-250-90s-250 40.295-250 90c0 49.706 115.503 39.032 216.773 154.996z"
-                fill="url(#c)" transform="rotate(143 810.285 354.367)"/>
-        <path
-                d="M373.408 256.178c88.026 32.429 156-25.04 156-55.929 0-30.888-69.843-55.929-156-55.929-86.156 0-156 25.04-156 55.93 0 30.888 67.975 23.5 156 55.928z"
-                fill="url(#d)" transform="rotate(136 905.21 332.676)"/>
-    </g>
-</svg>

docs/img/code.svg

@@ -1,5 +0,0 @@
-<svg width="96" height="48" xmlns="http://www.w3.org/2000/svg">
-  <text y="35" x="48" fill="#fff" stroke-width="0" font-size="36" font-family="Monospace" text-anchor="middle"
-        stroke="#fff">&lt;/&gt;
-  </text>
-</svg>

docs/img/download.svg

@@ -1,8 +0,0 @@
-<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" class="style-scope yt-icon" style="width:100%;height:100%"
-     pointer-events="none" display="block" fill="#fff">
-    <g class="style-scope yt-icon">
-        <path
-                d="M25.462 19.105v6.848H4.515v-6.848H.489v8.861c0 1.111.9 2.012 2.016 2.012h24.967c1.115 0 2.016-.9 2.016-2.012v-8.861h-4.026zM14.62 18.426l-5.764-6.965s-.877-.828.074-.828h3.248V9.217.494S12.049 0 12.793 0h4.572c.536 0 .524.416.524.416V10.424h2.998c1.154 0 .285.867.285.867s-4.904 6.51-5.588 7.193c-.492.495-.964-.058-.964-.058z"
-                class="style-scope yt-icon"/>
-    </g>
-</svg>

docs/img/footer.svg

@@ -1,35 +0,0 @@
-<svg width="1440" height="582" xmlns="http://www.w3.org/2000/svg">
-    <defs>
-        <linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="a">
-            <stop stop-color="#606483" stop-opacity="0" offset="0%"/>
-            <stop stop-color="#363636" stop-opacity=".72" offset="100%"/>
-        </linearGradient>
-        <linearGradient x1="50%" y1="0%" x2="39.334%" y2="79.282%" id="b">
-            <stop stop-color="#363636" offset="0%"/>
-            <stop stop-color="#363636" stop-opacity="0" offset="100%"/>
-        </linearGradient>
-        <radialGradient cx="33.3%" cy="43.394%" fx="33.3%" fy="43.394%" r="57.93%"
-                        gradientTransform="matrix(.24796 -.96592 .92535 .25883 -.151 .643)" id="c">
-            <stop stop-color="#c3352e" stop-opacity="0" offset="0%"/>
-            <stop stop-color="#c3352e" stop-opacity=".64" offset="51.712%"/>
-            <stop stop-color="#c3352e" stop-opacity=".24" offset="100%"/>
-        </radialGradient>
-        <filter id="d">
-            <feTurbulence type="fractalNoise" numOctaves="2" baseFrequency=".3" result="turb"/>
-            <feComposite in="turb" operator="arithmetic" k1=".1" k2=".1" k3=".1" k4=".1" result="result1"/>
-            <feComposite operator="in" in="result1" in2="SourceGraphic" result="finalFilter"/>
-            <feBlend mode="multiply" in="finalFilter" in2="SourceGraphic"/>
-        </filter>
-    </defs>
-    <g fill="none" fill-rule="evenodd">
-        <path
-                d="M252.464 335.471c101.27 115.965 283.227-105.29 283.227-154.996 0-49.705-111.929-90-250-90s-250 40.295-250 90c0 49.706 115.503 39.032 216.773 154.996z"
-                fill="url(#a)" transform="rotate(24 -272.272 -82.087)"/>
-        <path
-                d="M302.512 242.909c88.025 32.428 156-25.04 156-55.93 0-30.888-69.844-55.928-156-55.928-86.157 0-156 25.04-156 55.929 0 30.888 67.974 23.5 156 55.929z"
-                fill="url(#b)" transform="rotate(24 -255.451 -119.868)"/>
-        <path
-                d="M103.064 315.218c128.156 12.998 192.38 157.059 218.627 106.632 26.247-50.427-44.059-106.456 60.397-202.707 104.457-96.252-143.2-285.785-172.392-122.551C180.503 259.825-25.091 302.22 103.064 315.218z"
-                transform="translate(1176 -33)" fill="url(#c)" filter="url(#d)"/>
-    </g>
-</svg>

docs/img/plugins.svg

@@ -1,6 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 60 60" fill="#fff">
-  <path
-    d="M45.563 29.174l-22-15A1 1 0 0022 15v30a.999.999 0 001.563.826l22-15a1 1 0 000-1.652zM24 43.107V16.893L43.225 30 24 43.107z"/>
-  <path
-    d="M30 0C13.458 0 0 13.458 0 30s13.458 30 30 30 30-13.458 30-30S46.542 0 30 0zm0 58C14.561 58 2 45.439 2 30S14.561 2 30 2s28 12.561 28 28-12.561 28-28 28z"/>
-</svg>

docs/img/youtube-music.svg

@@ -1,6 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 176 176" width="32" height="32">
-  <circle fill="red" cx="88" cy="88" r="88"/>
-  <path fill="#FFF"
-        d="M88 46c23.1 0 42 18.8 42 42s-18.8 42-42 42-42-18.8-42-42 18.9-42 42-42m0-4c-25.4 0-46 20.6-46 46s20.6 46 46 46 46-20.6 46-46-20.6-46-46-46z"/>
-  <path fill="#FFF" d="M72 111l39-24-39-22z"/>
-</svg>

docs/index.html

@@ -1,490 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-<head>
-    <meta content="text/html; charset=UTF-8" http-equiv="Content-Type"/>
-
-    <meta content="IE=edge" http-equiv="X-UA-Compatible"/>
-    <meta content="width=device-width, initial-scale=1" name="viewport"/>
-    <title>YouTube Music Desktop App (Unofficial)</title>
-    <link
-            href="./favicon/favicon.ico"
-            rel="icon"
-            sizes="16x16"
-            type="image/x-icon"
-    />
-    <link
-            href="./favicon/favicon_32.png"
-            rel="icon"
-            sizes="32x32"
-            type="image/png"
-    />
-    <link
-            href="./favicon/favicon_48.png"
-            rel="icon"
-            sizes="48x48"
-            type="image/png"
-    />
-    <link
-            href="./favicon/favicon_96.png"
-            rel="icon"
-            sizes="96x96"
-            type="image/png"
-    />
-    <link
-            href="./favicon/favicon_144.png"
-            rel="icon"
-            sizes="144x144"
-            type="image/png"
-    />
-
-    <meta content="#131313" name="theme-color"/>
-    <meta
-            content="YouTube Music Unofficial Desktop App with built-in ad blocker and downloader"
-            name="description"
-    />
-    <meta
-            content="YouTube&nbsp;Music&nbsp;Desktop&nbsp;App"
-            property="og:site_name"
-    />
-    <meta
-            class="meta-url"
-            content="https://th-ch.github.io/youtube-music"
-            property="og:url"
-    />
-    <meta content="website" property="og:type"/>
-    <meta
-            class="meta-url"
-            content="https://th-ch.github.io/youtube-music"
-            name="twitter:url"
-    />
-
-    <link href="./style/fonts.css" rel="stylesheet"/>
-    <link href="./style/style.css" rel="stylesheet"/>
-    <script src="https://unpkg.com/scrollreveal"></script>
-</head>
-<body class="has-animations vsc-initialized" style="height: 100%;">
-<div class="body-wrap boxed-container">
-    <header class="site-header text-light">
-        <div class="container">
-            <div class="site-header-inner">
-                <div class="brand header-brand">
-                    <h1 class="m-0">
-                        <a href="https://github.com/th-ch/youtube-music">
-                            <img
-                                    alt="YouTube Music"
-                                    class="header-logo-image"
-                                    src="./img/youtube-music.svg"
-                            />
-                        </a>
-                    </h1>
-                </div>
-            </div>
-        </div>
-    </header>
-
-    <main>
-        <section class="hero text-center text-light">
-            <div class="hero-bg"></div>
-            <div class="hero-particles-container">
-                <canvas id="hero-particles"></canvas>
-            </div>
-            <div class="container-sm">
-                <div class="hero-inner">
-                    <div class="hero-copy">
-                        <h1 class="hero-title mt-0">
-                            Custom YouTube Music Desktop App
-                        </h1>
-                        <p class="hero-paragraph">
-                            Open source, cross-platform, unofficial YouTube Music Desktop
-                            App with built-in <strong>ad blocker</strong> and
-                            <strong>downloader</strong>
-                        </p>
-                        <div class="hero-cta">
-                            <a
-                                    class="button button-primary button-wide-mobile"
-                                    href="https://github.com/th-ch/youtube-music/releases/latest"
-                            >Download</a
-                            >
-                        </div>
-                    </div>
-                    <div class="mockup-container">
-                        <div class="mockup-bg">
-                            <img
-                                    alt="YouTube Music"
-                                    id="mockup-header-img"
-                                    src="./img/youtube-music.png"
-                            />
-                        </div>
-                    </div>
-                </div>
-            </div>
-        </section>
-
-        <section class="features-extended section">
-            <div class="features-extended-inner section-inner">
-                <div class="features-extended-wrap">
-                    <div class="container">
-                        <div class="feature-extended">
-                            <div class="feature-extended-image">
-                                <img
-                                        alt="Adblocker"
-                                        class="device-mockup"
-                                        data-sr-id="0"
-                                        src="./img/adblock.svg"
-                                        style="
-												visibility: visible;
-												opacity: 1;
-												transform: matrix3d(
-													1,
-													0,
-													0,
-													0,
-													0,
-													1,
-													0,
-													0,
-													0,
-													0,
-													1,
-													0,
-													0,
-													0,
-													0,
-													1
-												);
-												transition: opacity 0.6s
-														cubic-bezier(0.215, 0.61, 0.355, 1) 0s,
-													transform 0.6s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;
-											"
-                                        width="100px"
-                                />
-                            </div>
-                            <div
-                                    class="feature-extended-body"
-                                    data-sr-id="5"
-                                    style="
-											visibility: visible;
-											opacity: 1;
-											transform: matrix3d(
-												1,
-												0,
-												0,
-												0,
-												0,
-												1,
-												0,
-												0,
-												0,
-												0,
-												1,
-												0,
-												0,
-												0,
-												0,
-												1
-											);
-											transition: opacity 0.6s
-													cubic-bezier(0.215, 0.61, 0.355, 1) 0s,
-												transform 0.6s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;
-										"
-                            >
-                                <h3 class="mt-0 mb-16">Built-in adblocker</h3>
-                                <p class="m-0">Block all ads and tracking out of the box</p>
-                            </div>
-                        </div>
-                        <div class="feature-extended">
-                            <div class="feature-extended-image">
-                                <img
-                                        alt="Downloader"
-                                        class="device-mockup"
-                                        data-sr-id="2"
-                                        src="./img/download.svg"
-                                        style="
-												visibility: visible;
-												opacity: 1;
-												transform: matrix3d(
-													1,
-													0,
-													0,
-													0,
-													0,
-													1,
-													0,
-													0,
-													0,
-													0,
-													1,
-													0,
-													0,
-													0,
-													0,
-													1
-												);
-												transition: opacity 0.6s
-														cubic-bezier(0.215, 0.61, 0.355, 1) 0s,
-													transform 0.6s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;
-											"
-                                />
-                            </div>
-                            <div
-                                    class="feature-extended-body"
-                                    data-sr-id="6"
-                                    style="
-											visibility: visible;
-											opacity: 1;
-											transform: matrix3d(
-												1,
-												0,
-												0,
-												0,
-												0,
-												1,
-												0,
-												0,
-												0,
-												0,
-												1,
-												0,
-												0,
-												0,
-												0,
-												1
-											);
-											transition: opacity 0.6s
-													cubic-bezier(0.215, 0.61, 0.355, 1) 0s,
-												transform 0.6s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;
-										"
-                            >
-                                <h3 class="mt-0 mb-16">Built-in downloader</h3>
-                                <p class="m-0">
-                                    Download (like youtube-dl) to custom formats (mp3, opus,
-                                    etc) directly from the interface
-                                </p>
-                            </div>
-                        </div>
-                        <div class="feature-extended">
-                            <div class="feature-extended-image">
-                                <img
-                                        alt="Plugins"
-                                        class="device-mockup"
-                                        data-sr-id="3"
-                                        src="./img/plugins.svg"
-                                        style="
-												visibility: visible;
-												opacity: 1;
-												transform: matrix3d(
-													1,
-													0,
-													0,
-													0,
-													0,
-													1,
-													0,
-													0,
-													0,
-													0,
-													1,
-													0,
-													0,
-													0,
-													0,
-													1
-												);
-												transition: opacity 0.6s
-														cubic-bezier(0.215, 0.61, 0.355, 1) 0s,
-													transform 0.6s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;
-											"
-                                />
-                            </div>
-                            <div
-                                    class="feature-extended-body"
-                                    data-sr-id="7"
-                                    style="
-											visibility: visible;
-											opacity: 1;
-											transform: matrix3d(
-												1,
-												0,
-												0,
-												0,
-												0,
-												1,
-												0,
-												0,
-												0,
-												0,
-												1,
-												0,
-												0,
-												0,
-												0,
-												1
-											);
-											transition: opacity 0.6s
-													cubic-bezier(0.215, 0.61, 0.355, 1) 0s,
-												transform 0.6s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;
-										"
-                            >
-                                <h3 class="mt-0 mb-16">Many other plugins in one click</h3>
-                                <p class="m-0">
-                                    Enhance your user experience with media keys, integrations
-                                    (Discord), cosmetic filters, notifications, TouchBar,
-                                    auto-unpause and many more! Every plugin can be enabled or
-                                    disabled in one click.
-                                </p>
-                            </div>
-                        </div>
-                        <div class="feature-extended">
-                            <div class="feature-extended-image">
-                                <img
-                                        alt="Code"
-                                        class="device-mockup"
-                                        data-sr-id="4"
-                                        src="./img/code.svg"
-                                        style="
-												visibility: visible;
-												width: 200%;
-												opacity: 1;
-												transform: matrix3d(
-													1,
-													0,
-													0,
-													0,
-													0,
-													1,
-													0,
-													0,
-													0,
-													0,
-													1,
-													0,
-													0,
-													0,
-													0,
-													1
-												);
-												transition: opacity 0.6s
-														cubic-bezier(0.215, 0.61, 0.355, 1) 0s,
-													transform 0.6s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;
-											"
-                                />
-                            </div>
-                            <div
-                                    class="feature-extended-body"
-                                    data-sr-id="8"
-                                    style="
-											visibility: visible;
-											opacity: 1;
-											transform: matrix3d(
-												1,
-												0,
-												0,
-												0,
-												0,
-												1,
-												0,
-												0,
-												0,
-												0,
-												1,
-												0,
-												0,
-												0,
-												0,
-												1
-											);
-											transition: opacity 0.6s
-													cubic-bezier(0.215, 0.61, 0.355, 1) 0s,
-												transform 0.6s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;
-										"
-                            >
-                                <h3 class="mt-0 mb-16">Open source & Cross platform</h3>
-                                <p class="m-0">
-                                    Available for Windows (installer and portable), Mac and
-                                    Linux (AppImage, deb, etc)
-                                </p>
-                            </div>
-                        </div>
-                    </div>
-                </div>
-            </div>
-            <div class="main-particles-container">
-                <canvas id="main-particles"></canvas>
-            </div>
-        </section>
-    </main>
-
-    <footer class="site-footer">
-        <div class="footer-particles-container">
-            <canvas id="footer-particles"></canvas>
-        </div>
-        <div class="site-footer-top">
-            <section class="cta section text-light">
-                <div class="container-sm">
-                    <div class="cta-inner section-inner">
-                        <div class="cta-header text-center">
-                            <h2 class="section-title mt-0">Download and/or contribute</h2>
-                            <p class="section-paragraph">Pull requests welcome!</p>
-                            <div class="cta-cta">
-                                <a
-                                        class="button button-primary button-wide-mobile"
-                                        href="https://github.com/th-ch/youtube-music"
-                                >Go to code</a
-                                >
-                            </div>
-                        </div>
-                    </div>
-                </div>
-            </section>
-        </div>
-        <div class="site-footer-bottom">
-            <div class="container">
-                <div class="site-footer-inner">
-                    <div class="brand footer-brand">
-                        <a href="https://github.com/th-ch/youtube-music">
-                            <img alt="YouTube Music logo" src="./img/youtube-music.svg"/>
-                        </a>
-                    </div>
-                    <ul class="footer-links list-reset">
-                        <li>
-                            <a href="https://github.com/th-ch/youtube-music">Main page</a>
-                        </li>
-                        <li>
-                            <a href="https://github.com/th-ch/youtube-music/issues"
-                            >Issues</a
-                            >
-                        </li>
-                        <li>
-                            <a href="https://github.com/th-ch/youtube-music/pulls"
-                            >Pull requests</a
-                            >
-                        </li>
-                    </ul>
-                    <ul class="footer-social-links list-reset">
-                        <li>
-                            <a href="https://github.com/th-ch/youtube-music">
-                                <span class="screen-reader-text">GitHub</span>
-                                <svg
-                                        height="16"
-                                        viewBox="0 0 1792 1792"
-                                        width="16"
-                                        xmlns="http://www.w3.org/2000/svg"
-                                >
-                                    <path
-                                            d="M896 128q209 0 385.5 103t279.5 279.5 103 385.5q0 251-146.5 451.5t-378.5 277.5q-27 5-40-7t-13-30q0-3 .5-76.5t.5-134.5q0-97-52-142 57-6 102.5-18t94-39 81-66.5 53-105 20.5-150.5q0-119-79-206 37-91-8-204-28-9-81 11t-92 44l-38 24q-93-26-192-26t-192 26q-16-11-42.5-27t-83.5-38.5-85-13.5q-45 113-8 204-79 87-79 206 0 85 20.5 150t52.5 105 80.5 67 94 39 102.5 18q-39 36-49 103-21 10-45 15t-57 5-65.5-21.5-55.5-62.5q-19-32-48.5-52t-49.5-24l-20-3q-21 0-29 4.5t-5 11.5 9 14 13 12l7 5q22 10 43.5 38t31.5 51l10 23q13 38 44 61.5t67 30 69.5 7 55.5-3.5l23-4q0 38 .5 88.5t.5 54.5q0 18-13 30t-40 7q-232-77-378.5-277.5t-146.5-451.5q0-209 103-385.5t279.5-279.5 385.5-103zm-477 1103q3-7-7-12-10-3-13 2-3 7 7 12 9 6 13-2zm31 34q7-5-2-16-10-9-16-3-7 5 2 16 10 10 16 3zm30 45q9-7 0-19-8-13-17-6-9 5 0 18t17 7zm42 42q8-8-4-19-12-12-20-3-9 8 4 19 12 12 20 3zm57 25q3-11-13-16-15-4-19 7t13 15q15 6 19-6zm63 5q0-13-17-11-16 0-16 11 0 13 17 11 16 0 16-11zm58-10q-2-11-18-9-16 3-14 15t18 8 14-14z"
-                                            fill="#fff"
-                                    />
-                                </svg>
-                            </a>
-                        </li>
-                    </ul>
-                    <div class="footer-copyright">© 2021 th-ch</div>
-                </div>
-            </div>
-        </div>
-    </footer>
-</div>
-
-<script src="./js/main.js"></script>
-</body>
-</html>

docs/js/main.js

@@ -1,268 +0,0 @@
-/* eslint-disable */
-
-// Constants
-const element = document.documentElement;
-const { body } = document;
-const revealOnScroll = (window.sr = ScrollReveal({ mobile: false }));
-
-// Load animations
-element.classList.remove('no-js');
-element.classList.add('js');
-window.addEventListener('load', () => {
-  body.classList.add('is-loaded');
-});
-
-if (body.classList.contains('has-animations')) {
-  window.addEventListener('load', () => {
-    revealOnScroll.reveal('.feature-extended .device-mockup', {
-      duration: 600,
-      distance: '100px',
-      easing: 'cubic-bezier(0.215, 0.61, 0.355, 1)',
-      origin: 'bottom',
-      viewFactor: 0.6,
-    });
-    revealOnScroll.reveal('.feature-extended .feature-extended-body', {
-      duration: 600,
-      distance: '40px',
-      easing: 'cubic-bezier(0.215, 0.61, 0.355, 1)',
-      origin: 'top',
-      viewFactor: 0.6,
-    });
-  });
-}
-
-// Bubble canvas
-const bubbleCanvas = function (t) {
-  const e = this;
-  e.parentNode = t;
-  e.setCanvasSize();
-  window.addEventListener('resize', () => {
-    e.setCanvasSize();
-  });
-  e.mouseX = 0;
-  e.mouseY = 0;
-  window.addEventListener('mousemove', (t) => {
-    e.mouseX = t.clientX;
-    e.mouseY = t.clientY;
-  });
-  e.randomise();
-};
-
-bubbleCanvas.prototype.setCanvasSize = function () {
-  this.canvasWidth = this.parentNode.clientWidth;
-  this.canvasHeight = this.parentNode.clientHeight;
-};
-
-bubbleCanvas.prototype.generateDecimalBetween = function (start, end) {
-  return (Math.random() * (start - end) + end).toFixed(2);
-};
-
-bubbleCanvas.prototype.update = function () {
-  const t = this;
-  t.translateX -= t.movementX;
-  t.translateY -= t.movementY;
-  t.posX += (t.mouseX / (t.staticity / t.magnetism) - t.posX) / t.smoothFactor;
-  t.posY += (t.mouseY / (t.staticity / t.magnetism) - t.posY) / t.smoothFactor;
-  if (
-    t.translateY + t.posY < 0
-    || t.translateX + t.posX < 0
-    || t.translateX + t.posX > t.canvasWidth
-  ) {
-    t.randomise();
-    t.translateY = t.canvasHeight;
-  }
-};
-
-bubbleCanvas.prototype.randomise = function () {
-  this.colors = ['195,53,46', '172,54,46'];
-
-  this.velocity = 20;
-  this.smoothFactor = 50;
-  this.staticity = 30;
-  this.magnetism = 0.1 + 4 * Math.random();
-  this.color = this.colors[Math.floor(Math.random() * this.colors.length)];
-  this.alpha = this.generateDecimalBetween(5, 10) / 10;
-  this.size = this.generateDecimalBetween(1, 4);
-  this.posX = 0;
-  this.posY = 0;
-  this.movementX = this.generateDecimalBetween(-2, 2) / this.velocity;
-  this.movementY = this.generateDecimalBetween(1, 20) / this.velocity;
-  this.translateX = this.generateDecimalBetween(0, this.canvasWidth);
-  this.translateY = this.generateDecimalBetween(0, this.canvasHeight);
-};
-
-const drawBubbleCanvas = function (t) {
-  this.canvas = document.getElementById(t);
-  this.ctx = this.canvas.getContext('2d');
-  this.dpr = window.devicePixelRatio;
-};
-
-drawBubbleCanvas.prototype.start = function (bubbleDensity) {
-  const t = this;
-  t.bubbleDensity = bubbleDensity;
-  t.setCanvasSize();
-  window.addEventListener('resize', () => {
-    t.setCanvasSize();
-  });
-  t.bubblesList = [];
-  t.generateBubbles();
-  t.animate();
-};
-
-drawBubbleCanvas.prototype.setCanvasSize = function () {
-  this.container = this.canvas.parentNode;
-  this.w = this.container.offsetWidth;
-  this.h = this.container.offsetHeight;
-  this.wdpi = this.w * this.dpr;
-  this.hdpi = this.h * this.dpr;
-  this.canvas.width = this.wdpi;
-  this.canvas.height = this.hdpi;
-  this.canvas.style.width = this.w + 'px';
-  this.canvas.style.height = this.h + 'px';
-  this.ctx.scale(this.dpr, this.dpr);
-};
-
-drawBubbleCanvas.prototype.animate = function () {
-  const t = this;
-  t.ctx.clearRect(0, 0, t.canvas.clientWidth, t.canvas.clientHeight);
-  for (const e of t.bubblesList) {
-    e.update();
-    t.ctx.translate(e.translateX, e.translateY);
-    t.ctx.beginPath();
-    t.ctx.arc(e.posX, e.posY, e.size, 0, 2 * Math.PI);
-    t.ctx.fillStyle = 'rgba(' + e.color + ',' + e.alpha + ')';
-    t.ctx.fill();
-    t.ctx.setTransform(t.dpr, 0, 0, t.dpr, 0, 0);
-  }
-
-  requestAnimationFrame(this.animate.bind(this));
-};
-
-drawBubbleCanvas.prototype.addBubble = function (t) {
-  return this.bubblesList.push(t);
-};
-
-drawBubbleCanvas.prototype.generateBubbles = function () {
-  const t = this;
-  for (let e = 0; e < t.bubbleDensity; e++) {
-    t.addBubble(new bubbleCanvas(t.canvas.parentNode));
-  }
-};
-
-// Night sky with stars canvas
-const starCanvas = function (t) {
-  this.canvas = document.getElementById(t);
-  this.ctx = this.canvas.getContext('2d');
-  this.dpr = window.devicePixelRatio;
-};
-
-starCanvas.prototype.start = function () {
-  let w;
-  let h;
-
-  const setCanvasExtents = () => {
-    w = this.canvas.parentNode.clientWidth;
-    h = this.canvas.parentNode.clientHeight;
-    this.canvas.width = w;
-    this.canvas.height = h;
-  };
-
-  setCanvasExtents();
-
-  window.addEventListener('resize', () => {
-    setCanvasExtents();
-  });
-
-  const makeStars = (count) => {
-    const out = [];
-    for (let i = 0; i < count; i++) {
-      const s = {
-        x: Math.random() * w - w / 2,
-        y: Math.random() * h - h / 2,
-        z: Math.random() * 1000,
-      };
-      out.push(s);
-    }
-
-    return out;
-  };
-
-  const stars = makeStars(10_000);
-
-  const clear = () => {
-    this.ctx.fillStyle = '#212121';
-    this.ctx.fillRect(0, 0, this.canvas.width, this.canvas.height);
-  };
-
-  const putPixel = (x, y, brightness) => {
-    const intensity = brightness * 255;
-    const rgb = 'rgb(' + intensity + ',' + intensity + ',' + intensity + ')';
-    this.ctx.beginPath();
-    this.ctx.arc(x, y, 0.9, 0, 2 * Math.PI);
-    this.ctx.fillStyle = rgb;
-    this.ctx.fill();
-  };
-
-  const moveStars = (distance) => {
-    const count = stars.length;
-    for (let i = 0; i < count; i++) {
-      const s = stars[i];
-      s.z -= distance;
-      while (s.z <= 1) {
-        s.z += 1000;
-      }
-    }
-  };
-
-  let previousTime;
-  const init = (time) => {
-    previousTime = time;
-    requestAnimationFrame(tick);
-  };
-
-  const tick = (time) => {
-    const elapsed = time - previousTime;
-    previousTime = time;
-
-    moveStars(elapsed * 0.1);
-
-    clear();
-
-    const cx = w / 2;
-    const cy = h / 2;
-
-    const count = stars.length;
-    for (let i = 0; i < count; i++) {
-      const star = stars[i];
-
-      const x = cx + star.x / (star.z * 0.001);
-      const y = cy + star.y / (star.z * 0.001);
-
-      if (x < 0 || x >= w || y < 0 || y >= h) {
-        continue;
-      }
-
-      const d = star.z / 1000;
-      const b = 1 - d * d;
-
-      putPixel(x, y, b);
-    }
-
-    requestAnimationFrame(tick);
-  };
-
-  requestAnimationFrame(init);
-};
-
-// Start canvas animations
-window.addEventListener('load', () => {
-  // Stars
-  const headCanvas = new starCanvas('hero-particles');
-  // Bubbles
-  const footerCanvas = new drawBubbleCanvas('footer-particles');
-  const mainCanvas = new drawBubbleCanvas('main-particles');
-
-  headCanvas.start();
-  footerCanvas.start(30);
-  mainCanvas.start(200);
-});

docs/style/fonts.css

@@ -1,53 +0,0 @@
-/* hebrew */
-@font-face {
-  font-family: 'Heebo';
-  font-style: normal;
-  font-weight: 400;
-  src: url(https://fonts.gstatic.com/s/heebo/v9/NGS6v5_NC0k9P9H0TbFhsqMA6aw.woff2) format('woff2');
-  unicode-range: U+0590-05FF, U+20AA, U+25CC, U+FB1D-FB4F;
-}
-
-/* latin */
-@font-face {
-  font-family: 'Heebo';
-  font-style: normal;
-  font-weight: 400;
-  src: url(https://fonts.gstatic.com/s/heebo/v9/NGS6v5_NC0k9P9H2TbFhsqMA.woff2) format('woff2');
-  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
-}
-
-/* hebrew */
-@font-face {
-  font-family: 'Heebo';
-  font-style: normal;
-  font-weight: 700;
-  src: url(https://fonts.gstatic.com/s/heebo/v9/NGS6v5_NC0k9P9H0TbFhsqMA6aw.woff2) format('woff2');
-  unicode-range: U+0590-05FF, U+20AA, U+25CC, U+FB1D-FB4F;
-}
-
-/* latin */
-@font-face {
-  font-family: 'Heebo';
-  font-style: normal;
-  font-weight: 700;
-  src: url(https://fonts.gstatic.com/s/heebo/v9/NGS6v5_NC0k9P9H2TbFhsqMA.woff2) format('woff2');
-  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
-}
-
-/* latin-ext */
-@font-face {
-  font-family: 'Oxygen';
-  font-style: normal;
-  font-weight: 700;
-  src: url(https://fonts.gstatic.com/s/oxygen/v10/2sDcZG1Wl4LcnbuCNWgzZmW5Kb8VZBHR.woff2) format('woff2');
-  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
-}
-
-/* latin */
-@font-face {
-  font-family: 'Oxygen';
-  font-style: normal;
-  font-weight: 700;
-  src: url(https://fonts.gstatic.com/s/oxygen/v10/2sDcZG1Wl4LcnbuCNWgzaGW5Kb8VZA.woff2) format('woff2');
-  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
-}

electron-builder.yml

@@ -0,0 +1,125 @@
+appId: com.github.th-ch.pear-desktop
+productName: Pear Desktop
+files:
+  - '!*'
+  - dist
+  - assets
+  - license
+  - '!node_modules'
+  - 'node_modules/custom-electron-prompt/**'
+  - 'node_modules/@ghostery/adblocker-electron-preload/**'
+  - 'node_modules/@ffmpeg.wasm/core-mt/**'
+  - '!node_modules/**/*.map'
+  - '!node_modules/**/*.ts'
+asarUnpack:
+  - assets
+mac:
+  identity: null
+  target:
+    - target: dmg
+      arch:
+        - x64
+        - arm64
+  icon: assets/generated/icons/mac/icon.icns
+  compression: maximum
+win:
+  icon: assets/generated/icons/win/icon.ico
+  target:
+    - target: nsis-web
+      arch:
+        - x64
+        - ia32
+        - arm64
+    - target: portable
+      arch:
+        - x64
+        - ia32
+        - arm64
+  compression: maximum
+nsisWeb:
+  runAfterFinish: false
+linux:
+  icon: assets/generated/icons/png
+  category: AudioVideo
+  desktop:
+    entry:
+      StartupWMClass: com.github.th_ch.pear_desktop
+  target:
+    - 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: >-
+    Pear Desktop App bundled with custom plugins (and built-in ad
+    blocker / downloader)
+  category: AudioVideo
+flatpak:
+  description: >-
+    Pear Desktop App bundled with custom plugins (and built-in ad
+    blocker / downloader)
+  category: AudioVideo
+  runtimeVersion: '24.08'
+  baseVersion: '24.08'
+  finishArgs:
+    - '--socket=wayland'
+    - '--socket=x11'
+    - '--share=ipc'
+    - '--device=dri'
+    - '--socket=pulseaudio'
+    - '--share=network'
+    - '--filesystem=xdg-music:rw'
+    - '--talk-name=org.freedesktop.Notifications'
+    - '--talk-name=org.gnome.SessionManager'
+    - '--talk-name=org.kde.StatusNotifierWatcher'
+    - '--own-name=org.mpris.MediaPlayer2.PearDesktop.*'
+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:
+  slots:
+    - mpris:
+        interface: mpris
+directories:
+  output: ./pack/

electron.vite.config.mts

@@ -0,0 +1,188 @@
+import { dirname, join, resolve } from 'node:path';
+import { fileURLToPath } from 'node:url';
+
+import { defineConfig, defineViteConfig } from 'electron-vite';
+import builtinModules from 'builtin-modules';
+
+import Inspect from 'vite-plugin-inspect';
+import solidPlugin from 'vite-plugin-solid';
+import viteResolve from 'vite-plugin-resolve';
+
+import { withFilter, type UserConfig } from 'vite';
+
+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 = {
+      experimental: {
+        enableNativePlugin: true,
+      },
+      plugins: [
+        pluginLoader('backend'),
+        viteResolve({
+          'virtual:i18n': i18nImporter(),
+          'virtual:plugins': pluginVirtualModuleGenerator('main'),
+        }),
+      ],
+      publicDir: 'assets',
+      define: {
+        '__dirname': 'import.meta.dirname',
+        '__filename': 'import.meta.filename',
+      },
+      build: {
+        lib: {
+          entry: 'src/index.ts',
+          formats: ['es'],
+        },
+        outDir: 'dist/main',
+        rolldownOptions: {
+          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 = {
+      experimental: {
+        enableNativePlugin: true,
+      },
+      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,
+        },
+        rolldownOptions: {
+          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 = {
+      experimental: {
+        enableNativePlugin: mode !== 'development', // Disable native plugin in development mode to avoid issues with HMR (bug in rolldown-vite)
+      },
+      plugins: [
+        pluginLoader('renderer'),
+        viteResolve({
+          'virtual:i18n': i18nImporter(),
+          'virtual:plugins': pluginVirtualModuleGenerator('renderer'),
+        }),
+        withFilter(solidPlugin(), {
+          load: { id: [/\.(tsx|jsx)$/, '/@solid-refresh'] },
+        }),
+      ],
+      root: './src/',
+      build: {
+        lib: {
+          entry: 'src/index.html',
+          formats: ['iife'],
+          name: 'renderer',
+        },
+        outDir: 'dist/renderer',
+        rolldownOptions: {
+          external: ['electron', ...builtinModules],
+          input: './src/index.html',
+        },
+      },
+      resolve: {
+        alias: resolveAlias,
+      },
+      server: {
+        cors: {
+          origin:
+            'https://music.\u0079\u006f\u0075\u0074\u0075\u0062\u0065.com',
+        },
+      },
+    };
+
+    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,90 @@
+//@ts-check
+
+import eslint from '@eslint/js';
+import prettier from 'eslint-plugin-prettier/recommended';
+import solid from 'eslint-plugin-solid/configs/recommended';
+import stylistic from '@stylistic/eslint-plugin';
+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,
+  solid,
+  { 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'],
+      'stylistic/jsx-pascal-case': 'error',
+      'stylistic/jsx-curly-spacing': ['error', { when: 'never', children: true }],
+      'stylistic/jsx-sort-props': 'error',
+      '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',
+      '@typescript-eslint/consistent-type-imports': ['error', {
+        fixStyle: 'inline-type-imports',
+        prefer: 'type-imports',
+        disallowTypeAnnotations: false,
+      }],
+      '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,642 +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: windowX, y: windowY } = windowPosition;
-    const winSize = win.getSize();
-    const displaySize
-      = screen.getDisplayNearestPoint(windowPosition).bounds;
-    if (
-      windowX + winSize[0] < displaySize.x - 8
-      || windowX - winSize[0] > displaySize.x + displaySize.width
-      || windowY < displaySize.y - 8
-      || windowY > 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(windowX, windowY);
-    }
-  }
-
-  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);
-
-  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 }),
-    );
-  });
-}

license

@@ -1,6 +1,6 @@
 The MIT License (MIT)
 
-Copyright (c) th-ch <th-ch@users.noreply.github.com> (https://github.com/th-ch/youtube-music)
+Copyright (c) th-ch <th-ch@users.noreply.github.com> (https://github.com/pear-devs/pear-desktop)
 
 Permission is hereby granted, free of charge, to any person obtaining a copy
 of this software and associated documentation files (the "Software"), to deal

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,192 +1,185 @@
 {
-  "name": "youtube-music",
-  "productName": "YouTube Music",
-  "version": "2.0.3",
-  "description": "YouTube Music Desktop App - including custom plugins",
-  "main": "./dist/index.js",
+  "name": "pear-music",
+  "desktopName": "com.github.th_ch.pear_music",
+  "productName": "Pear Desktop",
+  "version": "3.11.0",
+  "description": "Pear Desktop App - including custom plugins",
+  "main": "./dist/main/index.js",
+  "type": "module",
   "license": "MIT",
-  "repository": "th-ch/youtube-music",
+  "repository": "pear-devs/pear-desktop",
   "author": {
     "name": "th-ch",
     "email": "th-ch@users.noreply.github.com",
-    "url": "https://github.com/th-ch/youtube-music"
-  },
-  "build": {
-    "appId": "com.github.th-ch.youtube-music",
-    "productName": "YouTube Music",
-    "files": [
-      "!*",
-      "dist",
-      "license",
-      "!node_modules",
-      "node_modules/custom-electron-prompt/**",
-      "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"
-    ],
-    "mac": {
-      "identity": null,
-      "target": [
-        {
-          "target": "dmg",
-          "arch": [
-            "x64",
-            "arm64"
-          ]
-        }
-      ],
-      "icon": "assets/generated/icons/mac/icon.icns"
-    },
-    "win": {
-      "icon": "assets/generated/icons/win/icon.ico",
-      "target": [
-        {
-          "target": "nsis-web",
-          "arch": [
-            "x64",
-            "ia32",
-            "arm64"
-          ]
-        },
-        {
-          "target": "portable",
-          "arch": [
-            "x64",
-            "ia32",
-            "arm64"
-          ]
-        }
-      ]
-    },
-    "nsisWeb": {
-      "runAfterFinish": false
-    },
-    "linux": {
-      "icon": "assets/generated/icons/png",
-      "category": "AudioVideo",
-      "target": [
-        "AppImage",
-        "snap",
-        "freebsd",
-        "deb",
-        "rpm"
-      ]
-    },
-    "snap": {
-      "slots": [
-        {
-          "mpris": {
-            "interface": "mpris"
-          }
-        }
-      ]
-    },
-    "directories": {
-      "output": "./pack/"
-    }
+    "url": "https://github.com/pear-devs/pear-desktop"
   },
   "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": "patch-package && 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-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",
-    "typecheck": "tsc -p tsconfig.json --noEmit"
+    "test": "pnpm playwright test",
+    "test:debug": "pnpm cross-env DEBUG=pw:*,-pw:test:protocol playwright test",
+    "build": "pnpm electron-vite build",
+    "vite:inspect": "pnpm clean && electron-vite build --mode development && pnpm exec serve .vite-inspect",
+    "start": "pnpm electron-vite preview",
+    "start:debug": "pnpm cross-env ELECTRON_ENABLE_LOGGING=1 pnpm start",
+    "dev": "pnpm cross-env NODE_ENV=development NODE_OPTIONS=--enable-source-maps electron-vite dev --watch",
+    "dev:renderer": "pnpm cross-env NODE_ENV=development NODE_OPTIONS=--enable-source-maps electron-vite dev",
+    "dev:debug": "pnpm cross-env ELECTRON_ENABLE_LOGGING=1 pnpm dev",
+    "clean": "pnpm del-cli dist && pnpm del-cli pack && pnpm 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": "pnpm eslint ./src",
+    "changelog": "pnpm dlx 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": "pnpm tsc -p tsconfig.json --noEmit"
   },
   "engines": {
-    "node": ">=16.0.0"
+    "node": ">=22",
+    "pnpm": ">=10"
+  },
+  "pnpm": {
+    "overrides": {
+      "vite": "npm:rolldown-vite@7.1.8",
+      "node-gyp": "11.4.2",
+      "xml2js": "0.6.2",
+      "node-fetch": "3.3.2",
+      "@electron/universal": "3.0.1",
+      "@babel/runtime": "7.28.4"
+    },
+    "patchedDependencies": {
+      "vudio@2.1.1": "patches/vudio@2.1.1.patch",
+      "@malept/flatpak-bundler@0.4.0": "patches/@malept__flatpak-bundler@0.4.0.patch",
+      "kuromoji@0.1.2": "patches/kuromoji@0.1.2.patch",
+      "file-type@16.5.4": "patches/file-type@16.5.4.patch",
+      "electron-is@3.0.0": "patches/electron-is@3.0.0.patch",
+      "mdui@2.1.4": "patches/mdui@2.1.4.patch"
+    },
+    "neverBuiltDependencies": []
   },
   "dependencies": {
-    "@cliqz/adblocker-electron": "1.26.8",
+    "@dehoist/romanize-thai": "1.0.0",
+    "@electron-toolkit/tsconfig": "1.0.1",
+    "@electron/remote": "2.1.3",
     "@ffmpeg.wasm/core-mt": "0.12.0",
     "@ffmpeg.wasm/main": "0.12.0",
-    "@foobar404/wave": "2.0.4",
-    "@jellybrick/mpris-service": "2.1.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.7.4",
+    "@foobar404/wave": "2.0.5",
+    "@ghostery/adblocker-electron": "2.11.6",
+    "@ghostery/adblocker-electron-preload": "2.11.6",
+    "@hono/node-server": "1.19.1",
+    "@hono/node-ws": "1.2.0",
+    "@hono/swagger-ui": "0.5.2",
+    "@hono/zod-openapi": "1.1.0",
+    "@hono/zod-validator": "0.7.2",
+    "@jellybrick/dbus-next": "0.10.3",
+    "@jellybrick/electron-better-web-request": "1.0.4",
+    "@jellybrick/mpris-service": "2.1.5",
+    "@jimp/plugin-color": "1.6.0",
+    "@mdui/icons": "^1.0.3",
+    "@skyra/jaro-winkler": "1.1.1",
+    "@xhayper/discord-rpc": "1.3.0",
+    "async-mutex": "0.5.0",
+    "bgutils-js": "3.2.0",
+    "butterchurn": "3.0.0-beta.5",
+    "butterchurn-presets": "3.0.0-beta.4",
+    "color": "5.0.0",
+    "conf": "14.0.0",
+    "crypto-js": "^4.2.0",
+    "custom-electron-prompt": "1.5.8",
+    "deepmerge-ts": "7.1.5",
+    "delay": "6.0.0",
+    "electron-debug": "4.1.0",
     "electron-is": "3.0.0",
     "electron-localshortcut": "3.2.1",
-    "electron-store": "8.1.0",
-    "electron-unhandled": "4.0.1",
-    "electron-updater": "6.1.4",
-    "fast-average-color": "9.4.0",
+    "electron-store": "10.1.0",
+    "electron-unhandled": "5.0.0",
+    "electron-updater": "6.6.2",
+    "es-hangul": "2.3.5",
+    "fast-average-color": "9.5.0",
+    "fast-equals": "5.2.2",
+    "fflate": "0.8.2",
     "filenamify": "6.0.0",
+    "hanja": "1.1.5",
+    "happy-dom": "18.0.1",
+    "hono": "4.9.6",
     "howler": "2.2.4",
     "html-to-text": "9.0.5",
+    "i18next": "25.5.2",
+    "jimp": "1.6.0",
     "keyboardevent-from-electron-accelerator": "2.0.0",
     "keyboardevents-areequal": "0.2.2",
-    "node-id3": "0.2.6",
-    "simple-youtube-age-restriction-bypass": "git+https://github.com/MiepHD/Simple-YouTube-Age-Restriction-Bypass.git#v2.5.5",
+    "kuromoji": "0.1.2",
+    "kuroshiro": "1.2.0",
+    "kuroshiro-analyzer-kuromoji": "1.1.0",
+    "lazy-var": "2.2.2",
+    "mdui": "2.1.4",
+    "node-html-parser": "7.0.1",
+    "node-id3": "0.2.9",
+    "peerjs": "1.5.5",
+    "semver": "7.7.2",
+    "serve": "14.2.5",
+    "socks": "2.8.7",
+    "solid-element": "1.9.1",
+    "solid-floating-ui": "0.3.1",
+    "solid-js": "1.9.9",
+    "solid-styled-components": "0.28.5",
+    "solid-transition-group": "0.3.0",
+    "tiny-pinyin": "1.3.2",
+    "tinyld": "1.3.4",
+    "virtua": "0.42.3",
     "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",
-    "node-fetch": "2.7.0",
-    "@electron/universal": "1.4.2",
-    "electron": "27.0.0-beta.9"
+    "youtubei.js": "^16.0.1",
+    "zod": "4.1.5"
   },
   "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.3",
-    "@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",
-    "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",
-    "patch-package": "8.0.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-toolkit/tsconfig": "1.0.1",
+    "@eslint/js": "9.35.0",
+    "@malept/flatpak-bundler": "0.4.0",
+    "@playwright/test": "1.55.0",
+    "@stylistic/eslint-plugin": "5.3.1",
+    "@total-typescript/ts-reset": "0.6.1",
+    "@types/crypto-js": "^4.2.2",
+    "@types/electron-localshortcut": "3.1.3",
+    "@types/howler": "2.2.12",
+    "@types/html-to-text": "9.0.4",
+    "@types/semver": "7.7.1",
+    "@types/trusted-types": "2.0.7",
+    "bufferutil": "4.0.9",
+    "builtin-modules": "5.0.0",
+    "cross-env": "10.0.0",
+    "del-cli": "6.0.0",
+    "discord-api-types": "0.38.23",
+    "electron": "38.2.0",
+    "electron-builder": "26.0.12",
+    "electron-builder-squirrel-windows": "26.0.12",
+    "electron-devtools-installer": "4.0.0",
+    "electron-vite": "4.0.0",
+    "eslint": "9.35.0",
+    "eslint-config-prettier": "10.1.8",
+    "eslint-import-resolver-exports": "1.0.0-beta.5",
+    "eslint-import-resolver-typescript": "4.4.4",
+    "eslint-plugin-import": "2.32.0",
+    "eslint-plugin-prettier": "5.5.4",
+    "eslint-plugin-solid": "0.14.5",
+    "glob": "11.0.3",
+    "node-gyp": "11.4.2",
+    "playwright": "1.55.0",
+    "ts-morph": "27.0.0",
+    "typescript": "5.9.2",
+    "typescript-eslint": "8.43.0",
+    "utf-8-validate": "6.0.5",
+    "vite": "npm:rolldown-vite@7.1.8",
+    "vite-plugin-inspect": "11.3.3",
+    "vite-plugin-resolve": "2.5.2",
+    "vite-plugin-solid": "2.11.8",
+    "ws": "8.18.3"
   },
   "auto-changelog": {
     "hideCredit": true,

patches/@malept__flatpak-bundler@0.4.0.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/electron-is@3.0.0.patch

@@ -0,0 +1,27 @@
+diff --git a/is.d.ts b/is.d.ts
+index fb861f7b401914f0f89cb4edf25c51df5cb05812..82144733cd34d88e2deb2e4713b104418e673f2e 100644
+--- a/is.d.ts
++++ b/is.d.ts
+@@ -5,6 +5,7 @@ declare namespace is {
+   export function macOS(): boolean;
+   export function windows(): boolean;
+   export function linux(): boolean;
++  export function freebsd(): boolean;
+   export function x86(): boolean;
+   export function x64(): boolean;
+   export function production(): boolean;
+diff --git a/is.js b/is.js
+index a76bb1755a2728bde185b35d847031d3b8ea4ab0..f6b03406c17342f5af078de069e5bbbd2246e152 100644
+--- a/is.js
++++ b/is.js
+@@ -39,6 +39,10 @@ module.exports = {
+   linux: function () {
+     return process.platform === 'linux'
+   },
++  // Checks if we are under FreeBSD OS
++  freebsd: function () {
++    return process.platform === "freebsd"
++  },
+   // Checks if we are the processor's arch is x86
+   x86: function () {
+     return process.arch === 'ia32'

patches/file-type@16.5.4.patch

@@ -0,0 +1,14 @@
+diff --git a/core.js b/core.js
+index d653e66a4056c27cca777d4e25222acae3b2ec85..a91741d67df85fd9627889a6c7197ac4e6a3a813 100644
+--- a/core.js
++++ b/core.js
+@@ -1415,8 +1415,7 @@ async function _fromTokenizer(tokenizer) {
+ }
+
+ const stream = readableStream => new Promise((resolve, reject) => {
+-	// Using `eval` to work around issues when bundling with Webpack
+-	const stream = eval('require')('stream'); // eslint-disable-line no-eval
++	const stream = require('node:stream');
+
+ 	readableStream.on('error', reject);
+ 	readableStream.once('readable', async () => {

patches/mdui@2.1.4.patch

@@ -0,0 +1,40 @@
+diff --git a/jsx.en.d.ts b/jsx.en.d.ts
+index 514d455dcdb436aaf7b2ee88deaefe01943c8b4b..48dff045dead4315936afd931336198996c88217 100644
+--- a/jsx.en.d.ts
++++ b/jsx.en.d.ts
+@@ -1,12 +1,8 @@
+-import React from 'react';
+ import { JQ } from '@mdui/jq';
+
+-type HTMLElementProps = React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>;
++type HTMLElementProps = import("solid-js").JSX.HTMLAttributes<HTMLElement>;
+
+-declare global {
+-  namespace React {
+-    namespace JSX {
+-      interface IntrinsicElements {
++export interface IntrinsicElements {
+         /**
+         * Avatar Component
+        *
+@@ -3296,7 +3292,4 @@ declare global {
+           */
+           'order'?: number;
+         } & HTMLElementProps;
+-      }
+-    }
+-  }
+ }
+diff --git a/package.json b/package.json
+index 3fa3eeb471ce4c31d7ac1c9bcb2d6823947e91ca..c4b062020bf20b8db34ccfea500fa682a4af19a6 100644
+--- a/package.json
++++ b/package.json
+@@ -60,5 +60,8 @@
+     "tslib": "^2.8.1",
+     "@mdui/shared": "^1.0.8",
+     "@mdui/jq": "^3.0.3"
++  },
++  "peerDependencies": {
++    "solid-js": "^1.9.7"
+   }
+ }

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) {

patches/youtubei.js+6.4.1.patch

@@ -1,38 +0,0 @@
-diff --git a/node_modules/youtubei.js/bundle/node.cjs b/node_modules/youtubei.js/bundle/node.cjs
-index 7e3072e..bf5be6a 100644
---- a/node_modules/youtubei.js/bundle/node.cjs
-+++ b/node_modules/youtubei.js/bundle/node.cjs
-@@ -16969,7 +16969,13 @@ var _Cache_createCache;
- var meta_url = import_meta.url;
- var is_cjs = !meta_url;
- var __dirname__ = is_cjs ? __dirname : import_path.default.dirname((0, import_url.fileURLToPath)(meta_url));
--var package_json = JSON.parse((0, import_fs.readFileSync)(import_path.default.resolve(__dirname__, is_cjs ? "../package.json" : "../../package.json"), "utf-8"));
-+var package_json = {
-+  homepage: "https://github.com/LuanRT/YouTube.js#readme",
-+  version: "6.4.1",
-+  bugs: {
-+    url: "https://github.com/LuanRT/YouTube.js/issues"
-+  }
-+};
- var repo_url = (_a3 = package_json.homepage) === null || _a3 === void 0 ? void 0 : _a3.split("#")[0];
- var Cache = class {
-   constructor(persistent = false, persistent_directory) {
-diff --git a/node_modules/youtubei.js/dist/src/platform/node.js b/node_modules/youtubei.js/dist/src/platform/node.js
-index 0e1b2ca..17b437c 100644
---- a/node_modules/youtubei.js/dist/src/platform/node.js
-+++ b/node_modules/youtubei.js/dist/src/platform/node.js
-@@ -16,7 +16,13 @@ import evaluate from './jsruntime/jinter.js';
- const meta_url = import.meta.url;
- const is_cjs = !meta_url;
- const __dirname__ = is_cjs ? __dirname : path.dirname(fileURLToPath(meta_url));
--const package_json = JSON.parse(readFileSync(path.resolve(__dirname__, is_cjs ? '../package.json' : '../../package.json'), 'utf-8'));
-+const package_json = {
-+  homepage: "https://github.com/LuanRT/YouTube.js#readme",
-+  version: "6.4.1",
-+  bugs: {
-+    url: "https://github.com/LuanRT/YouTube.js/issues"
-+  }
-+};
- const repo_url = (_a = package_json.homepage) === null || _a === void 0 ? void 0 : _a.split('#')[0];
- class Cache {
-     constructor(persistent = false, persistent_directory) {

plugins/adblocker/.gitignore

@@ -1 +0,0 @@
-/ad-blocker-engine.bin

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-types.ts

@@ -1,4 +0,0 @@
-export const blockers = {
-  WithBlocklists: 'With blocklists',
-  InPlayer: 'In player',
-} as const;

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,15 +0,0 @@
-/* eslint-disable @typescript-eslint/await-thenable */
-/* renderer */
-
-import { blockers } from './blocker-types';
-
-import { PluginConfig } from '../../config/dynamic';
-
-const config = new PluginConfig('adblocker', { enableFront: true });
-
-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,21 +0,0 @@
-import config from './config';
-
-import { blockers } from './blocker-types';
-
-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,15 +0,0 @@
-import config from './config';
-import inject from './inject';
-import injectCliqzPreload from './inject-cliqz-preload';
-
-import { blockers } from './blocker-types';
-
-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/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;