Migrate to typescript & tauri

.gitignore

@@ -3,17 +3,20 @@
 .env
 node_modules/
 dist/
-dist-electron/
-out/
 .vite/
 
+# Tauri build artifacts
+src-tauri/target/
+src-tauri/gen/
+
 .DS_Store
 Thumbs.db
 
 .env.*.local
 .env.local
 
 audio/*.mp3
+public/audio/*.mp3
 
 *.log
 npm-debug.log*

README.md

@@ -1,6 +1,6 @@
 # cupid music player
 
-A pixel-art desktop music player built with Electron, Vite, and React.
+A pixel-art desktop music player built with Tauri, Vite, React, and TypeScript.
 
 ## Features
 
@@ -9,11 +9,19 @@ A pixel-art desktop music player built with Electron, Vite, and React.
 - Interactive progress bar with draggable star indicator
 - Marquee scrolling for long track titles
 - Pink and blue theme switching with persistent preference
-- Spotify integration — browse your playlists and play tracks via yt-dlp
+- Spotify integration — browse your playlists and stream tracks via yt-dlp (no Premium required)
 - Apple Music integration — browse your library playlists via MusicKit JS
-- Local MP3 playback
-- Custom frameless window with drag and resize
-- Dynamic dock/taskbar icon that matches the active theme
+- Local MP3 playback from `public/audio/`
+- Custom frameless window with drag and corner resize
+- Dynamic taskbar/dock icon that matches the active theme
+
+## Prerequisites
+
+- [Node.js](https://nodejs.org/) 18+
+- [Rust](https://rustup.rs/) — install via rustup
+- **Windows:** [Microsoft C++ Build Tools](https://visualstudio.microsoft.com/visual-cpp-build-tools/) (MSVC toolchain)
+- **macOS:** Xcode Command Line Tools — `xcode-select --install`
+- **Linux:** `libwebkit2gtk-4.1`, `libgtk-3`, `libayatana-appindicator3` — see [Tauri Linux dependencies](https://tauri.app/start/prerequisites/)
 
 ## Getting Started
 
@@ -22,78 +30,111 @@ npm install
 npm run dev
 ```
 
-## Adding Local Audio Files
-
-1. Create an `audio/` folder in the project root (if it doesn't exist)
-2. Drop your `.mp3` files into the `audio/` folder
-3. Make sure your MP3 files have embedded metadata (title, artist, album art) — the player reads these automatically
-4. Restart the app
-
-The player uses the [music-metadata](https://github.com/borewit/music-metadata) library to extract track info and album art from your MP3 files. Files without metadata will still play but may show as "Unknown".
+`npm run dev` starts the Vite dev server and the Tauri window simultaneously.
 
-### Supported formats
-
-- `.mp3` — recommended, widely supported with ID3 tags
+## Adding Local Audio Files
 
-### Adding metadata to your MP3s
+1. Place your `.mp3` files in `public/audio/`
+2. Restart the app — the player reads ID3 tags (title, artist, album art) automatically
 
-If your files are missing metadata, you can add it with tools like:
-- [MP3Tag](https://www.mp3tag.de/en/) (Windows)
-- [Kid3](https://kid3.kde.org/) (Mac/Linux/Windows)
-- iTunes/Music.app — right-click a song > Get Info
+Files without metadata still play but may show as "Unknown". To add/fix metadata:
+- **Windows:** [MP3Tag](https://www.mp3tag.de/en/)
+- **macOS/Linux:** [Kid3](https://kid3.kde.org/)
+- **iTunes/Music.app:** right-click > Get Info
 
 ## Spotify Setup
 
-Stream any track from your Spotify playlists. Audio is fetched from YouTube via yt-dlp, so **Spotify Premium is not required**.
+Stream tracks from your Spotify playlists. Audio is fetched from YouTube via yt-dlp — **Spotify Premium is not required**.
 
 1. Create a Spotify app at [developer.spotify.com/dashboard](https://developer.spotify.com/dashboard)
-2. Add `http://127.0.0.1:5173/callback` as a redirect URI
-3. Copy `.env.example` to `.env` and add your Client ID
-4. Add yourself under Settings > User Management
-5. Click the settings icon in the player > log in
+2. Add **both** of these as redirect URIs:
+   - `http://localhost:5173/callback` (development)
+   - `cupid://callback` (production builds)
+3. Copy `.env.example` to `.env` and fill in your Client ID:
+   ```
+   VITE_SPOTIFY_CLIENT_ID=your_client_id_here
+   ```
+4. Add yourself under Settings → User Management (required while the app is in development mode)
+5. Click the settings icon in the player → log in
 
 See [SPOTIFY_SETUP.md](SPOTIFY_SETUP.md) for detailed instructions and troubleshooting.
 
 ## Apple Music Setup
 
-Browse your Apple Music library playlists. Requires an Apple Developer account. **Apple Music subscription is not required for playback.**
+Browse your Apple Music library playlists via MusicKit JS. **An Apple Music subscription is not required for playback.**
 
-1. Create a MusicKit key at [developer.apple.com/account/resources/authkeys](https://developer.apple.com/account/resources/authkeys/list)
-2. Download the `.p8` key file and place it in the project root
-3. Add `APPLE_TEAM_ID` and `APPLE_KEY_ID` to your `.env`
-4. Click the settings icon > switch to apple > log in
+1. Create a MusicKit key at [developer.apple.com → Certificates, Identifiers & Profiles → Keys](https://developer.apple.com/account/resources/authkeys/list)
+2. Download the `.p8` key file and place it in `src-tauri/` (it is gitignored automatically)
+3. Add to your `.env`:
+   ```
+   APPLE_TEAM_ID=YOUR10CHARID
+   APPLE_KEY_ID=YOURKEYID
+   ```
+4. Click the settings icon → switch to Apple → log in
 
 See [APPLE_MUSIC_SETUP.md](APPLE_MUSIC_SETUP.md) for detailed instructions and troubleshooting.
 
+> **Note:** The `.p8` private key is bundled inside the app for personal use. Do not distribute builds publicly if the key is embedded.
+
+## yt-dlp
+
+yt-dlp is used to stream audio for Spotify and Apple Music tracks. It is **downloaded and kept up to date automatically** — no manual installation needed.
+
+On first stream, the app downloads the appropriate yt-dlp binary for your platform into its app data directory and caches it. On subsequent launches it checks for updates in the background.
+
+If auto-download is blocked by a firewall, you can install yt-dlp manually and the app will fall back to the system PATH version.
+
 ## Build
 
 ```bash
-npm run package
+npm run build
 ```
 
-### Install as Desktop App
+Produces a platform-native installer in `src-tauri/target/release/bundle/`:
+
+| Platform | Output |
+|----------|--------|
+| Windows  | `nsis/*.exe` installer |
+| macOS    | `macos/*.app` bundle and `.dmg` |
+| Linux    | `appimage/*.AppImage` |
+
+### Install the built app
 
 **macOS:**
 ```bash
-cp -r "out/mac-arm64/Cupid Player.app" /Applications/
+cp -r "src-tauri/target/release/bundle/macos/Cupid Player.app" /Applications/
 ```
 
-**Windows:** Run the installer from `out/Cupid Player Setup.exe`.
+> First launch may require: right-click → Open, or System Settings → Privacy & Security → Allow.
+
+**Windows:** Run the `.exe` installer from `src-tauri/target/release/bundle/nsis/`.
+
+**Linux:** Make the AppImage executable and run it:
+```bash
+chmod +x "src-tauri/target/release/bundle/appimage/cupid-player_*.AppImage"
+./"src-tauri/target/release/bundle/appimage/cupid-player_*.AppImage"
+```
 
-**Linux:** Run the AppImage from `out/`.
+## Scripts
 
-> Note: The macOS build is unsigned. On first launch you may need to right-click > Open, or go to System Settings > Privacy & Security to allow it.
+| Command | Description |
+|---------|-------------|
+| `npm run dev` | Start Tauri in dev mode (Vite + Tauri window) |
+| `npm run vite` | Start Vite dev server only (browser preview) |
+| `npm run build` | Build release bundle for the current platform |
+| `npm run typecheck` | Run TypeScript type checker without emitting |
+| `npm run preview` | Preview the Vite production build in a browser |
 
 ## Tech Stack
 
-- **Electron** — desktop app shell (frameless window, IPC, system tray)
+- **Tauri 2** — desktop app shell (frameless window, IPC, system tray, deep links)
 - **Vite** — build tool and dev server
-- **React** — UI framework
-- **HTML5 Audio** — local MP3 playback
-- **yt-dlp** — YouTube audio streaming for Spotify/Apple Music tracks
-- **Spotify Web API** — playlist and metadata fetching (OAuth PKCE)
+- **React 18** — UI framework
+- **TypeScript** — type-safe frontend
+- **Rust** — native backend (JWT, yt-dlp execution, window management)
+- **HTML5 Audio** — local MP3 and streaming playback
+- **yt-dlp** — YouTube audio streaming for Spotify/Apple Music tracks (auto-downloaded)
+- **Spotify Web API** — playlist and metadata fetching (OAuth 2.0 PKCE)
 - **Apple MusicKit JS** — library playlist access (JWT auth)
+- **jsonwebtoken (Rust)** — Apple Music developer token generation
 - **CSS** — custom properties for theming, calc-based responsive scaling
-- **Node.js** — main process (JWT generation, yt-dlp execution)
-- **jsonwebtoken** — Apple Music developer token generation
-- **music-metadata** — MP3 ID3 tag extraction (title, artist, album art)