Fix Release ref for Fedora

Remove horizontal margins on guide

(cherry picked from commit 9e3a27266c)
Signed-off-by: Joshua M. Boniface <joshua@boniface.me>

.ci/azure-pipelines-build.yml

@@ -0,0 +1,63 @@
+jobs:
+- job: Build
+  displayName: 'Build'
+
+  strategy:
+    matrix:
+      Development:
+        BuildConfiguration: development
+      Production:
+        BuildConfiguration: production
+      Standalone:
+        BuildConfiguration: standalone
+
+  pool:
+    vmImage: 'ubuntu-latest'
+
+  steps:
+  - task: NodeTool@0
+    displayName: 'Install Node'
+    inputs:
+      versionSpec: '12.x'
+
+  - task: Cache@2
+    displayName: 'Check Cache'
+    inputs:
+      key: 'yarn | yarn.lock'
+      path: 'node_modules'
+      cacheHitVar: CACHE_RESTORED
+
+  - script: 'yarn install --frozen-lockfile'
+    displayName: 'Install Dependencies'
+    condition: ne(variables.CACHE_RESTORED, 'true')
+
+  - script: 'yarn build:development'
+    displayName: 'Build Development'
+    condition: eq(variables['BuildConfiguration'], 'development')
+
+  - script: 'yarn build:production'
+    displayName: 'Build Production'
+    condition: eq(variables['BuildConfiguration'], 'production')
+
+  - script: 'yarn build:standalone'
+    displayName: 'Build Standalone'
+    condition: eq(variables['BuildConfiguration'], 'standalone')
+
+  - script: 'test -d dist'
+    displayName: 'Check Build'
+
+  - script: 'mv dist jellyfin-web'
+    displayName: 'Rename Directory'
+
+  - task: ArchiveFiles@2
+    displayName: 'Archive Directory'
+    inputs:
+      rootFolderOrFile: 'jellyfin-web'
+      includeRootFolder: true
+      archiveFile: 'jellyfin-web-$(BuildConfiguration)'
+
+  - task: PublishPipelineArtifact@1
+    displayName: 'Publish Release'
+    inputs:
+      targetPath: '$(Build.SourcesDirectory)/jellyfin-web-$(BuildConfiguration).zip'
+      artifactName: 'jellyfin-web-$(BuildConfiguration)'

.ci/azure-pipelines-lint.yml

@@ -0,0 +1,29 @@
+jobs:
+- job: Lint
+  displayName: 'Lint'
+
+  pool:
+    vmImage: 'ubuntu-latest'
+
+  steps:
+  - task: NodeTool@0
+    displayName: 'Install Node'
+    inputs:
+      versionSpec: '12.x'
+
+  - task: Cache@2
+    displayName: 'Check Cache'
+    inputs:
+      key: 'yarn | yarn.lock'
+      path: 'node_modules'
+      cacheHitVar: CACHE_RESTORED
+
+  - script: 'yarn install --frozen-lockfile'
+    displayName: 'Install Dependencies'
+    condition: ne(variables.CACHE_RESTORED, 'true')
+
+  - script: 'yarn run lint --quiet'
+    displayName: 'Run ESLint'
+
+  - script: 'yarn run stylelint'
+    displayName: 'Run Stylelint'

.ci/azure-pipelines-package.yml

@@ -0,0 +1,122 @@
+jobs:
+- job: BuildPackage
+  displayName: 'Build Packages'
+
+  strategy:
+    matrix:
+      CentOS:
+        BuildConfiguration: centos
+      Debian:
+        BuildConfiguration: debian
+      Fedora:
+        BuildConfiguration: fedora
+      Portable:
+        BuildConfiguration: portable
+
+  pool:
+    vmImage: 'ubuntu-latest'
+
+  steps:
+  - script: 'docker build -f deployment/Dockerfile.$(BuildConfiguration) -t jellyfin-web-$(BuildConfiguration) deployment'
+    displayName: 'Build Dockerfile'
+    condition: or(startsWith(variables['Build.SourceBranch'], 'refs/tags'), startsWith(variables['Build.SourceBranch'], 'refs/heads/master'))
+
+  - script: 'docker image ls -a && docker run -v $(pwd)/deployment/dist:/dist -v $(pwd):/jellyfin -e IS_UNSTABLE="yes" -e BUILD_ID=$(Build.BuildNumber) jellyfin-web-$(BuildConfiguration)'
+    displayName: 'Run Dockerfile (unstable)'
+    condition: startsWith(variables['Build.SourceBranch'], 'refs/heads/master')
+
+  - script: 'docker image ls -a && docker run -v $(pwd)/deployment/dist:/dist -v $(pwd):/jellyfin -e IS_UNSTABLE="no" -e BUILD_ID=$(Build.BuildNumber) jellyfin-web-$(BuildConfiguration)'
+    displayName: 'Run Dockerfile (stable)'
+    condition: startsWith(variables['Build.SourceBranch'], 'refs/tags')
+
+  - task: PublishPipelineArtifact@1
+    displayName: 'Publish Release'
+    condition: or(startsWith(variables['Build.SourceBranch'], 'refs/tags'), startsWith(variables['Build.SourceBranch'], 'refs/heads/master'))
+    inputs:
+      targetPath: '$(Build.SourcesDirectory)/deployment/dist'
+      artifactName: 'jellyfin-web-$(BuildConfiguration)'
+
+  - task: SSH@0
+    displayName: 'Create target directory on repository server'
+    condition: or(startsWith(variables['Build.SourceBranch'], 'refs/tags'), startsWith(variables['Build.SourceBranch'], 'refs/heads/master'))
+    inputs:
+      sshEndpoint: repository
+      runOptions: 'inline'
+      inline: 'mkdir -p /srv/repository/incoming/azure/$(Build.BuildNumber)/$(BuildConfiguration)'
+
+  - task: CopyFilesOverSSH@0
+    displayName: 'Upload artifacts to repository server'
+    condition: or(startsWith(variables['Build.SourceBranch'], 'refs/tags'), startsWith(variables['Build.SourceBranch'], 'refs/heads/master'))
+    inputs:
+      sshEndpoint: repository
+      sourceFolder: '$(Build.SourcesDirectory)/deployment/dist'
+      contents: '**'
+      targetFolder: '/srv/repository/incoming/azure/$(Build.BuildNumber)/$(BuildConfiguration)'
+
+- job: BuildDocker
+  displayName: 'Build Docker'
+
+  pool:
+    vmImage: 'ubuntu-latest'
+
+  variables:
+  - name: JellyfinVersion
+    value: 0.0.0
+
+  steps:
+  - script: echo "##vso[task.setvariable variable=JellyfinVersion]$( awk -F '/' '{ print $NF }' <<<'$(Build.SourceBranch)' | sed 's/^v//' )"
+    displayName: Set release version (stable)
+    condition: startsWith(variables['Build.SourceBranch'], 'refs/tags')  
+
+  - task: Docker@2
+    displayName: 'Push Unstable Image'
+    condition: startsWith(variables['Build.SourceBranch'], 'refs/heads/master')
+    inputs:
+      repository: 'jellyfin/jellyfin-web'
+      command: buildAndPush
+      buildContext: '.'
+      Dockerfile: 'deployment/Dockerfile.docker'
+      containerRegistry: Docker Hub
+      tags: |
+        unstable-$(Build.BuildNumber)
+        unstable
+
+  - task: Docker@2
+    displayName: 'Push Stable Image'
+    condition: startsWith(variables['Build.SourceBranch'], 'refs/tags')
+    inputs:
+      repository: 'jellyfin/jellyfin-web'
+      command: buildAndPush
+      buildContext: '.'
+      Dockerfile: 'deployment/Dockerfile.docker'
+      containerRegistry: Docker Hub
+      tags: |
+        stable-$(Build.BuildNumber)
+        $(JellyfinVersion)
+
+- job: CollectArtifacts
+  displayName: 'Collect Artifacts'
+  dependsOn:
+  - BuildPackage
+  - BuildDocker
+  condition: and(succeeded('BuildPackage'), succeeded('BuildDocker'))
+
+  pool:
+    vmImage: 'ubuntu-latest'
+
+  steps:
+  - task: SSH@0
+    displayName: 'Update Unstable Repository'
+    condition: startsWith(variables['Build.SourceBranch'], 'refs/heads/master')
+    inputs:
+      sshEndpoint: repository
+      runOptions: 'inline'
+      inline: 'sudo /srv/repository/collect-server.azure.sh /srv/repository/incoming/azure $(Build.BuildNumber) unstable'
+
+  - task: SSH@0
+    displayName: 'Update Stable Repository'
+    condition: startsWith(variables['Build.SourceBranch'], 'refs/tags')
+    inputs:
+      sshEndpoint: repository
+      runOptions: 'inline'
+      inline: 'sudo /srv/repository/collect-server.azure.sh /srv/repository/incoming/azure $(Build.BuildNumber)'

.ci/azure-pipelines.yml

@@ -0,0 +1,17 @@
+trigger:
+  batch: true
+  branches:
+    include:
+    - '*'
+  tags:
+    include:
+    - '*'
+pr:
+  branches:
+    include:
+    - '*'
+
+jobs:
+- template: azure-pipelines-build.yml
+- template: azure-pipelines-lint.yml
+- template: azure-pipelines-package.yml

.copr/Makefile

@@ -0,0 +1 @@
+../fedora/Makefile

.dependabot/config.yml

@@ -0,0 +1,5 @@
+version: 1
+update_configs:
+  - package_manager: "javascript"
+    directory: "/"
+    update_schedule: "weekly"

.devcontainer/devcontainer.json

@@ -1,23 +0,0 @@
-// For format details, see https://aka.ms/devcontainer.json. For config options, see the
-// README at: https://github.com/devcontainers/templates/tree/main/src/javascript-node
-{
-	"name": "Node.js",
-	// Or use a Dockerfile or Docker Compose file. More info: https://containers.dev/guide/dockerfile
-	"image": "mcr.microsoft.com/devcontainers/javascript-node:1-20-bullseye",
-
-	// Features to add to the dev container. More info: https://containers.dev/features.
-	// "features": {},
-
-	// Use 'forwardPorts' to make a list of ports inside the container available locally.
-	// "forwardPorts": [],
-
-	// Use 'postCreateCommand' to run commands after the container is created.
-	//https://github.com/microsoft/vscode-dev-containers/issues/559
-	"postCreateCommand": "source $NVM_DIR/nvm.sh && nvm install 20"
-
-	// Configure tool-specific properties.
-	// "customizations": {},
-
-	// Uncomment to connect as root instead. More info: https://aka.ms/dev-containers-non-root.
-	// "remoteUser": "root"
-}

.editorconfig

@@ -8,5 +8,5 @@ trim_trailing_whitespace = true
 insert_final_newline = true
 end_of_line = lf
 
-[*.{json,yaml,yml}]
+[json]
 indent_size = 2

.escheckrc

@@ -1,9 +0,0 @@
-{
-    "ecmaVersion": "es5",
-    "files": "./dist/**/*.js",
-    "not": [
-        "./dist/libraries/pdf.worker.js",
-        "./dist/libraries/worker-bundle.js",
-        "./dist/serviceworker.js"
-    ]
-}

.eslintignore

@@ -0,0 +1,5 @@
+node_modules
+dist
+.idea
+.vscode
+src/libraries

.eslintrc.js

@@ -0,0 +1,196 @@
+module.exports = {
+    root: true,
+    plugins: [
+        'promise',
+        'import',
+        'eslint-comments'
+    ],
+    env: {
+        node: true,
+        es6: true,
+        es2017: true,
+        es2020: true
+    },
+    parserOptions: {
+        ecmaVersion: 2020,
+        sourceType: 'module',
+        ecmaFeatures: {
+            impliedStrict: true
+        }
+    },
+    extends: [
+        'eslint:recommended',
+        // 'plugin:promise/recommended',
+        'plugin:import/errors',
+        'plugin:import/warnings',
+        'plugin:eslint-comments/recommended',
+        'plugin:compat/recommended'
+    ],
+    rules: {
+        'block-spacing': ['error'],
+        'brace-style': ['error'],
+        'comma-dangle': ['error', 'never'],
+        'comma-spacing': ['error'],
+        'eol-last': ['error'],
+        'indent': ['error', 4, { 'SwitchCase': 1 }],
+        'keyword-spacing': ['error'],
+        'max-statements-per-line': ['error'],
+        'no-floating-decimal': ['error'],
+        'no-multi-spaces': ['error'],
+        'no-multiple-empty-lines': ['error', { 'max': 1 }],
+        'no-trailing-spaces': ['error'],
+        'one-var': ['error', 'never'],
+        'quotes': ['error', 'single', { 'avoidEscape': true, 'allowTemplateLiterals': false }],
+        'semi': ['error'],
+        'space-before-blocks': ['error'],
+        'space-infix-ops': 'error'
+    },
+    overrides: [
+        {
+            files: [
+                './src/**/*.js'
+            ],
+            parser: 'babel-eslint',
+            env: {
+                node: false,
+                amd: true,
+                browser: true,
+                es6: true,
+                es2017: true,
+                es2020: true
+            },
+            globals: {
+                // Browser globals
+                'MediaMetadata': 'readonly',
+                // Tizen globals
+                'tizen': 'readonly',
+                'webapis': 'readonly',
+                // WebOS globals
+                'webOS': 'readonly',
+                // Dependency globals
+                '$': 'readonly',
+                'jQuery': 'readonly',
+                'requirejs': 'readonly',
+                // Jellyfin globals
+                'ApiClient': 'writable',
+                'AppInfo': 'writable',
+                'chrome': 'writable',
+                'ConnectionManager': 'writable',
+                'DlnaProfilePage': 'writable',
+                'Dashboard': 'writable',
+                'DashboardPage': 'writable',
+                'Emby': 'readonly',
+                'Events': 'writable',
+                'getParameterByName': 'writable',
+                'getWindowLocationSearch': 'writable',
+                'Globalize': 'writable',
+                'Hls': 'writable',
+                'dfnshelper': 'writable',
+                'LibraryMenu': 'writable',
+                'LinkParser': 'writable',
+                'LiveTvHelpers': 'writable',
+                'MetadataEditor': 'writable',
+                'pageClassOn': 'writable',
+                'pageIdOn': 'writable',
+                'PlaylistViewer': 'writable',
+                'UserParentalControlPage': 'writable',
+                'Windows': 'readonly'
+            },
+            rules: {
+                // TODO: Fix warnings and remove these rules
+                'no-redeclare': ['warn'],
+                'no-unused-vars': ['warn'],
+                'no-useless-escape': ['warn'],
+                // TODO: Remove after ES6 migration is complete
+                'import/no-unresolved': ['off']
+            },
+            settings: {
+                polyfills: [
+                    // Native Promises Only
+                    'Promise',
+                    // whatwg-fetch
+                    'fetch',
+                    // document-register-element
+                    'document.registerElement',
+                    // resize-observer-polyfill
+                    'ResizeObserver',
+                    // fast-text-encoding
+                    'TextEncoder',
+                    // intersection-observer
+                    'IntersectionObserver',
+                    // Core-js
+                    'Object.assign',
+                    'Object.is',
+                    'Object.setPrototypeOf',
+                    'Object.toString',
+                    'Object.freeze',
+                    'Object.seal',
+                    'Object.preventExtensions',
+                    'Object.isFrozen',
+                    'Object.isSealed',
+                    'Object.isExtensible',
+                    'Object.getOwnPropertyDescriptor',
+                    'Object.getPrototypeOf',
+                    'Object.keys',
+                    'Object.entries',
+                    'Object.getOwnPropertyNames',
+                    'Function.name',
+                    'Function.hasInstance',
+                    'Array.from',
+                    'Array.arrayOf',
+                    'Array.copyWithin',
+                    'Array.fill',
+                    'Array.find',
+                    'Array.findIndex',
+                    'Array.iterator',
+                    'String.fromCodePoint',
+                    'String.raw',
+                    'String.iterator',
+                    'String.codePointAt',
+                    'String.endsWith',
+                    'String.includes',
+                    'String.repeat',
+                    'String.startsWith',
+                    'String.trim',
+                    'String.anchor',
+                    'String.big',
+                    'String.blink',
+                    'String.bold',
+                    'String.fixed',
+                    'String.fontcolor',
+                    'String.fontsize',
+                    'String.italics',
+                    'String.link',
+                    'String.small',
+                    'String.strike',
+                    'String.sub',
+                    'String.sup',
+                    'RegExp',
+                    'Number',
+                    'Math',
+                    'Date',
+                    'async',
+                    'Symbol',
+                    'Map',
+                    'Set',
+                    'WeakMap',
+                    'WeakSet',
+                    'ArrayBuffer',
+                    'DataView',
+                    'Int8Array',
+                    'Uint8Array',
+                    'Uint8ClampedArray',
+                    'Int16Array',
+                    'Uint16Array',
+                    'Int32Array',
+                    'Uint32Array',
+                    'Float32Array',
+                    'Float64Array',
+                    'Reflect',
+                    // Temporary while eslint-compat-plugin is buggy
+                    'document.querySelector'
+                ]
+            }
+        }
+    ]
+}

.github/CODEOWNERS

@@ -1,5 +1,4 @@
-*               @jellyfin/web
-# Joshua must review all changes to bump_version
-bump_version    @joshuaboniface
-# Core must approve all changes within the repo config
-.github/        @jellyfin/core
+.ci             @dkanada @EraYaN
+.github         @jellyfin/core
+build.sh        @joshuaboniface
+deployment      @joshuaboniface

.github/ISSUE_TEMPLATE/1-bug-report.yml

