prevent completed download restart

fix typo
closes #162
2024-07-02 11:37:06 +02:00 · 2024-06-30 10:37:22 +02:00 · 2024-06-21 10:41:49 +02:00 · 2024-06-14 11:14:39 +02:00 · 2024-06-14 10:42:25 +02:00 · 2024-06-14 10:41:59 +02:00
38 changed files with 3914 additions and 675 deletions
--- a/.gitignore
+++ b/.gitignore
@@ -16,3 +16,6 @@ cookies.txt
 __debug*
 ui/
 .idea
+frontend/.pnp.cjs
+frontend/.pnp.loader.mjs
+frontend/.yarn/install-state.gz
--- a/6
+++ b/6
@@ -25,15 +25,13 @@ RUN CGO_ENABLED=0 GOOS=linux go build -o yt-dlp-webui
 # -----------------------------------------------------------------------------

 # dependencies ----------------------------------------------------------------
-FROM cgr.dev/chainguard/wolfi-base
+FROM alpine:edge

 RUN apk update && \
-apk add ffmpeg ca-certificates python3 py3-pip wget
+apk add ffmpeg yt-dlp ca-certificates curl wget psmisc

 VOLUME /downloads /config

-RUN python3 -m pip install yt-dlp
-
 WORKDIR /app

 COPY --from=build /usr/src/yt-dlp-webui/yt-dlp-webui /app
--- a/5
+++ b/5
@@ -1,11 +1,14 @@
 .PHONY : fe clean all

 default:
-	CGO_ENABLED=0 go build -o yt-dlp-webui main.go
+	go run main.go

 fe:
 	cd frontend && pnpm build

+dev:
+	cd frontend && pnpm dev
+
 all:
 	$(MAKE) fe && cd ..
 	CGO_ENABLED=0 go build -o yt-dlp-webui main.go
--- a/docker-compose.yml
+++ b/docker-compose.yml
@@ -5,6 +5,7 @@ services:
      - 3033:3033
    volumes:
      - <your dir>:/downloads # replace <your dir> with a directory on your host system
+      - <your dir>:/config    # directory where config.yml will be stored
    healthcheck:
      test: curl -f http://localhost:3033 || exit 1
    restart: unless-stopped
--- a/env.nix
+++ b/env.nix
@@ -0,0 +1,4 @@
+{ pkgs ? import <nixpkgs> {} }:
+  pkgs.mkShell {
+    nativeBuildInputs = with pkgs.buildPackages; [ yt-dlp nodejs_22 yarn-berry go ];
+}
--- a/frontend/package.json
+++ b/frontend/package.json
@@ -1,6 +1,6 @@
 {
  "name": "yt-dlp-webui",
-  "version": "3.0.8",
+  "version": "3.1.0",
  "description": "Frontend compontent of yt-dlp-webui",
  "scripts": {
    "dev": "vite",
@@ -19,20 +19,21 @@
    "fp-ts": "^2.16.5",
    "react": "^18.3.1",
    "react-dom": "^18.3.1",
-    "react-router-dom": "^6.23.0",
+    "react-router-dom": "^6.23.1",
+    "react-virtuoso": "^4.7.11",
    "recoil": "^0.7.7",
    "rxjs": "^7.8.1"
  },
  "devDependencies": {
    "@modyfi/vite-plugin-yaml": "^1.1.0",
-    "@types/node": "^20.11.4",
-    "@types/react": "^18.2.48",
+    "@types/node": "^20.14.2",
+    "@types/react": "^18.3.3",
    "@types/react-dom": "^18.2.18",
    "@types/react-helmet": "^6.1.11",
    "@types/react-router-dom": "^5.3.3",
-    "@vitejs/plugin-react-swc": "^3.6.0",
-    "typescript": "^5.4.3",
-    "vite": "^5.2.11",
-    "million": "^3.0.6"
+    "@vitejs/plugin-react-swc": "^3.7.0",
+    "million": "^3.1.11",
+    "typescript": "^5.4.5",
+    "vite": "^5.2.11"
  }
 }
--- a/frontend/pnpm-lock.yaml
+++ b/frontend/pnpm-lock.yaml
@@ -10,10 +10,10 @@ importers:
    dependencies:
      '@emotion/react':
        specifier: ^11.11.4
-        version: 11.11.4(@types/react@18.2.48)(react@18.3.1)
+        version: 11.11.4(@types/react@18.3.3)(react@18.3.1)
      '@emotion/styled':
        specifier: ^11.11.5
