Modernize to v4.0.0 (#9)

* chore: replace eslint/prettier/jest with biome and vitest

Update all dependencies to latest versions. Replace ESLint + Prettier
with Biome for faster linting/formatting. Migrate tests from Jest to
Vitest for native TS6 support.

* chore: migrate to Tailwind CSS 4

Replace PostCSS plugin with @tailwindcss/vite. Remove tailwind.config.js
and postcss.config.js. Use CSS-first config with @import and
@custom-variant for class-based dark mode.

* chore: remove dead code

Remove unused preferences.tsx entry point (main.tsx handles routing),
unused preferences.html, and unused useInit hook.

* fix: resolve bugs and clean up code

Rust:
- Fix infinite recursion in config write on filesystem error
- Remove unnecessary Arc<Mutex> wrapper on WebviewWindow in live download
- Fix live stream relative segment URL construction (use base_url like VOD)
- Replace .expect() with let _ on window.emit to prevent panics
- Use app_handle.exit() instead of std::process::exit()
- Fix get_tauri_conf() return type (Config instead of Option<Config>)
- Remove unused _download_path params from internal download functions
- Replace pub_struct! macro with direct derive
- Remove duplicate form_confirm command

TypeScript:
- Fix showQualities set to true after fetch error
- Fix silent swallowing of non-Error exceptions
- Remove duplicate theme logic (ThemeProvider.tsx + useForm.ts)
- Consolidate theme application in ConfigProvider

* test: add tests for auth, playlist parsing, config and translations

TypeScript:
- Add getAuthHeaders tests (headers structure)
- Add getAuthVariables tests (LIVE/VOD/CLIP variable generation)
- Add getPlaylist tests (M3U8 parsing, chunked→Original mapping, errors)

Rust:
- Add AppConf tests (defaults, language lowercase, amend, serialization)
- Add translations tests (all languages implement trait, expected values)

* chore: update Rust deps and replace deprecated shell opener

Run cargo update to latest compatible versions. Replace deprecated
tauri-plugin-shell open() with tauri-plugin-opener for URL handling.

* feat: bump version to 4.0.0 and fix dark mode in preferences

Bump version to 4.0.0 across package.json, Cargo.toml and tauri.conf.json.
Add missing dark theme overrides for preferences page (inactive tabs,
backgrounds, labels, selects, borders).

* fix: improve dark mode and preferences UX

- Add close button to preferences window
- Only ask to restart when language changes (not on every save)
- Close preferences window after saving when no restart needed
- Fix dark mode text colors (labels, inputs, selects) with !important
  to override Tailwind 4 layer specificity
- Add "close" translation to all 5 locales

* fix: correct translations across all locales

- French: "Lumière" → "Clair" (theme light, not physical light)
- German: "Klare" → "Löschen", "Licht" → "Hell", "Qualitäten erhalten"
  → "Qualitäten abrufen", less formal phrasing throughout
- Italian: "Luce" → "Chiaro", "Scaricamenti" → "Download",
  "Cartella di scaricamento" → "Cartella di download"
- English: "Deutsch" → "German" in language list for consistency
- Spanish: add missing "downloadAnother" key

* feat: Tailwind dark: classes, Portuguese locale, no-restart preferences

Dark mode:
- Replace manual CSS overrides with Tailwind dark: variant classes
- Remove dark-theme.css overrides (keep only base styles)
- All components now use dark: classes directly in JSX

Preferences:
- Remove restart requirement entirely
- Add rebuild_menu Tauri command to update native menu on language change
- Preferences now save and close without prompting

New language:
- Add Portuguese (pt) locale for frontend and Rust menu

* fix: dark mode, preferences UX, open folder, and stale qualities

Dark mode:
- Fix @custom-variant syntax for Tailwind 4 (&:where(.dark, .dark *))
- Add color-scheme: dark for native form controls

Preferences:
- Save no longer closes window, shows checkmark feedback
- Close button now works (added permissions for preferences window)
- Emit preferences-updated event so main window refreshes live

Downloads:
- Replace shell open with opener plugin revealItemInDir for folders
- Reset qualities when URL changes to prevent stale downloads

* docs: update README for v4

Update technologies (Vitest, Biome, Preact, Vite, Tailwind 4),
add prerequisites section, list features, add test/build commands,
fix Tauri URL.

* chore: fix linting, a11y, and update CI workflows

- Fix Biome config (v1.x compatible with mixed Rust/TS projects)
- Auto-fix formatting (trailing commas, import sorting, quote style)
- Use import type where applicable
- Replace forEach with for...of in manifest building
- Fix a11y: tabs use button elements, spinner uses output element
- Add key prop to playlist options
- Add button type to close/save buttons
- Update frontend CI: ESLint/Prettier → Biome, add Vitest
- Update backend CI: add Tauri 2 system deps, add cargo test
- Update release CI: use Tauri 2 deps for Ubuntu

* chore: upgrade to Biome 2.x with Tailwind CSS support

Upgrade Biome from 1.x to 2.4.9. Enable tailwindDirectives CSS parser
for @custom-variant support. Use biome ci in CI workflow. Fix import
ordering for Biome 2.x.

* style: apply rustfmt formatting

* chore: add npm run check script for full validation

Runs biome ci, vitest, rustfmt check, clippy, and cargo test in one
command.

* chore: update GitHub Actions to latest versions

- actions/checkout v4 → v6
- actions/cache v4 → v5
- actions/setup-node v4 → v6

* chore: update release workflow to Ubuntu 24.04 LTS

* fix: align CI Linux deps with Tauri 2 docs

Use official Tauri 2 prerequisites: add libxdo-dev and libssl-dev,
remove legacy deps (libsoup-3.0-dev, libjavascriptcoregtk-4.1-dev,
patchelf) that are pulled transitively by libwebkit2gtk-4.1-dev.

Author: sergioalmela

.github/workflows/backend_checks.yml

@@ -14,10 +14,10 @@ jobs:
     runs-on: ubuntu-latest
 
     steps:
-      - uses: actions/checkout@v4
+      - uses: actions/checkout@v6
 
       - name: Cache Cargo Registry
-        uses: actions/cache@v4
+        uses: actions/cache@v5
         with:
           path: |
             ~/.cargo/registry
@@ -27,7 +27,7 @@ jobs:
       - name: Install dependencies
         run: |
           sudo apt-get update
-          sudo apt-get install -y libgtk-3-dev webkit2gtk-4.1 libayatana-appindicator3-dev
+          sudo apt-get install -y libwebkit2gtk-4.1-dev build-essential libxdo-dev libssl-dev libayatana-appindicator3-dev librsvg2-dev
 
       - name: Install Rust toolchain
         uses: dtolnay/rust-toolchain@stable
@@ -44,6 +44,11 @@ jobs:
           cd src-tauri
           cargo clippy -- -D warnings
 
+      - name: Run tests
+        run: |
+          cd src-tauri
+          cargo test
+
       - name: Cargo Build
         run: |
           cd src-tauri

.github/workflows/frontend_checks.yml

@@ -3,23 +3,22 @@ name: Frontend Checks
 on: [push, pull_request]
 
 jobs:
-  lint-and-format:
+  lint-and-test:
     runs-on: ubuntu-latest
 
     steps:
-      - uses: actions/checkout@v4
+      - uses: actions/checkout@v6
 
       - name: Set up Node.js
-        uses: actions/setup-node@v4
+        uses: actions/setup-node@v6
         with:
-          node-version: '20'
+          node-version: '22'
 
       - name: Install dependencies
         run: npm install
 
-      - name: Run ESLint
-        run: npm run lint
-
-      - name: Check Prettier
-        run: npm run prettier-check
+      - name: Run Biome
+        run: npx biome ci src
 
+      - name: Run tests
+        run: npx vitest run

.github/workflows/release.yml

@@ -5,9 +5,6 @@ on:
     branches:
       - master
 
-# This is the example from the readme.
-# On each push to the `release` branch it will create or update a GitHub release, build your app, and upload the artifacts to the release.
-
 jobs:
   publish-tauri:
     permissions:
@@ -20,17 +17,17 @@ jobs:
             args: "--target aarch64-apple-darwin"
           - platform: "macos-latest"
             args: "--target x86_64-apple-darwin"
-          - platform: "ubuntu-22.04"
+          - platform: "ubuntu-24.04"
             args: ""
           - platform: "windows-latest"
             args: ""
 
     runs-on: ${{ matrix.platform }}
     steps:
-      - uses: actions/checkout@v4
+      - uses: actions/checkout@v6
 
       - name: setup node
-        uses: actions/setup-node@v4
+        uses: actions/setup-node@v6
         with:
           node-version: lts/*
 
@@ -40,10 +37,10 @@ jobs:
           targets: ${{ matrix.platform == 'macos-latest' && 'aarch64-apple-darwin,x86_64-apple-darwin' || '' }}
 
       - name: install dependencies (ubuntu only)
-        if: matrix.platform == 'ubuntu-22.04'
+        if: matrix.platform == 'ubuntu-24.04'
         run: |
           sudo apt-get update
-          sudo apt-get install -y libwebkit2gtk-4.0-dev libwebkit2gtk-4.1-dev libappindicator3-dev librsvg2-dev patchelf
+          sudo apt-get install -y libwebkit2gtk-4.1-dev build-essential libxdo-dev libssl-dev libayatana-appindicator3-dev librsvg2-dev
 
       - name: install frontend dependencies
         run: npm install
@@ -57,4 +54,4 @@ jobs:
           releaseBody: "See the assets to download this version and install."
           releaseDraft: false
           prerelease: false
-          args: ${{ matrix.args }}
+          args: ${{ matrix.args }}

.prettierrc

@@ -4,35 +4,61 @@
 ## About
 Twitch Downloader is a free utility made to download Twitch content (streams, videos, highlights, clips).
 
-## Features:
+## Features
 
+- Download live streams, VODs, highlights, and clips
+- Quality selector for each content type
+- Dark and light theme
+- 6 languages: English, Spanish, Portuguese, French, German, Italian
+- Configurable download folder
+- Open file in file manager after download
+- Cross-platform (Linux, macOS, Windows)
 
-Twitch Downloader is a versatile tool that offers a range of features to enhance your Twitch content downloading experience. It comes with a user-friendly GUI, making it easy for anyone to use. You can download live streams, VODs, highlights, and clips with just a few clicks.  The application also supports multi-language, allowing users from different regions to use it with ease. User preferences are another highlight of Twitch Downloader, enabling you to customize the application according to your needs.  Whether you're a streamer wanting to archive your streams or a viewer looking to save your favorite moments, Twitch Downloader is the tool for you.
+## Prerequisites
+
+- [Node.js](https://nodejs.org/) (v18+)
+- [Rust](https://www.rust-lang.org/tools/install)
+- System dependencies for Tauri: see [Tauri prerequisites](https://v2.tauri.app/start/prerequisites/)
 
 ## How to execute
 
-### GUI
+### Development
 
 ```
 npm install
 npm run tauri dev
 ```
 
-It will open a new window with the GUI. Enter the URL of the stream, video, highlight or clip you want to download. Then, select the folder, file name and click on Get Qualities button. Then,  select the quality you want to download and click on Download button.
+### Build for production
+
+```
+npm run tauri build
+```
+
+It will open a new window with the GUI. Enter the URL of the stream, video, highlight or clip you want to download. Then, select the folder, file name and click on Get Qualities button. Select the quality you want to download and click on Download.
 
 ![How to use the GUI](public/how-to-use.gif)
 
+## Tests
+
+```
+npm test
+```
+
 ## Donate
 If you want to support the project, you can buy me a coffee. Thanks!
 
 [!["Buy Me A Coffee"](https://www.buymeacoffee.com/assets/img/custom_images/orange_img.png)](https://www.buymeacoffee.com/sergioalmela)
 
 ## Technologies used
-- [![Node.js](https://img.shields.io/badge/Node.js-339933?style=for-the-badge&logo=Node.js&logoColor=white)](https://nodejs.org/en/)
-- [![TypeScript](https://img.shields.io/badge/TypeScript-3178C6?style=for-the-badge&logo=TypeScript&logoColor=white)](https://www.typescriptlang.org/)
-- [![Jest](https://img.shields.io/badge/Jest-C21325?style=for-the-badge&logo=Jest&logoColor=white)](https://jestjs.io/)
-- [![Tauri](https://img.shields.io/badge/Tauri-421C87?style=for-the-badge&logo=Tauri&logoColor=white)](https://tauri.studio/)
+- [![Tauri](https://img.shields.io/badge/Tauri_2-421C87?style=for-the-badge&logo=Tauri&logoColor=white)](https://tauri.app/)
 - [![Rust](https://img.shields.io/badge/Rust-000000?style=for-the-badge&logo=Rust&logoColor=white)](https://www.rust-lang.org/)
+- [![TypeScript](https://img.shields.io/badge/TypeScript-3178C6?style=for-the-badge&logo=TypeScript&logoColor=white)](https://www.typescriptlang.org/)
+- [![Preact](https://img.shields.io/badge/Preact-673AB8?style=for-the-badge&logo=Preact&logoColor=white)](https://preactjs.com/)
+- [![Vite](https://img.shields.io/badge/Vite-646CFF?style=for-the-badge&logo=Vite&logoColor=white)](https://vite.dev/)
+- [![Tailwind CSS](https://img.shields.io/badge/Tailwind_CSS_4-06B6D4?style=for-the-badge&logo=TailwindCSS&logoColor=white)](https://tailwindcss.com/)
+- [![Vitest](https://img.shields.io/badge/Vitest-6E9F18?style=for-the-badge&logo=Vitest&logoColor=white)](https://vitest.dev/)
+- [![Biome](https://img.shields.io/badge/Biome-60A5FA?style=for-the-badge&logo=Biome&logoColor=white)](https://biomejs.dev/)
 
 ## Issues
 
@@ -53,4 +79,4 @@ Before posting an issue, be sure to include (if applicable):
 
 NOTE: Be sure to merge the latest from "upstream" before making a pull request!
 
-Any contribution to the localization of the app is welcome. You can find the localization files in the ```src/locales``` folder. You can use the ```en.json``` file as example.
+Any contribution to the localization of the app is welcome. You can find the localization files in the `src/locales` folder. You can use the `en.json` file as example.

README.md

@@ -0,0 +1,35 @@
+{
+  "$schema": "https://biomejs.dev/schemas/2.4.9/schema.json",
+  "files": {
+    "ignoreUnknown": true,
+    "includes": ["src/**"]
+  },
+  "formatter": {
+    "indentStyle": "space",
+    "indentWidth": 2
+  },
+  "linter": {
+    "rules": {
+      "recommended": true
+    }
+  },
+  "css": {
+    "parser": {
+      "cssModules": false,
+      "tailwindDirectives": true
+    }
+  },
+  "javascript": {
+    "formatter": {
+      "quoteStyle": "single",
+      "semicolons": "asNeeded"
+    }
+  },
+  "assist": {
+    "actions": {
+      "source": {
+        "organizeImports": "on"
+      }
+    }
+  }
+}