@@ -1,122 +0,0 @@
-name: Bug Report
-description: You have noticed a general issue or regression, and would like to report it
-labels:
-  - bug
-body:
-  - type: checkboxes
-    id: before-posting
-    attributes:
-      label: "This issue respects the following points:"
-      description: All conditions are **required**.
-      options:
-        - label: This issue is **not** already reported on [GitHub](https://github.com/jellyfin/jellyfin-web/issues?q=is%3Aissue) _(I've searched it)_.
-          required: true
-        - label: I agree to follow Jellyfin's [Code of Conduct](https://jellyfin.org/docs/general/community-standards.html#code-of-conduct).
-          required: true
-        - label: This report addresses only a single issue; If you encounter multiple issues, kindly create separate reports for each one.
-          required: true
-  - type: markdown
-    attributes:
-      value: |
-        ## Bug information  
-  - type: textarea
-    id: description
-    attributes:
-      label: Describe the bug
-      description: |
-        A clear and concise description of the bug.
-        You can also attach screenshots or screen recordings here to help explain your issue.
-    validations:
-      required: true
-  - type: textarea
-    id: reproduction
-    attributes:
-      label: Reproduction Steps
-      description: |
-        Steps to reproduce the behavior:
-      placeholder: |
-        1. Go to …
-        2. Click on …
-        3. Scroll down to …
-        4. See error / the app crashes
-    validations:
-      required: true
-  - type: textarea
-    id: behaviour
-    attributes:
-      label: Expected/Actual behaviour
-      description: |
-        Describe the behavior you were expecting versus what actually occurred.
-      placeholder: |
-        I expected the app to... However, the actual behavior was that...
-    validations:
-      required: true
-  - type: textarea
-    id: logs
-    attributes:
-      label: Logs
-      description: |
-        Please paste any log errors.
-      placeholder: Paste logs…
-  - type: markdown
-    attributes:
-      value: |
-        ## Environment
-  - type: markdown
-    attributes:
-      value: |
-        ### Server
-        You will find these values in your Admin Dashboard
-  - type: input
-    id: server-version
-    attributes:
-      label: Server version
-      placeholder: 10.10.2
-    validations:
-      required: true
-  - type: input
-    id: web-version
-    attributes:
-      label: Web version
-      placeholder: 10.10.2
-    validations:
-      required: true
-  - type: input
-    id: build-version
-    attributes:
-      label: Build version
-      placeholder: 10.10.2
-    validations:
-      required: true
-  - type: markdown
-    attributes:
-      value: |
-        ### Client
-        Information about the device you are seeing the issue on
-  - type: input
-    id: platform
-    attributes:
-      label: Platform
-      description: Specify the operating system or device where the issue occurs. If relevant, include details like version or model.
-      placeholder: e.g. Linux, Windows, iPhone, Tizen
-    validations:
-      required: true
-  - type: input
-    id: browser
-    attributes:
-      label: Browser
-      description: Indicate which browser you're using when encountering the issue. If possible, mention the browser version as well.
-      placeholder: e.g. Firefox, Chrome, Safari
-    validations:
-      required: true
-  - type: markdown
-    attributes:
-      value: |
-        ## Additional
-  - type: textarea
-    attributes:
-      label: Additional information
-      description: Include any relevant details, resources, or screenshots that might help in understanding or implementing the request.
-      placeholder: Add any additional context here.
-    validations:
-      required: false

.github/ISSUE_TEMPLATE/2-playback-issue.yml

@@ -1,145 +0,0 @@
-name: Playback Issue
-description: Create a bug report related to media playback
-labels:
-  - bug
-  - playback
-body:
-  - type: checkboxes
-    id: before-posting
-    attributes:
-      label: "This issue respects the following points:"
-      description: All conditions are **required**.
-      options:
-        - label: This issue is **not** already reported on [GitHub](https://github.com/jellyfin/jellyfin-web/issues?q=is%3Aissue) _(I've searched it)_.
-          required: true
-        - label: I agree to follow Jellyfin's [Code of Conduct](https://jellyfin.org/docs/general/community-standards.html#code-of-conduct).
-          required: true
-        - label: This report addresses only a single issue; If you encounter multiple issues, kindly create separate reports for each one.
-          required: true
-  - type: markdown
-    attributes:
-      value: |
-        ## Bug information  
-  - type: textarea
-    id: description
-    attributes:
-      label: Describe the bug
-      description: |
-        A clear and concise description of the bug.
-        You can also attach screenshots or screen recordings here to help explain your issue.
-    validations:
-      required: true
-  - type: textarea
-    id: reproduction
-    attributes:
-      label: Reproduction Steps
-      description: |
-        Steps to reproduce the behavior:
-      placeholder: |
-        1. Go to …
-        2. Click on …
-        3. Scroll down to …
-        4. See error / the app crashes
-    validations:
-      required: true
-  - type: textarea
-    id: behaviour
-    attributes:
-      label: Expected/Actual behaviour
-      description: |
-        Describe the behavior you were expecting versus what actually occurred.
-      placeholder: |
-        I expected the app to... However, the actual behavior was that...
-    validations:
-      required: true
-  - type: textarea
-    id: mediainfo
-    attributes:
-      label: Media info of the file
-      description: |
-        Please share the media information for the file causing issues. You can use a variety of tools to retrieve this information.
-        - Use ffprobe (`ffprobe ./file.mp4`)
-        - Copy the media info from the web interface
-      placeholder: Paste media info…
-      render: shell
-  - type: markdown
-    attributes:
-      value: |
-        ## Logs
-  - type: textarea
-    id: logs
-    attributes:
-      label: Logs
-      description: |
-        Please paste your logs here if applicable.
-      placeholder: Paste logs…
-  - type: textarea
-    id: logs-ffmpeg
-    attributes:
-      label: FFmpeg logs
-      description: |
-        Please paste your FFmpeg logs here if available. You can find these in your servers dashboard under "logs".
-      placeholder: Paste logs…
-      render: shell
-  - type: markdown
-    attributes:
-      value: |
-        ## Environment
-  - type: markdown
-    attributes:
-      value: |
-        ### Server
-        You will find these values in your Admin Dashboard
-  - type: input
-    id: server-version
-    attributes:
-      label: Server version
-      placeholder: 10.10.2
-    validations:
-      required: true
-  - type: input
-    id: web-version
-    attributes:
-      label: Web version
-      placeholder: 10.10.2
-    validations:
-      required: true
-  - type: input
-    id: build-version
-    attributes:
-      label: Build version
-      placeholder: 10.10.2
-    validations:
-      required: true
-  - type: markdown
-    attributes:
-      value: |
-        ### Client
-        Information about the device you are seeing the issue on
-  - type: input
-    id: platform
-    attributes:
-      label: Platform
-      description: Specify the operating system or device where the issue occurs. If relevant, include details like version or model.
-      placeholder: e.g. Linux, Windows, iPhone, Tizen
-    validations:
-      required: true
-  - type: input
-    id: browser
-    attributes:
-      label: Browser
-      description: Indicate which browser you're using when encountering the issue. If possible, mention the browser version as well.
-      placeholder: e.g. Firefox, Chrome, Safari
-    validations:
-      required: true
-  - type: markdown
-    attributes:
-      value: |
-        ## Additional
-  - type: textarea
-    attributes:
-      label: Additional information
-      description: Include any relevant details, resources, or screenshots that might help in understanding or implementing the request.
-      placeholder: Add any additional context here.
-    validations:
-      required: false

.github/ISSUE_TEMPLATE/bug_report.md

@@ -0,0 +1,35 @@
+---
+name: Bug report
+about: Create a bug report
+title: ''
+labels: bug
+assignees: ''
+
+---
+
+**Describe the bug**
+<!-- A clear and concise description of what the bug is. -->
+
+**To Reproduce**
+<!-- Steps to reproduce the behavior: -->
+1. Go to '...'
+2. Click on '....'
+3. Scroll down to '....'
+4. See error
+
+**Expected behavior**
+<!-- A clear and concise description of what you expected to happen. -->
+
+**Logs**
+<!-- Please paste any log errors. -->
+
+**Screenshots**
+<!-- If applicable, add screenshots to help explain your problem. -->
+
+**System (please complete the following information):**
+ - OS: [e.g. Docker, Debian, Windows]
+ - Browser: [e.g. Firefox, Chrome, Safari]
+ - Jellyfin Version: [e.g. 10.0.1]
+
+**Additional context**
+<!-- Add any other context about the problem here. -->

.github/ISSUE_TEMPLATE/config.yml

@@ -1,8 +0,0 @@
-blank_issues_enabled: false
-contact_links:
-  - name: Feature Request
-    url: https://features.jellyfin.org/
-    about: Please head over to our feature request hub to vote on or submit a feature.
-  - name: Help Or Question
-    url: https://matrix.to/#/#jellyfin-troubleshooting:matrix.org
-    about: Please join the troubleshooting Matrix channel to get some help.

.github/SUPPORT.md

@@ -1,24 +0,0 @@
-# Support
-
-Jellyfin contributors have limited availability to address general support
-questions. Please make sure you are using the latest version of Jellyfin.
-
-When looking for support or information, please first search for your
-question in these venues:
-
-* [Jellyfin Forum](https://forum.jellyfin.org)
-* [Jellyfin Documentation](https://jellyfin.org/docs/)
-* [Open or **closed** issues in the organization](https://github.com/issues?q=sort%3Aupdated-desc+org%3Ajellyfin+is%3Aissue+)
-
-If you didn't find an answer in the resources above, contributors and other
-users are reachable through the following channels:
-
-* #jellyfin on [Matrix](https://matrix.to/#/#jellyfin:matrix.org%22) or [IRC](ircs://irc.libera.chat:6697/#jellyfin)
-* #jellyfin-troubleshooting on [Matrix](https://matrix.to/#/#jellyfin-troubleshooting:matrix.org) or [IRC](ircs://irc.libera.chat:6697/#jellyfin-troubleshooting)
-* [/r/jellyfin on Reddit](https://www.reddit.com/r/jellyfin)
-
-GitHub issues are for tracking enhancements and bugs, not general support.
-
-The open source license grants you the freedom to use Jellyfin.
-It does not guarantee commitments of other people's time.
-Please be respectful and manage your expectations.

.github/pull_request_template.md

@@ -1,6 +1,6 @@
 <!--
 Ensure your title is short, descriptive, and in the imperative mood (Fix X, Change Y, instead of Fixed X, Changed Y).
-For a good inspiration of what to write in commit messages and PRs please review https://chris.beams.io/posts/git-commit/ and our https://jellyfin.org/docs/general/contributing/issues page.
+For a good inspiration of what to write in commit messages and PRs please review https://chris.beams.io/posts/git-commit/ and our https://docs.jellyfin.org/general/contributing/issues.html page.
 -->
 
 **Changes**

.github/renovate.json

@@ -1,28 +0,0 @@
-{
-  "$schema": "https://docs.renovatebot.com/renovate-schema.json",
-  "extends": [
-    "github>jellyfin/.github//renovate-presets/nodejs",
-    ":dependencyDashboard"
-  ],
-  "lockFileMaintenance": {
-    "enabled": false
-  },
-  "packageRules": [
-    {
-      "matchPackageNames": [ "@jellyfin/sdk" ],
-      "followTag": "unstable",
-      "minimumReleaseAge": null,
-      "prPriority": 5,
-      "schedule": [ "after 7:00 am" ]
-    },
-    {
-      "matchPackageNames": [ "dompurify" ],
-      "matchUpdateTypes": [ "major" ],
-      "enabled": false
-    },
-    {
-      "matchPackageNames": [ "hls.js" ],
-      "prPriority": 5
-    }
-  ]
-}

.github/stale.yml

@@ -0,0 +1,20 @@
+# Number of days of inactivity before an issue becomes stale
+daysUntilStale: 90
+# Number of days of inactivity before a stale issue is closed
+daysUntilClose: 14
+# Issues with these labels will never be considered stale
+exemptLabels:
+  - regression
+  - future
+  - feature
+  - enhancement
+  - confirmed
+# Label to use when marking an issue as stale
+staleLabel: stale
+# Comment to post when marking an issue as stale. Set to `false` to disable
+markComment: >
+  Issues go stale after 90d of inactivity. Mark the issue as fresh by adding a comment or commit. Stale issues close after an additional 14d of inactivity.
+  If this issue is safe to close now please do so.
+  If you have any questions you can reach us on [Matrix or Social Media](https://docs.jellyfin.org/general/getting-help.html).
+# Comment to post when closing a stale issue. Set to `false` to disable
+closeComment: false

.github/workflows/__automation.yml

@@ -1,15 +0,0 @@
-name: Automation 🎛️
-
-on:
-  workflow_call:
-
-jobs:
-  conflicts:
-    name: Merge conflict labeling 🏷️
-    runs-on: ubuntu-latest
-    steps:
-      - uses: eps1lon/actions-label-merge-conflict@1df065ebe6e3310545d4f4c4e862e43bdca146f0 # v3.0.3
-        with:
-          dirtyLabel: 'merge conflict'
-          commentOnDirty: 'This pull request has merge conflicts. Please resolve the conflicts so the PR can be successfully reviewed and merged.'
-          repoToken: ${{ secrets.JF_BOT_TOKEN }}

.github/workflows/__codeql.yml

@@ -1,40 +0,0 @@
-name: GitHub CodeQL 🔬
-
-on:
-  workflow_call:
-    inputs:
-      commit:
-        required: true
-        type: string
-
-jobs:
-  analyze:
-    name: Analyze ${{ matrix.language }} 🔬
-    runs-on: ubuntu-latest
-
-    strategy:
-      fail-fast: false
-      matrix:
-        language:
-          - javascript-typescript
-
-    steps:
-      - name: Checkout repository ⬇️
-        uses: actions/checkout@34e114876b0b11c390a56381ad16ebd13914f8d5 # v4.3.1
-        with:
-          ref: ${{ inputs.commit }}
-          show-progress: false
-
-      - name: Initialize CodeQL 🛠️
-        uses: github/codeql-action/init@c3d42c5d08633d8b33635fbd94b000a0e2585b3c # v3.31.4
-        with:
-          queries: security-and-quality
-          languages: ${{ matrix.language }}
-
-      - name: Autobuild 📦
-        uses: github/codeql-action/autobuild@c3d42c5d08633d8b33635fbd94b000a0e2585b3c # v3.31.4
-
-      - name: Perform CodeQL Analysis 🧪
-        uses: github/codeql-action/analyze@c3d42c5d08633d8b33635fbd94b000a0e2585b3c # v3.31.4
-        with:
-          category: '/language:${{matrix.language}}'

.github/workflows/__deploy.yml

@@ -1,59 +0,0 @@
-name: Deploy 🏗️
-
-on:
-  workflow_call:
-    inputs:
-      branch:
-        required: true
-        type: string
-      commit:
-        required: false
-        type: string
-      comment:
-        required: false
-        type: boolean
-      artifact_name:
-        required: false
-        type: string
-        default: frontend
-
-jobs:
-  cf-pages:
-    name: CloudFlare Pages 📃
-    runs-on: ubuntu-latest
-    environment: 
-      name: ${{ inputs.branch == 'master' && 'Production' || 'Preview' }}
-      url: ${{ steps.cf.outputs.deployment-url }}
-    outputs:
-      url: ${{ steps.cf.outputs.deployment-url }}
-
-    steps:
-      - name: Download workflow artifact ⬇️
-        uses: actions/download-artifact@d3f86a106a0bac45b974a628896c90dbdf5c8093 # v4.3.0
-        with:
-          name: ${{ inputs.artifact_name }}
-          path: dist
-
-      - name: Publish to Cloudflare Pages 📃
-        uses: cloudflare/wrangler-action@da0e0dfe58b7a431659754fdf3f186c529afbe65 # v3.14.1
-        id: cf
-        with:
-          apiToken: ${{ secrets.CLOUDFLARE_API_TOKEN }}
-          accountId: ${{ secrets.CLOUDFLARE_ACCOUNT_ID }}
-          command: pages deploy dist --project-name=jellyfin-web --branch=${{ inputs.branch }}
-
-  compose-comment:
-    name: Compose and push comment 📝
-    # Always run so the comment is composed for the workflow summary
-    if: ${{ always() }}
-    uses: ./.github/workflows/__job_messages.yml
-    secrets: inherit
-    needs:
-      - cf-pages
-
-    with:
-      branch: ${{ inputs.branch }}
-      commit: ${{ inputs.commit }}
-      preview_url: ${{ needs.cf-pages.outputs.url }}
-      in_progress: false
-      comment: ${{ inputs.comment }}

.github/workflows/__job_messages.yml

@@ -1,65 +0,0 @@
-name: Job messages ⚙️
-
-on:
-  workflow_call:
-    inputs:
-      branch:
-        required: false
-        type: string
-      commit:
-        required: true
-        type: string
-      preview_url:
-        required: false
-        type: string
-      in_progress:
-        required: true
-        type: boolean
-      comment:
-        required: false
-        type: boolean
-      marker:
-        description: Hidden marker to detect PR comments composed by the bot
-        required: false
-        type: string
-        default: "CFPages-deployment"
-
-
-jobs:
-  cf_pages_msg:
-    name: CloudFlare Pages deployment 📃🚀
-    runs-on: ubuntu-latest
-
-    steps:
-      - name: Compose message 📃
-        if: ${{ always() }}
-        id: compose
-        env:
-          COMMIT: ${{ inputs.commit }}
-          PREVIEW_URL: ${{ inputs.preview_url != '' && (inputs.branch != 'master' && inputs.preview_url || format('https://jellyfin-web.pages.dev ({0})', inputs.preview_url)) || 'Not available' }}
-          DEPLOY_STATUS: ${{ inputs.in_progress && '🔄 Deploying...' || (inputs.preview_url != '' && '✅ Deployed!' || '❌ Failure. Check workflow logs for details') }}
-          DEPLOYMENT_TYPE: ${{ inputs.branch != 'master' && '🔀 Preview' || '⚙️ Production' }}
-          WORKFLOW_RUN: ${{ !inputs.in_progress && format('**[View build logs](https://github.com/{0}/actions/runs/{1})**', github.repository, github.run_id) || '' }}
-        # EOF is needed for multiline environment variables in a GitHub Actions context
-        run: |
-          echo "## Cloudflare Pages deployment" > $GITHUB_STEP_SUMMARY
-          echo "" >> $GITHUB_STEP_SUMMARY
-          echo "| **Latest commit**       	| <code>${COMMIT::7}</code>     |" >> $GITHUB_STEP_SUMMARY
-          echo "|-------------------------	|:----------------------------:	|" >> $GITHUB_STEP_SUMMARY
-          echo "| **Status**              	| $DEPLOY_STATUS                |" >> $GITHUB_STEP_SUMMARY
-          echo "| **Preview URL**         	| $PREVIEW_URL                  |" >> $GITHUB_STEP_SUMMARY
-          echo "| **Type**         	        | $DEPLOYMENT_TYPE              |" >> $GITHUB_STEP_SUMMARY
-          echo "" >> $GITHUB_STEP_SUMMARY
-          echo "$WORKFLOW_RUN" >> $GITHUB_STEP_SUMMARY
-          COMPOSED_MSG=$(cat $GITHUB_STEP_SUMMARY)
-          echo "msg<<EOF" >> $GITHUB_ENV
-          echo "$COMPOSED_MSG" >> $GITHUB_ENV
-          echo "EOF" >> $GITHUB_ENV
-
-      - name: Push comment to Pull Request 🔼
-        uses: thollander/actions-comment-pull-request@24bffb9b452ba05a4f3f77933840a6a841d1b32b # v3.0.1
-        if: ${{ inputs.comment && steps.compose.conclusion == 'success' }}
-        with:
-          github-token: ${{ secrets.JF_BOT_TOKEN }}
-          message: ${{ env.msg }}
-          comment-tag: ${{ inputs.marker }}

.github/workflows/__package.yml

@@ -1,45 +0,0 @@
-name: Packaging 📦
-
-on:
-  workflow_call:
-    inputs:
-      commit:
-        required: false
-        type: string
-
-jobs:
-  run-build-prod:
-    name: Run production build 🏗️
-    runs-on: ubuntu-latest
-
-    steps:
-      - name: Check out Git repository
-        uses: actions/checkout@34e114876b0b11c390a56381ad16ebd13914f8d5 # v4.3.1
-        with:
-          ref: ${{ inputs.commit || github.sha }}
-
-      - name: Setup node environment
-        uses: actions/setup-node@49933ea5288caeca8642d1e84afbd3f7d6820020 # v4.4.0
-        with:
-          node-version: 20
-          cache: npm
-          check-latest: true
-
-      - name: Install Node.js dependencies
-        run: npm ci --no-audit
-
-      - name: Run a production build
-        env:
-          JELLYFIN_VERSION: ${{ inputs.commit || github.sha }}
-        run: npm run build:production
-
-      - name: Update config.json for testing
-        run: |
-          jq '.multiserver=true | .servers=["https://demo.jellyfin.org/unstable"]' dist/config.json > dist/config.tmp.json
-          mv dist/config.tmp.json dist/config.json
-
-      - name: Upload artifact
-        uses: actions/upload-artifact@ea165f8d65b6e75b540449e92b4886f43607fa02 # v4.6.2
-        with:
-          name: frontend
-          path: dist

.github/workflows/__quality_checks.yml

@@ -1,61 +0,0 @@
-name: Quality checks 👌🧪
-
-on:
-  workflow_call:
-    inputs:
-      commit:
-        required: true
-        type: string
-  workflow_dispatch:
-
-jobs:
-  dependency-review:
-    name: Vulnerable dependencies 🔎
-    runs-on: ubuntu-latest
-    steps:
-      - name: Checkout Repository
-        uses: actions/checkout@34e114876b0b11c390a56381ad16ebd13914f8d5 # v4.3.1
-        with:
-          ref: ${{ inputs.commit }}
-          show-progress: false
-
-      - name: Scan
-        uses: actions/dependency-review-action@3c4e3dcb1aa7874d2c16be7d79418e9b7efd6261 # v4.8.2
-        with:
-          ## Workaround from https://github.com/actions/dependency-review-action/issues/456
-          ## TODO: Remove when necessary
-          base-ref: ${{ github.event.pull_request.base.sha || 'master' }}
-          head-ref: ${{ github.event.pull_request.head.sha || github.ref }}
-
-  quality:
-    name: Run ${{ matrix.command }} 🕵️‍♂️
-    runs-on: ubuntu-latest
-    strategy:
-      fail-fast: false
-      matrix:
-        command:
-          - build:es-check
-          - lint
-          - stylelint
-          - build:check
-          - test
-
-    steps:
-      - name: Checkout ⬇️
-        uses: actions/checkout@34e114876b0b11c390a56381ad16ebd13914f8d5 # v4.3.1
-        with:
-          ref: ${{ inputs.commit }}
-          show-progress: false
-
-      - name: Setup node environment ⚙️
-        uses: actions/setup-node@49933ea5288caeca8642d1e84afbd3f7d6820020 # v4.4.0
-        with:
-          node-version: 20
-          cache: npm
-          check-latest: true
-
-      - name: Install dependencies 📦
-        run: npm ci --no-audit
-
-      - name: Run ${{ matrix.command }} ⚙️
-        run: npm run ${{ matrix.command }}

.github/workflows/pull_request.yml

@@ -1,100 +0,0 @@
-name: Pull Request 📥
-
-concurrency:
-  group: ${{ github.workflow }}-${{ github.event.pull_request.number || github.run_id }}
-  cancel-in-progress: true
-
-on:
-  pull_request_target:
-    branches:
-      - master
-      - release*
-    paths-ignore:
-      - '**/*.md'
-  merge_group:
-
-jobs:
-  push-comment:
-    name: Create comments ✍️
-    if: ${{ always() && !cancelled() && github.repository == 'jellyfin/jellyfin-web' }}
-    uses: ./.github/workflows/__job_messages.yml
-    secrets: inherit
-    with:
-      commit: ${{ github.event.pull_request.head.sha }}
-      in_progress: true
-      comment: true
-
-  build:
-    name: Build 🏗️
-    if: ${{ always() && !cancelled() }}
-    uses: ./.github/workflows/__package.yml
-    with:
-      commit: ${{ github.event.pull_request.head.sha }}
-
-  automation:
-    name: Automation 🎛️
-    if: ${{ github.repository == 'jellyfin/jellyfin-web' }}
-    uses: ./.github/workflows/__automation.yml
-    secrets: inherit
-
-  quality_checks:
-    name: Quality checks 👌🧪
-    if: ${{ always() && !cancelled() }}
-    uses: ./.github/workflows/__quality_checks.yml
-    permissions: {}
-    with:
-      commit: ${{ github.event.pull_request.head.sha }}
-
-  codeql:
-    name: GitHub CodeQL 🔬
-    if: ${{ always() && !cancelled() }}
-    uses: ./.github/workflows/__codeql.yml
-    permissions:
-      actions: read
-      contents: read
-      security-events: write
-    with:
-      commit: ${{ github.event.pull_request.head.sha }}
-
-  deploy:
-    name: Deploy 🚀
-    uses: ./.github/workflows/__deploy.yml
-    if: ${{ always() && !cancelled() && needs.build.result == 'success' && github.repository == 'jellyfin/jellyfin-web' }}
-    needs:
-      - push-comment
-      - build
-    permissions:
-      contents: read
-      deployments: write
-    secrets: inherit
-    with:
-      # If the PR is from the master branch of a fork, append the fork's name to the branch name
-      branch: ${{ github.event.pull_request.head.repo.full_name != github.repository && github.event.pull_request.head.ref == 'master' && format('{0}/{1}', github.event.pull_request.head.repo.full_name, github.event.pull_request.head.ref) || github.event.pull_request.head.ref }}
-      comment: true
-      commit: ${{ github.event.pull_request.head.sha }}
-
-  run-eslint:
-    name: Run eslint suggestions
-    if: ${{ github.repository == 'jellyfin/jellyfin-web' }}
-    runs-on: ubuntu-latest
-    
-    steps:
-      - name: Check out Git repository
-        uses: actions/checkout@34e114876b0b11c390a56381ad16ebd13914f8d5 # v4.3.1
-        with:
-          ref: ${{ github.event.pull_request.head.sha }}
-    
-      - name: Setup node environment
-        uses: actions/setup-node@49933ea5288caeca8642d1e84afbd3f7d6820020 # v4.4.0
-        with:
-          node-version: 20
-          cache: npm
-          check-latest: true 
-    
-      - name: Install Node.js dependencies
-        run: npm ci --no-audit
-    
-      - name: Run eslint
-        uses: CatChen/eslint-suggestion-action@4ee415529307a8ca0260b4a3775484802523e5af # v4.1.19
-        with:
-          github-token: ${{ secrets.GITHUB_TOKEN }}

.github/workflows/push.yml

@@ -1,58 +0,0 @@
-name: Push & Release 🌍
-
-concurrency:
-  group: ${{ github.workflow }}-${{ github.event_name == 'push' && github.ref }}
-  cancel-in-progress: true
-
-on:
-  push:
-    branches:
-      - master
-      - release*
-    paths-ignore:
-      - '**/*.md'
-
-jobs:
-  automation:
-    name: Automation 🎛️
-    if: ${{ github.repository == 'jellyfin/jellyfin-web' }}
-    uses: ./.github/workflows/__automation.yml
-    secrets: inherit
-
-  main:
-    name: 'Unstable release 🚀⚠️'
-    uses: ./.github/workflows/__package.yml
-    with:
-      commit: ${{ github.sha }}
-
-  quality_checks:
-    name: Quality checks 👌🧪
-    if: ${{ always() && !cancelled() }}
-    uses: ./.github/workflows/__quality_checks.yml
-    permissions: {}
-    with:
-      commit: ${{ github.sha }}
-
-  codeql:
-    name: GitHub CodeQL 🔬
-    uses: ./.github/workflows/__codeql.yml
-    permissions:
-      actions: read
-      contents: read
-      security-events: write
-    with:
-      commit: ${{ github.sha }}
-
-  deploy:
-    name: Deploy 🚀
-    if: ${{ github.repository == 'jellyfin/jellyfin-web' }}
-    uses: ./.github/workflows/__deploy.yml
-    needs:
-      - main
-    permissions:
-      contents: read
-      deployments: write
-    secrets: inherit
-    with:
-      branch: ${{ github.ref_name }}
-      comment: false

.github/workflows/schedule.yml

@@ -1,38 +0,0 @@
-name: Scheduled tasks 🕑
-
-on:
-  schedule:
-    - cron: '30 1 * * *'
-  workflow_dispatch:
-permissions:
-  issues: write
-  pull-requests: write
-
-jobs:
-  issues:
-    name: Check stale issues and PRs
-    runs-on: ubuntu-latest
-    if: ${{ contains(github.repository, 'jellyfin/') }}
-    steps:
-      - uses: actions/stale@5bef64f19d7facfb25b37b414482c7164d639639 # v9.1.0
-        with:
-          repo-token: ${{ secrets.JF_BOT_TOKEN }}
-          operations-per-run: 75
-          # Issues receive a stale warning after 120 days and close after an additional 21 days
-          days-before-stale: 120
-          days-before-close: 21
-          exempt-issue-labels: regression,security,roadmap,future,feature,enhancement,confirmed
-          stale-issue-label: stale
-          stale-issue-message: |-
-            This issue has gone 120 days without comment. To avoid abandoned issues, it will be closed in 21 days if there are no new comments.
-
-            If you're the original submitter of this issue, please comment confirming if this issue still affects you in the latest release or master branch, or close the issue if it has been fixed. If you're another user also affected by this bug, please comment confirming so. Either action will remove the stale label.
-
-            This bot exists to prevent issues from becoming stale and forgotten. Jellyfin is always moving forward, and bugs are often fixed as side effects of other changes. We therefore ask that bug report authors remain vigilant about their issues to ensure they are closed if fixed, or re-confirmed - perhaps with fresh logs or reproduction examples - regularly. If you have any questions you can reach us on [Matrix or Social Media](https://jellyfin.org/contact).
-          # PRs are closed after having unresolved merge conflicts for 90 days
-          days-before-pr-stale: 0
-          days-before-pr-close: 90
-          only-pr-labels: merge conflict
-          stale-pr-label: stale
-          close-pr-message: |-
-            This PR has been closed due to having unresolved merge conflicts.

.gitignore

@@ -3,21 +3,9 @@ dist
 web
 node_modules
 
-# test coverage
-coverage
-
-# config
-config.json
-
 # ide
 .idea
-.vs
+.vscode
 
-# vim
-*.sw?
-
-# direnv
-.direnv/
-
-# environment related
-.envrc
+# log
+yarn-error.log

.npmrc

@@ -1,3 +0,0 @@
-engine-strict=true
-fund=false
-save-exact=true

.nvmrc

@@ -1 +0,0 @@
-20

.sonarcloud.properties

@@ -1,3 +0,0 @@
-# Exclude test files from Sonar sources
-# See: https://docs.sonarcloud.io/advanced-setup/analysis-scope/#file-exclusion-and-inclusion
-sonar.exclusions=src/**/*.test.js,src/**/*.test.ts

.stylelintrc

@@ -0,0 +1,143 @@
+{
+  "plugins": [
+		"stylelint-no-browser-hacks/lib",
+	],
+  "rules": {
+    "at-rule-empty-line-before": [ "always", {
+      except: [
+        "blockless-after-same-name-blockless",
+        "first-nested",
+      ],
+      ignore: ["after-comment"],
+    } ],
+    "at-rule-name-case": "lower",
+    "at-rule-name-space-after": "always-single-line",
+    "at-rule-no-unknown": true,
+    "at-rule-semicolon-newline-after": "always",
+    "block-closing-brace-empty-line-before": "never",
+    "block-closing-brace-newline-after": "always",
+    "block-closing-brace-newline-before": "always-multi-line",
+    "block-closing-brace-space-before": "always-single-line",
+    "block-no-empty": true,
+    "block-opening-brace-newline-after": "always-multi-line",
+    "block-opening-brace-space-after": "always-single-line",
+    "block-opening-brace-space-before": "always",
+    "color-hex-case": "lower",
+    "color-hex-length": "short",
+    "color-no-invalid-hex": true,
+    "comment-empty-line-before": [ "always", {
+      except: ["first-nested"],
+      ignore: ["stylelint-commands"],
+    } ],
+    "comment-no-empty": true,
+    "comment-whitespace-inside": "always",
+    "custom-property-empty-line-before": [ "always", {
+      except: [
+        "after-custom-property",
+        "first-nested",
+      ],
+      ignore: [
+        "after-comment",
+        "inside-single-line-block",
+      ],
+    } ],
+    "declaration-bang-space-after": "never",
+    "declaration-bang-space-before": "always",
+    "declaration-block-no-duplicate-properties": [
+      true,
+      {
+        ignore: ["consecutive-duplicates-with-different-values"]
+      }
+    ],
+    "declaration-block-no-shorthand-property-overrides": true,
+    "declaration-block-semicolon-newline-after": "always-multi-line",
+    "declaration-block-semicolon-space-after": "always-single-line",
+    "declaration-block-semicolon-space-before": "never",
+    "declaration-block-single-line-max-declarations": 1,
+    "declaration-block-trailing-semicolon": "always",
+    "declaration-colon-newline-after": "always-multi-line",
+    "declaration-colon-space-after": "always-single-line",
+    "declaration-colon-space-before": "never",
+    "font-family-no-duplicate-names": true,
+    "function-calc-no-invalid": true,
+    "function-calc-no-unspaced-operator": true,
+    "function-comma-newline-after": "always-multi-line",
+    "function-comma-space-after": "always-single-line",
+    "function-comma-space-before": "never",
+    "function-linear-gradient-no-nonstandard-direction": true,
+    "function-max-empty-lines": 0,
+    "function-name-case": "lower",
+    "function-parentheses-newline-inside": "always-multi-line",
+    "function-parentheses-space-inside": "never-single-line",
+    "function-whitespace-after": "always",
+    "indentation": 4,
+    "keyframe-declaration-no-important": true,
+    "length-zero-no-unit": true,
+    "max-empty-lines": 1,
+    "media-feature-colon-space-after": "always",
+    "media-feature-colon-space-before": "never",
+    "media-feature-name-case": "lower",
+    "media-feature-name-no-unknown": true,
+    "media-feature-parentheses-space-inside": "never",
+    "media-feature-range-operator-space-after": "always",
+    "media-feature-range-operator-space-before": "always",
+    "media-query-list-comma-newline-after": "always-multi-line",
+    "media-query-list-comma-space-after": "always-single-line",
+    "media-query-list-comma-space-before": "never",
+    "no-descending-specificity": true,
+    "no-duplicate-at-import-rules": true,
+    "no-duplicate-selectors": true,
+    "no-empty-source": true,
+    "no-eol-whitespace": true,
+    "no-extra-semicolons": true,
+    "no-invalid-double-slash-comments": true,
+    "no-missing-end-of-source-newline": true,
+    "number-leading-zero": "always",
+    "number-no-trailing-zeros": true,
+    "plugin/no-browser-hacks": true,
+    "property-case": "lower",
+    "property-no-unknown": [
+      true,
+      {
+        "ignoreProperties": [
+          "user-drag"
+        ]
+      }
+    ],
+    "rule-empty-line-before": [ "always-multi-line", {
+      except: ["first-nested"],
+      ignore: ["after-comment"],
+    } ],
+    "selector-attribute-brackets-space-inside": "never",
+    "selector-attribute-operator-space-after": "never",
+    "selector-attribute-operator-space-before": "never",
+    "selector-combinator-space-after": "always",
+    "selector-combinator-space-before": "always",
+    "selector-descendant-combinator-no-non-space": true,
+    "selector-list-comma-newline-after": "always",
+    "selector-list-comma-space-before": "never",
+    "selector-max-empty-lines": 0,
+    "selector-pseudo-class-case": "lower",
+    "selector-pseudo-class-no-unknown": true,
+    "selector-pseudo-class-parentheses-space-inside": "never",
+    "selector-pseudo-element-case": "lower",
+    "selector-pseudo-element-colon-notation": "double",
+    "selector-pseudo-element-no-unknown": [
+      true,
+      {
+        "ignorePseudoElements": [
+          "cue"
+        ]
+      }
+    ],
+    "selector-type-case": "lower",
+    "selector-type-no-unknown": true,
+    "string-no-newline": true,
+    "unit-case": "lower",
+    "unit-no-unknown": true,
+    "value-list-comma-newline-after": "always-multi-line",
+    "value-list-comma-space-after": "always-single-line",
+    "value-list-comma-space-before": "never",
+    "value-list-max-empty-lines": 0,
+  }
+}

.stylelintrc.json

@@ -1,163 +0,0 @@
-{
-  "plugins": [
-    "@stylistic/stylelint-plugin",
-    "stylelint-no-browser-hacks/lib"
-  ],
-  "rules": {
-    "at-rule-empty-line-before": [ "always", {
-      "except": [
-        "blockless-after-same-name-blockless",
-        "first-nested"
-      ],
-      "ignore": ["after-comment"]
-    } ],
-    "@stylistic/at-rule-name-case": "lower",
-    "@stylistic/at-rule-name-space-after": "always-single-line",
-    "at-rule-no-unknown": true,
-    "at-rule-no-vendor-prefix": true,
-    "@stylistic/at-rule-semicolon-newline-after": "always",
-    "@stylistic/block-closing-brace-empty-line-before": "never",
-    "@stylistic/block-closing-brace-newline-after": "always",
-    "@stylistic/block-closing-brace-newline-before": "always-multi-line",
-    "@stylistic/block-closing-brace-space-before": "always-single-line",
-    "block-no-empty": true,
-    "@stylistic/block-opening-brace-newline-after": "always-multi-line",
-    "@stylistic/block-opening-brace-space-after": "always-single-line",
-    "@stylistic/block-opening-brace-space-before": "always",
-    "@stylistic/color-hex-case": "lower",
-    "color-hex-length": "short",
-    "color-no-invalid-hex": true,
-    "comment-empty-line-before": [ "always", {
-      "except": ["first-nested"],
-      "ignore": ["stylelint-commands"]
-    } ],
-    "comment-no-empty": true,
-    "comment-whitespace-inside": "always",
-    "custom-property-empty-line-before": [ "always", {
-      "except": [
-        "after-custom-property",
-        "first-nested"
-      ],
-      "ignore": [
-        "after-comment",
-        "inside-single-line-block"
-      ]
-    } ],
-    "@stylistic/declaration-bang-space-after": "never",
-    "@stylistic/declaration-bang-space-before": "always",
-    "declaration-block-no-duplicate-properties": [
-      true,
-      {
-        "ignore": ["consecutive-duplicates-with-different-values"]
-      }
-    ],
-    "declaration-block-no-shorthand-property-overrides": true,
-    "@stylistic/declaration-block-semicolon-newline-after": "always-multi-line",
-    "@stylistic/declaration-block-semicolon-space-after": "always-single-line",
-    "@stylistic/declaration-block-semicolon-space-before": "never",
-    "declaration-block-single-line-max-declarations": 1,
-    "@stylistic/declaration-block-trailing-semicolon": "always",
-    "@stylistic/declaration-colon-newline-after": "always-multi-line",
-    "@stylistic/declaration-colon-space-after": "always-single-line",
-    "@stylistic/declaration-colon-space-before": "never",
-    "font-family-no-duplicate-names": true,
-    "function-calc-no-unspaced-operator": true,
-    "@stylistic/function-comma-newline-after": "always-multi-line",
-    "@stylistic/function-comma-space-after": "always-single-line",
-    "@stylistic/function-comma-space-before": "never",
-    "function-linear-gradient-no-nonstandard-direction": true,
-    "@stylistic/function-max-empty-lines": 0,
-    "function-name-case": "lower",
-    "@stylistic/function-parentheses-newline-inside": "always-multi-line",
-    "@stylistic/function-parentheses-space-inside": "never-single-line",
-    "@stylistic/function-whitespace-after": "always",
-    "@stylistic/indentation": 4,
-    "keyframe-declaration-no-important": true,
-    "length-zero-no-unit": true,
-    "@stylistic/max-empty-lines": 1,
-    "@stylistic/media-feature-colon-space-after": "always",
-    "@stylistic/media-feature-colon-space-before": "never",
-    "@stylistic/media-feature-name-case": "lower",
-    "media-feature-name-no-unknown": true,
-    "media-feature-name-no-vendor-prefix": true,
-    "@stylistic/media-feature-parentheses-space-inside": "never",
-    "@stylistic/media-feature-range-operator-space-after": "always",
-    "@stylistic/media-feature-range-operator-space-before": "always",
-    "@stylistic/media-query-list-comma-newline-after": "always-multi-line",
-    "@stylistic/media-query-list-comma-space-after": "always-single-line",
-    "@stylistic/media-query-list-comma-space-before": "never",
-    "no-descending-specificity": true,
-    "no-duplicate-at-import-rules": true,
-    "no-duplicate-selectors": true,
-    "no-empty-source": true,
-    "@stylistic/no-eol-whitespace": true,
-    "@stylistic/no-extra-semicolons": true,
-    "no-invalid-double-slash-comments": true,
-    "@stylistic/no-missing-end-of-source-newline": true,
-    "@stylistic/number-leading-zero": "always",
-    "@stylistic/number-no-trailing-zeros": true,
-    "plugin/no-browser-hacks": true,
-    "@stylistic/property-case": "lower",
-    "property-no-unknown": [
-      true,
-      {
-        "ignoreProperties": [
-          "user-drag"
-        ]
-      }
-    ],
-    "property-no-vendor-prefix": true,
-    "rule-empty-line-before": [ "always-multi-line", {
-      "except": ["first-nested"],
-      "ignore": ["after-comment"]
-    } ],
-    "@stylistic/selector-attribute-brackets-space-inside": "never",
-    "@stylistic/selector-attribute-operator-space-after": "never",
-    "@stylistic/selector-attribute-operator-space-before": "never",
-    "@stylistic/selector-combinator-space-after": "always",
-    "@stylistic/selector-combinator-space-before": "always",
-    "@stylistic/selector-descendant-combinator-no-non-space": true,
-    "@stylistic/selector-list-comma-newline-after": "always",
-    "@stylistic/selector-list-comma-space-before": "never",
-    "@stylistic/selector-max-empty-lines": 0,
-    "selector-no-vendor-prefix": true,
-    "@stylistic/selector-pseudo-class-case": "lower",
-    "selector-pseudo-class-no-unknown": true,
-    "@stylistic/selector-pseudo-class-parentheses-space-inside": "never",
-    "@stylistic/selector-pseudo-element-case": "lower",
-    "selector-pseudo-element-colon-notation": "double",
-    "selector-pseudo-element-no-unknown": [
-      true,
-      {
-        "ignorePseudoElements": [
-          "cue"
-        ]
-      }
-    ],
-    "selector-type-case": "lower",
-    "selector-type-no-unknown": true,
-    "string-no-newline": true,
-    "@stylistic/unit-case": "lower",
-    "unit-no-unknown": true,
-    "value-no-vendor-prefix": true,
-    "@stylistic/value-list-comma-newline-after": "always-multi-line",
-    "@stylistic/value-list-comma-space-after": "always-single-line",
-    "@stylistic/value-list-comma-space-before": "never",
-    "@stylistic/value-list-max-empty-lines": 0
-  },
-  "overrides": [
-    {
-      "files": [
-        "*.scss",
-        "**/*.scss"
-      ],
-      "customSyntax": "postcss-scss",
-      "plugins": [ "stylelint-scss" ],
-      "rules": {
-        "at-rule-no-unknown": null,
-        "scss/at-rule-no-unknown": true,
-        "plugin/no-browser-hacks": null
-      }
-    }
-  ]
-}

.vscode/extensions.json

@@ -1,5 +0,0 @@
-{
-  "recommendations": [
-    "dbaeumer.vscode-eslint"
-  ]
-}

.vscode/settings.json

@@ -1,10 +0,0 @@
-{
-  "[json][typescript][typescriptreact][javascript]": {
-    "editor.defaultFormatter": "dbaeumer.vscode-eslint"
-  },
-  "editor.codeActionsOnSave": {
-    "source.fixAll.eslint": "explicit"
-  },
-  "eslint.format.enable": true,
-  "editor.formatOnSave": false
-}

CONTRIBUTORS.md

@@ -1,173 +1,101 @@
 # Jellyfin Contributors
 
-- [JoshuaBoniface](https://github.com/joshuaboniface)
-- [nvllsvm](https://github.com/nvllsvm)
-- [JustAMan](https://github.com/JustAMan)
-- [dcrdev](https://github.com/dcrdev)
-- [EraYaN](https://github.com/EraYaN)
-- [flemse](https://github.com/flemse)
-- [bfayers](https://github.com/bfayers)
-- [Bond_009](https://github.com/Bond-009)
-- [AnthonyLavado](https://github.com/anthonylavado)
-- [dkanada](https://github.com/dkanada)
-- [sparky8251](https://github.com/sparky8251)
-- [LeoVerto](https://github.com/LeoVerto)
-- [cvium](https://github.com/cvium)
-- [grafixeyehero](https://github.com/grafixeyehero)
-- [Drago96](https://github.com/drago-96)
-- [ViXXoR](https://github.com/ViXXoR)
-- [nkmerrill](https://github.com/nkmerrill)
-- [TtheCreator](https://github.com/Tthecreator)
-- [RazeLighter777](https://github.com/RazeLighter777)
-- [LogicalPhallacy](https://github.com/LogicalPhallacy)
-- [thornbill](https://github.com/thornbill)
-- [redSpoutnik](https://github.com/redSpoutnik)
-- [DrPandemic](https://github.com/drpandemic)
-- [Oddstr13](https://github.com/oddstr13)
-- [petermcneil](https://github.com/petermcneil)
-- [lewazo](https://github.com/lewazo)
-- [Raghu Saxena](https://github.com/ckcr4lyf)
-- [Nickbert7](https://github.com/Nickbert7)
-- [ferferga](https://github.com/ferferga)
-- [bilde2910](https://github.com/bilde2910)
-- [Daniel Hartung](https://github.com/dhartung)
-- [Ryan Hartzell](https://github.com/ryan-hartzell)
-- [Thibault Nocchi](https://github.com/ThibaultNocchi)
-- [MrTimscampi](https://github.com/MrTimscampi)
-- [artiume](https://github.com/Artiume)
-- [ConfusedPolarBear](https://github.com/ConfusedPolarBear)
-- [Sarab Singh](https://github.com/sarab97)
-- [DesertCookie](https://github.com/desertcookie)
-- [GuilhermeHideki](https://github.com/GuilhermeHideki)
-- [Andrei Oanca](https://github.com/OancaAndrei)
-- [Cromefire_](https://github.com/cromefire)
-- [Orry Verducci](https://github.com/orryverducci)
-- [Camc314](https://github.com/camc314)
-- [danieladov](https://github.com/danieladov)
-- [Stephane Senart](https://github.com/ssenart)
-- [imchasingshadows](https://github.com/imchasingshadows)
-- [Ömer Erdinç Yağmurlu](https://github.com/omeryagmurlu)
-- [Keegan Dahm](https://github.com/keegandahm)
-- [GodTamIt](https://github.com/GodTamIt)
-- [MinecraftPlaye](https://github.com/MinecraftPlaye)
-- [Matthew Jones](https://github.com/matthew-jones-uk)
-- [taku0](https://github.com/taku0)
-- [Viperinius](https://github.com/Viperinius)
-- [is343](https://github.com/is343)
-- [Meet Pandya](https://github.com/meet-k-pandya)
-- [Peter Spenler](https://github.com/peterspenler)
-- [jomp16](https://github.com/jomp16)
-- [Leon de Klerk](https://github.com/leondeklerk)
-- [CrispyBaguette](https://github.com/CrispyBaguette)
-- [Vankerkom](https://github.com/vankerkom)
-- [edvwib](https://github.com/edvwib)
-- [Rob Farraher](https://github.com/farraherbg)
-- [TelepathicWalrus](https://github.com/TelepathicWalrus)
-- [Pier-Luc Ducharme](https://github.com/pl-ducharme)
-- [Anantharaju S](https://github.com/Anantharajus)
-- [Merlin Sievers](https://github.com/dann-merlin)
-- [Fishbigger](https://github.com/fishbigger)
-- [sleepycatcoding](https://github.com/sleepycatcoding)
-- [TheMelmacian](https://github.com/TheMelmacian)
-- [v0idMrK](https://github.com/v0idMrK)
-- [tehciolo](https://github.com/tehciolo)
-- [scampower3](https://github.com/scampower3)
-- [LittleBigOwI](https://github.com/LittleBigOwI/)
-- [Nate G](https://github.com/GGProGaming)
-- [Grady Hallenbeck](https://github.com/grhallenbeck)
-- [DinuD](https://github.com/DinuD)
-- [Kevin Tan (Valius)](https://github.com/valius)
-- [Rasmus Krämer](https://github.com/rasmuslos)
-- [ntarelix](https://github.com/ntarelix)
-- [btopherjohnson](https://github.com/btopherjohnson)
-- [András Maróy](https://github.com/andrasmaroy)
-- [Chris-Codes-It](https://github.com/Chris-Codes-It)
-- [Vedant](https://github.com/viktory36)
-- [GeorgeH005](https://github.com/GeorgeH005)
-- [JPUC1143](https://github.com/Jpuc1143)
-- [David Angel](https://github.com/davidangel)
-- [Pithaya](https://github.com/Pithaya)
-- [Peter Santos](https://github.com/prsantos-com)
-- [Chaitanya Shahare](https://github.com/Chaitanya-Shahare)
-- [Venkat Karasani](https://github.com/venkat-karasani)
-- [Connor Smith](https://github.com/ConnorS1110)
-- [iFraan](https://github.com/iFraan)
-- [Ali](https://github.com/bu3alwa)
-- [K. Kyle Puchkov](https://github.com/kepper104)
-- [ItsAllAboutTheCode](https://github.com/ItsAllAboutTheCode)
-- [Jxiced](https://github.com/Jxiced)
-- [Derek Huber](https://github.com/Derek4aty1)
-- [StableCrimson](https://github.com/StableCrimson)
-- [diegoeche](https://github.com/diegoeche)
-- [Free O'Toole](https://github.com/freeotoole)
-- [TheBosZ](https://github.com/thebosz)
-- [qm3jp](https://github.com/qm3jp)
-- [johnnyg](https://github.com/johnnyg)
+ - [JoshuaBoniface](https://github.com/joshuaboniface)
+ - [nvllsvm](https://github.com/nvllsvm)
+ - [JustAMan](https://github.com/JustAMan)
+ - [dcrdev](https://github.com/dcrdev)
+ - [EraYaN](https://github.com/EraYaN)
+ - [flemse](https://github.com/flemse)
+ - [bfayers](https://github.com/bfayers)
+ - [Bond_009](https://github.com/Bond-009)
+ - [AnthonyLavado](https://github.com/anthonylavado)
+ - [dkanada](https://github.com/dkanada)
+ - [sparky8251](https://github.com/sparky8251)
+ - [LeoVerto](https://github.com/LeoVerto)
+ - [cvium](https://github.com/cvium)
+ - [grafixeyehero](https://github.com/grafixeyehero)
+ - [Drago96](https://github.com/drago-96)
+ - [ViXXoR](https://github.com/ViXXoR)
+ - [nkmerrill](https://github.com/nkmerrill)
+ - [TtheCreator](https://github.com/Tthecreator)
+ - [RazeLighter777](https://github.com/RazeLighter777)
+ - [LogicalPhallacy](https://github.com/LogicalPhallacy)
+ - [thornbill](https://github.com/thornbill)
+ - [redSpoutnik](https://github.com/redSpoutnik)
+ - [DrPandemic](https://github.com/drpandemic)
+ - [Oddstr13](https://github.com/oddstr13)
+ - [petermcneil](https://github.com/petermcneil)
+ - [lewazo](https://github.com/lewazo)
+ - [Raghu Saxena](https://github.com/ckcr4lyf)
+ - [Nickbert7](https://github.com/Nickbert7)
+ - [ferferga](https://github.com/ferferga)
+ - [bilde2910](https://github.com/bilde2910)
+ - [Daniel Hartung](https://github.com/dhartung)
+ - [Ryan Hartzell](https://github.com/ryan-hartzell)
+ - [Thibault Nocchi](https://github.com/ThibaultNocchi)
+ - [MrTimscampi](https://github.com/MrTimscampi)
+ - [Sarab Singh](https://github.com/sarab97)
+ - [Andrei Oanca](https://github.com/OancaAndrei)
 
-## Emby Contributors
+# Emby Contributors
 
-- [LukePulverenti](https://github.com/LukePulverenti)
-- [ebr11](https://github.com/ebr11)
-- [lalmanzar](https://github.com/lalmanzar)
-- [schneifu](https://github.com/schneifu)
-- [Mark2xv](https://github.com/Mark2xv)
-- [ScottRapsey](https://github.com/ScottRapsey)
-- [skynet600](https://github.com/skynet600)
-- [Cheesegeezer](https://githum.com/Cheesegeezer)
-- [Radeon](https://github.com/radeonorama)
-- [gcw07](https://github.com/gcw07)
-- [SivaramAdhiappan](https://github.com/shivaram1190)
-- [CWatkinsNash](https://github.com/CWatkinsNash)
-- [sfnetwork](https://github.com/sfnetwork)
-- [Logos302](https://github.com/Logos302)
-- [TheWorkz](https://github.com/TheWorkz)
-- [mboehler](https://github.com/mboehler)
-- [KaHooli](https://github.com/KaHooli)
-- [xzener](https://github.com/xzener)
-- [CBers](https://github.com/CBers)
-- [Sagaia](https://github.com/Sagaia)
-- [JHawk111](https://github.com/JHawk111)
-- [David3663](https://github.com/david3663)
-- [Smyken](https://github.com/Smyken)
-- [doron1](https://github.com/doron1)
-- [brainfryd](https://github.com/brainfryd)
-- [DGMayor](http://github.com/DGMayor)
-- [Jon-theHTPC](https://github.com/Jon-theHTPC)
-- [aspdend](https://github.com/aspdend)
-- [RedshirtMB](https://github.com/RedshirtMB)
-- [thealienamongus](https://github.com/thealienamongus)
-- [brocass](https://github.com/brocass)
-- [pjrollo2000](https://github.com/pjrollo2000)
-- [abobader](https://github.com/abobader)
-- [milli260876](https://github.com/milli260876)
-- [vileboy](https://github.com/vileboy)
-- [starkadius](https://github.com/starkadius)
-- [wraslor](https://github.com/wraslor)
-- [mrwebsmith](https://github.com/mrwebsmith)
-- [rickster53](https://github.com/rickster53)
-- [Tharnax](https://github.com/Tharnax)
-- [0sm0](https://github.com/0sm0)
-- [swhitmore](https://github.com/swhitmore)
-- [DigiTM](https://github.com/DigiTM)
-- [crisliv / xliv](https://github.com/crisliv)
-- [Yogi](https://github.com/yogi12)
-- [madFloyd](https://github.com/madFloyd)
-- [yardameus](https://github.com/yardameus)
-- [rrb008](https://github.com/rrb008)
-- [Toonguy](https://github.com/Toonguy)
-- [Alwin Hummels](https://github.com/AlwinHummels)
-- [trooper11](https://github.com/trooper11)
-- [danlotfy](https://github.com/danlotfy)
-- [jordy1955](https://github.com/jordy1955)
-- [JoshFink](https://github.com/JoshFink)
-- [Detector1](https://github.com/Detector1)
-- [BlackIce013](https://github.com/blackice013)
-- [mporcas](https://github.com/mporcas)
-- [tikuf](https://github.com/tikuf/)
-- [Tim Hobbs](https://github.com/timhobbs)
-- [SvenVandenbrande](https://github.com/SvenVandenbrande)
-<!--
-    NOTE: This is the end of the list of past Emby Contributors.
-    New Jellyfin contributors should add their name to the end
-    of the list of Jellyfin Contributors above. NOT HERE ;)
--->
+ - [LukePulverenti](https://github.com/LukePulverenti)
+ - [ebr11](https://github.com/ebr11)
+ - [lalmanzar](https://github.com/lalmanzar)
+ - [schneifu](https://github.com/schneifu)
+ - [Mark2xv](https://github.com/Mark2xv)
+ - [ScottRapsey](https://github.com/ScottRapsey)
+ - [skynet600](https://github.com/skynet600)
+ - [Cheesegeezer](https://githum.com/Cheesegeezer)
+ - [Radeon](https://github.com/radeonorama)
+ - [gcw07](https://github.com/gcw07)
+ - [SivaramAdhiappan](https://github.com/shivaram1190)
+ - [CWatkinsNash](https://github.com/CWatkinsNash)
+ - [sfnetwork](https://github.com/sfnetwork)
+ - [Logos302](https://github.com/Logos302)
+ - [TheWorkz](https://github.com/TheWorkz)
+ - [mboehler](https://github.com/mboehler)
+ - [KaHooli](https://github.com/KaHooli)
+ - [xzener](https://github.com/xzener)
+ - [CBers](https://github.com/CBers)
+ - [Sagaia](https://github.com/Sagaia)
+ - [JHawk111](https://github.com/JHawk111)
+ - [David3663](https://github.com/david3663)
+ - [Smyken](https://github.com/Smyken)
+ - [doron1](https://github.com/doron1)
+ - [brainfryd](https://github.com/brainfryd)
+ - [DGMayor](http://github.com/DGMayor)
+ - [Jon-theHTPC](https://github.com/Jon-theHTPC)
+ - [aspdend](https://github.com/aspdend)
+ - [RedshirtMB](https://github.com/RedshirtMB)
+ - [thealienamongus](https://github.com/thealienamongus)
+ - [brocass](https://github.com/brocass)
+ - [pjrollo2000](https://github.com/pjrollo2000)
+ - [abobader](https://github.com/abobader)
+ - [milli260876](https://github.com/milli260876)
+ - [vileboy](https://github.com/vileboy)
+ - [starkadius](https://github.com/starkadius)
+ - [wraslor](https://github.com/wraslor)
+ - [mrwebsmith](https://github.com/mrwebsmith)
+ - [rickster53](https://github.com/rickster53)
+ - [Tharnax](https://github.com/Tharnax)
+ - [0sm0](https://github.com/0sm0)
+ - [swhitmore](https://github.com/swhitmore)
+ - [DigiTM](https://github.com/DigiTM)
+ - [crisliv / xliv](https://github.com/crisliv)
+ - [Yogi](https://github.com/yogi12)
+ - [madFloyd](https://github.com/madFloyd)
+ - [yardameus](https://github.com/yardameus)
+ - [rrb008](https://github.com/rrb008)
+ - [Toonguy](https://github.com/Toonguy)
+ - [Alwin Hummels](https://github.com/AlwinHummels)
+ - [trooper11](https://github.com/trooper11)
+ - [danlotfy](https://github.com/danlotfy)
+ - [jordy1955](https://github.com/jordy1955)
+ - [JoshFink](https://github.com/JoshFink)
+ - [Detector1](https://github.com/Detector1)
+ - [BlackIce013](https://github.com/blackice013)
+ - [mporcas](https://github.com/mporcas)
+ - [tikuf](https://github.com/tikuf/)
+ - [Tim Hobbs](https://github.com/timhobbs)
+ - [SvenVandenbrande](https://github.com/SvenVandenbrande)

README.md

@@ -23,6 +23,9 @@
 <a href="https://features.jellyfin.org">
 <img alt="Feature Requests" src="https://img.shields.io/badge/fider-vote%20on%20features-success.svg"/>
 </a>
+<a href="https://forum.jellyfin.org">
+<img alt="Discuss on our Forum" src="https://img.shields.io/discourse/https/forum.jellyfin.org/users.svg"/>
+</a>
 <a href="https://matrix.to/#/+jellyfin:matrix.org">
 <img alt="Chat on Matrix" src="https://img.shields.io/matrix/jellyfin:matrix.org.svg?logo=matrix"/>
 </a>
@@ -41,8 +44,8 @@ Jellyfin Web is the frontend used for most of the clients available for end user
 
 ### Dependencies
 
-- [Node.js](https://nodejs.org/en/download)
-- npm (included in Node.js)
+- [Yarn 1.22.4](https://classic.yarnpkg.com/en/docs/install)
+- Gulp-cli
 
 ### Getting Started
 
@@ -56,56 +59,23 @@ Jellyfin Web is the frontend used for most of the clients available for end user
 2. Install build dependencies in the project directory.
 
    ```sh
-   npm install
+   yarn install
    ```
 
 3. Run the web client with webpack for local development.
 
    ```sh
-   npm start
+   yarn serve
    ```
 
-4. Build the client with sourcemaps available.
+4. Build the client with sourcemaps.
 
    ```sh
-   npm run build:development
+   yarn build:development
    ```
 
-## Directory Structure
+   You can build a nginx compatible version as well.
 
-> [!NOTE]
-> We are in the process of refactoring to a [new structure](https://forum.jellyfin.org/t-proposed-update-to-the-structure-of-jellyfin-web) based on [Bulletproof React](https://github.com/alan2207/bulletproof-react/blob/master/docs/project-structure.md) architecture guidelines.
-> Most new code should be organized under the appropriate app directory unless it is common/shared.
-
-```
-.
-└── src
-    ├── apps
-    │   ├── dashboard           # Admin dashboard app
-    │   ├── experimental        # New experimental app
-    │   ├── stable              # Classic (stable) app
-    │   └── wizard              # Startup wizard app
-    ├── assets                  # Static assets
-    ├── components              # Higher order visual components and React components
-    ├── constants               # Common constant values
-    ├── controllers             # Legacy page views and controllers 🧹 ❌
-    ├── elements                # Basic webcomponents and React equivalents 🧹
-    ├── hooks                   # Custom React hooks
-    ├── lib                     # Reusable libraries
-    │   ├── globalize           # Custom localization library
-    │   ├── jellyfin-apiclient  # Supporting code for the deprecated apiclient package
-    │   ├── legacy              # Polyfills for legacy browsers
-    │   ├── navdrawer           # Navigation drawer library for classic layout
-    │   └── scroller            # Content scrolling library
-    ├── plugins                 # Client plugins (features dynamically loaded at runtime)
-    ├── scripts                 # Random assortment of visual components and utilities 🐉 ❌
-    ├── strings                 # Translation files (only commit changes to en-us.json)
-    ├── styles                  # Common app Sass stylesheets
-    ├── themes                  # Sass and MUI themes
-    ├── types                   # Common TypeScript interfaces/types
-    └── utils                   # Utility functions
-```
-
-- ❌ &mdash; Deprecated, do **not** create new files here
-- 🧹 &mdash; Needs cleanup
-- 🐉 &mdash; Serious mess (Here be dragons)
+   ```sh
+   yarn build:standalone
+   ```

babel.config.js

@@ -1,19 +0,0 @@
-module.exports = {
-    babelrcRoots: [
-        // Keep the root as a root
-        '.'
-    ],
-    sourceType: 'unambiguous',
-    presets: [
-        [
-            '@babel/preset-env',
-            {
-                useBuiltIns: 'usage',
-                corejs: 3
-            }
-        ],
-        '@babel/preset-react'
-    ],
-    plugins: [
-    ]
-};

build.sh

@@ -0,0 +1,110 @@
+#!/usr/bin/env bash
+
+# build.sh - Build Jellyfin binary packages
+# Part of the Jellyfin Project
+
+set -o errexit
+set -o pipefail
+
+usage() {
+    echo -e "build.sh - Build Jellyfin binary packages"
+    echo -e "Usage:"
+    echo -e "  $0 -t/--type <BUILD_TYPE> -p/--platform <PLATFORM> [-k/--keep-artifacts] [-l/--list-platforms]"
+    echo -e "Notes:"
+    echo -e "  * BUILD_TYPE can be one of: [native, docker] and must be specified"
+    echo -e "    * native: Build using the build script in the host OS"
+    echo -e "    * docker: Build using the build script in a standardized Docker container"
+    echo -e "  * PLATFORM can be any platform shown by -l/--list-platforms and must be specified"
+    echo -e "  * If -k/--keep-artifacts is specified, transient artifacts (e.g. Docker containers) will be"
+    echo -e "    retained after the build is finished; the source directory will still be cleaned"
+    echo -e "  * If -l/--list-platforms is specified, all other arguments are ignored; the script will print"
+    echo -e "    the list of supported platforms and exit"
+}
+
+list_platforms() {
+    declare -a platforms
+    platforms=(
+        $( find deployment -maxdepth 1 -mindepth 1 -name "build.*" | awk -F'.' '{ $1=""; printf $2; if ($3 != ""){ printf "." $3; }; if ($4 != ""){ printf "." $4; };  print ""; }' | sort )
+    )
+    echo -e "Valid platforms:"
+    echo
+    for platform in ${platforms[@]}; do
+        echo -e "* ${platform} : $( grep '^#=' deployment/build.${platform} | sed 's/^#= //' )"
+    done
+}
+
+do_build_native() {
+    export IS_DOCKER=NO
+    deployment/build.${PLATFORM}
+}
+
+do_build_docker() {
+    if ! dpkg --print-architecture | grep -q 'amd64'; then
+        echo "Docker-based builds only support amd64-based cross-building; use a 'native' build instead."
+        exit 1
+    fi
+    if [[ ! -f deployment/Dockerfile.${PLATFORM} ]]; then
+        echo "Missing Dockerfile for platform ${PLATFORM}"
+        exit 1
+    fi
+    if [[ ${KEEP_ARTIFACTS} == YES ]]; then
+        docker_args=""
+    else
+        docker_args="--rm"
+    fi
+
+    docker build . -t "jellyfin-builder.${PLATFORM}" -f deployment/Dockerfile.${PLATFORM}
+    mkdir -p ${ARTIFACT_DIR}
+    docker run $docker_args -v "${SOURCE_DIR}:/jellyfin" -v "${ARTIFACT_DIR}:/dist" "jellyfin-builder.${PLATFORM}"
+}
+
+while [[ $# -gt 0 ]]; do
+    key="$1"
+    case $key in
+        -t|--type)
+        BUILD_TYPE="$2"
+        shift
+        shift
+        ;;
+        -p|--platform)
+        PLATFORM="$2"
+        shift
+        shift
+        ;;
+        -k|--keep-artifacts)
+        KEEP_ARTIFACTS=YES
+        shift
+        ;;
+        -l|--list-platforms)
+        list_platforms
+        exit 0
+        ;;
+        -h|--help)
+        usage
+        exit 0
+        ;;
+        *)
+        echo "Unknown option $1"
+        usage
+        exit 1
+        ;;
+    esac
+done
+
+if [[ -z ${BUILD_TYPE} || -z ${PLATFORM} ]]; then
+    usage
+    exit 1
+fi
+
+export SOURCE_DIR="$( pwd )"
+export ARTIFACT_DIR="${SOURCE_DIR}/../bin/${PLATFORM}"
+
+# Determine build type
+case ${BUILD_TYPE} in
+    native)
+        do_build_native
+    ;;
+    docker)
+        do_build_docker
+    ;;
+esac

build.yaml

@@ -0,0 +1,9 @@
+---
+# We just wrap `build` so this is really it
+name: "jellyfin-web"
+version: "10.6.4"
+packages:
+  - debian.all
+  - fedora.all
+  - centos.all
+  - portable

bump_version

@@ -7,7 +7,7 @@ set -o pipefail
 set -o xtrace
 
 usage() {
-    echo -e "bump_version - increase the shared version"
+    echo -e "bump_version - increase the shared version and generate changelogs"
     echo -e ""
     echo -e "Usage:"
     echo -e " $ bump_version <new_version>"
@@ -18,12 +18,74 @@ if [[ -z $1 ]]; then
     exit 1
 fi
 
-new_version="$1"
-new_version_sed="$( cut -f1 -d'-' <<<"${new_version}" )"
+shared_version_file="src/components/apphost.js"
+build_file="./build.yaml"
 
-# Bump the NPM version
-npm --no-git-tag-version --allow-same-version version v${new_version_sed}
+new_version="$1"
+
+# Parse the version from shared version file
+old_version="$( grep "appVersion" ${shared_version_file} | head -1 | sed -E "s/var appVersion = '([0-9\.]+)';/\1/" | tr -d '[:space:]' )"
+echo "Old version in appHost is: $old_version"
+
+# Set the shared version to the specified new_version
+old_version_sed="$( sed 's/\./\\./g' <<<"${old_version}" )" # Escape the '.' chars
+new_version_sed="$( cut -f1 -d'-' <<<"${new_version}" )"
+sed -i "s/${old_version_sed}/${new_version_sed}/g" ${shared_version_file}
+
+old_version="$( grep "version:" ${build_file} | sed -E 's/version: "([0-9\.]+[-a-z0-9]*)"/\1/' )"
+echo "Old version in ${build_file}: ${old_version}"
+
+# Set the build.yaml version to the specified new_version
+old_version_sed="$( sed 's/\./\\./g' <<<"${old_version}" )" # Escape the '.' chars
+sed -i "s/${old_version_sed}/${new_version}/g" ${build_file}
+
+if [[ ${new_version} == *"-"* ]]; then
+    new_version_deb="$( sed 's/-/~/g' <<<"${new_version}" )"
+else
+    new_version_deb="${new_version}-1"
+fi
+
+# Write out a temporary Debian changelog with our new stuff appended and some templated formatting
+debian_changelog_file="debian/changelog"
+debian_changelog_temp="$( mktemp )"
+# Create new temp file with our changelog
+echo -e "jellyfin-web (${new_version_deb}) unstable; urgency=medium
+
+  * New upstream version ${new_version}; release changelog at https://github.com/jellyfin/jellyfin-web/releases/tag/v${new_version}
+
+ -- Jellyfin Packaging Team <packaging@jellyfin.org>  $( date --rfc-2822 )
+" >> ${debian_changelog_temp}
+cat ${debian_changelog_file} >> ${debian_changelog_temp}
+# Move into place
+mv ${debian_changelog_temp} ${debian_changelog_file}
+
+# Write out a temporary Yum changelog with our new stuff prepended and some templated formatting
+fedora_spec_file="fedora/jellyfin-web.spec"
+fedora_changelog_temp="$( mktemp )"
+fedora_spec_temp_dir="$( mktemp -d )"
+fedora_spec_temp="${fedora_spec_temp_dir}/jellyfin-web.spec.tmp"
+# Make a copy of our spec file for hacking
+cp ${fedora_spec_file} ${fedora_spec_temp_dir}/
+pushd ${fedora_spec_temp_dir}
+# Split out the stuff before and after changelog
+csplit jellyfin-web.spec  "/^%changelog/" # produces xx00 xx01
+# Update the version in xx00
+sed -i "s/${old_version_sed}/${new_version_sed}/g" xx00
+# Remove the header from xx01
+sed -i '/^%changelog/d' xx01
+# Create new temp file with our changelog
+echo -e "%changelog
+* $( LANG=C date '+%a %b %d %Y' ) Jellyfin Packaging Team <packaging@jellyfin.org>
+- New upstream version ${new_version}; release changelog at https://github.com/jellyfin/jellyfin-web/releases/tag/v${new_version}" >> ${fedora_changelog_temp}
+cat xx01 >> ${fedora_changelog_temp}
+# Reassembble
+cat xx00 ${fedora_changelog_temp} > ${fedora_spec_temp}
+popd
+# Move into place
+mv ${fedora_spec_temp} ${fedora_spec_file}
+# Clean up
+rm -rf ${fedora_changelog_temp} ${fedora_spec_temp_dir}
 
 # Stage the changed files for commit
-git add .
-git status -v
+git add ${shared_version_file} ${build_file} ${debian_changelog_file} ${fedora_spec_file}
+git status

cssnano.config.js

@@ -1,10 +0,0 @@
-module.exports = {
-    preset: [
-        'default',
-        // Turn off `mergeLonghand` because it combines `padding-*` and `margin-*`,
-        // breaking fallback styles.
-        // https://github.com/cssnano/cssnano/issues/1163
-        // https://github.com/cssnano/cssnano/issues/1192
-        { mergeLonghand: false }
-    ]
-};

debian/changelog

@@ -0,0 +1,29 @@
+jellyfin-web (10.6.4-1) unstable; urgency=medium
+
+  * New upstream version 10.6.4; release changelog at https://github.com/jellyfin/jellyfin-web/releases/tag/v10.6.4
+
+ -- Jellyfin Packaging Team <packaging@jellyfin.org>  Sun, 30 Aug 2020 16:45:08 -0400
+
+jellyfin-web (10.6.3-1) unstable; urgency=medium
+
+  * New upstream version 10.6.3; release changelog at https://github.com/jellyfin/jellyfin-web/releases/tag/v10.6.3
+
+ -- Jellyfin Packaging Team <packaging@jellyfin.org>  Sun, 16 Aug 2020 19:48:03 -0400
+
+jellyfin-web (10.6.2-1) unstable; urgency=medium
+
+  * New upstream version 10.6.2; release changelog at https://github.com/jellyfin/jellyfin-web/releases/tag/v10.6.2
+
+ -- Jellyfin Packaging Team <packaging@jellyfin.org>  Sun, 02 Aug 2020 20:25:58 -0400
+
+jellyfin-web (10.6.1-1) unstable; urgency=medium
+
+  * New upstream version 10.6.1; release changelog at https://github.com/jellyfin/jellyfin-web/releases/tag/v10.6.1
+
+ -- Jellyfin Packaging Team <packaging@jellyfin.org>  Mon, 27 Jul 2020 18:29:54 -0400
+
+jellyfin-web (10.6.0-1) unstable; urgency=medium
+
+  * New upstream version 10.6.0; release changelog at https://github.com/jellyfin/jellyfin-web/releases/tag/v10.6.0
+
+ -- Jellyfin Packaging Team <packaging@jellyfin.org>  Mon, 16 Mar 2020 11:15:00 -0400

debian/compat

@@ -0,0 +1 @@
+8

debian/control

@@ -0,0 +1,16 @@
+Source: jellyfin-web
+Section: misc
+Priority: optional
+Maintainer: Jellyfin Team <team@jellyfin.org>
+Build-Depends:  debhelper (>= 9),
+                npm | nodejs
+Standards-Version: 3.9.4
+Homepage: https://jellyfin.org/
+Vcs-Git: https://github.org/jellyfin/jellyfin-web.git
+Vcs-Browser: https://github.org/jellyfin/jellyfin-web
+
+Package: jellyfin-web
+Recommends: jellyfin-server
+Architecture: all
+Description: Jellyfin is the Free Software Media System.
+ This package provides the Jellyfin web client.

debian/copyright

@@ -0,0 +1,28 @@
+Format: http://dep.debian.net/deps/dep5
+Upstream-Name: jellyfin-web
+Source: https://github.com/jellyfin/jellyfin-web
+
+Files: *
+Copyright: 2018-2020 Jellyfin Team
+License: GPL-3.0
+
+Files: debian/*
+Copyright: 2020 Joshua Boniface <joshua@boniface.me>
+License: GPL-3.0
+
+License: GPL-3.0
+ This package is free software; you can redistribute it and/or modify
+ it under the terms of the GNU General Public License as published by
+ the Free Software Foundation; either version 2 of the License, or
+ (at your option) any later version.
+ .
+ This package is distributed in the hope that it will be useful,
+ but WITHOUT ANY WARRANTY; without even the implied warranty of
+ MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ GNU General Public License for more details.
+ .
+ You should have received a copy of the GNU General Public License
+ along with this program. If not, see <http://www.gnu.org/licenses/>
+ .
+ On Debian systems, the complete text of the GNU General
+ Public License version 2 can be found in "/usr/share/common-licenses/GPL-2".

debian/gbp.conf

@@ -0,0 +1,6 @@
+[DEFAULT]
+pristine-tar = False
+cleaner = fakeroot debian/rules clean
+
+[import-orig]
+filter = [ ".git*", ".hg*", ".vs*", ".vscode*" ]

debian/install

@@ -0,0 +1 @@
+web usr/share/jellyfin/

debian/po/POTFILES.in

@@ -0,0 +1 @@
+[type: gettext/rfc822deb] templates

debian/po/templates.pot

@@ -0,0 +1,57 @@
+# SOME DESCRIPTIVE TITLE.
+# Copyright (C) YEAR THE PACKAGE'S COPYRIGHT HOLDER
+# This file is distributed under the same license as the PACKAGE package.
+# FIRST AUTHOR <EMAIL@ADDRESS>, YEAR.
+#
+#, fuzzy
+msgid ""
+msgstr ""
+"Project-Id-Version: jellyfin-server\n"
+"Report-Msgid-Bugs-To: jellyfin-server@packages.debian.org\n"
+"POT-Creation-Date: 2015-06-12 20:51-0600\n"
+"PO-Revision-Date: YEAR-MO-DA HO:MI+ZONE\n"
+"Last-Translator: FULL NAME <EMAIL@ADDRESS>\n"
+"Language-Team: LANGUAGE <LL@li.org>\n"
+"Language: \n"
+"MIME-Version: 1.0\n"
+"Content-Type: text/plain; charset=CHARSET\n"
+"Content-Transfer-Encoding: 8bit\n"
+
+#. Type: note
+#. Description
+#: ../templates:1001
+msgid "Jellyfin permission info:"
+msgstr ""
+
+#. Type: note
+#. Description
+#: ../templates:1001
+msgid ""
+"Jellyfin by default runs under a user named \"jellyfin\".  Please ensure that the "
+"user jellyfin has read and write access to any folders you wish to add to your "
+"library. Otherwise please run jellyfin under a different user."
+msgstr ""
+
+#. Type: string
+#. Description
+#: ../templates:2001
+msgid "Username to run Jellyfin as:"
+msgstr ""
+
+#. Type: string
+#. Description
+#: ../templates:2001
+msgid "The user that jellyfin will run as."
+msgstr ""
+
+#. Type: note
+#. Description
+#: ../templates:3001
+msgid "Jellyfin still running"
+msgstr ""
+
+#. Type: note
+#. Description
+#: ../templates:3001
+msgid "Jellyfin is currently running. Please close it and try again."
+msgstr ""

debian/rules

@@ -0,0 +1,20 @@
+#! /usr/bin/make -f
+export DH_VERBOSE=1
+
+%:
+	dh $@
+
+# disable "make check"
+override_dh_auto_test:
+
+# disable stripping debugging symbols
+override_dh_clistrip:
+
+override_dh_auto_build:
+	npx yarn install
+	mv $(CURDIR)/dist $(CURDIR)/web
+
+override_dh_auto_clean:
+	test -d $(CURDIR)/dist && rm -rf '$(CURDIR)/dist' || true
+	test -d $(CURDIR)/web && rm -rf '$(CURDIR)/web' || true
+	test -d $(CURDIR)/node_modules && rm -rf '$(CURDIR)/node_modules' || true

debian/source/format

@@ -0,0 +1 @@
+1.0

debian/source/options

@@ -0,0 +1,7 @@
+tar-ignore='.git*'
+tar-ignore='**/.git'
+tar-ignore='**/.hg'
+tar-ignore='**/.vs'
+tar-ignore='**/.vscode'
+tar-ignore='deployment'
+tar-ignore='*.deb'

deployment/Dockerfile.centos

@@ -0,0 +1,29 @@
+FROM centos:7
+
+# Docker build arguments
+ARG SOURCE_DIR=/jellyfin
+ARG ARTIFACT_DIR=/dist
+
+# Docker run environment
+ENV SOURCE_DIR=/jellyfin
+ENV ARTIFACT_DIR=/dist
+ENV IS_DOCKER=YES
+
+# Prepare CentOS environment
+RUN yum update -y \
+  && yum install -y epel-release \
+  && yum install -y @buildsys-build rpmdevtools git yum-plugins-core nodejs-yarn autoconf automake glibc-devel
+
+# Install recent NodeJS and Yarn
+RUN curl -fSsLo /etc/yum.repos.d/yarn.repo https://dl.yarnpkg.com/rpm/yarn.repo \
+  && rpm -i https://rpm.nodesource.com/pub_10.x/el/7/x86_64/nodesource-release-el7-1.noarch.rpm \
+  && yum install -y yarn
+
+# Link to build script
+RUN ln -sf ${SOURCE_DIR}/deployment/build.centos /build.sh
+
+VOLUME ${SOURCE_DIR}
+
+VOLUME ${ARTIFACT_DIR}
+
+ENTRYPOINT ["/build.sh"]

deployment/Dockerfile.debian

@@ -0,0 +1,27 @@
+FROM debian:10
+
+# Docker build arguments
+ARG SOURCE_DIR=/jellyfin
+ARG ARTIFACT_DIR=/dist
+
+# Docker run environment
+ENV SOURCE_DIR=/jellyfin
+ENV ARTIFACT_DIR=/dist
+ENV DEB_BUILD_OPTIONS=noddebs
+ENV IS_DOCKER=YES
+
+# Prepare Debian build environment
+RUN apt-get update \
+  && apt-get install -y debhelper mmv npm git
+
+# Prepare Yarn
+RUN npm install -g yarn
+
+# Link to build script
+RUN ln -sf ${SOURCE_DIR}/deployment/build.debian /build.sh
+
+VOLUME ${SOURCE_DIR}
+
+VOLUME ${ARTIFACT_DIR}
+
+ENTRYPOINT ["/build.sh"]

deployment/Dockerfile.docker

@@ -0,0 +1,11 @@
+FROM node:alpine
+
+ARG SOURCE_DIR=/src
+ARG ARTIFACT_DIR=/jellyfin-web
+
+RUN apk add autoconf g++ make libpng-dev gifsicle alpine-sdk automake libtool make gcc musl-dev nasm python
+
+WORKDIR ${SOURCE_DIR}
+COPY . .
+
+RUN yarn install && mv dist ${ARTIFACT_DIR}

deployment/Dockerfile.fedora

@@ -0,0 +1,23 @@
+FROM fedora:31
+
+# Docker build arguments
+ARG SOURCE_DIR=/jellyfin
+ARG ARTIFACT_DIR=/dist
+
+# Docker run environment
+ENV SOURCE_DIR=/jellyfin
+ENV ARTIFACT_DIR=/dist
+ENV IS_DOCKER=YES
+
+# Prepare Fedora environment
+RUN dnf update -y \
+  && dnf install -y @buildsys-build rpmdevtools git dnf-plugins-core nodejs-yarn autoconf automake glibc-devel
+
+# Link to build script
+RUN ln -sf ${SOURCE_DIR}/deployment/build.fedora /build.sh
+
+VOLUME ${SOURCE_DIR}
+
+VOLUME ${ARTIFACT_DIR}
+
+ENTRYPOINT ["/build.sh"]

deployment/Dockerfile.portable

@@ -0,0 +1,26 @@
+FROM debian:10
+
+# Docker build arguments
+ARG SOURCE_DIR=/jellyfin
+ARG ARTIFACT_DIR=/dist
+
+# Docker run environment
+ENV SOURCE_DIR=/jellyfin
+ENV ARTIFACT_DIR=/dist
+ENV IS_DOCKER=YES
+
+# Prepare Debian build environment
+RUN apt-get update \
+  && apt-get install -y mmv npm git
+
+# Prepare Yarn
+RUN npm install -g yarn
+
+# Link to build script
+RUN ln -sf ${SOURCE_DIR}/deployment/build.portable /build.sh
+
+VOLUME ${SOURCE_DIR}
+
+VOLUME ${ARTIFACT_DIR}
+
+ENTRYPOINT ["/build.sh"]

deployment/build.centos

@@ -0,0 +1,41 @@
+#!/bin/bash
+
+set -o errexit
+set -o xtrace
+
+# move to source directory
+pushd ${SOURCE_DIR}
+
+cp -a yarn.lock /tmp/yarn.lock
+
+# modify changelog to unstable configuration if IS_UNSTABLE
+if [[ ${IS_UNSTABLE} == 'yes' ]]; then
+    pushd fedora
+
+    PR_ID=$( git log --grep 'Merge pull request' --oneline --single-worktree --first-parent | head -1 | grep --color=none -Eo '#[0-9]+' | tr -d '#' )
+
+    sed -i "s/Version:.*/Version:        ${BUILD_ID}/" jellyfin-web.spec
+    sed -i "/%changelog/q" jellyfin-web.spec
+
+    cat <<EOF >>jellyfin-web.spec
+* $( LANG=C date '+%a %b %d %Y' ) Jellyfin Packaging Team <packaging@jellyfin.org>
+- Jellyfin Web unstable build ${BUILD_ID} for merged PR #${PR_ID}
+EOF
+    popd
+fi
+
+# build rpm
+make -f fedora/Makefile srpm outdir=/root/rpmbuild/SRPMS
+rpmbuild --rebuild -bb /root/rpmbuild/SRPMS/jellyfin-*.src.rpm
+
+# move the artifacts
+mv /root/rpmbuild/RPMS/noarch/jellyfin-*.rpm /root/rpmbuild/SRPMS/jellyfin-*.src.rpm ${ARTIFACT_DIR}/
+
+if [[ ${IS_DOCKER} == YES ]]; then
+    chown -Rc $(stat -c %u:%g ${ARTIFACT_DIR}) ${ARTIFACT_DIR}
+fi
+
+rm -f fedora/jellyfin*.tar.gz
+cp -a /tmp/yarn.lock yarn.lock
+
+popd

deployment/build.debian

@@ -0,0 +1,39 @@
+#!/bin/bash
+
+set -o errexit
+set -o xtrace
+
+# move to source directory
+pushd ${SOURCE_DIR}
+
+cp -a yarn.lock /tmp/yarn.lock
+
+# modify changelog to unstable configuration if IS_UNSTABLE
+if [[ ${IS_UNSTABLE} == 'yes' ]]; then
+    pushd debian
+
+    PR_ID=$( git log --grep 'Merge pull request' --oneline --single-worktree --first-parent | head -1 | grep --color=none -Eo '#[0-9]+' | tr -d '#' )
+
+    cat <<EOF >changelog
+jellyfin-web (${BUILD_ID}-unstable) unstable; urgency=medium
+
+  * Jellyfin Web unstable build ${BUILD_ID} for merged PR #${PR_ID}
+
+ -- Jellyfin Packaging Team <packaging@jellyfin.org>  $( date --rfc-2822 )
+EOF
+    popd
+fi
+
+# build deb
+dpkg-buildpackage -us -uc --pre-clean --post-clean
+
+mkdir -p ${ARTIFACT_DIR}
+mv ../jellyfin*.{deb,dsc,tar.gz,buildinfo,changes} ${ARTIFACT_DIR}
+
+cp -a /tmp/yarn.lock yarn.lock
+
+if [[ ${IS_DOCKER} == YES ]]; then
+    chown -Rc $(stat -c %u:%g ${ARTIFACT_DIR}) ${ARTIFACT_DIR}
+fi
+
+popd

deployment/build.fedora

@@ -0,0 +1,41 @@
+#!/bin/bash
+
+set -o errexit
+set -o xtrace
+
+# move to source directory
+pushd ${SOURCE_DIR}
+
+cp -a yarn.lock /tmp/yarn.lock
+
+# modify changelog to unstable configuration if IS_UNSTABLE
+if [[ ${IS_UNSTABLE} == 'yes' ]]; then
+    pushd fedora
+
+    PR_ID=$( git log --grep 'Merge pull request' --oneline --single-worktree --first-parent | head -1 | grep --color=none -Eo '#[0-9]+' | tr -d '#' )
+
+    sed -i "s/Version:.*/Version:        ${BUILD_ID}/" jellyfin-web.spec
+    sed -i "/%changelog/q" jellyfin-web.spec
+
+    cat <<EOF >>jellyfin-web.spec
+* $( LANG=C date '+%a %b %d %Y' ) Jellyfin Packaging Team <packaging@jellyfin.org>
+- Jellyfin Web unstable build ${BUILD_ID} for merged PR #${PR_ID}
+EOF
+    popd
+fi
+
+# build rpm
+make -f fedora/Makefile srpm outdir=/root/rpmbuild/SRPMS
+rpmbuild -rb /root/rpmbuild/SRPMS/jellyfin-*.src.rpm
+
+# move the artifacts
+mv /root/rpmbuild/RPMS/noarch/jellyfin-*.rpm /root/rpmbuild/SRPMS/jellyfin-*.src.rpm ${ARTIFACT_DIR}
+
+if [[ ${IS_DOCKER} == YES ]]; then
+    chown -Rc $(stat -c %u:%g ${ARTIFACT_DIR}) ${ARTIFACT_DIR}
+fi
+
+rm -f fedora/jellyfin*.tar.gz
+cp -a /tmp/yarn.lock yarn.lock
+
+popd

deployment/build.portable

@@ -0,0 +1,30 @@
+#!/bin/bash
+
+set -o errexit
+set -o xtrace
+
+# move to source directory
+pushd ${SOURCE_DIR}
+
+# get version
+if [[ ${IS_UNSTABLE} == 'yes' ]]; then
+    version="${BUILD_ID}"
+else
+    version="$( grep "version:" ./build.yaml | sed -E 's/version: "([0-9\.]+.*)"/\1/' )"
+fi
+
+# build archives
+npx yarn install
+mv dist jellyfin-web_${version}
+tar -czf jellyfin-web_${version}_portable.tar.gz jellyfin-web_${version}
+rm -rf dist
+
+# move the artifacts
+mkdir -p ${ARTIFACT_DIR}
+mv jellyfin[-_]*.tar.gz ${ARTIFACT_DIR}
+
+if [[ ${IS_DOCKER} == YES ]]; then
+    chown -Rc $(stat -c %u:%g ${ARTIFACT_DIR}) ${ARTIFACT_DIR}
+fi
+
+popd

eslint.config.mjs

@@ -1,417 +0,0 @@
-// @ts-check
-
-import eslint from '@eslint/js';
-import comments from '@eslint-community/eslint-plugin-eslint-comments/configs';
-import compat from 'eslint-plugin-compat';
-import globals from 'globals';
-// @ts-expect-error Missing type definition
-import importPlugin from 'eslint-plugin-import';
-import jsxA11y from 'eslint-plugin-jsx-a11y';
-import reactPlugin from 'eslint-plugin-react';
-import reactHooks from 'eslint-plugin-react-hooks';
-import restrictedGlobals from 'confusing-browser-globals';
-import sonarjs from 'eslint-plugin-sonarjs';
-import stylistic from '@stylistic/eslint-plugin';
-// eslint-disable-next-line import/no-unresolved
-import tseslint from 'typescript-eslint';
-
-export default tseslint.config(
-    eslint.configs.recommended,
-    tseslint.configs.recommended,
-    // @ts-expect-error Harmless type mismatch in dependency
-    comments.recommended,
-    compat.configs['flat/recommended'],
-    importPlugin.flatConfigs.errors,
-    sonarjs.configs.recommended,
-
-    reactPlugin.configs.flat.recommended,
-    {
-        settings: {
-            react: {
-                version: 'detect'
-            }
-        }
-    },
-    jsxA11y.flatConfigs.recommended,
-
-    // Global ignores
-    {
-        ignores: [
-            'node_modules',
-            'coverage',
-            'dist',
-            '.idea',
-            '.vscode'
-        ]
-    },
-
-    // Global style rules
-    {
-        plugins: {
-            '@stylistic': stylistic
-        },
-        extends: [ importPlugin.flatConfigs.typescript ],
-        rules: {
-            'array-callback-return': ['error', { 'checkForEach': true }],
-            'curly': ['error', 'multi-line', 'consistent'],
-            'default-case-last': 'error',
-            'max-params': ['error', 7],
-            'new-cap': [
-                'error',
-                {
-                    'capIsNewExceptions': ['jQuery.Deferred'],
-                    'newIsCapExceptionPattern': '\\.default$'
-                }
-            ],
-            'no-duplicate-imports': 'error',
-            'no-empty-function': 'error',
-            'no-extend-native': 'error',
-            'no-lonely-if': 'error',
-            'no-nested-ternary': 'error',
-            'no-redeclare': 'off',
-            '@typescript-eslint/no-redeclare': ['error', { builtinGlobals: false }],
-            'no-restricted-globals': ['error'].concat(restrictedGlobals),
-            'no-return-assign': 'error',
-            'no-return-await': 'error',
-            'no-sequences': ['error', { 'allowInParentheses': false }],
-            'no-shadow': 'off',
-            '@typescript-eslint/no-shadow': 'error',
-            'no-throw-literal': 'error',
-            'no-undef-init': 'error',
-            'no-unneeded-ternary': 'error',
-            'no-unused-expressions': 'off',
-            '@typescript-eslint/no-unused-expressions': ['error', { 'allowShortCircuit': true, 'allowTernary': true, 'allowTaggedTemplates': true }],
-            'no-unused-private-class-members': 'error',
-            '@typescript-eslint/no-unused-vars': 'error',
-            'no-useless-rename': 'error',
-            'no-useless-constructor': 'off',
-            '@typescript-eslint/no-useless-constructor': 'error',
-            'no-var': 'error',
-            'no-void': ['error', { 'allowAsStatement': true }],
-            'no-warning-comments': ['warn', { 'terms': ['hack', 'xxx'] }],
-            'one-var': ['error', 'never'],
-            'prefer-const': ['error', { 'destructuring': 'all' }],
-            'prefer-promise-reject-errors': ['warn', { 'allowEmptyReject': true }],
-            '@typescript-eslint/prefer-for-of': 'error',
-            'radix': 'error',
-            'yoda': 'error',
-
-            'sonarjs/fixme-tag': 'warn',
-            'sonarjs/todo-tag': 'off',
-            'sonarjs/deprecation': 'off',
-            'sonarjs/no-alphabetical-sort': 'warn',
-            'sonarjs/no-inverted-boolean-check': 'error',
-            'sonarjs/no-selector-parameter': 'off',
-            'sonarjs/pseudo-random': 'warn',
-            // TODO: Enable the following sonarjs rules and fix issues
-            'sonarjs/no-duplicate-string': 'off',
-            'sonarjs/no-nested-functions': 'warn',
-
-            // TODO: Replace with stylistic.configs.customize()
-            '@stylistic/block-spacing': 'error',
-            '@stylistic/brace-style': ['error', '1tbs', { 'allowSingleLine': true }],
-            '@stylistic/comma-dangle': ['error', 'never'],
-            '@stylistic/comma-spacing': 'error',
-            '@stylistic/eol-last': 'error',
-            '@stylistic/indent': ['error', 4, { 'SwitchCase': 1 }],
-            '@stylistic/jsx-quotes': ['error', 'prefer-single'],
-            '@stylistic/keyword-spacing': 'error',
-            '@stylistic/max-statements-per-line': 'error',
-            '@stylistic/no-floating-decimal': 'error',
-            '@stylistic/no-mixed-spaces-and-tabs': 'error',
-            '@stylistic/no-multi-spaces': 'error',
-            '@stylistic/no-multiple-empty-lines': ['error', { 'max': 1 }],
-            '@stylistic/no-trailing-spaces': 'error',
-            '@stylistic/object-curly-spacing': ['error', 'always'],
-            '@stylistic/operator-linebreak': ['error', 'before', { overrides: { '?': 'after', ':': 'after', '=': 'after' } }],
-            '@stylistic/padded-blocks': ['error', 'never'],
-            '@stylistic/quotes': ['error', 'single', { 'avoidEscape': true, 'allowTemplateLiterals': false }],
-            '@stylistic/semi': 'error',
-            '@stylistic/space-before-blocks': 'error',
-            '@stylistic/space-infix-ops': 'error',
-
-            '@typescript-eslint/no-restricted-imports': [
-                'error',
-                {
-                    paths: [
-                        {
-                            name: '@jellyfin/sdk/lib/generated-client',
-                            message: 'Use direct file imports for tree-shaking',
-                            allowTypeImports: true
-                        },
-                        {
-                            name: '@jellyfin/sdk/lib/generated-client/api',
-                            message: 'Use direct file imports for tree-shaking',
-                            allowTypeImports: true
-                        },
-                        {
-                            name: '@jellyfin/sdk/lib/generated-client/models',
-                            message: 'Use direct file imports for tree-shaking',
-                            allowTypeImports: true
-                        },
-                        {
-                            name: '@mui/icons-material',
-                            message: 'Use direct file imports for tree-shaking',
-                            allowTypeImports: true
-                        },
-                        {
-                            name: '@mui/material',
-                            message: 'Use direct file imports for tree-shaking',
-                            allowTypeImports: true
-                        }
-                    ]
-                }
-            ]
-        }
-    },
-
-    // Config files use node globals
-    {
-        ignores: [ 'src' ],
-        languageOptions: {
-            globals: {
-                ...globals.node
-            }
-        }
-    },
-
-    // Config files are commonjs by default
-    {
-        files: [ '**/*.{cjs,js}' ],
-        ignores: [ 'src' ],
-        languageOptions: {
-            sourceType: 'commonjs'
-        },
-        rules: {
-            '@typescript-eslint/no-require-imports': 'off'
-        }
-    },
-
-    // App files
-    {
-        files: [
-            'src/**/*.{js,jsx,ts,tsx}'
-        ],
-        languageOptions: {
-            parserOptions: {
-                projectService: true,
-                tsconfigRootDir: import.meta.dirname
-            },
-            globals: {
-                ...globals.browser,
-                // Tizen globals
-                'tizen': false,
-                'webapis': false,
-                // WebOS globals
-                'webOS': false,
-                // Dependency globals
-                '$': false,
-                'jQuery': false,
-                // Jellyfin globals
-                'ApiClient': true,
-                'Events': true,
-                'chrome': true,
-                'Emby': false,
-                'Hls': true,
-                'LibraryMenu': true,
-                'Windows': false,
-                // Build time definitions
-                __COMMIT_SHA__: false,
-                __JF_BUILD_VERSION__: false,
-                __PACKAGE_JSON_NAME__: false,
-                __PACKAGE_JSON_VERSION__: false,
-                __USE_SYSTEM_FONTS__: false,
-                __WEBPACK_SERVE__: false
-            }
-        },
-        settings: {
-            'import/resolver': {
-                node: {
-                    extensions: [
-                        '.js',
-                        '.ts',
-                        '.jsx',
-                        '.tsx'
-                    ],
-                    moduleDirectory: [
-                        'node_modules',
-                        'src'
-                    ]
-                }
-            },
-            polyfills: [
-                'Promise',
-                // whatwg-fetch
-                'fetch',
-                // document-register-element
-                'document.registerElement',
-                // resize-observer-polyfill
-                'ResizeObserver',
-                // fast-text-encoding
-                'TextEncoder',
-                // intersection-observer
-                'IntersectionObserver',
-                // Core-js
-                'Object.assign',
-                'Object.is',
-                'Object.setPrototypeOf',
-                'Object.toString',
-                'Object.freeze',
-                'Object.seal',
-                'Object.preventExtensions',
-                'Object.isFrozen',
-                'Object.isSealed',
-                'Object.isExtensible',
-                'Object.getOwnPropertyDescriptor',
-                'Object.getPrototypeOf',
-                'Object.keys',
-                'Object.entries',
-                'Object.getOwnPropertyNames',
-                'Function.name',
-                'Function.hasInstance',
-                'Array.from',
-                'Array.arrayOf',
-                'Array.copyWithin',
-                'Array.fill',
-                'Array.find',
-                'Array.findIndex',
-                'Array.iterator',
-                'String.fromCodePoint',
-                'String.raw',
-                'String.iterator',
-                'String.codePointAt',
-                'String.endsWith',
-                'String.includes',
-                'String.repeat',
-                'String.startsWith',
-                'String.trim',
-                'String.anchor',
-                'String.big',
-                'String.blink',
-                'String.bold',
-                'String.fixed',
-                'String.fontcolor',
-                'String.fontsize',
-                'String.italics',
-                'String.link',
-                'String.small',
-                'String.strike',
-                'String.sub',
-                'String.sup',
-                'RegExp',
-                'Number',
-                'Math',
-                'Date',
-                'async',
-                'Symbol',
-                'Map',
-                'Set',
-                'WeakMap',
-                'WeakSet',
-                'ArrayBuffer',
-                'DataView',
-                'Int8Array',
-                'Uint8Array',
-                'Uint8ClampedArray',
-                'Int16Array',
-                'Uint16Array',
-                'Int32Array',
-                'Uint32Array',
-                'Float32Array',
-                'Float64Array',
-                'Reflect'
-            ]
-        },
-        rules: {
-            // TODO: Add typescript recommended typed rules
-            '@typescript-eslint/naming-convention': [
-                'error',
-                {
-                    selector: 'default',
-                    format: [ 'camelCase', 'PascalCase' ],
-                    leadingUnderscore: 'allow'
-                },
-                {
-                    selector: 'variable',
-                    format: [ 'camelCase', 'PascalCase', 'UPPER_CASE' ],
-                    leadingUnderscore: 'allowSingleOrDouble',
-                    trailingUnderscore: 'allowSingleOrDouble'
-                },
-                {
-                    selector: 'typeLike',
-                    format: [ 'PascalCase' ]
-                },
-                {
-                    selector: 'enumMember',
-                    format: [ 'PascalCase', 'UPPER_CASE' ]
-                },
-                {
-                    selector: [ 'objectLiteralProperty', 'typeProperty' ],
-                    format: [ 'camelCase', 'PascalCase' ],
-                    leadingUnderscore: 'allowSingleOrDouble',
-                    trailingUnderscore: 'allowSingleOrDouble'
-                },
-                // Ignore numbers, locale strings (en-us), aria/data attributes and CSS selectors
-                {
-                    selector: [ 'objectLiteralProperty', 'typeProperty' ],
-                    format: null,
-                    filter: {
-                        regex: '[ &\\-]|^([0-9]+)$',
-                        match: true
-                    }
-                }
-            ],
-            '@typescript-eslint/no-deprecated': 'warn',
-            '@typescript-eslint/no-floating-promises': 'error',
-            '@typescript-eslint/prefer-string-starts-ends-with': 'error'
-        }
-    },
-
-    // React files
-    {
-        files: [ 'src/**/*.{jsx,tsx}' ],
-        plugins: {
-            'react-hooks': reactHooks
-        },
-        rules: {
-            'react/jsx-filename-extension': ['error', { 'extensions': ['.jsx', '.tsx'] }],
-            'react/jsx-no-bind': 'error',
-            'react/jsx-no-useless-fragment': 'error',
-            'react/no-array-index-key': 'error',
-            'react-hooks/rules-of-hooks': 'error',
-            'react-hooks/exhaustive-deps': 'warn'
-        }
-    },
-
-    // Service worker
-    {
-        files: [ 'src/serviceworker.js' ],
-        languageOptions: {
-            globals: {
-                ...globals.serviceworker
-            }
-        }
-    },
-
-    // Legacy JS (less strict)
-    {
-        files: [ 'src/**/*.{js,jsx}' ],
-        rules: {
-            '@typescript-eslint/no-floating-promises': 'off',
-            '@typescript-eslint/no-this-alias': 'off',
-
-            'sonarjs/public-static-readonly': 'off',
-
-            // TODO: Enable the following rules and fix issues
-            'sonarjs/cognitive-complexity': 'off',
-            'sonarjs/constructor-for-side-effects': 'off',
-            'sonarjs/function-return-type': 'off',
-            'sonarjs/no-async-constructor': 'off',
-            'sonarjs/no-duplicate-string': 'off',
-            'sonarjs/no-ignored-exceptions': 'off',
-            'sonarjs/no-invariant-returns': 'warn',
-            'sonarjs/no-nested-functions': 'off',
-            'sonarjs/void-use': 'off'
-        }
-    }
-);

fedora/Makefile

@@ -0,0 +1,21 @@
+VERSION := $(shell sed -ne '/^Version:/s/.*  *//p' fedora/jellyfin-web.spec)
+
+srpm:
+	cd fedora/;                                                                   \
+	SOURCE_DIR=..                                                                 \
+	WORKDIR="$${PWD}";                                                            \
+	tar                                                                           \
+	--transform "s,^\.,jellyfin-web-$(VERSION),"                                  \
+	--exclude='.git*'                                                             \
+	--exclude='**/.git'                                                           \
+	--exclude='**/.hg'                                                            \
+	--exclude='deployment'                                                        \
+	--exclude='*.deb'                                                             \
+	--exclude='*.rpm'                                                             \
+	--exclude='jellyfin-web-$(VERSION).tar.gz'                                    \
+	-czf "jellyfin-web-$(VERSION).tar.gz"                                         \
+	-C $${SOURCE_DIR} ./
+	cd fedora/;                                                                   \
+	rpmbuild -bs jellyfin-web.spec                                                \
+	         --define "_sourcedir $$PWD/"                                         \
+	         --define "_srcrpmdir $(outdir)"

fedora/jellyfin-web.spec

@@ -0,0 +1,53 @@
+%global         debug_package %{nil}
+
+Name:           jellyfin-web
+Version:        10.6.4
+Release:        1%{?dist}
+Summary:        The Free Software Media System web client
+License:        GPLv3
+URL:            https://jellyfin.org
+# Jellyfin Server tarball created by `make -f .copr/Makefile srpm`, real URL ends with `v%{version}.tar.gz`
+Source0:        jellyfin-web-%{version}.tar.gz
+
+%if 0%{?centos}
+BuildRequires:  yarn
+# sadly the yarn RPM at https://dl.yarnpkg.com/rpm/ uses git but doesn't Requires: it
+BuildRequires: git
+%else
+BuildRequires:  nodejs-yarn
+%endif
+BuildArch:		noarch
+
+# Disable Automatic Dependency Processing
+AutoReqProv:    no
+
+%description
+Jellyfin is a free software media system that puts you in control of managing and streaming your media.
+
+
+%prep
+%autosetup -n jellyfin-web-%{version} -b 0
+
+%build
+
+%install
+yarn install
+%{__mkdir} -p %{buildroot}%{_datadir}
+mv dist %{buildroot}%{_datadir}/jellyfin-web
+%{__install} -D -m 0644 LICENSE %{buildroot}%{_datadir}/licenses/jellyfin/LICENSE
+
+%files
+%attr(755,root,root) %{_datadir}/jellyfin-web
+%{_datadir}/licenses/jellyfin/LICENSE
+
+%changelog
+* Sun Aug 30 2020 Jellyfin Packaging Team <packaging@jellyfin.org>
+- New upstream version 10.6.4; release changelog at https://github.com/jellyfin/jellyfin-web/releases/tag/v10.6.4
+* Sun Aug 16 2020 Jellyfin Packaging Team <packaging@jellyfin.org>
+- New upstream version 10.6.3; release changelog at https://github.com/jellyfin/jellyfin-web/releases/tag/v10.6.3
+* Sun Aug 02 2020 Jellyfin Packaging Team <packaging@jellyfin.org>
+- New upstream version 10.6.2; release changelog at https://github.com/jellyfin/jellyfin-web/releases/tag/v10.6.2
+* Mon Jul 27 2020 Jellyfin Packaging Team <packaging@jellyfin.org>
+- New upstream version 10.6.1; release changelog at https://github.com/jellyfin/jellyfin-web/releases/tag/v10.6.1
+* Mon Mar 23 2020 Jellyfin Packaging Team <packaging@jellyfin.org>
+- Forthcoming stable release

flake.lock

@@ -1,60 +0,0 @@
-{
-  "nodes": {
-    "flake-utils": {
-      "inputs": {
-        "systems": "systems"
-      },
-      "locked": {
-        "lastModified": 1731533236,
-        "narHash": "sha256-l0KFg5HjrsfsO/JpG+r7fRrqm12kzFHyUHqHCVpMMbI=",
-        "owner": "numtide",
-        "repo": "flake-utils",
-        "rev": "11707dc2f618dd54ca8739b309ec4fc024de578b",
-        "type": "github"
-      },
-      "original": {
-        "owner": "numtide",
-        "repo": "flake-utils",
-        "type": "github"
-      }
-    },
-    "nixpkgs": {
-      "locked": {
-        "lastModified": 1739874174,
-        "narHash": "sha256-XGxSVtojlwjYRYGvGXex0Cw+/363EVJlbY9TPX9bARk=",
-        "owner": "nixos",
-        "repo": "nixpkgs",
-        "rev": "d2ab2691c798f6b633be91d74b1626980ddaff30",
-        "type": "github"
-      },
-      "original": {
-        "owner": "nixos",
-        "repo": "nixpkgs",
-        "type": "github"
-      }
-    },
-    "root": {
-      "inputs": {
-        "flake-utils": "flake-utils",
-        "nixpkgs": "nixpkgs"
-      }
-    },
-    "systems": {
-      "locked": {
-        "lastModified": 1681028828,
-        "narHash": "sha256-Vy1rq5AaRuLzOxct8nz4T6wlgyUR7zLU309k9mBC768=",
-        "owner": "nix-systems",
-        "repo": "default",
-        "rev": "da67096a3b9bf56a91d16901293e51ba5b49a27e",
-        "type": "github"
-      },
-      "original": {
-        "owner": "nix-systems",
-        "repo": "default",
-        "type": "github"
-      }
-    }
-  },
-  "root": "root",
-  "version": 7
-}

flake.nix

@@ -1,34 +0,0 @@
-{
-  description = "jellyfin-web nix flake";
-
-  inputs = {
-    nixpkgs.url = "github:nixos/nixpkgs";
-    flake-utils.url = "github:numtide/flake-utils";
-  };
-
-  outputs = {
-    self,
-    nixpkgs,
-    flake-utils,
-  }:
-    flake-utils.lib.eachDefaultSystem (
-      system: let
-        pkgs = import nixpkgs {
-          inherit system;
-        };
-      in {
-        devShell = with pkgs;
-          mkShell rec {
-            buildInputs = [
-              nodejs_20
-            ];
-
-            shellHook = ''
-              # Also see: https://github.com/sass/embedded-host-node/issues/334
-              echo "Removing sass-embedded from node-modules as its broken on NixOS."
-              rm -rf node_modules/sass-embedded*
-            '';
-          };
-      }
-    );
-}

gulpfile.js

@@ -0,0 +1,204 @@
+const { src, dest, series, parallel, watch } = require('gulp');
+const browserSync = require('browser-sync').create();
+const del = require('del');
+const babel = require('gulp-babel');
+const concat = require('gulp-concat');
+const terser = require('gulp-terser');
+const htmlmin = require('gulp-htmlmin');
+const imagemin = require('gulp-imagemin');
+const sourcemaps = require('gulp-sourcemaps');
+const mode = require('gulp-mode')({
+    modes: ['development', 'production'],
+    default: 'development',
+    verbose: false
+});
+const stream = require('webpack-stream');
+const inject = require('gulp-inject');
+const postcss = require('gulp-postcss');
+const sass = require('gulp-sass');
+const gulpif = require('gulp-if');
+const lazypipe = require('lazypipe');
+
+sass.compiler = require('node-sass');
+
+let config;
+if (mode.production()) {
+    config = require('./webpack.prod.js');
+} else {
+    config = require('./webpack.dev.js');
+}
+
+const options = {
+    javascript: {
+        query: ['src/**/*.js', '!src/bundle.js', '!src/standalone.js', '!src/scripts/apploader.js']
+    },
+    apploader: {
+        query: ['src/standalone.js', 'src/scripts/apploader.js']
+    },
+    css: {
+        query: ['src/**/*.css', 'src/**/*.scss']
+    },
+    html: {
+        query: ['src/**/*.html', '!src/index.html']
+    },
+    images: {
+        query: ['src/**/*.png', 'src/**/*.jpg', 'src/**/*.gif', 'src/**/*.svg']
+    },
+    copy: {
+        query: ['src/**/*.json', 'src/**/*.ico', 'src/**/*.mp3']
+    },
+    injectBundle: {
+        query: 'src/index.html'
+    }
+};
+
+function serve() {
+    browserSync.init({
+        server: {
+            baseDir: './dist'
+        },
+        port: 8080
+    });
+
+    const events = ['add', 'change'];
+
+    watch(options.javascript.query).on('all', function (event, path) {
+        if (events.includes(event)) {
+            javascript(path);
+        }
+    });
+
+    watch(options.apploader.query, apploader(true));
+
+    watch('src/bundle.js', webpack);
+
+    watch(options.css.query).on('all', function (event, path) {
+        if (events.includes(event)) {
+            css(path);
+        }
+    });
+
+    watch(options.html.query).on('all', function (event, path) {
+        if (events.includes(event)) {
+            html(path);
+        }
+    });
+
+    watch(options.images.query).on('all', function (event, path) {
+        if (events.includes(event)) {
+            images(path);
+        }
+    });
+
+    watch(options.copy.query).on('all', function (event, path) {
+        if (events.includes(event)) {
+            copy(path);
+        }
+    });
+
+    watch(options.injectBundle.query, injectBundle);
+}
+
+function clean() {
+    return del(['dist/']);
+}
+
+const pipelineJavascript = lazypipe()
+    .pipe(function () {
+        return mode.development(sourcemaps.init({ loadMaps: true }));
+    })
+    .pipe(function () {
+        return babel({
+            presets: [
+                ['@babel/preset-env']
+            ]
+        });
+    })
+    .pipe(function () {
+        return terser({
+            keep_fnames: true,
+            mangle: false
+        });
+    })
+    .pipe(function () {
+        return mode.development(sourcemaps.write('.'));
+    });
+
+function javascript(query) {
+    return src(typeof query !== 'function' ? query : options.javascript.query, { base: './src/' })
+        .pipe(pipelineJavascript())
+        .pipe(dest('dist/'))
+        .pipe(browserSync.stream());
+}
+
+function apploader(standalone) {
+    function task() {
+        return src(options.apploader.query, { base: './src/' })
+            .pipe(gulpif(standalone, concat('scripts/apploader.js')))
+            .pipe(pipelineJavascript())
+            .pipe(dest('dist/'))
+            .pipe(browserSync.stream());
+    }
+
+    task.displayName = 'apploader';
+
+    return task;
+}
+
+function webpack() {
+    return stream(config)
+        .pipe(dest('dist/'))
+        .pipe(browserSync.stream());
+}
+
+function css(query) {
+    return src(typeof query !== 'function' ? query : options.css.query, { base: './src/' })
+        .pipe(mode.development(sourcemaps.init({ loadMaps: true })))
+        .pipe(sass().on('error', sass.logError))
+        .pipe(postcss())
+        .pipe(mode.development(sourcemaps.write('.')))
+        .pipe(dest('dist/'))
+        .pipe(browserSync.stream());
+}
+
+function html(query) {
+    return src(typeof query !== 'function' ? query : options.html.query, { base: './src/' })
+        .pipe(mode.production(htmlmin({ collapseWhitespace: true })))
+        .pipe(dest('dist/'))
+        .pipe(browserSync.stream());
+}
+
+function images(query) {
+    return src(typeof query !== 'function' ? query : options.images.query, { base: './src/' })
+        .pipe(mode.production(imagemin()))
+        .pipe(dest('dist/'))
+        .pipe(browserSync.stream());
+}
+
+function copy(query) {
+    return src(typeof query !== 'function' ? query : options.copy.query, { base: './src/' })
+        .pipe(dest('dist/'))
+        .pipe(browserSync.stream());
+}
+
+function injectBundle() {
+    return src(options.injectBundle.query, { base: './src/' })
+        .pipe(inject(
+            src(['src/scripts/apploader.js'], { read: false }, { base: './src/' }), {
+                relative: true,
+                transform: function (filepath) {
+                    return `<script src="${filepath}" defer></script>`;
+                }
+            }
+        ))
+        .pipe(dest('dist/'))
+        .pipe(browserSync.stream());
+}
+
+function build(standalone) {
+    return series(clean, parallel(javascript, apploader(standalone), webpack, css, html, images, copy));
+}
+
+exports.default = series(build(false), injectBundle);
+exports.standalone = series(build(true), injectBundle);
+exports.serve = series(exports.standalone, serve);

package.json

@@ -1,141 +1,150 @@
 {
   "name": "jellyfin-web",
-  "version": "10.12.0",
+  "version": "0.0.0",
   "description": "Web interface for Jellyfin",
   "repository": "https://github.com/jellyfin/jellyfin-web",
   "license": "GPL-2.0-or-later",
   "devDependencies": {
-    "@babel/core": "7.27.4",
-    "@babel/plugin-transform-modules-umd": "7.27.1",
-    "@babel/preset-env": "7.27.2",
-    "@babel/preset-react": "7.27.1",
-    "@eslint-community/eslint-plugin-eslint-comments": "4.5.0",
-    "@eslint/js": "9.30.1",
-    "@stylistic/eslint-plugin": "5.6.1",
-    "@stylistic/stylelint-plugin": "3.1.3",
-    "@types/dompurify": "3.0.5",
-    "@types/escape-html": "1.0.4",
-    "@types/loadable__component": "5.13.9",
-    "@types/lodash-es": "4.17.12",
-    "@types/markdown-it": "14.1.2",
-    "@types/react": "18.3.23",
-    "@types/react-dom": "18.3.7",
-    "@types/react-lazy-load-image-component": "1.6.4",
-    "@types/sortablejs": "1.15.8",
-    "@typescript-eslint/parser": "8.35.1",
-    "@uupaa/dynamic-import-polyfill": "1.0.2",
-    "@vitest/coverage-v8": "3.2.4",
-    "autoprefixer": "10.4.21",
-    "babel-loader": "10.0.0",
-    "clean-webpack-plugin": "4.0.0",
-    "confusing-browser-globals": "1.0.11",
-    "copy-webpack-plugin": "13.0.0",
-    "cross-env": "7.0.3",
-    "css-loader": "7.1.2",
-    "cssnano": "7.0.7",
-    "es-check": "9.1.4",
-    "eslint": "9.30.1",
-    "eslint-plugin-compat": "6.0.2",
-    "eslint-plugin-import": "2.32.0",
-    "eslint-plugin-jsx-a11y": "6.10.2",
-    "eslint-plugin-react": "7.37.5",
-    "eslint-plugin-react-hooks": "7.0.1",
-    "eslint-plugin-sonarjs": "3.0.4",
-    "expose-loader": "5.0.1",
-    "fast-glob": "3.3.3",
-    "fork-ts-checker-webpack-plugin": "9.1.0",
-    "globals": "16.2.0",
-    "html-loader": "5.1.0",
-    "html-webpack-plugin": "5.6.3",
-    "jsdom": "26.1.0",
-    "mini-css-extract-plugin": "2.9.2",
-    "postcss": "8.5.6",
-    "postcss-loader": "8.1.1",
-    "postcss-preset-env": "10.2.3",
-    "postcss-scss": "4.0.9",
-    "sass": "1.89.2",
-    "sass-loader": "16.0.5",
-    "source-map-loader": "5.0.0",
-    "speed-measure-webpack-plugin": "1.5.0",
-    "style-loader": "4.0.0",
-    "stylelint": "16.21.0",
-    "stylelint-config-rational-order": "0.1.2",
-    "stylelint-no-browser-hacks": "2.0.0",
-    "stylelint-order": "7.0.0",
-    "stylelint-scss": "6.12.1",
-    "ts-loader": "9.5.2",
-    "typescript": "5.8.3",
-    "typescript-eslint": "8.35.1",
-    "vite-tsconfig-paths": "5.1.4",
-    "vitest": "3.2.4",
-    "webpack": "5.99.9",
-    "webpack-bundle-analyzer": "4.10.2",
-    "webpack-cli": "6.0.1",
-    "webpack-dev-server": "5.2.2",
-    "webpack-merge": "6.0.1",
-    "worker-loader": "3.0.8"
+    "@babel/core": "^7.10.3",
+    "@babel/plugin-proposal-class-properties": "^7.10.1",
+    "@babel/plugin-proposal-private-methods": "^7.10.1",
+    "@babel/plugin-transform-modules-amd": "^7.9.6",
+    "@babel/polyfill": "^7.8.7",
+    "@babel/preset-env": "^7.10.3",
+    "autoprefixer": "^9.8.5",
+    "babel-eslint": "^11.0.0-beta.2",
+    "babel-loader": "^8.0.6",
+    "browser-sync": "^2.26.7",
+    "copy-webpack-plugin": "^5.1.1",
+    "css-loader": "^3.6.0",
+    "cssnano": "^4.1.10",
+    "del": "^5.1.0",
+    "eslint": "^6.8.0",
+    "eslint-plugin-compat": "^3.5.1",
+    "eslint-plugin-eslint-comments": "^3.2.0",
+    "eslint-plugin-import": "^2.21.2",
+    "eslint-plugin-promise": "^4.2.1",
+    "file-loader": "^6.0.0",
+    "gulp": "^4.0.2",
+    "gulp-babel": "^8.0.0",
+    "gulp-cli": "^2.3.0",
+    "gulp-concat": "^2.6.1",
+    "gulp-htmlmin": "^5.0.1",
+    "gulp-if": "^3.0.0",
+    "gulp-imagemin": "^7.1.0",
+    "gulp-inject": "^5.0.5",
+    "gulp-mode": "^1.0.2",
+    "gulp-postcss": "^8.0.0",
+    "gulp-sass": "^4.0.2",
+    "gulp-sourcemaps": "^2.6.5",
+    "gulp-terser": "^1.2.0",
+    "html-webpack-plugin": "^4.3.0",
+    "lazypipe": "^1.0.2",
+    "node-sass": "^4.13.1",
+    "postcss-loader": "^3.0.0",
+    "postcss-preset-env": "^6.7.0",
+    "style-loader": "^1.1.3",
+    "stylelint": "^13.6.1",
+    "stylelint-config-rational-order": "^0.1.2",
+    "stylelint-no-browser-hacks": "^1.2.1",
+    "stylelint-order": "^4.1.0",
+    "webpack": "^4.41.5",
+    "webpack-merge": "^4.2.2",
+    "webpack-stream": "^5.2.1"
   },
   "dependencies": {
-    "@emotion/react": "11.14.0",
-    "@emotion/styled": "11.14.0",
-    "@fontsource/noto-sans": "5.2.7",
-    "@fontsource/noto-sans-hk": "5.2.6",
-    "@fontsource/noto-sans-jp": "5.2.6",
-    "@fontsource/noto-sans-kr": "5.2.6",
-    "@fontsource/noto-sans-sc": "5.2.6",
-    "@fontsource/noto-sans-tc": "5.2.6",
-    "@jellyfin/libass-wasm": "4.2.3",
-    "@jellyfin/sdk": "0.0.0-unstable.202512091852",
-    "@jellyfin/ux-web": "1.0.0",
-    "@mui/icons-material": "6.4.12",
-    "@mui/material": "6.4.12",
-    "@mui/x-date-pickers": "7.29.4",
-    "@react-hook/resize-observer": "2.0.2",
-    "@tanstack/react-query": "5.80.10",
-    "@tanstack/react-query-devtools": "5.80.10",
-    "abortcontroller-polyfill": "1.7.8",
-    "blurhash": "2.0.5",
+    "alameda": "^1.4.0",
+    "blurhash": "^1.1.3",
     "classlist.js": "https://github.com/eligrey/classList.js/archive/1.2.20180112.tar.gz",
-    "classnames": "2.5.1",
-    "core-js": "3.43.0",
-    "date-fns": "2.30.0",
-    "dompurify": "2.5.8",
-    "element-closest-polyfill": "1.0.7",
-    "epubjs": "0.3.93",
-    "escape-html": "1.0.3",
-    "fast-text-encoding": "1.0.6",
-    "flv.js": "1.6.2",
-    "headroom.js": "0.12.0",
-    "history": "5.3.0",
-    "hls.js": "1.6.13",
-    "intersection-observer": "0.12.2",
-    "jellyfin-apiclient": "1.11.0",
-    "jquery": "3.7.1",
-    "jstree": "3.3.17",
-    "libarchive.js": "2.0.2",
-    "libpgs": "0.8.1",
-    "lodash-es": "4.17.21",
-    "markdown-it": "14.1.0",
-    "material-design-icons-iconfont": "6.7.0",
-    "material-react-table": "3.2.1",
-    "native-promise-only": "0.8.1",
-    "pdfjs-dist": "3.11.174",
-    "proxy-polyfill": "0.3.2",
-    "react": "18.3.1",
-    "react-blurhash": "0.3.0",
-    "react-dom": "18.3.1",
-    "react-lazy-load-image-component": "1.6.3",
-    "react-router-dom": "6.30.1",
-    "resize-observer-polyfill": "1.5.1",
-    "screenfull": "6.0.2",
-    "sortablejs": "1.15.6",
-    "swiper": "11.2.8",
-    "usehooks-ts": "3.1.1",
-    "webcomponents.js": "0.7.24",
-    "whatwg-fetch": "3.6.20"
+    "core-js": "^3.6.5",
+    "date-fns": "^2.14.0",
+    "epubjs": "^0.3.85",
+    "fast-text-encoding": "^1.0.3",
+    "flv.js": "^1.5.0",
+    "headroom.js": "^0.11.0",
+    "hls.js": "^0.14.0",
+    "howler": "^2.2.0",
+    "intersection-observer": "^0.11.0",
+    "jellyfin-apiclient": "^1.4.1",
+    "jellyfin-noto": "https://github.com/jellyfin/jellyfin-noto",
+    "jquery": "^3.5.1",
+    "jstree": "^3.3.10",
+    "libass-wasm": "https://github.com/jellyfin/JavascriptSubtitlesOctopus#4.0.0-jf-smarttv",
+    "material-design-icons-iconfont": "^5.0.1",
+    "native-promise-only": "^0.8.0-a",
+    "page": "^1.11.6",
+    "query-string": "^6.13.1",
+    "resize-observer-polyfill": "^1.5.1",
+    "screenfull": "^5.0.2",
+    "shaka-player": "^2.5.13",
+    "sortablejs": "^1.10.2",
+    "swiper": "^5.4.5",
+    "webcomponents.js": "^0.7.24",
+    "whatwg-fetch": "^3.2.0"
   },
-  "optionalDependencies": {
-    "sass-embedded": "1.89.2"
+  "babel": {
+    "presets": [
+      "@babel/preset-env"
+    ],
+    "overrides": [
+      {
+        "test": [
+          "src/components/accessSchedule/accessSchedule.js",
+          "src/components/actionSheet/actionSheet.js",
+          "src/components/autoFocuser.js",
+          "src/components/cardbuilder/cardBuilder.js",
+          "src/components/cardbuilder/chaptercardbuilder.js",
+          "src/components/cardbuilder/peoplecardbuilder.js",
+          "src/components/images/imageLoader.js",
+          "src/components/indicators/indicators.js",
+          "src/components/lazyLoader/lazyLoaderIntersectionObserver.js",
+          "src/components/playback/brightnessosd.js",
+          "src/components/playback/mediasession.js",
+          "src/components/playback/nowplayinghelper.js",
+          "src/components/playback/playbackorientation.js",
+          "src/components/playback/playerSelectionMenu.js",
+          "src/components/playback/playersettingsmenu.js",
+          "src/components/playback/playmethodhelper.js",
+          "src/components/playback/remotecontrolautoplay.js",
+          "src/components/playback/volumeosd.js",
+          "src/components/playmenu.js",
+          "src/components/sanatizefilename.js",
+          "src/components/scrollManager.js",
+          "src/components/syncPlay/groupSelectionMenu.js",
+          "src/components/syncPlay/playbackPermissionManager.js",
+          "src/components/syncPlay/syncPlayManager.js",
+          "src/components/syncPlay/timeSyncManager.js",
+          "src/controllers/dashboard/logs.js",
+          "src/controllers/dashboard/plugins/repositories.js",
+          "src/controllers/user/display.js",
+          "src/controllers/user/home.js",
+          "src/controllers/user/playback.js",
+          "src/controllers/user/subtitles.js",
+          "src/plugins/bookPlayer/plugin.js",
+          "src/plugins/bookPlayer/tableOfContents.js",
+          "src/plugins/photoPlayer/plugin.js",
+          "src/scripts/deleteHelper.js",
+          "src/scripts/dfnshelper.js",
+          "src/scripts/dom.js",
+          "src/scripts/fileDownloader.js",
+          "src/scripts/filesystem.js",
+          "src/scripts/imagehelper.js",
+          "src/scripts/inputManager.js",
+          "src/plugins/backdropScreensaver/plugin.js",
+          "src/components/filterdialog/filterdialog.js",
+          "src/components/fetchhelper.js",
+          "src/scripts/keyboardNavigation.js",
+          "src/scripts/settings/appSettings.js",
+          "src/scripts/settings/userSettings.js",
+          "src/scripts/settings/webSettings.js"
+        ],
+        "plugins": [
+          "@babel/plugin-transform-modules-amd",
+          "@babel/plugin-proposal-class-properties",
+          "@babel/plugin-proposal-private-methods"
+        ]
+      }
+    ]
   },
   "browserslist": [
     "last 2 Firefox versions",
@@ -154,22 +163,12 @@
     "Firefox ESR"
   ],
   "scripts": {
-    "start": "npm run serve",
-    "serve": "webpack serve --config webpack.dev.js",
-    "build:analyze": "cross-env NODE_ENV=\"production\" webpack --config webpack.analyze.js",
-    "build:development": "webpack --config webpack.dev.js",
-    "build:production": "cross-env NODE_ENV=\"production\" webpack --config webpack.prod.js",
-    "build:check": "tsc --noEmit",
-    "build:es-check": "npm run build:production && npm run escheck",
-    "escheck": "es-check",
-    "lint": "eslint",
-    "test": "vitest --watch=false --config vite.config.ts",
-    "test:watch": "vitest --config vite.config.ts",
-    "stylelint": "stylelint \"src/**/*.{css,scss}\""
-  },
-  "engines": {
-    "node": ">=20.0.0",
-    "npm": ">=9.6.4 <11.0.0",
-    "yarn": "YARN NO LONGER USED - use npm instead."
+    "serve": "gulp serve --development",
+    "prepare": "gulp --production",
+    "build:development": "gulp --development",
+    "build:production": "gulp --production",
+    "build:standalone": "gulp standalone --development",
+    "lint": "eslint \".\"",
+    "stylelint": "stylelint \"src/**/*.css\""
   }
 }

postcss.config.js

@@ -7,8 +7,8 @@ const config = () => ({
     plugins: [
         // Explicitly specify browserslist to override ones from node_modules
         // For example, Swiper has it in its package.json
-        postcssPresetEnv({ browsers: packageConfig.browserslist }),
-        autoprefixer({ overrideBrowserslist: packageConfig.browserslist }),
+        postcssPresetEnv({browsers: packageConfig.browserslist}),
+        autoprefixer({overrideBrowserslist: packageConfig.browserslist}),
         cssnano()
     ]
 });

scripts/duplicates.py

@@ -1,33 +0,0 @@
-import sys
-import os
-import json
-
-# load every string in the source language
-# print all duplicate values to a file
-
-cwd = os.getcwd()
-source = cwd + '/../src/strings/en-us.json'
-
-reverse = {}
-duplicates = {}
-
-with open(source) as en:
-    strings = json.load(en)
-    for key, value in strings.items():
-        if value not in reverse:
-            reverse[value] = [key]
-        else:
-            reverse[value].append(key)
-
-for key, value in reverse.items():
-    if len(value) > 1:
-        duplicates[key] = value
-
-print('LENGTH: ' + str(len(duplicates)))
-with open('duplicates.txt', 'w') as out:
-    for item in duplicates:
-      out.write(json.dumps(item) + ': ')
-      out.write(json.dumps(duplicates[item]) + '\n')
-    out.close()
-
-print('DONE')

scripts/scgen.py

@@ -16,7 +16,7 @@ langlst.append('en-us.json')
 dep = []
 
 def grep(key):
-    command = 'grep -r -E "(\\\"|\'|\{)%s(\\\"|\'|\})" --include=\*.{js,html} --exclude-dir=../src/strings ../src' % key
+    command = 'grep -r -E "(\(\\\"|\(\'|\{)%s(\\\"|\'|\})" --include=\*.{js,html} --exclude-dir=../src/strings ../src' % key
     p = subprocess.Popen(command, shell=True, stdout=subprocess.PIPE, stderr=subprocess.STDOUT)
     output = p.stdout.readlines()
     if output:

scripts/scrm.py

@@ -11,7 +11,7 @@ langlst = os.listdir(langdir)
 
 keys = []
 
-with open('unused.txt', 'r') as f:
+with open('scout.txt', 'r') as f:
     for line in f:
         keys.append(line.strip('\n'))
 

src/RootApp.tsx

@@ -1,31 +0,0 @@
-import { QueryClientProvider } from '@tanstack/react-query';
-import { ReactQueryDevtools } from '@tanstack/react-query-devtools';
-import React from 'react';
-
-import { ApiProvider } from 'hooks/useApi';
-import { UserSettingsProvider } from 'hooks/useUserSettings';
-import { WebConfigProvider } from 'hooks/useWebConfig';
-import browser from 'scripts/browser';
-import { queryClient } from 'utils/query/queryClient';
-
-import RootAppRouter from 'RootAppRouter';
-
-const useReactQueryDevtools = window.Proxy // '@tanstack/query-devtools' requires 'Proxy', which cannot be polyfilled for legacy browsers
-    && !browser.tv; // Don't use devtools on the TV as the navigation is weird
-
-const RootApp = () => (
-    <QueryClientProvider client={queryClient}>
-        <ApiProvider>
-            <UserSettingsProvider>
-                <WebConfigProvider>
-                    <RootAppRouter />
-                </WebConfigProvider>
-            </UserSettingsProvider>
-        </ApiProvider>
-        {useReactQueryDevtools && (
-            <ReactQueryDevtools initialIsOpen={false} />
-        )}
-    </QueryClientProvider>
-);
-
-export default RootApp;

src/RootAppRouter.tsx

@@ -1,69 +0,0 @@
-import { ThemeProvider } from '@mui/material/styles';
-import React from 'react';
-import {
-    RouterProvider,
-    createHashRouter,
-    Outlet,
-    useLocation
-} from 'react-router-dom';
-
-import { DASHBOARD_APP_PATHS, DASHBOARD_APP_ROUTES } from 'apps/dashboard/routes/routes';
-import { EXPERIMENTAL_APP_ROUTES } from 'apps/experimental/routes/routes';
-import { STABLE_APP_ROUTES } from 'apps/stable/routes/routes';
-import { WIZARD_APP_ROUTES } from 'apps/wizard/routes/routes';
-import AppHeader from 'components/AppHeader';
-import Backdrop from 'components/Backdrop';
-import { SETTING_KEY as LAYOUT_SETTING_KEY } from 'components/layoutManager';
-import BangRedirect from 'components/router/BangRedirect';
-import { createRouterHistory } from 'components/router/routerHistory';
-import { LayoutMode } from 'constants/layoutMode';
-import browser from 'scripts/browser';
-import appTheme from 'themes';
-import { ThemeStorageManager } from 'themes/themeStorageManager';
-
-const layoutMode = browser.tv ? LayoutMode.Tv : localStorage.getItem(LAYOUT_SETTING_KEY);
-const isExperimentalLayout = !layoutMode || layoutMode === LayoutMode.Experimental;
-
-const router = createHashRouter([
-    {
-        element: <RootAppLayout />,
-        children: [
-            ...(isExperimentalLayout ? EXPERIMENTAL_APP_ROUTES : STABLE_APP_ROUTES),
-            ...DASHBOARD_APP_ROUTES,
-            ...WIZARD_APP_ROUTES,
-            {
-                path: '!/*',
-                Component: BangRedirect
-            }
-        ]
-    }
-]);
-
-export const history = createRouterHistory(router);
-
-export default function RootAppRouter() {
-    return <RouterProvider router={router} />;
-}
-
-/**
- * Layout component that renders legacy components required on all pages.
- * NOTE: The app will crash if these get removed from the DOM.
- */
-function RootAppLayout() {
-    const location = useLocation();
-    const isNewLayoutPath = Object.values(DASHBOARD_APP_PATHS)
-        .some(path => location.pathname.startsWith(`/${path}`));
-
-    return (
-        <ThemeProvider
-            theme={appTheme}
-            defaultMode='dark'
-            storageManager={ThemeStorageManager}
-        >
-            <Backdrop />
-            <AppHeader isHidden={isExperimentalLayout || isNewLayoutPath} />
-
-            <Outlet />
-        </ThemeProvider>
-    );
-}

src/addplugin.html

@@ -0,0 +1,49 @@
+<div id="addPluginPage" data-role="page" class="page type-interior pluginConfigurationPage" data-backbutton="true">
+    <div>
+        <div class="content-primary">
+            <div class="readOnlyContent">
+                <div class="verticalSection">
+                    <div class="sectionTitleContainer flex align-items-center">
+                        <h1 class="sectionTitle pluginName"></h1>
+                        <a is="emby-linkbutton" rel="noopener noreferrer" class="raised button-alt headerHelpButton" target="_blank" href="https://docs.jellyfin.org/general/server/plugins/index.html">${Help}</a>
+                    </div>
+
+                    <p id="overview" style="font-style: italic;"></p>
+                    <p id="description"></p>
+                </div>
+
+                <div class="verticalSection">
+                    <h2 class="sectionTitle">${HeaderInstall}</h2>
+
+                    <form class="addPluginForm">
+                        <p id="pCurrentVersion"></p>
+                        <div id="pSelectVersion" class="hide selectContainer">
+                            <select id="selectVersion" name="selectVersion" is="emby-select" label="${LabelSelectVersionToInstall}"></select>
+                        </div>
+
+                        <div id="btnInstallDiv" class="hide">
+                            <button is="emby-button" type="submit" id="btnInstall" class="raised button-submit block">
+                                <span>${Install}</span>
+                            </button>
+                            <div class="fieldDescription">${ServerRestartNeededAfterPluginInstall}</div>
+                        </div>
+                    </form>
+                </div>
+            </div>
+            <br />
+            <div class="readOnlyContent">
+                <div is="emby-collapse" title="${HeaderDeveloperInfo}">
+                    <div class="collapseContent">
+                        <p id="developer"></p>
+                    </div>
+                </div>
+
+                <div is="emby-collapse" title="${HeaderRevisionHistory}">
+                    <div class="collapseContent">
+                        <div id="revisionHistory"></div>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+</div>

src/addserver.html

@@ -8,7 +8,7 @@
             </div>
             <br />
             <button is="emby-button" type="submit" class="raised button-submit block">
-                <span>${Connect}</span>
+                <span>${ButtonConnect}</span>
             </button>
             <button is="emby-button" type="button" class="raised button-cancel block btnCancel">
                 <span>${ButtonCancel}</span>

src/apiclient.d.ts

@@ -1,362 +0,0 @@
-/* eslint-disable @typescript-eslint/no-explicit-any */
-declare module 'jellyfin-apiclient' {
-    import type {
-        AllThemeMediaResult,
-        AuthenticationResult,
-        BaseItemDto,
-        BaseItemDtoQueryResult,
-        BufferRequestDto,
-        ClientCapabilities,
-        CountryInfo,
-        CultureDto,
-        DeviceOptions,
-        DisplayPreferencesDto,
-        EndPointInfo,
-        FileSystemEntryInfo,
-        GeneralCommand,
-        GroupInfoDto,
-        GuideInfo,
-        IgnoreWaitRequestDto,
-        ImageInfo,
-        ImageProviderInfo,
-        ImageType,
-        ItemCounts,
-        LiveTvInfo,
-        MovePlaylistItemRequestDto,
-        NewGroupRequestDto,
-        NextItemRequestDto,
-        NotificationResultDto,
-        NotificationsSummaryDto,
-        ParentalRating,
-        PingRequestDto,
-        PlaybackInfoResponse,
-        PlaybackProgressInfo,
-        PlaybackStartInfo,
-        PlaybackStopInfo,
-        PlayCommand,
-        PlaystateCommand,
-        PluginInfo,
-        PluginSecurityInfo,
-        PreviousItemRequestDto,
-        QueryFiltersLegacy,
-        QueueRequestDto,
-        QuickConnectResult,
-        QuickConnectState,
-        ReadyRequestDto,
-        RecommendationDto,
-        RemoteImageResult,
-        RemoveFromPlaylistRequestDto,
-        SearchHintResult,
-        SeekRequestDto,
-        SeriesTimerInfoDto,
-        SeriesTimerInfoDtoQueryResult,
-        ServerConfiguration,
-        SessionInfo,
-        SetPlaylistItemRequestDto,
-        SetRepeatModeRequestDto,
-        SetShuffleModeRequestDto,
-        SystemInfo,
-        TaskInfo,
-        TaskTriggerInfo,
-        TimerInfoDto,
-        TimerInfoDtoQueryResult,
-        UserConfiguration,
-        UserDto,
-        UserItemDataDto,
-        UserPolicy,
-        UtcTimeResponse,
-        VirtualFolderInfo
-    } from '@jellyfin/sdk/lib/generated-client';
-    import type { ConnectionState } from 'lib/jellyfin-apiclient';
-
-    class ApiClient {
-        constructor(serverAddress: string, appName: string, appVersion: string, deviceName: string, deviceId: string);
-
-        accessToken(): string;
-        addMediaPath(virtualFolderName: string, mediaPath: string, networkSharePath: string, refreshLibrary?: boolean): Promise<void>;
-        addVirtualFolder(name: string, type?: string, refreshLibrary?: boolean, libraryOptions?: any): Promise<void>;
-        ajax(request: any): Promise<any>;
-        appName(): string;
-        appVersion(): string;
-        authenticateUserByName(name: string, password: string): Promise<AuthenticationResult>;
-        cancelLiveTvSeriesTimer(id: string): Promise<void>;
-        cancelLiveTvTimer(id: string): Promise<void>;
-        cancelSyncItems(itemIds: string[], targetId?: string): Promise<void>;
-        clearAuthenticationInfo(): void;
-        clearUserItemRating(userId: string, itemId: string): Promise<UserItemDataDto>;
-        closeWebSocket(): void;
-        createLiveTvSeriesTimer(item: string): Promise<void>;
-        createLiveTvTimer(item: string): Promise<void>;
-        createPackageReview(review: any): Promise<any>;
-        createSyncPlayGroup(options?: NewGroupRequestDto): Promise<void>;
-        createUser(user: UserDto): Promise<UserDto>;
-        deleteDevice(deviceId: string): Promise<void>;
-        deleteItemImage(itemId: string, imageType: ImageType, imageIndex?: number): Promise<void>;
-        deleteItem(itemId: string): Promise<void>;
-        deleteLiveTvRecording(id: string): Promise<void>;
-        deleteUserImage(userId: string, imageType: ImageType, imageIndex?: number): Promise<void>;
-        deleteUser(userId: string): Promise<void>;
-        detectBitrate(force: boolean): Promise<number>;
-        deviceId(): string;
-        deviceName(): string;
-        disablePlugin(id: string, version: string): Promise<void>;
-        downloadRemoteImage(options: any): Promise<void>;
-        enablePlugin(id: string, version: string): Promise<void>;
-        encodeName(name: string): string;
-        ensureWebSocket(): void;
-        fetch(request: any, includeAuthorization?: boolean): Promise<any>;
-        fetchWithFailover(request: any, enableReconnection?: boolean): Promise<any>;
-        getAdditionalVideoParts(userId?: string, itemId: string): Promise<BaseItemDtoQueryResult>;
-        getAlbumArtists(userId: string, options?: any): Promise<BaseItemDtoQueryResult>;
-        getAncestorItems(itemId: string, userId?: string): Promise<BaseItemDto[]>;
-        getArtist(name: string, userId?: string): Promise<BaseItemDto>;
-        getArtists(userId: string, options?: any): Promise<BaseItemDtoQueryResult>;
-        getAvailablePlugins(options?: any): Promise<PluginInfo[]>;
-        getAvailableRemoteImages(options: any): Promise<RemoteImageResult>;
-        getContentUploadHistory(): Promise<any>;
-        getCountries(): Promise<CountryInfo[]>;
-        getCriticReviews(itemId: string, options?: any): Promise<BaseItemDtoQueryResult>;
-        getCultures(): Promise<CultureDto[]>;
-        getCurrentUser(cache?: boolean): Promise<UserDto>;
-        getCurrentUserId(): string;
-        getDateParamValue(date: Date): string;
-        getDefaultImageQuality(imageType: ImageType): number;
-        getDevicesOptions(): Promise<DeviceOptions>;
-        getDirectoryContents(path: string, options?: any): Promise<FileSystemEntryInfo[]>;
-        getDisplayPreferences(id: string, userId: string, app: string): Promise<DisplayPreferencesDto>;
-        getDownloadSpeed(byteSize: number): Promise<number>;
-        getDrives(): Promise<FileSystemEntryInfo[]>;
-        getEndpointInfo(): Promise<EndPointInfo>;
-        getEpisodes(itemId: string, options?: any): Promise<BaseItemDtoQueryResult>;
-        getFilters(options?: any): Promise<QueryFiltersLegacy>;
-        getGenre(name: string, userId?: string): Promise<BaseItemDto>;
-        getGenres(userId: string, options?: any): Promise<BaseItemDtoQueryResult>;
-        getImageUrl(itemId: string, options?: any): string;
-        getInstalledPlugins(): Promise<PluginInfo[]>;
-        getInstantMixFromItem(itemId: string, options?: any): Promise<BaseItemDtoQueryResult>;
-        getIntros(itemId: string): Promise<BaseItemDtoQueryResult>;
-        getItemCounts(userId?: string): Promise<ItemCounts>;
-        /** @deprecated This function returns a URL with a legacy auth parameter.*/
-        getItemDownloadUrl(itemId: string): string;
-        getItemImageInfos(itemId: string): Promise<ImageInfo[]>;
-        getItems(userId: string, options?: any): Promise<BaseItemDtoQueryResult>;
-        getItem(userId: string, itemId: string): Promise<BaseItemDto>;
-        getJSON(url: string, includeAuthorization?: boolean): Promise<any>;
-        getLatestItems(options?: any): Promise<BaseItemDto[]>;
-        getLiveStreamMediaInfo(liveStreamId: string): Promise<any>;
-        getLiveTvChannel(id: string, userId?: string): Promise<BaseItemDto>;
-        getLiveTvChannels(options?: any): Promise<BaseItemDtoQueryResult>;
-        getLiveTvGuideInfo(userId: string): Promise<GuideInfo>;
-        getLiveTvInfo(userId: string): Promise<LiveTvInfo>;
-        getLiveTvProgram(id: string, userId?: string): Promise<BaseItemDto>;
-        getLiveTvPrograms(options?: any): Promise<BaseItemDtoQueryResult>;
-        getLiveTvRecommendedPrograms(options?: any): Promise<BaseItemDtoQueryResult>;
-        getLiveTvRecordingGroup(id: string): Promise<BaseItemDto>;
-        getLiveTvRecordingGroups(options?: any): Promise<BaseItemDtoQueryResult>;
-        getLiveTvRecording(id: string, userId?: string): Promise<BaseItemDto>;
-        getLiveTvRecordingSeries(options?: any): Promise<BaseItemDtoQueryResult>;
-        getLiveTvRecordings(options?: any): Promise<BaseItemDtoQueryResult>;
-        getLiveTvSeriesTimer(id: string): Promise<SeriesTimerInfoDto>;
-        getLiveTvSeriesTimers(options?: any): Promise<SeriesTimerInfoDtoQueryResult>;
-        getLiveTvTimer(id: string): Promise<TimerInfoDto>;
-        getLiveTvTimers(options?: any): Promise<TimerInfoDtoQueryResult>;
-        getLocalTrailers(userId: string, itemId: string): Promise<BaseItemDto[]>;
-        getMovieRecommendations(options?: any): Promise<RecommendationDto[]>;
-        getMusicGenre(name: string, userId?: string): Promise<BaseItemDto>;
-        getMusicGenres(userId: string, options?: any): Promise<BaseItemDtoQueryResult>;
-        getNamedConfiguration(name: string): Promise<any>;
-        getNetworkDevices(): Promise<any>;
-        getNetworkShares(path: string): Promise<FileSystemEntryInfo[]>;
-        getNewLiveTvTimerDefaults(options?: any): Promise<SeriesTimerInfoDto>;
-        getNextUpEpisodes(options?: any): Promise<BaseItemDtoQueryResult>;
-        getNotificationSummary(userId: string): Promise<NotificationsSummaryDto>;
-        getNotifications(userId: string, options?: any): Promise<NotificationResultDto>;
-        getPackageInfo(name: string, guid: string): Promise<PackageInfo>;
-        getPackageReviews(packageId: string, minRating?: string, maxRating?: string, limit?: string): Promise<any>;
-        getParentalRatings(): Promise<ParentalRating[]>;
-        getParentPath(path: string): Promise<string>;
-        getPeople(userId: string, options?: any): Promise<BaseItemDtoQueryResult>;
-        getPerson(name: string, userId?: string): Promise<BaseItemDto>;
-        getPhysicalPaths(): Promise<string[]>;
-        getPlaybackInfo(itemId: string, options: any, deviceProfile: any): Promise<PlaybackInfoResponse>;
-        getPluginConfiguration(id: string): Promise<any>;
-        getPublicSystemInfo(): Promise<PublicSystemInfo>;
-        getPublicUsers(): Promise<UserDto[]>;
-        getQuickConnect(verb: string): Promise<void | boolean | number | QuickConnectResult | QuickConnectState>;
-        getReadySyncItems(deviceId: string): Promise<any>;
-        getRecordingFolders(userId: string): Promise<BaseItemDtoQueryResult>;
-        getRegistrationInfo(feature: string): Promise<any>;
-        getRemoteImageProviders(options: any): Promise<ImageProviderInfo[]>;
-        getResumableItems(userId: string, options?: any): Promise<BaseItemDtoQueryResult>;
-        getRootFolder(userId: string): Promise<BaseItemDto>;
-        getSavedEndpointInfo(): EndPointInfo;
-        getScaledImageUrl(itemId: string, options?: any): string;
-        getScheduledTask(id: string): Promise<TaskInfo>;
-        getScheduledTasks(options?: any): Promise<TaskInfo[]>;
-        getSearchHints(options?: any): Promise<SearchHintResult>;
-        getSeasons(itemId: string, options?: any): Promise<BaseItemDtoQueryResult>;
-        getServerConfiguration(): Promise<ServerConfiguration>;
-        getServerTime(): Promise<UtcTimeResponse>;
-        getSessions(options?: any): Promise<SessionInfo[]>;
-        getSimilarItems(itemId: string, options?: any): Promise<BaseItemDtoQueryResult>;
-        getSpecialFeatures(userId: string, itemId: string): Promise<BaseItemDto[]>;
-        getStudio(name: string, userId?: string): Promise<BaseItemDto>;
-        getStudios(userId: string, options?: any): Promise<BaseItemDtoQueryResult>;
-        getSyncPlayGroups(): Promise<GroupInfoDto[]>;
-        getSyncStatus(itemId: string): Promise<any>;
-        getSystemInfo(): Promise<SystemInfo>;
-        getThemeMedia(userId?: string, itemId: string, inherit?: boolean): Promise<AllThemeMediaResult>;
-        getThumbImageUrl(item: BaseItemDto, options?: any): string;
-        getUpcomingEpisodes(options?: any): Promise<BaseItemDtoQueryResult>;
-        getUrl(name: string, params?: any, serverAddress?: string): string;
-        get(url: string): Promise<any>;
-        getUserImageUrl(userId: string, options?: any): string;
-        getUsers(options?: any): Promise<UserDto[]>;
-        getUser(userId: string): Promise<UserDto>;
-        getUserViews(options?: any, userId: string): Promise<BaseItemDtoQueryResult>;
-        getVirtualFolders(): Promise<VirtualFolderInfo[]>;
-        handleMessageReceived(msg: any): void;
-        installPlugin(name: string, guid: string, version?: string): Promise<void>;
-        isLoggedIn(): boolean;
-        isMessageChannelOpen(): boolean;
-        isMinServerVersion(version: string): boolean;
-        isWebSocketOpen(): boolean;
-        isWebSocketOpenOrConnecting(): boolean;
-        isWebSocketSupported(): boolean;
-        joinSyncPlayGroup(options?: any): Promise<void>;
-        leaveSyncPlayGroup(): Promise<void>;
-        logout(): Promise<void>;
-        markNotificationsRead(userId: string, idList: string[], isRead: boolean): Promise<void>;
-        markPlayed(userId: string, itemId: string, date: Date): Promise<UserItemDataDto>;
-        markUnplayed(userId: string, itemId: string, date: Date): Promise<UserItemDataDto>;
-        openWebSocket(): void;
-        quickConnect(secret: string): Promise<AuthenticationResult>;
-        refreshItem(itemId: string, options?: any): Promise<void>;
-        removeMediaPath(virtualFolderName: string, mediaPath: string, refreshLibrary?: boolean): Promise<void>;
-        removeVirtualFolder(name: string, refreshLibrary?: boolean): Promise<void>;
-        renameVirtualFolder(name: string, newName: string, refreshLibrary?: boolean): Promise<void>;
-        reportCapabilities(capabilities: ClientCapabilities): Promise<void>;
-        reportOfflineActions(actions: any): Promise<any>;
-        reportPlaybackProgress(options: PlaybackProgressInfo): Promise<void>;
-        reportPlaybackStart(options: PlaybackStartInfo): Promise<void>;
-        reportPlaybackStopped(options: PlaybackStopInfo): Promise<void>;
-        reportSyncJobItemTransferred(syncJobItemId: string): Promise<any>;
-        requestSyncPlayBuffering(options?: BufferRequestDto): Promise<void>;
-        requestSyncPlayMovePlaylistItem(options?: MovePlaylistItemRequestDto): Promise<void>;
-        requestSyncPlayNextItem(options?: NextItemRequestDto): Promise<void>;
-        requestSyncPlayPause(): Promise<void>;
-        requestSyncPlayPreviousItem(options?: PreviousItemRequestDto): Promise<void>;
-        requestSyncPlayQueue(options?: QueueRequestDto): Promise<void>;
-        requestSyncPlayReady(options?: ReadyRequestDto): Promise<void>;
-        requestSyncPlayRemoveFromPlaylist(options?: RemoveFromPlaylistRequestDto): Promise<void>;
-        requestSyncPlaySeek(options?: SeekRequestDto): Promise<void>;
-        requestSyncPlaySetIgnoreWait(options?: IgnoreWaitRequestDto): Promise<void>;
-        requestSyncPlaySetNewQueue(options?: NewGroupRequestDto): Promise<void>;
-        requestSyncPlaySetPlaylistItem(options?: SetPlaylistItemRequestDto): Promise<void>;
-        requestSyncPlaySetRepeatMode(options?: SetRepeatModeRequestDto): Promise<void>;
-        requestSyncPlaySetShuffleMode(options?: SetShuffleModeRequestDto): Promise<void>;
-        requestSyncPlayUnpause(): Promise<void>;
-        resetEasyPassword(userId: string): Promise<void>;
-        resetLiveTvTuner(id: string): Promise<void>;
-        resetUserPassword(userId: string): Promise<void>;
-        restartServer(): Promise<void>;
-        sendCommand(sessionId: string, command: any): Promise<void>;
-        sendMessageCommand(sessionId: string, options: GeneralCommand): Promise<void>;
-        sendMessage(name: string, data: any): void;
-        sendPlayCommand(sessionId: string, options: PlayCommand): Promise<void>;
-        sendPlayStateCommand(sessionId: string, command: PlaystateCommand, options?: any): Promise<void>;
-        sendSyncPlayPing(options?: PingRequestDto): Promise<void>;
-        sendWebSocketMessage(name: string, data: any): void;
-        serverAddress(val?: string): string;
-        serverId(): string;
-        serverVersion(): string;
-        setAuthenticationInfo(accessKey?: string, userId?: string): void;
-        setRequestHeaders(headers: any): void;
-        setSystemInfo(info: SystemInfo): void;
-        shutdownServer(): Promise<void>;
-        startScheduledTask(id: string): Promise<void>;
-        stopActiveEncodings(playSessionId: string): Promise<void>;
-        stopScheduledTask(id: string): Promise<void>;
-        syncData(data: any): Promise<any>;
-        uninstallPluginByVersion(id: string, version: string): Promise<void>;
-        uninstallPlugin(id: string): Promise<void>;
-        updateDisplayPreferences(id: string, obj: DisplayPreferencesDto, userId: string, app: string): Promise<void>;
-        updateEasyPassword(userId: string, newPassword: string): Promise<void>;
-        updateFavoriteStatus(userId: string, itemId: string, isFavorite: boolean): Promise<UserItemDataDto>;
-        updateItemImageIndex(itemId: string, imageType: ImageType, imageIndex: number, newIndex: number): Promise<any>;
-        updateItem(item: BaseItemDto): Promise<void>;
-        updateLiveTvSeriesTimer(item: SeriesTimerInfoDto): Promise<void>;
-        updateLiveTvTimer(item: TimerInfoDto): Promise<void>;
-        updateMediaPath(virtualFolderName: string, pathInfo: any): Promise<void>;
-        updateNamedConfiguration(name: string, configuration: any): Promise<void>;
-        updatePluginConfiguration(id: string, configuration: any): Promise<void>;
-        updatePluginSecurityInfo(info: PluginSecurityInfo): Promise<void>;
-        updateScheduledTaskTriggers(id: string, triggers: TaskTriggerInfo[]): Promise<void>;
-        updateServerConfiguration(configuration: ServerConfiguration): Promise<void>;
-        updateServerInfo(server: any, serverUrl: string): void;
-        updateUserConfiguration(userId: string, configuration: UserConfiguration): Promise<void>;
-        updateUserItemRating(userId: string, itemId: string, likes: boolean): Promise<UserItemDataDto>;
-        updateUserPassword(userId: string, currentPassword: string, newPassword: string): Promise<void>;
-        updateUserPolicy(userId: string, policy: UserPolicy): Promise<void>;
-        updateUser(user: UserDto): Promise<void>;
-        updateVirtualFolderOptions(id: string, libraryOptions?: any): Promise<void>;
-        uploadItemImage(itemId: string, imageType: ImageType, file: File): Promise<void>;
-        uploadItemSubtitle(itemId: string, language: string, isForced: boolean, file: File): Promise<void>;
-        uploadUserImage(userId: string, imageType: ImageType, file: File): Promise<void>;
-    }
-
-    class AppStore {
-        constructor();
-
-        getItem(name: string): string | null;
-        removeItem(name: string): void;
-        setItem(name: string, value: string): void;
-    }
-
-    interface ConnectResponse {
-        ApiClient: ApiClient
-        Servers: any[]
-        State: ConnectionState
-    }
-
-    class ConnectionManager {
-        constructor(credentialProvider: Credentials, appName: string, appVersion: string, deviceName: string, deviceId: string, capabilities: ClientCapabilities);
-
-        addApiClient(apiClient: ApiClient): void;
-        clearData(): void;
-        connect(options?: any): Promise<ConnectResponse>;
-        connectToAddress(address: string, options?: any): Promise<any>;
-        connectToServer(server: any, options?: any): Promise<any>;
-        connectToServers(servers: any[], options?: any): Promise<any>;
-        deleteServer(serverId: string): Promise<void>;
-        getApiClient(item: BaseItemDto | string): ApiClient;
-        getApiClients(): ApiClient[];
-        getAvailableServers(): any[];
-        getOrCreateApiClient(serverId: string): ApiClient;
-        getSavedServers(): any[];
-        handleMessageReceived(msg: any): void;
-        logout(): Promise<void>;
-        minServerVersion(val?: string): string;
-        updateSavedServerId(server: any): Promise<void>;
-        user(apiClient: ApiClient): Promise<any>;
-    }
-
-    class Credentials {
-        constructor(key?: string);
-
-        addOrUpdateServer(list: any[], server: any): any;
-        clear(): void;
-        credentials(data?: any): any;
-    }
-
-    interface Event {
-        type: string;
-    }
-
-    const Events: {
-        off(obj: any, eventName: string, fn: (e: Event, ...args: any[]) => void): void;
-        on(obj: any, eventName: string, fn: (e: Event, ...args: any[]) => void): void;
-        trigger(obj: any, eventName: string, ...args: any[]): void;
-    };
-}
-/* eslint-enable @typescript-eslint/no-explicit-any */

src/apikeys.html

@@ -0,0 +1,26 @@
+<div id="apiKeysPage" data-role="page" class="page type-interior advancedConfigurationPage fullWidthContent">
+    <div>
+        <div class="content-primary">
+            <div class="detailSectionHeader">
+                <h2 style="margin:.6em 0;vertical-align:middle;display:inline-block;">${HeaderApiKeys}</h2>
+                <button is="emby-button" type="button" class="fab btnNewKey submit" style="margin-left:1em;" title="${ButtonAdd}">
+                    <span class="material-icons add" aria-hidden="true"></span>
+                </button>
+            </div>
+            <p>${HeaderApiKeysHelp}</p>
+            <br />
+            <table class="tblApiKeys detailTable">
+                <caption class="clipForScreenReader">${ApiKeysCaption}</caption>
+                <thead>
+                    <tr>
+                        <th scope="col" class="detailTableHeaderCell"></th>
+                        <th scope="col" class="detailTableHeaderCell">${HeaderApiKey}</th>
+                        <th scope="col" class="detailTableHeaderCell">${HeaderApp}</th>
+                        <th scope="col" class="detailTableHeaderCell">${HeaderDateIssued}</th>
+                    </tr>
+                </thead>
+                <tbody class="resultBody"></tbody>
+            </table>
+        </div>
+    </div>
+</div>

src/apps/dashboard/AppLayout.tsx

@@ -1,113 +0,0 @@
-import AppBar from '@mui/material/AppBar';
-import Box from '@mui/material/Box';
-import { type Theme } from '@mui/material/styles';
-import useMediaQuery from '@mui/material/useMediaQuery';
-import { LocalizationProvider } from '@mui/x-date-pickers';
-import { AdapterDateFns } from '@mui/x-date-pickers/AdapterDateFns';
-import React, { FC, StrictMode, useCallback, useEffect, useState } from 'react';
-import { Outlet, useLocation } from 'react-router-dom';
-
-import AppBody from 'components/AppBody';
-import AppToolbar from 'components/toolbar/AppToolbar';
-import ServerButton from 'components/toolbar/ServerButton';
-import ElevationScroll from 'components/ElevationScroll';
-import { DRAWER_WIDTH } from 'components/ResponsiveDrawer';
-import { appRouter } from 'components/router/appRouter';
-import ThemeCss from 'components/ThemeCss';
-import { useApi } from 'hooks/useApi';
-import { useLocale } from 'hooks/useLocale';
-
-import AppTabs from './components/AppTabs';
-import AppDrawer from './components/drawer/AppDrawer';
-import HelpButton from './components/toolbar/HelpButton';
-import { DASHBOARD_APP_PATHS } from './routes/routes';
-
-import './AppOverrides.scss';
-
-export const Component: FC = () => {
-    const [ isDrawerActive, setIsDrawerActive ] = useState(false);
-    const location = useLocation();
-    const { user } = useApi();
-    const { dateFnsLocale } = useLocale();
-
-    const isMediumScreen = useMediaQuery((t: Theme) => t.breakpoints.up('md'));
-    const isMetadataManager = location.pathname.startsWith(`/${DASHBOARD_APP_PATHS.MetadataManager}`);
-    const isDrawerAvailable = Boolean(user) && !isMetadataManager;
-    const isDrawerOpen = isDrawerActive && isDrawerAvailable;
-
-    const onToggleDrawer = useCallback(() => {
-        setIsDrawerActive(!isDrawerActive);
-    }, [ isDrawerActive, setIsDrawerActive ]);
-
-    // Update body class
-    useEffect(() => {
-        document.body.classList.add('dashboardDocument');
-
-        return () => {
-            document.body.classList.remove('dashboardDocument');
-        };
-    }, []);
-
-    return (
-        <LocalizationProvider dateAdapter={AdapterDateFns} adapterLocale={dateFnsLocale}>
-            <Box sx={{ display: 'flex' }}>
-                <StrictMode>
-                    <ElevationScroll elevate={false}>
-                        <AppBar
-                            position='fixed'
-                            sx={{
-                                width: {
-                                    xs: '100%',
-                                    md: isDrawerAvailable ? `calc(100% - ${DRAWER_WIDTH}px)` : '100%'
-                                },
-                                ml: {
-                                    xs: 0,
-                                    md: isDrawerAvailable ? DRAWER_WIDTH : 0
-                                }
-                            }}
-                        >
-                            <AppToolbar
-                                isBackButtonAvailable={appRouter.canGoBack()}
-                                isDrawerAvailable={!isMediumScreen && isDrawerAvailable}
-                                isDrawerOpen={isDrawerOpen}
-                                onDrawerButtonClick={onToggleDrawer}
-                                buttons={
-                                    <HelpButton />
-                                }
-                            >
-                                {isMetadataManager && (
-                                    <ServerButton />
-                                )}
-
-                                <AppTabs isDrawerOpen={isDrawerOpen} />
-                            </AppToolbar>
-                        </AppBar>
-                    </ElevationScroll>
-
-                    {
-                        isDrawerAvailable && (
-                            <AppDrawer
-                                open={isDrawerOpen}
-                                onClose={onToggleDrawer}
-                                onOpen={onToggleDrawer}
-                            />
-                        )
-                    }
-                </StrictMode>
-
-                <Box
-                    component='main'
-                    sx={{
-                        width: '100%',
-                        flexGrow: 1
-                    }}
-                >
-                    <AppBody>
-                        <Outlet />
-                    </AppBody>
-                </Box>
-            </Box>
-            <ThemeCss dashboard />
-        </LocalizationProvider>
-    );
-};

src/apps/dashboard/AppOverrides.scss

@@ -1,38 +0,0 @@
-// Default MUI breakpoints
-// https://mui.com/material-ui/customization/breakpoints/#default-breakpoints
-$mui-bp-sm: 600px;
-$mui-bp-md: 900px;
-$mui-bp-lg: 1200px;
-$mui-bp-xl: 1536px;
-
-$drawer-width: 240px;
-
-// Fix dashboard pages layout to work with drawer
-.dashboardDocument {
-    .mainAnimatedPage:not(.metadataEditorPage) {
-        @media all and (min-width: $mui-bp-md) {
-            left: $drawer-width;
-        }
-    }
-
-    .skinBody {
-        position: unset !important;
-    }
-
-    // Fix the padding of dashboard pages
-    .content-primary {
-        padding-top: 3.25rem;
-    }
-    // Tabbed pages
-    .withTabs .content-primary {
-        padding-top: 6.5rem;
-
-        @media all and (min-width: $mui-bp-lg) {
-            padding-top: 3.25rem;
-        }
-    }
-
-    .metadataEditorPage {
-        padding-top: 3.25rem !important;
-    }
-}

src/apps/dashboard/components/AppTabs.tsx

@@ -1,96 +0,0 @@
-import { Theme } from '@mui/material/styles';
-import Tab from '@mui/material/Tab';
-import Tabs from '@mui/material/Tabs';
-import useMediaQuery from '@mui/material/useMediaQuery';
-import debounce from 'lodash-es/debounce';
-import isEqual from 'lodash-es/isEqual';
-import React, { FC, useCallback, useEffect, useRef, useState } from 'react';
-import { Link } from 'react-router-dom';
-
-import { EventType } from 'constants/eventType';
-import Events, { type Event } from 'utils/events';
-
-interface AppTabsParams {
-    isDrawerOpen: boolean
-}
-
-interface TabDefinition {
-    href: string
-    name: string
-}
-
-const handleResize = debounce(() => window.dispatchEvent(new Event('resize')), 100);
-
-const AppTabs: FC<AppTabsParams> = ({
-    isDrawerOpen
-}) => {
-    const documentRef = useRef<Document>(document);
-    const [ activeIndex, setActiveIndex ] = useState(0);
-    const [ tabs, setTabs ] = useState<TabDefinition[]>();
-
-    const isBigScreen = useMediaQuery((theme: Theme) => theme.breakpoints.up('sm'));
-
-    const onTabsUpdate = useCallback((
-        _e: Event,
-        _newView?: string,
-        newIndex: number | undefined = 0,
-        newTabs?: TabDefinition[]
-    ) => {
-        setActiveIndex(newIndex);
-
-        if (!isEqual(tabs, newTabs)) {
-            setTabs(newTabs);
-        }
-    }, [ tabs ]);
-
-    useEffect(() => {
-        const doc = documentRef.current;
-
-        if (doc) Events.on(doc, EventType.SET_TABS, onTabsUpdate);
-
-        return () => {
-            if (doc) Events.off(doc, EventType.SET_TABS, onTabsUpdate);
-        };
-    }, [ onTabsUpdate ]);
-
-    // HACK: Force resizing to workaround upstream bug with tab resizing
-    // https://github.com/mui/material-ui/issues/24011
-    useEffect(() => {
-        handleResize();
-    }, [ isDrawerOpen ]);
-
-    if (!tabs?.length) return null;
-
-    return (
-        <Tabs
-            value={activeIndex}
-            sx={{
-                width: '100%',
-                flexShrink: {
-                    xs: 0,
-                    lg: 'unset'
-                },
-                order: {
-                    xs: 100,
-                    lg: 'unset'
-                }
-            }}
-            variant={isBigScreen ? 'standard' : 'scrollable'}
-            centered={isBigScreen}
-        >
-            {
-                tabs.map(({ href, name }, index) => (
-                    <Tab
-                        key={`tab-${name}`}
-                        label={name}
-                        data-tab-index={`${index}`}
-                        component={Link}
-                        to={href}
-                    />
-                ))
-            }
-        </Tabs>
-    );
-};
-
-export default AppTabs;

src/apps/dashboard/components/BaseCard.tsx

@@ -1,121 +0,0 @@
-import React from 'react';
-import Box from '@mui/material/Box';
-import Card from '@mui/material/Card';
-import CardContent from '@mui/material/CardContent';
-import CardMedia from '@mui/material/CardMedia';
-import IconButton from '@mui/material/IconButton';
-import Typography from '@mui/material/Typography';
-import MoreVertIcon from '@mui/icons-material/MoreVert';
-import { getDefaultBackgroundClass } from 'components/cardbuilder/cardBuilderUtils';
-import CardActionArea from '@mui/material/CardActionArea';
-import Stack from '@mui/material/Stack';
-import { Link, To } from 'react-router-dom';
-
-interface BaseCardProps {
-    title?: string;
-    text?: string;
-    image?: string | null;
-    icon?: React.ReactNode;
-    to?: To;
-    onClick?: () => void;
-    action?: boolean;
-    actionRef?: React.MutableRefObject<HTMLButtonElement | null>;
-    onActionClick?: () => void;
-    height?: number;
-    width?: number;
-};
-
-const BaseCard = ({
-    title,
-    text,
-    image,
-    icon,
-    to,
-    onClick,
-    action,
-    actionRef,
-    onActionClick,
-    height,
-    width
-}: BaseCardProps) => {
-    return (
-        <Card
-            sx={{
-                display: 'flex',
-                flexDirection: 'column',
-                height: height || 240,
-                width: width
-            }}
-        >
-            <CardActionArea
-                {...(to && {
-                    component: Link,
-                    to: to
-                })}
-                onClick={onClick}
-                sx={{
-                    display: 'flex',
-                    flexGrow: 1,
-                    alignItems: 'stretch'
-                }}
-            >
-                {image ? (
-                    <CardMedia
-                        sx={{ flexGrow: 1 }}
-                        image={image}
-                        title={title}
-                    />
-                ) : (
-                    <Box className={getDefaultBackgroundClass(title)} sx={{
-                        flexGrow: 1,
-                        display: 'flex',
-                        alignItems: 'center',
-                        justifyContent: 'center'
-                    }}>
-                        {icon}
-                    </Box>
-                )}
-            </CardActionArea>
-            <CardContent
-                sx={{
-                    minHeight: 50,
-                    '&:last-child': {
-                        paddingBottom: 2,
-                        paddingRight: 1
-                    }
-                }}>
-                <Stack flexGrow={1} direction='row'>
-                    <Stack flexGrow={1}>
-                        <Typography gutterBottom sx={{
-                            overflow: 'hidden',
-                            whiteSpace: 'nowrap',
-                            textOverflow: 'ellipsis'
-                        }}>
-                            {title}
-                        </Typography>
-                        {text && (
-                            <Typography
-                                variant='body2'
-                                color='text.secondary'
-                                sx={{
-                                    lineBreak: 'anywhere'
-                                }}
-                            >
-                                {text}
-                            </Typography>
-                        )}
-                    </Stack>
-                    <Box>
-                        {action ? (
-                            <IconButton ref={actionRef} onClick={onActionClick}>
-                                <MoreVertIcon />
-                            </IconButton>
-                        ) : null}
-                    </Box>
-                </Stack>
-            </CardContent>
-        </Card>
-    );
-};
-
-export default BaseCard;

src/apps/dashboard/components/SearchInput.tsx

@@ -1,70 +0,0 @@
-import Search from '@mui/icons-material/Search';
-import InputBase, { type InputBaseProps } from '@mui/material/InputBase';
-import { alpha, styled } from '@mui/material/styles';
-import React, { type FC } from 'react';
-
-const SearchContainer = styled('div')(({ theme }) => ({
-    display: 'flex',
-    position: 'relative',
-    borderRadius: theme.shape.borderRadius,
-    backgroundColor: alpha(theme.palette.common.white, 0.15),
-    '&:hover': {
-        backgroundColor: alpha(theme.palette.common.white, 0.25)
-    },
-    width: '100%',
-    [theme.breakpoints.up('sm')]: {
-        width: 'auto'
-    }
-}));
-
-const SearchIconWrapper = styled('div')(({ theme }) => ({
-    padding: theme.spacing(0, 2),
-    height: '100%',
-    position: 'absolute',
-    pointerEvents: 'none',
-    display: 'flex',
-    alignItems: 'center',
-    justifyContent: 'center'
-}));
-
-const StyledInputBase = styled(InputBase)(({ theme }) => ({
-    color: 'inherit',
-    flexGrow: 1,
-    '& .MuiInputBase-input': {
-        padding: theme.spacing(1, 1, 1, 0),
-        // vertical padding + font size from searchIcon
-        paddingLeft: `calc(1em + ${theme.spacing(4)})`,
-        transition: theme.transitions.create('width'),
-        width: '100%',
-        [theme.breakpoints.up('md')]: {
-            width: '20ch'
-        }
-    }
-}));
-
-interface SearchInputProps extends InputBaseProps {
-    label?: string
-}
-
-const SearchInput: FC<SearchInputProps> = ({
-    label,
-    ...props
-}) => {
-    return (
-        <SearchContainer>
-            <SearchIconWrapper>
-                <Search />
-            </SearchIconWrapper>
-            <StyledInputBase
-                placeholder={label}
-                inputProps={{
-                    'aria-label': label,
-                    ...props.inputProps
-                }}
-                {...props}
-            />
-        </SearchContainer>
-    );
-};
-
-export default SearchInput;

src/apps/dashboard/components/Toast.tsx

@@ -1,30 +0,0 @@
-import React, { useCallback } from 'react';
-import Snackbar, { SnackbarProps } from '@mui/material/Snackbar';
-import IconButton from '@mui/material/IconButton';
-import CloseIcon from '@mui/icons-material/Close';
-
-const Toast = (props: SnackbarProps) => {
-    const onCloseClick = useCallback((e: React.MouseEvent<HTMLButtonElement, MouseEvent>) => {
-        props.onClose?.(e, 'clickaway');
-    }, [ props ]);
-
-    const action = (
-        <IconButton
-            size='small'
-            color='inherit'
-            onClick={onCloseClick}
-        >
-            <CloseIcon fontSize='small' />
-        </IconButton>
-    );
-
-    return (
-        <Snackbar
-            autoHideDuration={3300}
-            action={action}
-            { ...props }
-        />
-    );
-};
-
-export default Toast;

src/apps/dashboard/components/UserAvatarButton.tsx

@@ -1,35 +0,0 @@
-import type { UserDto } from '@jellyfin/sdk/lib/generated-client/models/user-dto';
-import type { SxProps, Theme } from '@mui/material';
-import IconButton from '@mui/material/IconButton';
-import React, { type FC } from 'react';
-import { Link } from 'react-router-dom';
-
-import UserAvatar from 'components/UserAvatar';
-
-interface UserAvatarButtonProps {
-    user?: UserDto
-    sx?: SxProps<Theme>
-}
-
-const UserAvatarButton: FC<UserAvatarButtonProps> = ({
-    user,
-    sx
-}) => (
-    user?.Id ? (
-        <IconButton
-            size='large'
-            color='inherit'
-            sx={{
-                padding: 0,
-                ...sx
-            }}
-            title={user.Name || undefined}
-            component={Link}
-            to={`/dashboard/users/profile?userId=${user.Id}`}
-        >
-            <UserAvatar user={user} />
-        </IconButton>
-    ) : undefined
-);
-
-export default UserAvatarButton;

src/apps/dashboard/components/drawer/AppDrawer.tsx

@@ -1,37 +0,0 @@
-import ListItem from '@mui/material/ListItem';
-import List from '@mui/material/List';
-import React, { FC } from 'react';
-
-import DrawerHeaderLink from 'apps/experimental/components/drawers/DrawerHeaderLink';
-import ResponsiveDrawer, { ResponsiveDrawerProps } from 'components/ResponsiveDrawer';
-
-import ServerDrawerSection from './sections/ServerDrawerSection';
-import DevicesDrawerSection from './sections/DevicesDrawerSection';
-import LiveTvDrawerSection from './sections/LiveTvDrawerSection';
-import AdvancedDrawerSection from './sections/AdvancedDrawerSection';
-import PluginDrawerSection from './sections/PluginDrawerSection';
-
-const AppDrawer: FC<ResponsiveDrawerProps> = ({
-    open = false,
-    onClose,
-    onOpen
-}) => (
-    <ResponsiveDrawer
-        open={open}
-        onClose={onClose}
-        onOpen={onOpen}
-    >
-        <List disablePadding>
-            <ListItem disablePadding>
-                <DrawerHeaderLink />
-            </ListItem>
-        </List>
-        <ServerDrawerSection />
-        <DevicesDrawerSection />
-        <LiveTvDrawerSection />
-        <PluginDrawerSection />
-        <AdvancedDrawerSection />
-    </ResponsiveDrawer>
-);
-
-export default AppDrawer;

src/apps/dashboard/components/drawer/sections/AdvancedDrawerSection.tsx

@@ -1,70 +0,0 @@
-import Article from '@mui/icons-material/Article';
-import Backup from '@mui/icons-material/Backup';
-import Lan from '@mui/icons-material/Lan';
-import Schedule from '@mui/icons-material/Schedule';
-import VpnKey from '@mui/icons-material/VpnKey';
-import List from '@mui/material/List';
-import ListItem from '@mui/material/ListItem';
-import ListItemIcon from '@mui/material/ListItemIcon';
-import ListItemText from '@mui/material/ListItemText';
-import ListSubheader from '@mui/material/ListSubheader';
-import React from 'react';
-
-import ListItemLink from 'components/ListItemLink';
-import globalize from 'lib/globalize';
-
-const AdvancedDrawerSection = () => {
-    return (
-        <List
-            aria-labelledby='advanced-subheader'
-            subheader={
-                <ListSubheader component='div' id='advanced-subheader'>
-                    {globalize.translate('TabAdvanced')}
-                </ListSubheader>
-            }
-        >
-            <ListItem disablePadding>
-                <ListItemLink to='/dashboard/networking'>
-                    <ListItemIcon>
-                        <Lan />
-                    </ListItemIcon>
-                    <ListItemText primary={globalize.translate('TabNetworking')} />
-                </ListItemLink>
-            </ListItem>
-            <ListItem disablePadding>
-                <ListItemLink to='/dashboard/keys'>
-                    <ListItemIcon>
-                        <VpnKey />
-                    </ListItemIcon>
-                    <ListItemText primary={globalize.translate('HeaderApiKeys')} />
-                </ListItemLink>
-            </ListItem>
-            <ListItem disablePadding>
-                <ListItemLink to='/dashboard/backups'>
-                    <ListItemIcon>
-                        <Backup />
-                    </ListItemIcon>
-                    <ListItemText primary={globalize.translate('HeaderBackups')} />
-                </ListItemLink>
-            </ListItem>
-            <ListItem disablePadding>
-                <ListItemLink to='/dashboard/logs'>
-                    <ListItemIcon>
-                        <Article />
-                    </ListItemIcon>
-                    <ListItemText primary={globalize.translate('TabLogs')} />
-                </ListItemLink>
-            </ListItem>
-            <ListItem disablePadding>
-                <ListItemLink to='/dashboard/tasks'>
-                    <ListItemIcon>
-                        <Schedule />
-                    </ListItemIcon>
-                    <ListItemText primary={globalize.translate('TabScheduledTasks')} />
-                </ListItemLink>
-            </ListItem>
-        </List>
-    );
-};
-
-export default AdvancedDrawerSection;

src/apps/dashboard/components/drawer/sections/DevicesDrawerSection.tsx

@@ -1,43 +0,0 @@
-import Analytics from '@mui/icons-material/Analytics';
-import Devices from '@mui/icons-material/Devices';
-import List from '@mui/material/List';
-import ListItem from '@mui/material/ListItem';
-import ListItemIcon from '@mui/material/ListItemIcon';
-import ListItemText from '@mui/material/ListItemText';
-import ListSubheader from '@mui/material/ListSubheader';
-import React from 'react';
-
-import ListItemLink from 'components/ListItemLink';
-import globalize from 'lib/globalize';
-
-const DevicesDrawerSection = () => {
-    return (
-        <List
-            aria-labelledby='devices-subheader'
-            subheader={
-                <ListSubheader component='div' id='devices-subheader'>
-                    {globalize.translate('HeaderDevices')}
-                </ListSubheader>
-            }
-        >
-            <ListItem disablePadding>
-                <ListItemLink to='/dashboard/devices'>
-                    <ListItemIcon>
-                        <Devices />
-                    </ListItemIcon>
-                    <ListItemText primary={globalize.translate('HeaderDevices')} />
-                </ListItemLink>
-            </ListItem>
-            <ListItem disablePadding>
-                <ListItemLink to='/dashboard/activity'>
-                    <ListItemIcon>
-                        <Analytics />
-                    </ListItemIcon>
-                    <ListItemText primary={globalize.translate('HeaderActivity')} />
-                </ListItemLink>
-            </ListItem>
-        </List>
-    );
-};
-
-export default DevicesDrawerSection;

src/apps/dashboard/components/drawer/sections/LiveTvDrawerSection.tsx

@@ -1,43 +0,0 @@
-import Dvr from '@mui/icons-material/Dvr';
-import LiveTv from '@mui/icons-material/LiveTv';
-import List from '@mui/material/List';
-import ListItem from '@mui/material/ListItem';
-import ListItemIcon from '@mui/material/ListItemIcon';
-import ListItemText from '@mui/material/ListItemText';
-import ListSubheader from '@mui/material/ListSubheader';
-import React from 'react';
-
-import ListItemLink from 'components/ListItemLink';
-import globalize from 'lib/globalize';
-
-const LiveTvDrawerSection = () => {
-    return (
-        <List
-            aria-labelledby='livetv-subheader'
-            subheader={
-                <ListSubheader component='div' id='livetv-subheader'>
-                    {globalize.translate('LiveTV')}
-                </ListSubheader>
-            }
-        >
-            <ListItem disablePadding>
-                <ListItemLink to='/dashboard/livetv'>
-                    <ListItemIcon>
-                        <LiveTv />
-                    </ListItemIcon>
-                    <ListItemText primary={globalize.translate('LiveTV')} />
-                </ListItemLink>
-            </ListItem>
-            <ListItem disablePadding>
-                <ListItemLink to='/dashboard/livetv/recordings'>
-                    <ListItemIcon>
-                        <Dvr />
-                    </ListItemIcon>
-                    <ListItemText primary={globalize.translate('HeaderDVR')} />
-                </ListItemLink>
-            </ListItem>
-        </List>
-    );
-};
-
-export default LiveTvDrawerSection;

src/apps/dashboard/components/drawer/sections/PluginDrawerSection.tsx

@@ -1,63 +0,0 @@
-import Extension from '@mui/icons-material/Extension';
-import Folder from '@mui/icons-material/Folder';
-import List from '@mui/material/List';
-import ListItemIcon from '@mui/material/ListItemIcon';
-import ListItemText from '@mui/material/ListItemText';
-import ListSubheader from '@mui/material/ListSubheader';
-import React, { useEffect } from 'react';
-
-import ListItemLink from 'components/ListItemLink';
-import globalize from 'lib/globalize';
-import Dashboard from 'utils/dashboard';
-import { useConfigurationPages } from 'apps/dashboard/features/plugins/api/useConfigurationPages';
-
-const PluginDrawerSection = () => {
-    const {
-        data: pagesInfo,
-        error
-    } = useConfigurationPages({ enableInMainMenu: true });
-
-    useEffect(() => {
-        if (error) console.error('[PluginDrawerSection] unable to fetch plugin config pages', error);
-    }, [ error ]);
-
-    return (
-        <List
-            aria-labelledby='plugins-subheader'
-            subheader={
-                <ListSubheader component='div' id='plugins-subheader'>
-                    {globalize.translate('TabPlugins')}
-                </ListSubheader>
-            }
-        >
-            <ListItemLink
-                to='/dashboard/plugins'
-                includePaths={[
-                    '/configurationpage',
-                    '/dashboard/plugins/repositories'
-                ]}
-                excludePaths={pagesInfo?.map(p => `/${Dashboard.getPluginUrl(p.Name)}`)}
-            >
-                <ListItemIcon>
-                    <Extension />
-                </ListItemIcon>
-                <ListItemText primary={globalize.translate('TabPlugins')} />
-            </ListItemLink>
-
-            {pagesInfo?.map(pageInfo => (
-                <ListItemLink
-                    key={pageInfo.PluginId}
-                    to={`/${Dashboard.getPluginUrl(pageInfo.Name)}`}
-                >
-                    <ListItemIcon>
-                        {/* TODO: Support different icons? */}
-                        <Folder />
-                    </ListItemIcon>
-                    <ListItemText primary={pageInfo.DisplayName} />
-                </ListItemLink>
-            ))}
-        </List>
-    );
-};
-
-export default PluginDrawerSection;

src/apps/dashboard/components/drawer/sections/ServerDrawerSection.tsx

@@ -1,147 +0,0 @@
-import Dashboard from '@mui/icons-material/Dashboard';
-import ExpandLess from '@mui/icons-material/ExpandLess';
-import ExpandMore from '@mui/icons-material/ExpandMore';
-import LibraryAdd from '@mui/icons-material/LibraryAdd';
-import Palette from '@mui/icons-material/Palette';
-import People from '@mui/icons-material/People';
-import PlayCircle from '@mui/icons-material/PlayCircle';
-import Settings from '@mui/icons-material/Settings';
-import Collapse from '@mui/material/Collapse';
-import List from '@mui/material/List';
-import ListItem from '@mui/material/ListItem';
-import ListItemButton from '@mui/material/ListItemButton/ListItemButton';
-import ListItemIcon from '@mui/material/ListItemIcon';
-import ListItemText from '@mui/material/ListItemText';
-import ListSubheader from '@mui/material/ListSubheader';
-import React, { type MouseEvent, useCallback, useState } from 'react';
-import { useLocation } from 'react-router-dom';
-
-import ListItemLink from 'components/ListItemLink';
-import globalize from 'lib/globalize';
-
-const LIBRARY_PATHS = [
-    '/dashboard/libraries',
-    '/dashboard/libraries/display',
-    '/dashboard/libraries/metadata',
-    '/dashboard/libraries/nfo'
-];
-
-const PLAYBACK_PATHS = [
-    '/dashboard/playback/transcoding',
-    '/dashboard/playback/resume',
-    '/dashboard/playback/streaming',
-    '/dashboard/playback/trickplay'
-];
-
-const ServerDrawerSection = () => {
-    const location = useLocation();
-
-    const [ isLibrarySectionOpen, setIsLibrarySectionOpen ] = useState(LIBRARY_PATHS.includes(location.pathname));
-    const [ isPlaybackSectionOpen, setIsPlaybackSectionOpen ] = useState(PLAYBACK_PATHS.includes(location.pathname));
-
-    const onLibrarySectionClick = useCallback((e: MouseEvent) => {
-        e.preventDefault();
-        e.stopPropagation();
-        setIsLibrarySectionOpen(isOpen => !isOpen);
-    }, []);
-
-    const onPlaybackSectionClick = useCallback((e: MouseEvent) => {
-        e.preventDefault();
-        e.stopPropagation();
-        setIsPlaybackSectionOpen(isOpen => !isOpen);
-    }, []);
-
-    return (
-        <List
-            aria-labelledby='server-subheader'
-            subheader={
-                <ListSubheader component='div' id='server-subheader'>
-                    {globalize.translate('TabServer')}
-                </ListSubheader>
-            }
-        >
-            <ListItem disablePadding>
-                <ListItemLink to='/dashboard'>
-                    <ListItemIcon>
-                        <Dashboard />
-                    </ListItemIcon>
-                    <ListItemText primary={globalize.translate('TabDashboard')} />
-                </ListItemLink>
-            </ListItem>
-            <ListItem disablePadding>
-                <ListItemLink to='/dashboard/settings'>
-                    <ListItemIcon>
-                        <Settings />
-                    </ListItemIcon>
-                    <ListItemText primary={globalize.translate('General')} />
-                </ListItemLink>
-            </ListItem>
-            <ListItemLink to='/dashboard/branding'>
-                <ListItemIcon>
-                    <Palette />
-                </ListItemIcon>
-                <ListItemText primary={globalize.translate('HeaderBranding')} />
-            </ListItemLink>
-            <ListItem disablePadding>
-                <ListItemLink to='/dashboard/users'>
-                    <ListItemIcon>
-                        <People />
-                    </ListItemIcon>
-                    <ListItemText primary={globalize.translate('HeaderUsers')} />
-                </ListItemLink>
-            </ListItem>
-            <ListItem disablePadding>
-                <ListItemButton onClick={onLibrarySectionClick}>
-                    <ListItemIcon>
-                        <LibraryAdd />
-                    </ListItemIcon>
-                    <ListItemText primary={globalize.translate('HeaderLibraries')} />
-                    {isLibrarySectionOpen ? <ExpandLess /> : <ExpandMore />}
-                </ListItemButton>
-            </ListItem>
-            <Collapse in={isLibrarySectionOpen} timeout='auto' unmountOnExit>
-                <List component='div' disablePadding>
-                    <ListItemLink to='/dashboard/libraries' sx={{ pl: 4 }}>
-                        <ListItemText inset primary={globalize.translate('HeaderLibraries')} />
-                    </ListItemLink>
-                    <ListItemLink to='/dashboard/libraries/display' sx={{ pl: 4 }}>
-                        <ListItemText inset primary={globalize.translate('Display')} />
-                    </ListItemLink>
-                    <ListItemLink to='/dashboard/libraries/metadata' sx={{ pl: 4 }}>
-                        <ListItemText inset primary={globalize.translate('LabelMetadata')} />
-                    </ListItemLink>
-                    <ListItemLink to='/dashboard/libraries/nfo' sx={{ pl: 4 }}>
-                        <ListItemText inset primary={globalize.translate('TabNfoSettings')} />
-                    </ListItemLink>
-                </List>
-            </Collapse>
-            <ListItem disablePadding>
-                <ListItemButton onClick={onPlaybackSectionClick}>
-                    <ListItemIcon>
-                        <PlayCircle />
-                    </ListItemIcon>
-                    <ListItemText primary={globalize.translate('TitlePlayback')} />
-                    {isPlaybackSectionOpen ? <ExpandLess /> : <ExpandMore />}
-                </ListItemButton>
-            </ListItem>
-            <Collapse in={isPlaybackSectionOpen} timeout='auto' unmountOnExit>
-                <List component='div' disablePadding>
-                    <ListItemLink to='/dashboard/playback/transcoding' sx={{ pl: 4 }}>
-                        <ListItemText inset primary={globalize.translate('Transcoding')} />
-                    </ListItemLink>
-                    <ListItemLink to='/dashboard/playback/resume' sx={{ pl: 4 }}>
-                        <ListItemText inset primary={globalize.translate('ButtonResume')} />
-                    </ListItemLink>
-                    <ListItemLink to='/dashboard/playback/streaming' sx={{ pl: 4 }}>
-                        <ListItemText inset primary={globalize.translate('TabStreaming')} />
-                    </ListItemLink>
-                    <ListItemLink to='/dashboard/playback/trickplay' sx={{ pl: 4 }}>
-                        <ListItemText inset primary={globalize.translate('Trickplay')} />
-                    </ListItemLink>
-                </List>
-            </Collapse>
-        </List>
-    );
-};
-
-export default ServerDrawerSection;

src/apps/dashboard/components/table/DateTimeCell.tsx

@@ -1,17 +0,0 @@
-import format from 'date-fns/format';
-import type { MRT_Cell, MRT_RowData } from 'material-react-table';
-import { FC } from 'react';
-
-import { useLocale } from 'hooks/useLocale';
-
-interface CellProps {
-    cell: MRT_Cell<MRT_RowData>
-}
-
-const DateTimeCell: FC<CellProps> = ({ cell }) => {
-    const { dateFnsLocale } = useLocale();
-
-    return format(cell.getValue<Date>(), 'Pp', { locale: dateFnsLocale });
-};
-
-export default DateTimeCell;

src/apps/dashboard/components/table/TablePage.tsx

@@ -1,73 +0,0 @@
-import Box from '@mui/material/Box/Box';
-import Stack from '@mui/material/Stack/Stack';
-import type {} from '@mui/material/themeCssVarsAugmentation';
-import Typography from '@mui/material/Typography/Typography';
-import { type MRT_RowData, type MRT_TableInstance, type MRT_TableOptions, MaterialReactTable } from 'material-react-table';
-import React from 'react';
-
-import Page, { type PageProps } from 'components/Page';
-
-interface TablePageProps<T extends MRT_RowData> extends PageProps {
-    title: string
-    subtitle?: string
-    table: MRT_TableInstance<T>
-}
-
-export const DEFAULT_TABLE_OPTIONS: Partial<MRT_TableOptions<MRT_RowData>> = {
-    // Enable custom features
-    enableColumnPinning: true,
-    enableColumnResizing: true,
-
-    // Sticky header/footer
-    enableStickyFooter: true,
-    enableStickyHeader: true,
-    muiTableContainerProps: {
-        sx: {
-            maxHeight: 'calc(100% - 7rem)' // 2 x 3.5rem for header and footer
-        }
-    }
-};
-
-const TablePage = <T extends MRT_RowData>({
-    title,
-    subtitle,
-    table,
-    children,
-    ...pageProps
-}: TablePageProps<T>) => {
-    return (
-        <Page
-            title={title}
-            {...pageProps}
-        >
-            <Box
-                className='content-primary'
-                sx={{
-                    display: 'flex',
-                    flexDirection: 'column',
-                    height: '100%'
-                }}
-            >
-                <Stack
-                    spacing={2}
-                    sx={{
-                        marginBottom: 1
-                    }}
-                >
-                    <Typography variant='h1'>
-                        {title}
-                    </Typography>
-                    {subtitle && (
-                        <Typography>
-                            {subtitle}
-                        </Typography>
-                    )}
-                </Stack>
-                <MaterialReactTable table={table} />
-            </Box>
-            {children}
-        </Page>
-    );
-};
-
-export default TablePage;

src/apps/dashboard/components/toolbar/HelpButton.tsx

@@ -1,36 +0,0 @@
-import HelpOutline from '@mui/icons-material/HelpOutline';
-import IconButton from '@mui/material/IconButton';
-import Tooltip from '@mui/material/Tooltip/Tooltip';
-import React from 'react';
-import { Route, Routes } from 'react-router-dom';
-
-import { HelpLinks } from 'apps/dashboard/constants/helpLinks';
-import globalize from 'lib/globalize';
-
-const HelpButton = () => (
-    <Routes>
-        {
-            HelpLinks.map(({ paths, url }) => paths.map(path => (
-                <Route
-                    key={[url, path].join('-')}
-                    path={path}
-                    element={
-                        <Tooltip title={globalize.translate('Help')}>
-                            <IconButton
-                                href={url}
-                                rel='noopener noreferrer'
-                                target='_blank'
-                                size='large'
-                                color='inherit'
-                            >
-                                <HelpOutline />
-                            </IconButton>
-                        </Tooltip>
-                    }
-                />
-            ))).flat()
-        }
-    </Routes>
-);
-
-export default HelpButton;

src/apps/dashboard/components/widgets/ActivityLogWidget.tsx

@@ -1,51 +0,0 @@
-import React, { useMemo } from 'react';
-import globalize from 'lib/globalize';
-import Widget from './Widget';
-import List from '@mui/material/List';
-import ActivityListItem from 'apps/dashboard/features/activity/components/ActivityListItem';
-import { useLogEntries } from 'apps/dashboard/features/activity/api/useLogEntries';
-import subSeconds from 'date-fns/subSeconds';
-import Skeleton from '@mui/material/Skeleton';
-import Stack from '@mui/material/Stack';
-
-const ActivityLogWidget = () => {
-    const dayBefore = useMemo(() => (
-        subSeconds(new Date(), 24 * 60 * 60).toISOString()
-    ), []);
-
-    const { data: logs, isPending } = useLogEntries({
-        startIndex: 0,
-        limit: 7,
-        minDate: dayBefore,
-        hasUserId: true
-    });
-
-    return (
-        <Widget
-            title={globalize.translate('HeaderActivity')}
-            href='/dashboard/activity?useractivity=true'
-        >
-            {isPending ? (
-                <Stack spacing={2}>
-                    <Skeleton variant='rounded' height={60} />
-                    <Skeleton variant='rounded' height={60} />
-                    <Skeleton variant='rounded' height={60} />
-                    <Skeleton variant='rounded' height={60} />
-                </Stack>
-            ) : (
-                <List sx={{ bgcolor: 'background.paper' }}>
-                    {logs?.Items?.map(entry => (
-                        <ActivityListItem
-                            key={entry.Id}
-                            item={entry}
-                            displayShortOverview={true}
-                            to='/dashboard/activity?useractivity=true'
-                        />
-                    ))}
-                </List>
-            )}
-        </Widget>
-    );
-};
-
-export default ActivityLogWidget;