-        version: 11.11.5(@emotion/react@11.11.4(@types/react@18.2.48)(react@18.3.1))(@types/react@18.2.48)(react@18.3.1)
+        version: 11.11.5(@emotion/react@11.11.4(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react@18.3.1)
      '@fontsource/roboto':
        specifier: ^5.0.13
        version: 5.0.13
@@ -22,10 +22,10 @@ importers:
        version: 5.0.18
      '@mui/icons-material':
        specifier: ^5.15.16
-        version: 5.15.16(@mui/material@5.15.16(@emotion/react@11.11.4(@types/react@18.2.48)(react@18.3.1))(@emotion/styled@11.11.5(@emotion/react@11.11.4(@types/react@18.2.48)(react@18.3.1))(@types/react@18.2.48)(react@18.3.1))(@types/react@18.2.48)(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(@types/react@18.2.48)(react@18.3.1)
+        version: 5.15.16(@mui/material@5.15.16(@emotion/react@11.11.4(@types/react@18.3.3)(react@18.3.1))(@emotion/styled@11.11.5(@emotion/react@11.11.4(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(@types/react@18.3.3)(react@18.3.1)
      '@mui/material':
        specifier: ^5.15.16
-        version: 5.15.16(@emotion/react@11.11.4(@types/react@18.2.48)(react@18.3.1))(@emotion/styled@11.11.5(@emotion/react@11.11.4(@types/react@18.2.48)(react@18.3.1))(@types/react@18.2.48)(react@18.3.1))(@types/react@18.2.48)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
+        version: 5.15.16(@emotion/react@11.11.4(@types/react@18.3.3)(react@18.3.1))(@emotion/styled@11.11.5(@emotion/react@11.11.4(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
      fp-ts:
        specifier: ^2.16.5
        version: 2.16.5
@@ -36,8 +36,11 @@ importers:
        specifier: ^18.3.1
        version: 18.3.1(react@18.3.1)
      react-router-dom:
-        specifier: ^6.23.0
-        version: 6.23.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
+        specifier: ^6.23.1
+        version: 6.23.1(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
+      react-virtuoso:
+        specifier: ^4.7.11
+        version: 4.7.11(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
      recoil:
        specifier: ^0.7.7
        version: 0.7.7(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
@@ -47,13 +50,13 @@ importers:
    devDependencies:
      '@modyfi/vite-plugin-yaml':
        specifier: ^1.1.0
-        version: 1.1.0(rollup@4.13.0)(vite@5.2.11(@types/node@20.11.4))
+        version: 1.1.0(rollup@4.13.0)(vite@5.2.11(@types/node@20.14.2))
      '@types/node':
-        specifier: ^20.11.4
-        version: 20.11.4
+        specifier: ^20.14.2
+        version: 20.14.2
      '@types/react':
-        specifier: ^18.2.48
-        version: 18.2.48
+        specifier: ^18.3.3
+        version: 18.3.3
      '@types/react-dom':
        specifier: ^18.2.18
        version: 18.2.18
@@ -64,17 +67,17 @@ importers:
        specifier: ^5.3.3
        version: 5.3.3
      '@vitejs/plugin-react-swc':
-        specifier: ^3.6.0
-        version: 3.6.0(vite@5.2.11(@types/node@20.11.4))
+        specifier: ^3.7.0
+        version: 3.7.0(vite@5.2.11(@types/node@20.14.2))
      million:
-        specifier: ^3.0.6
-        version: 3.0.6(rollup@4.13.0)
+        specifier: ^3.1.11
+        version: 3.1.11(rollup@4.13.0)
      typescript:
-        specifier: ^5.4.3
-        version: 5.4.3
+        specifier: ^5.4.5
+        version: 5.4.5
      vite:
        specifier: ^5.2.11
-        version: 5.2.11(@types/node@20.11.4)
+        version: 5.2.11(@types/node@20.14.2)

 packages:

@@ -518,8 +521,8 @@ packages:
  '@popperjs/core@2.11.8':
    resolution: {integrity: sha512-P1st0aksCrn9sGZhp8GMYwBnQsbvAWsZAX44oXNNvLHGqAOcoVxmjZiohstwQ7SqKnbR47akdNi+uleWD8+g6A==}

-  '@remix-run/router@1.16.0':
-    resolution: {integrity: sha512-Quz1KOffeEf/zwkCBM3kBtH4ZoZ+pT3xIXBG4PPW/XFtDP7EGhtTiC2+gpL9GnR7+Qdet5Oa6cYSvwKYg6kN9Q==}
+  '@remix-run/router@1.16.1':
+    resolution: {integrity: sha512-es2g3dq6Nb07iFxGk5GuHN20RwBZOsuDQN7izWIisUcv9r+d2C5jQxqmgkdebXgReWfiyUabcki6Fg77mSNrig==}
    engines: {node: '>=14.0.0'}

  '@rollup/pluginutils@5.1.0':
@@ -596,80 +599,80 @@ packages:
    cpu: [x64]
    os: [win32]

-  '@swc/core-darwin-arm64@1.4.8':
-    resolution: {integrity: sha512-hhQCffRTgzpTIbngSnC30vV6IJVTI9FFBF954WEsshsecVoCGFiMwazBbrkLG+RwXENTrMhgeREEFh6R3KRgKQ==}
+  '@swc/core-darwin-arm64@1.5.28':
+    resolution: {integrity: sha512-sP6g63ybzIdOWNDbn51tyHN8EMt7Mb4RMeHQEsXB7wQfDvzhpWB+AbfK6Gs3Q8fwP/pmWIrWW9csKOc1K2Mmkg==}
    engines: {node: '>=10'}
    cpu: [arm64]
    os: [darwin]

-  '@swc/core-darwin-x64@1.4.8':
-    resolution: {integrity: sha512-P3ZBw8Jr8rKhY/J8d+6WqWriqngGTgHwtFeJ8MIakQJTbdYbFgXSZxcvDiERg3psbGeFXaUaPI0GO6BXv9k/OQ==}
+  '@swc/core-darwin-x64@1.5.28':
+    resolution: {integrity: sha512-Bd/agp/g7QocQG5AuorOzSC78t8OzeN+pCN/QvJj1CvPhvppjJw6e1vAbOR8vO2vvGi2pvtf3polrYQStJtSiA==}
    engines: {node: '>=10'}
    cpu: [x64]
    os: [darwin]

-  '@swc/core-linux-arm-gnueabihf@1.4.8':
-    resolution: {integrity: sha512-PP9JIJt19bUWhAGcQW6qMwTjZOcMyzkvZa0/LWSlDm0ORYVLmDXUoeQbGD3e0Zju9UiZxyulnpjEN0ZihJgPTA==}
+  '@swc/core-linux-arm-gnueabihf@1.5.28':
+    resolution: {integrity: sha512-Wr3TwPGIveS9/OBWm0r9VAL8wkCR0zQn46J8K01uYCmVhUNK3Muxjs0vQBZaOrGu94mqbj9OXY+gB3W7aDvGdA==}
    engines: {node: '>=10'}
    cpu: [arm]
    os: [linux]

-  '@swc/core-linux-arm64-gnu@1.4.8':
-    resolution: {integrity: sha512-HvEWnwKHkoVUr5iftWirTApFJ13hGzhAY2CMw4lz9lur2m+zhPviRRED0FCI6T95Knpv7+8eUOr98Z7ctrG6DQ==}
+  '@swc/core-linux-arm64-gnu@1.5.28':
+    resolution: {integrity: sha512-8G1ZwVTuLgTAVTMPD+M97eU6WeiRIlGHwKZ5fiJHPBcz1xqIC7jQcEh7XBkobkYoU5OILotls3gzjRt8CMNyDQ==}
    engines: {node: '>=10'}
    cpu: [arm64]
    os: [linux]

-  '@swc/core-linux-arm64-musl@1.4.8':
-    resolution: {integrity: sha512-kY8+qa7k/dEeBq9p0Hrta18QnJPpsiJvDQSLNaTIFpdM3aEM9zbkshWz8gaX5VVGUEALowCBUWqmzO4VaqM+2w==}
+  '@swc/core-linux-arm64-musl@1.5.28':
+    resolution: {integrity: sha512-0Ajdzb5Fzvz+XUbN5ESeHAz9aHHSYiQcm+vmsDi0TtPHmsalfnqEPZmnK0zPALPJPLQP2dDo4hELeDg3/c3xgA==}
    engines: {node: '>=10'}
    cpu: [arm64]
    os: [linux]

-  '@swc/core-linux-x64-gnu@1.4.8':
-    resolution: {integrity: sha512-0WWyIw432wpO/zeGblwq4f2YWam4pn8Z/Ig4KzHMgthR/KmiLU3f0Z7eo45eVmq5vcU7Os1zi/Zb65OOt09q/w==}
+  '@swc/core-linux-x64-gnu@1.5.28':
+    resolution: {integrity: sha512-ueQ9VejnQUM2Pt+vT0IAKoF4vYBWUP6n1KHGdILpoGe3LuafQrqu7RoyQ15C7/AYii7hAeNhTFdf6gLbg8cjFg==}
    engines: {node: '>=10'}
    cpu: [x64]
    os: [linux]

-  '@swc/core-linux-x64-musl@1.4.8':
-    resolution: {integrity: sha512-p4yxvVS05rBNCrBaSTa20KK88vOwtg8ifTW7ec/yoab0bD5EwzzB8KbDmLLxE6uziFa0sdjF0dfRDwSZPex37Q==}
+  '@swc/core-linux-x64-musl@1.5.28':
+    resolution: {integrity: sha512-G5th8Mg0az8CbY4GQt9/m5hg2Y0kGIwvQBeVACuLQB6q2Y4txzdiTpjmFqUUhEvvl7Klyx1IHvNhfXs3zpt7PA==}
    engines: {node: '>=10'}
    cpu: [x64]
    os: [linux]

-  '@swc/core-win32-arm64-msvc@1.4.8':
-    resolution: {integrity: sha512-jKuXihxAaqUnbFfvPxtmxjdJfs87F1GdBf33il+VUmSyWCP4BE6vW+/ReDAe8sRNsKyrZ3UH1vI5q1n64csBUA==}
+  '@swc/core-win32-arm64-msvc@1.5.28':
+    resolution: {integrity: sha512-JezwCGavZ7CkNXx4yInI4kpb71L0zxzxA9BFlmnsGKEEjVQcKc3hFpmIzfFVs+eotlBUwDNb0+Yo9m6Cb7lllA==}
    engines: {node: '>=10'}
    cpu: [arm64]
    os: [win32]

-  '@swc/core-win32-ia32-msvc@1.4.8':
-    resolution: {integrity: sha512-O0wT4AGHrX8aBeH6c2ADMHgagAJc5Kf6W48U5moyYDAkkVnKvtSc4kGhjWhe1Yl0sI0cpYh2In2FxvYsb44eWw==}
+  '@swc/core-win32-ia32-msvc@1.5.28':
+    resolution: {integrity: sha512-q8tW5J4RkOkl7vYShnWS//VAb2Ngolfm9WOMaF2GRJUr2Y/Xeb/+cNjdsNOqea2BzW049D5vdP7XPmir3/zUZw==}
    engines: {node: '>=10'}
    cpu: [ia32]
    os: [win32]

-  '@swc/core-win32-x64-msvc@1.4.8':
-    resolution: {integrity: sha512-C2AYc3A2o+ECciqsJWRgIpp83Vk5EaRzHe7ed/xOWzVd0MsWR+fweEsyOjlmzHfpUxJSi46Ak3/BIZJlhZbXbg==}
+  '@swc/core-win32-x64-msvc@1.5.28':
+    resolution: {integrity: sha512-jap6EiB3wG1YE1hyhNr9KLPpH4PGm+5tVMfN0l7fgKtV0ikgpcEN/YF94tru+z5m2HovqYW009+Evq9dcVGmpg==}
    engines: {node: '>=10'}
    cpu: [x64]
    os: [win32]

-  '@swc/core@1.4.8':
-    resolution: {integrity: sha512-uY2RSJcFPgNOEg12RQZL197LZX+MunGiKxsbxmh22VfVxrOYGRvh4mPANFlrD1yb38CgmW1wI6YgIi8LkIwmWg==}
+  '@swc/core@1.5.28':
+    resolution: {integrity: sha512-muCdNIqOTURUgYeyyOLYE3ShL8SZO6dw6bhRm6dCvxWzCZOncPc5fB0kjcPXTML+9KJoHL7ks5xg+vsQK+v6ig==}
    engines: {node: '>=10'}
    peerDependencies:
-      '@swc/helpers': ^0.5.0
+      '@swc/helpers': '*'
    peerDependenciesMeta:
      '@swc/helpers':
        optional: true

-  '@swc/counter@0.1.2':
-    resolution: {integrity: sha512-9F4ys4C74eSTEUNndnER3VJ15oru2NumfQxS8geE+f3eB5xvfxpWyqE5XlVnxb/R14uoXi6SLbBwwiDSkv+XEw==}
+  '@swc/counter@0.1.3':
+    resolution: {integrity: sha512-e2BR4lsJkkRlKZ/qCHPw9ZaSxc0MVUd7gtbtaB7aMvHeJVYe8sOB8DBZkP2DtISHGSku9sCK6T6cnY0CtXrOCQ==}

-  '@swc/types@0.1.5':
-    resolution: {integrity: sha512-myfUej5naTBWnqOCc/MdVOLVjXUXtIA+NpDrDBKJtLLg2shUjBu3cZmB/85RyitKc55+lUUyl7oRfLOvkr2hsw==}
+  '@swc/types@0.1.8':
+    resolution: {integrity: sha512-RNFA3+7OJFNYY78x0FYwi1Ow+iF1eF5WvmfY1nXPOEH4R2p/D4Cr1vzje7dNAI2aLFqpv8Wyz4oKSWqIZArpQA==}

  '@types/estree@1.0.5':
    resolution: {integrity: sha512-/kYRxGDLWzHOB7q+wtSUQlFrtcdUccpfy+X+9iMBpHK8QLLhx2wIPYuS5DYtR9Wa/YlZAbIovy7qVdB1Aq6Lyw==}
@@ -677,8 +680,8 @@ packages:
  '@types/history@4.7.11':
    resolution: {integrity: sha512-qjDJRrmvBMiTx+jyLxvLfJU7UznFuokDv4f3WRuriHKERccVpFU+8XMQUAbDzoiJCsmexxRExQeMwwCdamSKDA==}

-  '@types/node@20.11.4':
-    resolution: {integrity: sha512-6I0fMH8Aoy2lOejL3s4LhyIYX34DPwY8bl5xlNjBvUEk8OHrcuzsFt+Ied4LvJihbtXPM+8zUqdydfIti86v9g==}
+  '@types/node@20.14.2':
+    resolution: {integrity: sha512-xyu6WAMVwv6AKFLB+e/7ySZVr/0zLCzOa7rSpq6jNwpqOrUbcACDWC+53d4n2QHOnDou0fbIsg8wZu/sxrnI4Q==}

  '@types/parse-json@4.0.0':
    resolution: {integrity: sha512-//oorEZjL6sbPcKUaCdIGlIUeH26mgzimjBB77G6XRgnDl/L5wOnpyBGRe/Mmf5CVW3PwEBE1NjiMZ/ssFh4wA==}
@@ -686,9 +689,6 @@ packages:
  '@types/prop-types@15.7.11':
    resolution: {integrity: sha512-ga8y9v9uyeiLdpKddhxYQkxNDrfvuPrlFb0N1qnZZByvcElJaXthF1UhvCh9TLWJBEHeNtdnbysW7Y6Uq8CVng==}

-  '@types/prop-types@15.7.5':
-    resolution: {integrity: sha512-JCB8C6SnDoQf0cNycqd/35A7MjcnK+ZTqE7judS6o7utxUCg6imJg3QK2qzHKszlTjcj2cn+NwMB2i96ubpj7w==}
-
  '@types/react-dom@18.2.18':
    resolution: {integrity: sha512-TJxDm6OfAX2KJWJdMEVTwWke5Sc/E/RlnPGvGfS0W7+6ocy2xhDVQVh/KvC2Uf7kACs+gDytdusDSdWfWkaNzw==}

@@ -704,14 +704,11 @@ packages:
  '@types/react-transition-group@4.4.10':
    resolution: {integrity: sha512-hT/+s0VQs2ojCX823m60m5f0sL5idt9SO6Tj6Dg+rdphGPIeJbJ6CxvBYkgkGKrYeDjvIpKTR38UzmtHJOGW3Q==}

-  '@types/react@18.2.48':
-    resolution: {integrity: sha512-qboRCl6Ie70DQQG9hhNREz81jqC1cs9EVNcjQ1AU+jH6NFfSAhVVbrrY/+nSF+Bsk4AOwm9Qa61InvMCyV+H3w==}
+  '@types/react@18.3.3':
+    resolution: {integrity: sha512-hti/R0pS0q1/xx+TsI73XIqk26eBsISZ2R0wUijXIngRK9R/e7Xw/cXVxQK7R5JjW+SV4zGcn5hXjudkN/pLIw==}

-  '@types/scheduler@0.16.3':
-    resolution: {integrity: sha512-5cJ8CB4yAx7BH1oMvdU0Jh9lrEXyPkar6F9G/ERswkCuvP4KQZfZkSjcMbAICCpQTN4OuZn8tz0HiKv9TGZgrQ==}
-
-  '@vitejs/plugin-react-swc@3.6.0':
-    resolution: {integrity: sha512-XFRbsGgpGxGzEV5i5+vRiro1bwcIaZDIdBRP16qwm+jP68ue/S8FJTBEgOeojtVDYrbSua3XFp71kC8VJE6v+g==}
+  '@vitejs/plugin-react-swc@3.7.0':
+    resolution: {integrity: sha512-yrknSb3Dci6svCd/qhHqhFPDSw0QtjumcqdKMoNNzmOl5lMXTTiqzjWtG4Qask2HdvvzaNgSunbQGet8/GrKdA==}
    peerDependencies:
      vite: ^4 || ^5

@@ -931,8 +928,8 @@ packages:
  lru-cache@5.1.1:
    resolution: {integrity: sha512-KpNARQA3Iwv+jTA0utUVVbrh+Jlrr1Fv0e56GGzAFOXN7dk/FviaDW8LHmK52DlcH4WP2n6gI8vN1aesBFgo9w==}

-  million@3.0.6:
-    resolution: {integrity: sha512-OLjRVASGOZdyZw2ctBSSOu5kb9PaxafqkueqVvw0iQtUUnTLVRk1EmtqcNAtJWCIm8wn+WGRpDbnp+5Hi8//Kg==}
+  million@3.1.11:
+    resolution: {integrity: sha512-6Vh1s0da0PzSqbbp9Zd8yMTIkOWnvBU4vNJCMHTZPXaY3fZ5h+N7s5croS/RBgjJIHz3WQZnvyNBQz7gQ6cqJg==}
    hasBin: true

  ms@2.1.2:
@@ -994,15 +991,15 @@ packages:
  react-is@18.2.0:
    resolution: {integrity: sha512-xWGDIW6x921xtzPkhiULtthJHoJvBbF3q26fzloPCK0hsvxtPVelvftw3zjbHWSkR2km9Z+4uxbDDK/6Zw9B8w==}

-  react-router-dom@6.23.0:
-    resolution: {integrity: sha512-Q9YaSYvubwgbal2c9DJKfx6hTNoBp3iJDsl+Duva/DwxoJH+OTXkxGpql4iUK2sla/8z4RpjAm6EWx1qUDuopQ==}
+  react-router-dom@6.23.1:
+    resolution: {integrity: sha512-utP+K+aSTtEdbWpC+4gxhdlPFwuEfDKq8ZrPFU65bbRJY+l706qjR7yaidBpo3MSeA/fzwbXWbKBI6ftOnP3OQ==}
    engines: {node: '>=14.0.0'}
    peerDependencies:
      react: '>=16.8'
      react-dom: '>=16.8'

-  react-router@6.23.0:
-    resolution: {integrity: sha512-wPMZ8S2TuPadH0sF5irFGjkNLIcRvOSaEe7v+JER8508dyJumm6XZB1u5kztlX0RVq6AzRVndzqcUh6sFIauzA==}
+  react-router@6.23.1:
+    resolution: {integrity: sha512-fzcOaRF69uvqbbM7OhvQyBTFDVrrGlsFdS3AL+1KfIBtGETibHzi3FkoTRyiDJnWNc2VxrfvR+657ROHjaNjqQ==}
    engines: {node: '>=14.0.0'}
    peerDependencies:
      react: '>=16.8'
@@ -1013,6 +1010,13 @@ packages:
      react: '>=16.6.0'
      react-dom: '>=16.6.0'

+  react-virtuoso@4.7.11:
+    resolution: {integrity: sha512-Kdn9qEtQI2ulEuBMzW2BTkDsfijB05QUd6lpZ1K36oyA3k65Cz4lG4EKrh2pCfUafX4C2uMSZOwzMOhbrMOTFA==}
+    engines: {node: '>=10'}
+    peerDependencies:
+      react: '>=16 || >=17 || >= 18'
+      react-dom: '>=16 || >=17 || >= 18'
+
  react@18.3.1:
    resolution: {integrity: sha512-wS+hAgJShR0KhEvPJArfuPVN1+Hz1t0Y6n5jLrGQbkb4urgPE/0Rve+1kMB1v/oWgHgm4WIcV+i7F2pTVj+2iQ==}
    engines: {node: '>=0.10.0'}
@@ -1093,8 +1097,8 @@ packages:
  tslib@2.5.2:
    resolution: {integrity: sha512-5svOrSA2w3iGFDs1HibEVBGbDrAY82bFQ3HZ3ixB+88nsbsWQoKqDRb5UBYAUPEzbBn6dAp5gRNXglySbx1MlA==}

-  typescript@5.4.3:
-    resolution: {integrity: sha512-KrPd3PKaCLr78MalgiwJnA25Nm8HAmdwN3mYUYZgG/wizIo9EainNVQI9/yDavtVFRN2h3k8uf3GLHuhDMgEHg==}
+  typescript@5.4.5:
+    resolution: {integrity: sha512-vcI4UpRgg81oIRUFwR0WSIHKt11nJ7SAVlYNIu+QpqeyXP+gpQJy/Z4+F0aGxSE4MqwjyXvW/TzgkLAx2AGHwQ==}
    engines: {node: '>=14.17'}
    hasBin: true

@@ -1326,7 +1330,7 @@ snapshots:

  '@emotion/memoize@0.8.1': {}

-  '@emotion/react@11.11.4(@types/react@18.2.48)(react@18.3.1)':
+  '@emotion/react@11.11.4(@types/react@18.3.3)(react@18.3.1)':
    dependencies:
      '@babel/runtime': 7.23.8
      '@emotion/babel-plugin': 11.11.0
@@ -1338,7 +1342,7 @@ snapshots:
      hoist-non-react-statics: 3.3.2
      react: 18.3.1
    optionalDependencies:
-      '@types/react': 18.2.48
+      '@types/react': 18.3.3

  '@emotion/serialize@1.1.3':
    dependencies:
@@ -1358,18 +1362,18 @@ snapshots:

  '@emotion/sheet@1.2.2': {}

-  '@emotion/styled@11.11.5(@emotion/react@11.11.4(@types/react@18.2.48)(react@18.3.1))(@types/react@18.2.48)(react@18.3.1)':
+  '@emotion/styled@11.11.5(@emotion/react@11.11.4(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react@18.3.1)':
    dependencies:
      '@babel/runtime': 7.23.8
      '@emotion/babel-plugin': 11.11.0
      '@emotion/is-prop-valid': 1.2.2
-      '@emotion/react': 11.11.4(@types/react@18.2.48)(react@18.3.1)
+      '@emotion/react': 11.11.4(@types/react@18.3.3)(react@18.3.1)
      '@emotion/serialize': 1.1.4
      '@emotion/use-insertion-effect-with-fallbacks': 1.0.1(react@18.3.1)
      '@emotion/utils': 1.2.1
      react: 18.3.1
    optionalDependencies:
-      '@types/react': 18.2.48
+      '@types/react': 18.3.3

  '@emotion/unitless@0.8.1': {}

@@ -1488,47 +1492,47 @@ snapshots:
      '@jridgewell/resolve-uri': 3.1.1
      '@jridgewell/sourcemap-codec': 1.4.15

-  '@modyfi/vite-plugin-yaml@1.1.0(rollup@4.13.0)(vite@5.2.11(@types/node@20.11.4))':
+  '@modyfi/vite-plugin-yaml@1.1.0(rollup@4.13.0)(vite@5.2.11(@types/node@20.14.2))':
    dependencies:
      '@rollup/pluginutils': 5.1.0(rollup@4.13.0)
      js-yaml: 4.1.0
      tosource: 2.0.0-alpha.3
-      vite: 5.2.11(@types/node@20.11.4)
+      vite: 5.2.11(@types/node@20.14.2)
    transitivePeerDependencies:
      - rollup

-  '@mui/base@5.0.0-beta.40(@types/react@18.2.48)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)':
+  '@mui/base@5.0.0-beta.40(@types/react@18.3.3)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)':
    dependencies:
      '@babel/runtime': 7.24.5
      '@floating-ui/react-dom': 2.0.9(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
-      '@mui/types': 7.2.14(@types/react@18.2.48)
-      '@mui/utils': 5.15.14(@types/react@18.2.48)(react@18.3.1)
+      '@mui/types': 7.2.14(@types/react@18.3.3)
+      '@mui/utils': 5.15.14(@types/react@18.3.3)(react@18.3.1)
      '@popperjs/core': 2.11.8
      clsx: 2.1.0
      prop-types: 15.8.1
      react: 18.3.1
      react-dom: 18.3.1(react@18.3.1)
    optionalDependencies:
-      '@types/react': 18.2.48
+      '@types/react': 18.3.3

  '@mui/core-downloads-tracker@5.15.16': {}

-  '@mui/icons-material@5.15.16(@mui/material@5.15.16(@emotion/react@11.11.4(@types/react@18.2.48)(react@18.3.1))(@emotion/styled@11.11.5(@emotion/react@11.11.4(@types/react@18.2.48)(react@18.3.1))(@types/react@18.2.48)(react@18.3.1))(@types/react@18.2.48)(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(@types/react@18.2.48)(react@18.3.1)':
+  '@mui/icons-material@5.15.16(@mui/material@5.15.16(@emotion/react@11.11.4(@types/react@18.3.3)(react@18.3.1))(@emotion/styled@11.11.5(@emotion/react@11.11.4(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(@types/react@18.3.3)(react@18.3.1)':
    dependencies:
      '@babel/runtime': 7.24.5
-      '@mui/material': 5.15.16(@emotion/react@11.11.4(@types/react@18.2.48)(react@18.3.1))(@emotion/styled@11.11.5(@emotion/react@11.11.4(@types/react@18.2.48)(react@18.3.1))(@types/react@18.2.48)(react@18.3.1))(@types/react@18.2.48)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
+      '@mui/material': 5.15.16(@emotion/react@11.11.4(@types/react@18.3.3)(react@18.3.1))(@emotion/styled@11.11.5(@emotion/react@11.11.4(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
      react: 18.3.1
    optionalDependencies:
-      '@types/react': 18.2.48
+      '@types/react': 18.3.3

-  '@mui/material@5.15.16(@emotion/react@11.11.4(@types/react@18.2.48)(react@18.3.1))(@emotion/styled@11.11.5(@emotion/react@11.11.4(@types/react@18.2.48)(react@18.3.1))(@types/react@18.2.48)(react@18.3.1))(@types/react@18.2.48)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)':
+  '@mui/material@5.15.16(@emotion/react@11.11.4(@types/react@18.3.3)(react@18.3.1))(@emotion/styled@11.11.5(@emotion/react@11.11.4(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)':
    dependencies:
      '@babel/runtime': 7.24.5
-      '@mui/base': 5.0.0-beta.40(@types/react@18.2.48)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
+      '@mui/base': 5.0.0-beta.40(@types/react@18.3.3)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
      '@mui/core-downloads-tracker': 5.15.16
-      '@mui/system': 5.15.15(@emotion/react@11.11.4(@types/react@18.2.48)(react@18.3.1))(@emotion/styled@11.11.5(@emotion/react@11.11.4(@types/react@18.2.48)(react@18.3.1))(@types/react@18.2.48)(react@18.3.1))(@types/react@18.2.48)(react@18.3.1)
-      '@mui/types': 7.2.14(@types/react@18.2.48)
-      '@mui/utils': 5.15.14(@types/react@18.2.48)(react@18.3.1)
+      '@mui/system': 5.15.15(@emotion/react@11.11.4(@types/react@18.3.3)(react@18.3.1))(@emotion/styled@11.11.5(@emotion/react@11.11.4(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react@18.3.1)
+      '@mui/types': 7.2.14(@types/react@18.3.3)
+      '@mui/utils': 5.15.14(@types/react@18.3.3)(react@18.3.1)
      '@types/react-transition-group': 4.4.10
      clsx: 2.1.0
      csstype: 3.1.3
@@ -1538,20 +1542,20 @@ snapshots:
      react-is: 18.2.0
      react-transition-group: 4.4.5(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
    optionalDependencies:
-      '@emotion/react': 11.11.4(@types/react@18.2.48)(react@18.3.1)
-      '@emotion/styled': 11.11.5(@emotion/react@11.11.4(@types/react@18.2.48)(react@18.3.1))(@types/react@18.2.48)(react@18.3.1)
-      '@types/react': 18.2.48
+      '@emotion/react': 11.11.4(@types/react@18.3.3)(react@18.3.1)
+      '@emotion/styled': 11.11.5(@emotion/react@11.11.4(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react@18.3.1)
+      '@types/react': 18.3.3

-  '@mui/private-theming@5.15.14(@types/react@18.2.48)(react@18.3.1)':
+  '@mui/private-theming@5.15.14(@types/react@18.3.3)(react@18.3.1)':
    dependencies:
      '@babel/runtime': 7.24.5
-      '@mui/utils': 5.15.14(@types/react@18.2.48)(react@18.3.1)
+      '@mui/utils': 5.15.14(@types/react@18.3.3)(react@18.3.1)
      prop-types: 15.8.1
      react: 18.3.1
    optionalDependencies:
-      '@types/react': 18.2.48
+      '@types/react': 18.3.3

-  '@mui/styled-engine@5.15.14(@emotion/react@11.11.4(@types/react@18.2.48)(react@18.3.1))(@emotion/styled@11.11.5(@emotion/react@11.11.4(@types/react@18.2.48)(react@18.3.1))(@types/react@18.2.48)(react@18.3.1))(react@18.3.1)':
+  '@mui/styled-engine@5.15.14(@emotion/react@11.11.4(@types/react@18.3.3)(react@18.3.1))(@emotion/styled@11.11.5(@emotion/react@11.11.4(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react@18.3.1))(react@18.3.1)':
    dependencies:
      '@babel/runtime': 7.24.5
      '@emotion/cache': 11.11.0
@@ -1559,30 +1563,30 @@ snapshots:
      prop-types: 15.8.1
      react: 18.3.1
    optionalDependencies:
-      '@emotion/react': 11.11.4(@types/react@18.2.48)(react@18.3.1)
-      '@emotion/styled': 11.11.5(@emotion/react@11.11.4(@types/react@18.2.48)(react@18.3.1))(@types/react@18.2.48)(react@18.3.1)
+      '@emotion/react': 11.11.4(@types/react@18.3.3)(react@18.3.1)
+      '@emotion/styled': 11.11.5(@emotion/react@11.11.4(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react@18.3.1)

-  '@mui/system@5.15.15(@emotion/react@11.11.4(@types/react@18.2.48)(react@18.3.1))(@emotion/styled@11.11.5(@emotion/react@11.11.4(@types/react@18.2.48)(react@18.3.1))(@types/react@18.2.48)(react@18.3.1))(@types/react@18.2.48)(react@18.3.1)':
+  '@mui/system@5.15.15(@emotion/react@11.11.4(@types/react@18.3.3)(react@18.3.1))(@emotion/styled@11.11.5(@emotion/react@11.11.4(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react@18.3.1)':
    dependencies:
      '@babel/runtime': 7.24.5
-      '@mui/private-theming': 5.15.14(@types/react@18.2.48)(react@18.3.1)
-      '@mui/styled-engine': 5.15.14(@emotion/react@11.11.4(@types/react@18.2.48)(react@18.3.1))(@emotion/styled@11.11.5(@emotion/react@11.11.4(@types/react@18.2.48)(react@18.3.1))(@types/react@18.2.48)(react@18.3.1))(react@18.3.1)
-      '@mui/types': 7.2.14(@types/react@18.2.48)
-      '@mui/utils': 5.15.14(@types/react@18.2.48)(react@18.3.1)
+      '@mui/private-theming': 5.15.14(@types/react@18.3.3)(react@18.3.1)
+      '@mui/styled-engine': 5.15.14(@emotion/react@11.11.4(@types/react@18.3.3)(react@18.3.1))(@emotion/styled@11.11.5(@emotion/react@11.11.4(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react@18.3.1))(react@18.3.1)
+      '@mui/types': 7.2.14(@types/react@18.3.3)
+      '@mui/utils': 5.15.14(@types/react@18.3.3)(react@18.3.1)
      clsx: 2.1.0
      csstype: 3.1.3
      prop-types: 15.8.1
      react: 18.3.1
    optionalDependencies:
-      '@emotion/react': 11.11.4(@types/react@18.2.48)(react@18.3.1)
-      '@emotion/styled': 11.11.5(@emotion/react@11.11.4(@types/react@18.2.48)(react@18.3.1))(@types/react@18.2.48)(react@18.3.1)
-      '@types/react': 18.2.48
+      '@emotion/react': 11.11.4(@types/react@18.3.3)(react@18.3.1)
+      '@emotion/styled': 11.11.5(@emotion/react@11.11.4(@types/react@18.3.3)(react@18.3.1))(@types/react@18.3.3)(react@18.3.1)
+      '@types/react': 18.3.3

-  '@mui/types@7.2.14(@types/react@18.2.48)':
+  '@mui/types@7.2.14(@types/react@18.3.3)':
    optionalDependencies:
-      '@types/react': 18.2.48
+      '@types/react': 18.3.3

-  '@mui/utils@5.15.14(@types/react@18.2.48)(react@18.3.1)':
+  '@mui/utils@5.15.14(@types/react@18.3.3)(react@18.3.1)':
    dependencies:
      '@babel/runtime': 7.24.5
      '@types/prop-types': 15.7.11
@@ -1590,11 +1594,11 @@ snapshots:
      react: 18.3.1
      react-is: 18.2.0
    optionalDependencies:
-      '@types/react': 18.2.48
+      '@types/react': 18.3.3

  '@popperjs/core@2.11.8': {}

-  '@remix-run/router@1.16.0': {}
+  '@remix-run/router@1.16.1': {}

  '@rollup/pluginutils@5.1.0(rollup@4.13.0)':
    dependencies:
@@ -1643,61 +1647,63 @@ snapshots:
  '@rollup/rollup-win32-x64-msvc@4.13.0':
    optional: true

-  '@swc/core-darwin-arm64@1.4.8':
+  '@swc/core-darwin-arm64@1.5.28':
    optional: true

-  '@swc/core-darwin-x64@1.4.8':
+  '@swc/core-darwin-x64@1.5.28':
    optional: true

-  '@swc/core-linux-arm-gnueabihf@1.4.8':
+  '@swc/core-linux-arm-gnueabihf@1.5.28':
    optional: true

-  '@swc/core-linux-arm64-gnu@1.4.8':
+  '@swc/core-linux-arm64-gnu@1.5.28':
    optional: true

-  '@swc/core-linux-arm64-musl@1.4.8':
+  '@swc/core-linux-arm64-musl@1.5.28':
    optional: true

-  '@swc/core-linux-x64-gnu@1.4.8':
+  '@swc/core-linux-x64-gnu@1.5.28':
    optional: true

-  '@swc/core-linux-x64-musl@1.4.8':
+  '@swc/core-linux-x64-musl@1.5.28':
    optional: true

-  '@swc/core-win32-arm64-msvc@1.4.8':
+  '@swc/core-win32-arm64-msvc@1.5.28':
    optional: true

-  '@swc/core-win32-ia32-msvc@1.4.8':
+  '@swc/core-win32-ia32-msvc@1.5.28':
    optional: true

-  '@swc/core-win32-x64-msvc@1.4.8':
+  '@swc/core-win32-x64-msvc@1.5.28':
    optional: true

-  '@swc/core@1.4.8':
+  '@swc/core@1.5.28':
    dependencies:
-      '@swc/counter': 0.1.2
-      '@swc/types': 0.1.5
+      '@swc/counter': 0.1.3
+      '@swc/types': 0.1.8
    optionalDependencies:
-      '@swc/core-darwin-arm64': 1.4.8
-      '@swc/core-darwin-x64': 1.4.8
-      '@swc/core-linux-arm-gnueabihf': 1.4.8
-      '@swc/core-linux-arm64-gnu': 1.4.8
-      '@swc/core-linux-arm64-musl': 1.4.8
-      '@swc/core-linux-x64-gnu': 1.4.8
-      '@swc/core-linux-x64-musl': 1.4.8
-      '@swc/core-win32-arm64-msvc': 1.4.8
-      '@swc/core-win32-ia32-msvc': 1.4.8
-      '@swc/core-win32-x64-msvc': 1.4.8
+      '@swc/core-darwin-arm64': 1.5.28
+      '@swc/core-darwin-x64': 1.5.28
+      '@swc/core-linux-arm-gnueabihf': 1.5.28
+      '@swc/core-linux-arm64-gnu': 1.5.28
+      '@swc/core-linux-arm64-musl': 1.5.28
+      '@swc/core-linux-x64-gnu': 1.5.28
+      '@swc/core-linux-x64-musl': 1.5.28
+      '@swc/core-win32-arm64-msvc': 1.5.28
+      '@swc/core-win32-ia32-msvc': 1.5.28
+      '@swc/core-win32-x64-msvc': 1.5.28

-  '@swc/counter@0.1.2': {}
+  '@swc/counter@0.1.3': {}

-  '@swc/types@0.1.5': {}
+  '@swc/types@0.1.8':
+    dependencies:
+      '@swc/counter': 0.1.3

  '@types/estree@1.0.5': {}

  '@types/history@4.7.11': {}

-  '@types/node@20.11.4':
+  '@types/node@20.14.2':
    dependencies:
      undici-types: 5.26.5

@@ -1705,43 +1711,38 @@ snapshots:

  '@types/prop-types@15.7.11': {}

-  '@types/prop-types@15.7.5': {}
-
  '@types/react-dom@18.2.18':
    dependencies:
-      '@types/react': 18.2.48
+      '@types/react': 18.3.3

  '@types/react-helmet@6.1.11':
    dependencies:
-      '@types/react': 18.2.48
+      '@types/react': 18.3.3

  '@types/react-router-dom@5.3.3':
    dependencies:
      '@types/history': 4.7.11
-      '@types/react': 18.2.48
+      '@types/react': 18.3.3
      '@types/react-router': 5.1.20

  '@types/react-router@5.1.20':
    dependencies:
      '@types/history': 4.7.11
-      '@types/react': 18.2.48
+      '@types/react': 18.3.3

  '@types/react-transition-group@4.4.10':
    dependencies:
-      '@types/react': 18.2.48
+      '@types/react': 18.3.3

-  '@types/react@18.2.48':
+  '@types/react@18.3.3':
    dependencies:
-      '@types/prop-types': 15.7.5
-      '@types/scheduler': 0.16.3
-      csstype: 3.1.2
+      '@types/prop-types': 15.7.11
+      csstype: 3.1.3

-  '@types/scheduler@0.16.3': {}
-
-  '@vitejs/plugin-react-swc@3.6.0(vite@5.2.11(@types/node@20.11.4))':
+  '@vitejs/plugin-react-swc@3.7.0(vite@5.2.11(@types/node@20.14.2))':
    dependencies:
-      '@swc/core': 1.4.8
-      vite: 5.2.11(@types/node@20.11.4)
+      '@swc/core': 1.5.28
+      vite: 5.2.11(@types/node@20.14.2)
    transitivePeerDependencies:
      - '@swc/helpers'

@@ -1952,7 +1953,7 @@ snapshots:
    dependencies:
      yallist: 3.1.1

-  million@3.0.6(rollup@4.13.0):
+  million@3.1.11(rollup@4.13.0):
    dependencies:
      '@babel/core': 7.23.7
      '@babel/types': 7.23.6
@@ -2015,16 +2016,16 @@ snapshots:

  react-is@18.2.0: {}

-  react-router-dom@6.23.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1):
+  react-router-dom@6.23.1(react-dom@18.3.1(react@18.3.1))(react@18.3.1):
    dependencies:
-      '@remix-run/router': 1.16.0
+      '@remix-run/router': 1.16.1
      react: 18.3.1
      react-dom: 18.3.1(react@18.3.1)
-      react-router: 6.23.0(react@18.3.1)
+      react-router: 6.23.1(react@18.3.1)

-  react-router@6.23.0(react@18.3.1):
+  react-router@6.23.1(react@18.3.1):
    dependencies:
-      '@remix-run/router': 1.16.0
+      '@remix-run/router': 1.16.1
      react: 18.3.1

  react-transition-group@4.4.5(react-dom@18.3.1(react@18.3.1))(react@18.3.1):
@@ -2036,6 +2037,11 @@ snapshots:
      react: 18.3.1
      react-dom: 18.3.1(react@18.3.1)

+  react-virtuoso@4.7.11(react-dom@18.3.1(react@18.3.1))(react@18.3.1):
+    dependencies:
+      react: 18.3.1
+      react-dom: 18.3.1(react@18.3.1)
+
  react@18.3.1:
    dependencies:
      loose-envify: 1.4.0
@@ -2112,7 +2118,7 @@ snapshots:

  tslib@2.5.2: {}

-  typescript@5.4.3: {}
+  typescript@5.4.5: {}

  undici-types@5.26.5: {}

@@ -2131,13 +2137,13 @@ snapshots:
      escalade: 3.1.1
      picocolors: 1.0.0

-  vite@5.2.11(@types/node@20.11.4):
+  vite@5.2.11(@types/node@20.14.2):
    dependencies:
      esbuild: 0.20.2
      postcss: 8.4.38
      rollup: 4.13.0
    optionalDependencies:
-      '@types/node': 20.11.4
+      '@types/node': 20.14.2
      fsevents: 2.3.3

  webpack-sources@3.2.3: {}
--- a/frontend/src/assets/i18n.yaml
+++ b/frontend/src/assets/i18n.yaml
@@ -51,6 +51,8 @@ languages:
    logsTitle: 'Logs'
    awaitingLogs: 'Awaiting logs...'
    bulkDownload: 'Download files in a zip archive'
+    rpcPollingTimeTitle: RPC polling time
+    rpcPollingTimeDescription: A lower interval results in higher CPU usage (server and client side)
  german:
    urlInput: Video URL
    statusTitle: Status
--- a/frontend/src/atoms/rpc.ts
+++ b/frontend/src/atoms/rpc.ts
@@ -1,4 +1,4 @@
-import { selector } from 'recoil'
+import { atom, selector } from 'recoil'
 import { RPCClient } from '../lib/rpcClient'
 import { rpcHTTPEndpoint, rpcWebSocketEndpoint } from './settings'

@@ -12,3 +12,12 @@ export const rpcClientState = selector({
    ),
  dangerouslyAllowMutability: true,
 })
+
+export const rpcPollingTimeState = atom({
+  key: 'rpcPollingTimeState',
+  default: Number(localStorage.getItem('rpc-polling-time')) || 1000,
+  effects: [
+    ({ onSet }) =>
+      onSet(a => localStorage.setItem('rpc-polling-time', a.toString()))
+  ]
+})
--- a/frontend/src/atoms/settings.ts
+++ b/frontend/src/atoms/settings.ts
@@ -64,8 +64,7 @@ export const serverAddressState = atom<string>({

 export const serverPortState = atom<number>({
  key: 'serverPortState',
-  default: Number(localStorage.getItem('server-port')) ||
-    Number(window.location.port),
+  default: Number(localStorage.getItem('server-port')) || Number(window.location.port),
  effects: [
    ({ onSet }) =>
      onSet(a => localStorage.setItem('server-port', a.toString()))
@@ -197,7 +196,7 @@ export const cookiesState = atom({
  ]
 })

-export const themeSelector = selector<ThemeNarrowed>({
+const themeSelector = selector<ThemeNarrowed>({
  key: 'themeSelector',
  get: ({ get }) => {
    const theme = get(themeState)
--- a/frontend/src/atoms/status.ts
+++ b/frontend/src/atoms/status.ts
@@ -6,16 +6,6 @@ export const connectedState = atom({
  default: false
 })

-export const updatedBinaryState = atom({
-  key: 'updatedBinaryState',
-  default: false
-})
-
-export const isDownloadingState = atom({
-  key: 'isDownloadingState',
-  default: false
-})
-
 export const freeSpaceBytesState = selector({
  key: 'freeSpaceBytesState',
  get: async ({ get }) => {
--- a/frontend/src/components/AppBar.tsx
+++ b/frontend/src/components/AppBar.tsx
@@ -1,11 +1,11 @@
-import { styled } from '@mui/material';
-import MuiAppBar, { AppBarProps as MuiAppBarProps } from '@mui/material/AppBar';
+import { styled } from '@mui/material'
+import MuiAppBar, { AppBarProps as MuiAppBarProps } from '@mui/material/AppBar'

 interface AppBarProps extends MuiAppBarProps {
  open?: boolean
 }

-const drawerWidth = 240;
+const drawerWidth = 240

 const AppBar = styled(MuiAppBar, {
  shouldForwardProp: (prop) => prop !== 'open',
@@ -23,6 +23,6 @@ const AppBar = styled(MuiAppBar, {
      duration: theme.transitions.duration.enteringScreen,
    }),
  }),
-}));
+}))

 export default AppBar
--- a/frontend/src/components/DownloadDialog.tsx
+++ b/frontend/src/components/DownloadDialog.tsx
@@ -26,19 +26,17 @@ import {
  Suspense,
  forwardRef,
  useEffect,
-  useMemo,
  useRef,
  useState,
  useTransition
 } from 'react'
 import { useRecoilState, useRecoilValue } from 'recoil'
 import { customArgsState, downloadTemplateState, filenameTemplateState, savedTemplatesState } from '../atoms/downloadTemplate'
-import { latestCliArgumentsState, settingsState } from '../atoms/settings'
+import { settingsState } from '../atoms/settings'
 import { availableDownloadPathsState, connectedState } from '../atoms/status'
 import FormatsGrid from '../components/FormatsGrid'
 import { useI18n } from '../hooks/useI18n'
 import { useRPC } from '../hooks/useRPC'
-import { CliArguments } from '../lib/argsParser'
 import type { DLMetadata } from '../types'
 import { toFormatArgs } from '../utils'
 import ExtraDownloadOptions from './ExtraDownloadOptions'
@@ -71,7 +69,6 @@ const DownloadDialog: FC<Props> = ({ open, onClose, onDownloadStart }) => {
  const [pickedBestFormat, setPickedBestFormat] = useState('')

  const [customArgs, setCustomArgs] = useRecoilState(customArgsState)
-  const [, setCliArgs] = useRecoilState(latestCliArgumentsState)

  const [downloadPath, setDownloadPath] = useState('')

@@ -83,10 +80,6 @@ const DownloadDialog: FC<Props> = ({ open, onClose, onDownloadStart }) => {

  const [isPlaylist, setIsPlaylist] = useState(false)

-  const argsBuilder = useMemo(() =>
-    new CliArguments().fromString(settings.cliArgs), [settings.cliArgs]
-  )
-
  const { i18n } = useI18n()
  const { client } = useRPC()

@@ -110,9 +103,9 @@ const DownloadDialog: FC<Props> = ({ open, onClose, onDownloadStart }) => {
      if (pickedBestFormat !== '') codes.push(pickedBestFormat)

      await new Promise(r => setTimeout(r, 10))
-      await client.download({
+      client.download({
        url: immediate || line,
-        args: `${argsBuilder.toString()} ${toFormatArgs(codes)} ${downloadTemplate}`,
+        args: `${toFormatArgs(codes)} ${downloadTemplate}`,
        pathOverride: downloadPath ?? '',
        renameTo: settings.fileRenaming ? filenameTemplate : '',
        playlist: isPlaylist,
@@ -122,7 +115,7 @@ const DownloadDialog: FC<Props> = ({ open, onClose, onDownloadStart }) => {
        resetInput()
        setDownloadFormats(undefined)
        onDownloadStart(immediate || line)
-      }, 250)
+      }, 100)
    }

    setUrl('')
@@ -327,19 +320,6 @@ const DownloadDialog: FC<Props> = ({ open, onClose, onDownloadStart }) => {
                        label={i18n.t('playlistCheckbox')}
                      />
                    </Grid>
-                    <Grid item>
-                      <FormControlLabel
-                        control={
-                          <Checkbox
-                            onChange={() => setCliArgs(argsBuilder.toggleExtractAudio().toString())}
-                          />
-                        }
-                        checked={argsBuilder.extractAudio}
-                        onChange={() => setCliArgs(argsBuilder.toggleExtractAudio().toString())}
-                        disabled={settings.formatSelection}
-                        label={i18n.t('extractAudioCheckbox')}
-                      />
-                    </Grid>
                  </Grid>
                  <Grid item>
                    <Button
--- a/frontend/src/components/Downloads.tsx
+++ b/frontend/src/components/Downloads.tsx
@@ -3,7 +3,7 @@ import { useRecoilState, useRecoilValue } from 'recoil'
 import { loadingDownloadsState } from '../atoms/downloads'
 import { listViewState } from '../atoms/settings'
 import { loadingAtom } from '../atoms/ui'
-import DownloadsCardView from './DownloadsCardView'
+import DownloadsGridView from './DownloadsGridView'
 import DownloadsTableView from './DownloadsTableView'

 const Downloads: React.FC = () => {
@@ -21,7 +21,7 @@ const Downloads: React.FC = () => {

  if (tableView) return <DownloadsTableView />

-  return <DownloadsCardView />
+  return <DownloadsGridView />
 }

 export default Downloads
--- a/frontend/src/components/DownloadsGridView.tsx
+++ b/frontend/src/components/DownloadsGridView.tsx
@@ -4,16 +4,19 @@ import { activeDownloadsState } from '../atoms/downloads'
 import { useToast } from '../hooks/toast'
 import { useI18n } from '../hooks/useI18n'
 import { useRPC } from '../hooks/useRPC'
+import { ProcessStatus, RPCResult } from '../types'
 import DownloadCard from './DownloadCard'

-const DownloadsCardView: React.FC = () => {
+const DownloadsGridView: React.FC = () => {
  const downloads = useRecoilValue(activeDownloadsState)

  const { i18n } = useI18n()
  const { client } = useRPC()
  const { pushMessage } = useToast()

-  const abort = (id: string) => client.kill(id)
+  const stop = (r: RPCResult) => r.progress.process_status === ProcessStatus.Completed
+    ? client.clear(r.id)
+    : client.kill(r.id)

  return (
    <Grid container spacing={{ xs: 2, md: 2 }} columns={{ xs: 4, sm: 8, md: 12, xl: 12 }} pt={2}>
@@ -22,7 +25,7 @@ const DownloadsCardView: React.FC = () => {
          <Grid item xs={4} sm={8} md={6} xl={4} key={download.id}>
            <DownloadCard
              download={download}
-              onStop={() => abort(download.id)}
+              onStop={() => stop(download)}
              onCopy={() => pushMessage(i18n.t('clipboardAction'), 'info')}
            />
          </Grid>
@@ -32,4 +35,4 @@ const DownloadsCardView: React.FC = () => {
  )
 }

-export default DownloadsCardView
+export default DownloadsGridView
--- a/frontend/src/components/DownloadsTableView.tsx
+++ b/frontend/src/components/DownloadsTableView.tsx
@@ -18,12 +18,60 @@ import {
  TableRow,
  Typography
 } from "@mui/material"
+import { forwardRef } from 'react'
+import { TableComponents, TableVirtuoso } from 'react-virtuoso'
 import { useRecoilValue } from 'recoil'
 import { activeDownloadsState } from '../atoms/downloads'
 import { serverURL } from '../atoms/settings'
 import { useRPC } from '../hooks/useRPC'
+import { ProcessStatus, RPCResult } from '../types'
 import { base64URLEncode, formatSize, formatSpeedMiB } from "../utils"

+const columns = [
+  {
+    width: 8,
+    label: 'Status',
+    dataKey: 'status',
+    numeric: false,
+  },
+  {
+    width: 500,
+    label: 'Title',
+    dataKey: 'title',
+    numeric: false,
+  },
+  {
+    width: 50,
+    label: 'Speed',
+    dataKey: 'speed',
+    numeric: true,
+  },
+  {
+    width: 150,
+    label: 'Progress',
+    dataKey: 'progress',
+    numeric: true,
+  },
+  {
+    width: 80,
+    label: 'Size',
+    dataKey: 'size',
+    numeric: true,
+  },
+  {
+    width: 100,
+    label: 'Added on',
+    dataKey: 'addedon',
+    numeric: true,
+  },
+  {
+    width: 80,
+    label: 'Actions',
+    dataKey: 'actions',
+    numeric: true,
+  },
+] as const
+
 function LinearProgressWithLabel(props: LinearProgressProps & { value: number }) {
  return (
    <Box sx={{ display: 'flex', alignItems: 'center' }}>
@@ -39,14 +87,42 @@ function LinearProgressWithLabel(props: LinearProgressProps & { value: number })
  )
 }

+const VirtuosoTableComponents: TableComponents<RPCResult> = {
+  Scroller: forwardRef<HTMLDivElement>((props, ref) => (
+    <TableContainer {...props} ref={ref} />
+  )),
+  Table: (props) => (
+    <Table {...props} sx={{ borderCollapse: 'separate', tableLayout: 'fixed', mt: 2 }} size='small' />
+  ),
+  TableHead,
+  TableRow: ({ item: _item, ...props }) => <TableRow {...props} />,
+  TableBody: forwardRef<HTMLTableSectionElement>((props, ref) => (
+    <TableBody {...props} ref={ref} />
+  )),
+}
+
+function fixedHeaderContent() {
+  return (
+    <TableRow>
+      {columns.map((column) => (
+        <TableCell
+          key={column.dataKey}
+          variant="head"
+          align={column.numeric || false ? 'right' : 'left'}
+          style={{ width: column.width }}
+        >
+          {column.label}
+        </TableCell>
+      ))}
+    </TableRow>
+  )
+}
+
 const DownloadsTableView: React.FC = () => {
-  const serverAddr = useRecoilValue(serverURL)
  const downloads = useRecoilValue(activeDownloadsState)
-
+  const serverAddr = useRecoilValue(serverURL)
  const { client } = useRPC()

-  const abort = (id: string) => client.kill(id)
-
  const viewFile = (path: string) => {
    const encoded = base64URLEncode(path)
    window.open(`${serverAddr}/archive/v/${encoded}?token=${localStorage.getItem('token')}`)
@@ -57,41 +133,14 @@ const DownloadsTableView: React.FC = () => {
    window.open(`${serverAddr}/archive/d/${encoded}?token=${localStorage.getItem('token')}`)
  }

+  const stop = (r: RPCResult) => r.progress.process_status === ProcessStatus.Completed
+    ? client.clear(r.id)
+    : client.kill(r.id)
+
+
+  function rowContent(_index: number, download: RPCResult) {
    return (
-    <TableContainer
-      sx={{ minHeight: '80vh', mt: 4 }}
-      hidden={downloads.length === 0}
-    >
-      <Table size="small">
-        <TableHead>
-          <TableRow>
-            <TableCell width={8}>
-              <Typography fontWeight={500} fontSize={13}>Status</Typography>
-            </TableCell>
-            <TableCell>
-              <Typography fontWeight={500} fontSize={13}>Title</Typography>
-            </TableCell>
-            <TableCell align="right">
-              <Typography fontWeight={500} fontSize={13}>Speed</Typography>
-            </TableCell>
-            <TableCell align="center" width={200}>
-              <Typography fontWeight={500} fontSize={13}>Progress</Typography>
-            </TableCell>
-            <TableCell align="right">
-              <Typography fontWeight={500} fontSize={13}>Size</Typography>
-            </TableCell>
-            <TableCell align="right" width={180}>
-              <Typography fontWeight={500} fontSize={13}>Added on</Typography>
-            </TableCell>
-            <TableCell align="right" width={8}>
-              <Typography fontWeight={500} fontSize={13}>Actions</Typography>
-            </TableCell>
-          </TableRow>
-        </TableHead>
-        <TableBody>
-          {
-            downloads.map(download => (
-              <TableRow key={download.id}>
+      <>
        <TableCell>
          {download.progress.percentage === '-1'
            ? <DownloadDoneIcon color="primary" />
@@ -124,7 +173,7 @@ const DownloadsTableView: React.FC = () => {
          <ButtonGroup>
            <IconButton
              size="small"
-                      onClick={() => abort(download.id)}
+              onClick={() => stop(download)}
            >
              {download.progress.percentage === '-1' ? <DeleteIcon /> : <StopCircleIcon />}

@@ -147,12 +196,20 @@ const DownloadsTableView: React.FC = () => {
            }
          </ButtonGroup>
        </TableCell>
-              </TableRow>
-            ))
+      </>
+    )
  }
-        </TableBody>
-      </Table>
-    </TableContainer>
+
+  return (
+    <Box style={{ height: downloads.length === 0 ? '0vh' : '80vh', width: '100%' }}>
+      <TableVirtuoso
+        hidden={downloads.length === 0}
+        data={downloads}
+        components={VirtuosoTableComponents}
+        fixedHeaderContent={fixedHeaderContent}
+        itemContent={rowContent}
+      />
+    </Box>
  )
 }

--- a/frontend/src/components/ExtraDownloadOptions.tsx
+++ b/frontend/src/components/ExtraDownloadOptions.tsx
@@ -15,6 +15,12 @@ const ExtraDownloadOptions: React.FC = () => {
        disablePortal
        options={customTemplates.map(({ name, content }) => ({ label: name, content }))}
        autoHighlight
+        defaultValue={
+          customTemplates
+            .filter(({ id, name }) => id === "0" || name === "default")
+            .map(({ name, content }) => ({ label: name, content }))
+            .at(0)
+        }
        getOptionLabel={(option) => option.label}
        onChange={(_, value) => {
          setCustomArgs(value?.content!)
--- a/frontend/src/components/Footer.tsx
+++ b/frontend/src/components/Footer.tsx
@@ -1,15 +1,15 @@
+import DownloadIcon from '@mui/icons-material/Download'
 import SettingsEthernet from '@mui/icons-material/SettingsEthernet'
 import { AppBar, Chip, Divider, Toolbar } from '@mui/material'
 import { Suspense } from 'react'
 import { useRecoilValue } from 'recoil'
 import { settingsState } from '../atoms/settings'
 import { connectedState } from '../atoms/status'
+import { totalDownloadSpeedState } from '../atoms/ui'
 import { useI18n } from '../hooks/useI18n'
+import { formatSpeedMiB } from '../utils'
 import FreeSpaceIndicator from './FreeSpaceIndicator'
 import VersionIndicator from './VersionIndicator'
-import DownloadIcon from '@mui/icons-material/Download'
-import { totalDownloadSpeedState } from '../atoms/ui'
-import { formatSpeedMiB } from '../utils'

 const Footer: React.FC = () => {
  const settings = useRecoilValue(settingsState)
@@ -35,7 +35,7 @@ const Footer: React.FC = () => {
        display: 'flex', gap: 1, justifyContent: 'space-between'
      }}>
        <div style={{ display: 'flex', gap: 4, alignItems: 'center' }}>
-          <Chip label="RPC v3.0.8" variant="outlined" size="small" />
+          <Chip label="RPC v3.1.0" variant="outlined" size="small" />
          <VersionIndicator />
        </div>
        <div style={{ display: 'flex', gap: 4, 'alignItems': 'center' }}>
--- a/frontend/src/components/HomeSpeedDial.tsx
+++ b/frontend/src/components/HomeSpeedDial.tsx
@@ -1,9 +1,9 @@
 import AddCircleIcon from '@mui/icons-material/AddCircle'
 import BuildCircleIcon from '@mui/icons-material/BuildCircle'
 import DeleteForeverIcon from '@mui/icons-material/DeleteForever'
+import FolderZipIcon from '@mui/icons-material/FolderZip'
 import FormatListBulleted from '@mui/icons-material/FormatListBulleted'
 import ViewAgendaIcon from '@mui/icons-material/ViewAgenda'
-import FolderZipIcon from '@mui/icons-material/FolderZip'
 import {
  SpeedDial,
  SpeedDialAction,
@@ -26,8 +26,6 @@ const HomeSpeedDial: React.FC<Props> = ({ onDownloadOpen, onEditorOpen }) => {
  const { i18n } = useI18n()
  const { client } = useRPC()

-  const abort = () => client.killAll()
-
  return (
    <SpeedDial
      ariaLabel="Home speed dial"
@@ -42,12 +40,12 @@ const HomeSpeedDial: React.FC<Props> = ({ onDownloadOpen, onEditorOpen }) => {
      <SpeedDialAction
        icon={<FolderZipIcon />}
        tooltipTitle={i18n.t('bulkDownload')}
-        onClick={() => window.open(`${serverAddr}/archive/bulk`)}
+        onClick={() => window.open(`${serverAddr}/archive/bulk?token=${localStorage.getItem('token')}`)}
      />
      <SpeedDialAction
        icon={<DeleteForeverIcon />}
        tooltipTitle={i18n.t('abortAllButton')}
-        onClick={abort}
+        onClick={() => client.killAll()}
      />
      <SpeedDialAction
        icon={<BuildCircleIcon />}
--- a/frontend/src/components/Logout.tsx
+++ b/frontend/src/components/Logout.tsx
@@ -1,13 +1,10 @@
 import LogoutIcon from '@mui/icons-material/Logout'
 import { ListItemButton, ListItemIcon, ListItemText } from '@mui/material'
 import { useNavigate } from 'react-router-dom'
-import { useRecoilValue } from 'recoil'
-import { serverURL } from '../atoms/settings'
 import { useI18n } from '../hooks/useI18n'

 export default function Logout() {
  const navigate = useNavigate()
-  const url = useRecoilValue(serverURL)

  const logout = async () => {
    localStorage.removeItem('token')
--- a/frontend/src/components/SocketSubscriber.tsx
+++ b/frontend/src/components/SocketSubscriber.tsx
@@ -4,6 +4,7 @@ import { useNavigate } from 'react-router-dom'
 import { useRecoilState, useRecoilValue } from 'recoil'
 import { take, timer } from 'rxjs'
 import { downloadsState } from '../atoms/downloads'
+import { rpcPollingTimeState } from '../atoms/rpc'
 import { serverAddressAndPortState } from '../atoms/settings'
 import { connectedState } from '../atoms/status'
 import { useSubscription } from '../hooks/observable'
@@ -19,6 +20,7 @@ const SocketSubscriber: React.FC<Props> = () => {
  const [, setDownloads] = useRecoilState(downloadsState)

  const serverAddressAndPort = useRecoilValue(serverAddressAndPortState)
+  const rpcPollingTime = useRecoilValue(rpcPollingTimeState)

  const { i18n } = useI18n()
  const { client } = useRPC()
@@ -70,11 +72,10 @@ const SocketSubscriber: React.FC<Props> = () => {

  useEffect(() => {
    if (connected) {
-      const sub = timer(0, 1000).subscribe(() => client.running())
-
+      const sub = timer(0, rpcPollingTime).subscribe(() => client.running())
      return () => sub.unsubscribe()
    }
-  }, [connected, client])
+  }, [connected, client, rpcPollingTime])

  return null
 }
--- a/frontend/src/lib/argsParser.ts
+++ b/frontend/src/lib/argsParser.ts
@@ -1,66 +0,0 @@
-export class CliArguments {
-  private _extractAudio: boolean
-  private _noMTime: boolean
-
-  constructor(extractAudio = false, noMTime = true) {
-    this._extractAudio = extractAudio
-    this._noMTime = noMTime
-  }
-
-  public get extractAudio(): boolean {
-    return this._extractAudio
-  }
-
-  public toggleExtractAudio() {
-    this._extractAudio = !this._extractAudio
-    return this
-  }
-
-  public disableExtractAudio() {
-    this._extractAudio = false
-    return this
-  }
-
-  public get noMTime(): boolean {
-    return this._noMTime
-  }
-
-  public toggleNoMTime() {
-    this._noMTime = !this._noMTime
-    return this
-  }
-
-  public toString(): string {
-    let args = ''
-
-    if (this._extractAudio) {
-      args += '-x '
-    }
-
-    if (this._noMTime) {
-      args += '--no-mtime '
-    }
-
-    return args.trim()
-  }
-
-  private reset() {
-    this._extractAudio = false
-    this._noMTime = false
-  }
-
-  public fromString(str: string): CliArguments {
-    this.reset()
-
-    if (str) {
-      if (str.includes('-x')) {
-        this._extractAudio = true
-      }
-
-      if (str.includes('--no-mtime')) {
-        this._noMTime = true
-      }
-    }
-    return this
-  }
-}
--- a/frontend/src/lib/rpcClient.ts
+++ b/frontend/src/lib/rpcClient.ts
@@ -132,6 +132,13 @@ export class RPCClient {
    })
  }

+  public clear(id: string) {
+    this.sendHTTP({
+      method: 'Service.Clear',
+      params: [id],
+    })
+  }
+
  public killAll() {
    this.sendHTTP({
      method: 'Service.KillAll',
--- a/frontend/src/types/index.ts
+++ b/frontend/src/types/index.ts
@@ -34,11 +34,18 @@ type DownloadInfo = {
  created_at: string
 }

+export enum ProcessStatus {
+  Pending = 0,
+  Downloading,
+  Completed,
+  Errored,
+}
+
 type DownloadProgress = {
  speed: number
  eta: number
  percentage: string
-  process_status: number
+  process_status: ProcessStatus
 }

 export type RPCResult = Readonly<{
@@ -76,15 +83,14 @@ export type DirectoryEntry = {
  name: string
  path: string
  size: number
-  shaSum: string
  modTime: string
  isVideo: boolean
  isDirectory: boolean
 }

-export type DeleteRequest = Pick<DirectoryEntry, 'path' | 'shaSum'>
+export type DeleteRequest = Pick<DirectoryEntry, 'path'>

-export type PlayRequest = Pick<DirectoryEntry, 'path'>
+export type PlayRequest = DeleteRequest

 export type CustomTemplate = {
  id: string
--- a/frontend/src/utils.ts
+++ b/frontend/src/utils.ts
@@ -1,11 +1,7 @@
 import { pipe } from 'fp-ts/lib/function'
 import type { RPCResponse } from "./types"
+import { ProcessStatus } from './types'

-/**
- * Validate an ip v4 via regex
- * @param {string} ipAddr 
- * @returns ip validity test
- */
 export function validateIP(ipAddr: string): boolean {
  let ipRegex = /^(?:25[0-5]|2[0-4]\d|1\d\d|[1-9]\d|\d)(?:\.(?:25[0-5]|2[0-4]\d|1\d\d|[1-9]\d|\d)){3}$/gm
  return ipRegex.test(ipAddr)
@@ -58,15 +54,15 @@ export function isRPCResponse(object: any): object is RPCResponse<any> {
  return 'result' in object && 'id' in object
 }

-export function mapProcessStatus(status: number) {
+export function mapProcessStatus(status: ProcessStatus) {
  switch (status) {
-    case 0:
+    case ProcessStatus.Pending:
      return 'Pending'
-    case 1:
+    case ProcessStatus.Downloading:
      return 'Downloading'
-    case 2:
+    case ProcessStatus.Completed:
      return 'Completed'
-    case 3:
+    case ProcessStatus.Errored:
      return 'Error'
    default:
      return 'Pending'
--- a/frontend/src/views/Archive.tsx
+++ b/frontend/src/views/Archive.tsx
@@ -113,7 +113,6 @@ export default function Downloaded() {
            modTime: '',
            name: '..',
            path: upperLevel,
-            shaSum: '',
            size: 0,
          }, ...r.filter(f => f.name !== '')]
          : r.filter(f => f.name !== '')
@@ -144,7 +143,6 @@ export default function Downloaded() {
      method: 'POST',
      body: JSON.stringify({
        path: entry.path,
-        shaSum: entry.shaSum,
      })
    }),
    matchW(
--- a/frontend/src/views/Settings.tsx
+++ b/frontend/src/views/Settings.tsx
@@ -4,7 +4,6 @@ import {
  Container,
  FormControl,
  FormControlLabel,
-  FormGroup,
  Grid,
  InputAdornment,
  InputLabel,
@@ -12,6 +11,7 @@ import {
  Paper,
  Select,
  SelectChangeEvent,
+  Slider,
  Stack,
  Switch,
  TextField,
@@ -27,6 +27,7 @@ import {
  map,
  takeWhile
 } from 'rxjs'
+import { rpcPollingTimeState } from '../atoms/rpc'
 import {
  Language,
  Theme,
@@ -36,7 +37,6 @@ import {
  formatSelectionState,
  languageState,
  languages,
-  latestCliArgumentsState,
  pathOverridingState,
  servedFromReverseProxyState,
  servedFromReverseProxySubDirState,
@@ -48,22 +48,25 @@ import CookiesTextField from '../components/CookiesTextField'
 import { useToast } from '../hooks/toast'
 import { useI18n } from '../hooks/useI18n'
 import { useRPC } from '../hooks/useRPC'
-import { CliArguments } from '../lib/argsParser'
 import { validateDomain, validateIP } from '../utils'

 // NEED ABSOLUTELY TO BE SPLIT IN MULTIPLE COMPONENTS
 export default function Settings() {
  const [reverseProxy, setReverseProxy] = useRecoilState(servedFromReverseProxyState)
  const [baseURL, setBaseURL] = useRecoilState(servedFromReverseProxySubDirState)
+
  const [formatSelection, setFormatSelection] = useRecoilState(formatSelectionState)
  const [pathOverriding, setPathOverriding] = useRecoilState(pathOverridingState)
  const [fileRenaming, setFileRenaming] = useRecoilState(fileRenamingState)
  const [enableArgs, setEnableArgs] = useRecoilState(enableCustomArgsState)
+
  const [serverAddr, setServerAddr] = useRecoilState(serverAddressState)
  const [serverPort, setServerPort] = useRecoilState(serverPortState)
+
+  const [pollingTime, setPollingTime] = useRecoilState(rpcPollingTimeState)
  const [language, setLanguage] = useRecoilState(languageState)
  const [appTitle, setApptitle] = useRecoilState(appTitleState)
-  const [cliArgs, setCliArgs] = useRecoilState(latestCliArgumentsState)
+
  const [theme, setTheme] = useRecoilState(themeState)

  const [invalidIP, setInvalidIP] = useState(false)
@@ -73,8 +76,6 @@ export default function Settings() {

  const { pushMessage } = useToast()

-  const argsBuilder = useMemo(() => new CliArguments().fromString(cliArgs), [])
-
  const baseURL$ = useMemo(() => new Subject<string>(), [])
  const serverAddr$ = useMemo(() => new Subject<string>(), [])
  const serverPort$ = useMemo(() => new Subject<string>(), [])
@@ -148,8 +149,6 @@ export default function Settings() {

  return (
    <Container maxWidth="xl" sx={{ mt: 4, mb: 8 }}>
-      <Grid container spacing={3}>
-        <Grid item xs={12} md={12} lg={12}>
      <Paper
        sx={{
          p: 2.5,
@@ -161,7 +160,6 @@ export default function Settings() {
        <Typography pb={2} variant="h6" color="primary">
          {i18n.t('settingsAnchor')}
        </Typography>
-            <FormGroup>
        <Grid container spacing={2}>
          <Grid item xs={12} md={11}>
            <TextField
@@ -195,6 +193,34 @@ export default function Settings() {
              error={appTitle === ''}
            />
          </Grid>
+          <Grid item xs={12} md={12}>
+            <Typography>
+              {i18n.t('rpcPollingTimeTitle')}
+            </Typography>
+            <Typography variant='caption' sx={{ mb: 0.5 }}>
+              {i18n.t('rpcPollingTimeDescription')}
+            </Typography>
+            <Slider
+              aria-label="rpc polling time"
+              defaultValue={pollingTime}
+              max={2000}
+              getAriaValueText={(v: number) => `${v} ms`}
+              step={null}
+              valueLabelDisplay="off"
+              marks={[
+                { value: 100, label: '100 ms' },
+                { value: 250, label: '250 ms' },
+                { value: 500, label: '500 ms' },
+                { value: 750, label: '750 ms' },
+                { value: 1000, label: '1000 ms' },
+                { value: 2000, label: '2000 ms' },
+              ]}
+              onChange={(_, value) => typeof value === 'number'
+                ? setPollingTime(value)
+                : setPollingTime(1000)
+              }
+            />
+          </Grid>
          <Grid item xs={12}>
            <Typography variant="h6" color="primary" sx={{ mb: 0.5 }}>
              Reverse Proxy
@@ -228,7 +254,7 @@ export default function Settings() {
          </Grid>
        </Grid>
        <Typography variant="h6" color="primary" sx={{ mt: 0.5, mb: 2 }}>
-                Appaerance
+          Appearance
        </Typography>
        <Grid container spacing={2}>
          <Grid item xs={12} md={6}>
@@ -265,32 +291,12 @@ export default function Settings() {
        <Typography variant="h6" color="primary" sx={{ mt: 2, mb: 0.5 }}>
          General download settings
        </Typography>
-              <FormControlLabel
-                control={
-                  <Switch
-                    defaultChecked={argsBuilder.noMTime}
-                    onChange={() => setCliArgs(argsBuilder.toggleNoMTime().toString())}
-                  />
-                }
-                label={i18n.t('noMTimeCheckbox')}

-              />
-              <FormControlLabel
-                control={
-                  <Switch
-                    defaultChecked={argsBuilder.extractAudio}
-                    onChange={() => setCliArgs(argsBuilder.toggleExtractAudio().toString())}
-                    disabled={formatSelection}
-                  />
-                }
-                label={i18n.t('extractAudioCheckbox')}
-              />
        <FormControlLabel
          control={
            <Switch
              defaultChecked={formatSelection}
              onChange={() => {
-                      setCliArgs(argsBuilder.disableExtractAudio().toString())
                setFormatSelection(!formatSelection)
              }}
            />
@@ -354,10 +360,7 @@ export default function Settings() {
            </Button>
          </Stack>
        </Grid>
-            </FormGroup>
      </Paper>
-        </Grid>
-      </Grid>
    </Container>
  )
 }
--- a/frontend/yarn.lock
+++ b/frontend/yarn.lock
--- a/server/config/config.go
+++ b/server/config/config.go
@@ -10,6 +10,7 @@ import (
 type Config struct {
 	CurrentLogFile  string
 	LogPath         string `yaml:"log_path"`
+	BaseURL         string `yaml:"base_url"`
 	Host            string `yaml:"host"`
 	Port            int    `yaml:"port"`
 	DownloadPath    string `yaml:"downloadPath"`
--- a/server/dbutil/migrate.go
+++ b/server/dbutil/migrate.go
@@ -22,6 +22,18 @@ func AutoMigrate(ctx context.Context, db *sql.DB) error {
 			content TEXT NOT NULL
 		)`,
 	)
+	if err != nil {
+		return err
+	}
+
+	db.ExecContext(
+		ctx,
+		`INSERT INTO templates (id, name, content) VALUES
+			($1, $2, $3),
+			($4, $5, $6);`,
+		"0", "default", "--no-mtime",
+		"1", "audio only", "-x",
+	)

 	return err
 }
--- a/server/internal/common_types.go
+++ b/server/internal/common_types.go
@@ -36,6 +36,7 @@ type DownloadInfo struct {
 	ACodec      string    `json:"acodec"`
 	Extension   string    `json:"ext"`
 	OriginalURL string    `json:"original_url"`
+	FileName    string    `json:"filename"`
 	CreatedAt   time.Time `json:"created_at"`
 }

--- a/server/internal/message_queue.go
+++ b/server/internal/message_queue.go
@@ -56,7 +56,7 @@ func (m *MessageQueue) downloadConsumer() {

 	m.eventBus.SubscribeAsync(queueName, func(p *Process) {
 		//TODO: provide valid context
-		sem.Acquire(context.TODO(), 1)
+		sem.Acquire(context.Background(), 1)
 		defer sem.Release(1)

 		m.logger.Info("received process from event bus",
@@ -65,7 +65,9 @@ func (m *MessageQueue) downloadConsumer() {
 			slog.String("id", p.getShortId()),
 		)

+		if p.Progress.Status != StatusCompleted {
 			p.Start()
+		}

 		m.logger.Info("started process",
 			slog.String("bus", queueName),
@@ -92,6 +94,14 @@ func (m *MessageQueue) metadataSubscriber() {
 			slog.String("id", p.getShortId()),
 		)

+		if p.Progress.Status == StatusCompleted {
+			m.logger.Warn("proccess has an illegal state",
+				slog.String("id", p.getShortId()),
+				slog.Int("status", p.Progress.Status),
+			)
+			return
+		}
+
 		if err := p.SetMetadata(); err != nil {
 			m.logger.Error("failed to retrieve metadata",
 				slog.String("id", p.getShortId()),
--- a/server/internal/playlist.go
+++ b/server/internal/playlist.go
@@ -5,6 +5,7 @@ import (
 	"errors"
 	"log/slog"
 	"os/exec"
+	"slices"
 	"strings"
 	"time"

@@ -21,7 +22,7 @@ type metadata struct {
 func PlaylistDetect(req DownloadRequest, mq *MessageQueue, db *MemoryDB, logger *slog.Logger) error {
 	var (
 		downloader = config.Instance().DownloaderPath
-		cmd        = exec.Command(downloader, req.URL, "-J")
+		cmd        = exec.Command(downloader, req.URL, "--flat-playlist", "-J")
 	)

 	stdout, err := cmd.StdoutPipe()
@@ -41,21 +42,24 @@ func PlaylistDetect(req DownloadRequest, mq *MessageQueue, db *MemoryDB, logger
 		return err
 	}

-	logger.Info("decoded metadata", slog.String("url", req.URL))
+	if err := cmd.Wait(); err != nil {
+		return err
+	}
+
+	logger.Info("decoded playlist metadata", slog.String("url", req.URL))

 	if m.Type == "" {
-		cmd.Wait()
 		return errors.New("probably not a valid URL")
 	}

 	if m.Type == "playlist" {
-		logger.Info(
-			"playlist detected",
-			slog.String("url", req.URL),
-			slog.Int("count", m.Count),
-		)
+		entries := slices.CompactFunc(slices.Compact(m.Entries), func(a DownloadInfo, b DownloadInfo) bool {
+			return a.URL == b.URL
+		})

-		for _, meta := range m.Entries {
+		logger.Info("playlist detected", slog.String("url", req.URL), slog.Int("count", len(entries)))
+
+		for i, meta := range entries {
 			// detect playlist title from metadata since each playlist entry will be
 			// treated as an individual download
 			req.Rename = strings.Replace(
@@ -65,8 +69,11 @@ func PlaylistDetect(req DownloadRequest, mq *MessageQueue, db *MemoryDB, logger
 				1,
 			)

+			//TODO: it's idiotic but it works: virtually delay the creation time
+			meta.CreatedAt = time.Now().Add(time.Millisecond * time.Duration(i*10))
+
 			proc := &Process{
-				Url:      meta.OriginalURL,
+				Url:      meta.URL,
 				Progress: DownloadProgress{},
 				Output:   DownloadOutput{Filename: req.Rename},
 				Info:     meta,
@@ -74,16 +81,13 @@ func PlaylistDetect(req DownloadRequest, mq *MessageQueue, db *MemoryDB, logger
 				Logger:   logger,
 			}

-			proc.Info.URL = meta.OriginalURL
+			proc.Info.URL = meta.URL

 			time.Sleep(time.Millisecond)

 			db.Set(proc)
 			mq.Publish(proc)
 		}
-
-		err = cmd.Wait()
-		return err
 	}

 	proc := &Process{
--- a/server/internal/process.go
+++ b/server/internal/process.go
@@ -125,8 +125,6 @@ func (p *Process) Start() {

 	p.proc = cmd.Process

-	go p.SetMetadata()
-
 	// --------------- progress block --------------- //
 	var (
 		sourceChan = make(chan []byte)
@@ -200,18 +198,22 @@ func (p *Process) Complete() {

 // Kill a process and remove it from the memory
 func (p *Process) Kill() error {
+	defer func() {
+		p.Progress.Status = StatusCompleted
+	}()
 	// yt-dlp uses multiple child process the parent process
 	// has been spawned with setPgid = true. To properly kill
 	// all subprocesses a SIGTERM need to be sent to the correct
 	// process group
-	if p.proc != nil {
+	if p.proc == nil {
+		return errors.New("*os.Process not set")
+	}
+
 	pgid, err := syscall.Getpgid(p.proc.Pid)
 	if err != nil {
 		return err
 	}
-		err = syscall.Kill(-pgid, syscall.SIGTERM)
-
-		p.Logger.Info("killed process", slog.String("id", p.Id))
+	if err := syscall.Kill(-pgid, syscall.SIGTERM); err != nil {
 		return err
 	}

@@ -225,10 +227,7 @@ func (p *Process) GetFormatsSync() (DownloadFormats, error) {

 	stdout, err := cmd.Output()
 	if err != nil {
-		p.Logger.Error(
-			"failed to retrieve metadata",
-			slog.String("err", err.Error()),
-		)
+		p.Logger.Error("failed to retrieve metadata", slog.String("err", err.Error()))
 		return DownloadFormats{}, err
 	}

--- a/server/logging/handler.go
+++ b/server/logging/handler.go
@@ -61,7 +61,10 @@ func sse(w http.ResponseWriter, r *http.Request) {
 		}

 		sb.WriteString("event: log\n")
-		sb.WriteString("data: " + b.String() + "\n\n")
+		sb.WriteString("data: ")
+		sb.WriteString(b.String())
+		sb.WriteRune('\n')
+		sb.WriteRune('\n')

 		fmt.Fprint(w, sb.String())

--- a/server/rpc/handlers.go
+++ b/server/rpc/handlers.go
@@ -2,7 +2,6 @@ package rpc

 import (
 	"io"
-	"log"
 	"net/http"

 	"github.com/gorilla/websocket"
@@ -30,8 +29,6 @@ func WebSocket(w http.ResponseWriter, r *http.Request) {
 	for {
 		mtype, reader, err := c.NextReader()
 		if err != nil {
-			http.Error(w, err.Error(), http.StatusInternalServerError)
-			log.Println(err)
 			break
 		}

@@ -40,7 +37,6 @@ func WebSocket(w http.ResponseWriter, r *http.Request) {
 		writer, err := c.NextWriter(mtype)
 		if err != nil {
 			http.Error(w, err.Error(), http.StatusInternalServerError)
-			log.Println(err)
 			break
 		}

--- a/server/rpc/service.go
+++ b/server/rpc/service.go
@@ -1,6 +1,7 @@
 package rpc

 import (
+	"errors"
 	"log/slog"

 	"github.com/marcopeocchi/yt-dlp-web-ui/server/internal"
@@ -99,13 +100,19 @@ func (s *Service) Kill(args string, killed *string) error {
 		return err
 	}

-	if proc != nil {
-		err = proc.Kill()
-		s.db.Delete(proc.Id)
+	if proc == nil {
+		return errors.New("nil process")
+	}
+
+	if err := proc.Kill(); err != nil {
+		s.logger.Info("failed killing process", slog.String("id", proc.Id), slog.Any("err", err))
+		return err
 	}

 	s.db.Delete(proc.Id)
-	return err
+	s.logger.Info("succesfully killed process", slog.String("id", proc.Id))
+
+	return nil
 }

 // KillAll kills all process unconditionally and removes them from
@@ -115,7 +122,10 @@ func (s *Service) KillAll(args NoArgs, killed *string) error {

 	var (
 		keys       = s.db.Keys()
-		err  error
+		removeFunc = func(p *internal.Process) error {
+			defer s.db.Delete(p.Id)
+			return p.Kill()
+		}
 	)

 	for _, key := range *keys {
@@ -124,13 +134,24 @@ func (s *Service) KillAll(args NoArgs, killed *string) error {
 			return err
 		}

-		if proc != nil {
-			proc.Kill()
-			s.db.Delete(proc.Id)
-		}
+		if proc == nil {
+			s.db.Delete(key)
+			continue
 		}

-	return err
+		if err := removeFunc(proc); err != nil {
+			s.logger.Info(
+				"failed killing process",
+				slog.String("id", proc.Id),
+				slog.Any("err", err),
+			)
+			continue
+		}
+
+		s.logger.Info("succesfully killed process", slog.String("id", proc.Id))
+	}
+
+	return nil
 }

 // Remove a process from the db rendering it unusable if active
--- a/server/server.go
+++ b/server/server.go
@@ -157,8 +157,11 @@ func newServer(c serverConfig) *http.Server {
 	// use in dev
 	// r.Use(middleware.Logger)

-	r.Mount("/", http.FileServer(http.FS(c.frontend)))
-	r.Mount("/openapi", http.FileServer(http.FS(c.swagger)))
+	baseUrl := config.Instance().BaseURL
+	r.Mount(baseUrl+"/", http.StripPrefix(baseUrl, http.FileServerFS(c.frontend)))
+
+	// swagger
+	r.Mount("/openapi", http.FileServerFS(c.swagger))

 	// Archive routes
 	r.Route("/archive", func(r chi.Router) {
@@ -209,7 +212,7 @@ func gracefulShutdown(srv *http.Server, db *internal.MemoryDB) {
 		defer func() {
 			db.Persist()
 			stop()
-			srv.Shutdown(context.TODO())
+			srv.Shutdown(context.Background())
 		}()
 	}()
 }
Author	SHA1	Message	Date
marcobaobao	3edebbdb6c	prevent completed download restart	2024-07-02 11:37:06 +02:00
Marco Piovanello	98f0ea3bd2	fix typo closes #162	2024-06-30 10:37:22 +02:00
marcobaobao	0daf36719b	Fixed process not cleared after download. Closes #160	2024-06-21 10:41:49 +02:00
marcobaobao	38683bfe85	code refactoring	2024-06-14 11:14:39 +02:00
marcobaobao	4066a6d5e3	frontend code refactoring	2024-06-14 10:42:25 +02:00
marcobaobao	ee18929196	missing psmisc docker file	2024-06-14 10:41:59 +02:00
marcobaobao	9c09c88d06	way faster playlist entries detection	2024-06-12 10:16:24 +02:00
marcobaobao	d402d71815	code refactoring, dependencies upgrade	2024-06-12 10:15:50 +02:00
marcopiovanello	848f716d08	Updated env.nix	2024-06-11 16:25:49 +02:00
marcopiovanello	14a14a9f38	Added env.nix	2024-06-11 16:21:37 +02:00
marcopiovanello	6ffca7d64f	sse logger consumer optimizations	2024-06-11 16:18:04 +02:00
marcobaobao	0b0ba4718c	Kubernetes fixups according to #157	2024-06-09 11:21:13 +02:00
marcobaobao	7ea1c0b205	small layout changes in downloads table	2024-06-07 22:24:25 +02:00
marcobaobao	d614433501	fixed yt-dlp duplicated playlist entries	2024-06-07 16:24:36 +02:00
marcobaobao	c108428243	virtualized downloads table	2024-06-07 15:21:29 +02:00
marcobaobao	f4c4d6928b	code refactoring	2024-06-07 11:19:17 +02:00
marcobaobao	00ca9156fb	sped-up download by spawning 1 less yt-dlp process	2024-06-07 10:55:03 +02:00
marcobaobao	2f0afe27cc	removed --no-mtime and -x switches in settings Custom templates are powerful: --no-mtime has been set as default behavior (template named default), -x is another template named "audio only"	2024-06-07 10:08:32 +02:00
marcobaobao	acac2f41a5	missing token in zip download	2024-06-07 09:26:30 +02:00
marcobaobao	9cbce3b66c	added rpc polling time selector	2024-06-05 11:15:01 +02:00
marcobaobao	fad2f1d0da	updated makefile	2024-06-05 11:14:51 +02:00
marcobaobao	a331329125	updated version number	2024-06-05 11:14:44 +02:00
marcobaobao	1138e66bc7	reverted base image to alpine, updated makefile	2024-06-05 09:14:59 +02:00