Review comments and changes

NellowTCS · Mar 16, 2026 · Mar 16, 2026 · Mar 16, 2026 · Mar 16, 2026 · Mar 16, 2026
commit 54fafede72912cf801ec2bf237ca9e83d54c6598
diff --git a/BUGS.md b/BUGS.md
@@ -2,7 +2,6 @@
 
 - [ ] when the visualizer is open, something UI bugs out and transparency and it flickers sometimes
 - [ ] switching from Home to All Songs and vice versa has a white flash
-- [ ] same for flo stuff we should consolidate where we can and it doesn't create large files
 - [ ] use a proper equalizer component from the web or NPM that works with redux rather than that thing as it's... not a equalizer
 - [ ] so like keeping track of state when user repeatedly does actions (like for example switching songs fast) does nothing and like weirds out state (the eternal problem with this appppppp ugh)
 - [ ] Crossfade doesn't work
@@ -15,9 +14,6 @@
   - [ ] Compact mode
   - [ ] Show Lyrics
   - [ ] Show Album Art
-  - [X] Toggle Lyrics
-  - [X] Toggle Visualizer
-
 - [ ] Lessen delays while reordering
 
 - [ ] Use List Virtualization for song list so that having larger libraries doesn't cause lag on all songs
@@ -38,9 +34,6 @@
 - [ ] fix some themes' visibility issues
   - light mode mostly fixed, re-check all
 
-- [ ] proper pitch manipulation
-  - [PitchShift](https://tonejs.github.io/docs/15.1.22/classes/PitchShift.html)?
-
 - [ ] some missed text that's supposed to be in i18n
   - Run `npm run i18n-check` or `node i18n-izer.cjs -I "visualizers"  --ignore-console`
 

diff --git a/Build/eslint.config.cjs b/Build/eslint.config.cjs
@@ -19,11 +19,11 @@ module.exports = [
     rules: {
       "react/jsx-uses-react": "off",
       "react/react-in-jsx-scope": "off",
-      "react/jsx-uses-vars": "warn",
+      "react/jsx-uses-vars": "error",
       "react/prop-types": "off",
       "react/display-name": "off",
-      "react/no-unescaped-entities": "warn",
-      "react/jsx-key": "warn",
+      "react/no-unescaped-entities": "error",
+      "react/jsx-key": "error",
     },
     settings: {
       react: {
@@ -48,23 +48,23 @@ module.exports = [
     },
     rules: {
       "@typescript-eslint/no-unused-vars": [
-        "warn",
+        "error",
         {
           argsIgnorePattern: "^_",
           varsIgnorePattern: "^_",
           caughtErrorsIgnorePattern: "^_",
           ignoreRestSiblings: true,
         },
       ],
-      "@typescript-eslint/no-explicit-any": "warn",
-      "@typescript-eslint/consistent-type-definitions": ["warn", "interface"],
+      "@typescript-eslint/no-explicit-any": "error",
+      "@typescript-eslint/consistent-type-definitions": ["error", "interface"],
       "react/jsx-uses-react": "off",
       "react/react-in-jsx-scope": "off",
-      "react/jsx-uses-vars": "warn",
+      "react/jsx-uses-vars": "error",
       "react/prop-types": "off",
       "react/display-name": "off",
-      "react/no-unescaped-entities": "warn",
-      "react/jsx-key": "warn",
+      "react/no-unescaped-entities": "error",
+      "react/jsx-key": "error",
     },
     settings: {
       react: {

diff --git a/Build/jest.config.cjs b/Build/jest.config.cjs
@@ -11,8 +11,6 @@ module.exports = {
     "^.+\\.tsx?$": ["ts-jest", { useESM: true }],
   },
   moduleNameMapper: {
-    "^@core/(.*)$": "<rootDir>/src/core/$1",
-    "^@platform/(.*)$": "<rootDir>/src/platform/$1",
     "^.*/platform/visualizers$": "<rootDir>/tests/mocks/platformVisualizers.ts",
     "^@audiflo/libflo$": "<rootDir>/tests/mocks/audifloLibflo.ts",
     "StreamingDecoderBackend$": "<rootDir>/tests/mocks/streamingDecoderBackend.ts",

diff --git a/Build/package-lock.json b/Build/package-lock.json
diff --git a/Build/package.json b/Build/package.json
@@ -20,7 +20,6 @@
     "build:wasm": "wasm-pack build ../crates/symphonia-wasm --target web --out-dir ../../Build/src/platform/audio/wasm/symphonia --out-name symphonia --release",
     "test:watch": "jest --watch",
     "lint": "eslint 'src/**/*.ts' 'src/**/*.tsx'",
-    "eject": "react-scripts eject",
     "make-pretty": "prettier --write 'src/**/*.{ts,tsx,js,jsx,json,css,scss,md,html,cjs}'",
     "count-lines": "cloc . --exclude-dir=node_modules,build,dist --exclude-ext=lock,json",
     "i18n-check": "node i18n-izer.cjs --ignore-console",
@@ -31,7 +30,6 @@
     "@audiflo/libflo": "^0.1.3",
     "@dnd-kit/core": "^6.3.1",
     "@dnd-kit/sortable": "^10.0.0",
-    "@dnd-kit/utilities": "^3.2.2",
     "@fontsource/caveat": "^5.3.0",
     "@fontsource/inter": "^5.3.0",
     "@fontsource/jetbrains-mono": "^5.3.0",
@@ -60,12 +58,13 @@
     "@zag-js/marquee": "^1.44.0",
     "@zag-js/react": "^1.44.0",
     "dompurify": "^3.4.15",
+    "dsssp": "^0.8.0",
     "gsap": "^3.15.0",
     "i18next": "^26.4.2",
     "i18next-browser-languagedetector": "^8.2.1",
     "i18next-http-backend": "^4.0.2",
-    "lodash": "^4.18.1",
     "lucide-react": "^0.577.0",
+    "m3u-parser-generator": "^5.0.2",
     "music-metadata": "^11.16.0",
     "react": "^19.3.0",
     "react-dom": "^19.3.0",
@@ -79,9 +78,7 @@
   "devDependencies": {
     "@babel/plugin-transform-runtime": "^7.29.0",
     "@tauri-apps/cli": "^2.11.5",
-    "@types/jasmine": "^6.0.0",
     "@types/jest": "^30.0.0",
-    "@types/lodash": "^4.17.25",
     "@types/node": "^26.6.2",
     "@types/react": "^19.3.0",
     "@types/react-dom": "^19.3.0",
@@ -101,7 +98,8 @@
     "vite": "^8.3.0",
     "vite-plugin-pwa": "^1.3.0",
     "vite-plugin-wasm": "^3.6.0",
-    "workbox-window": "^7.4.1"
+    "workbox-precaching": "^7.4.1",
+    "workbox-routing": "^7.4.1"
   },
   "eslintConfig": {
     "extends": [

diff --git a/Build/src/core/engine/types.ts b/Build/src/core/engine/types.ts
@@ -1,3 +1,5 @@
+export type TrackSourceKind = "opfs" | "folderHandle";
+
 export interface Track {
   id: string;
   title: string;
@@ -7,6 +9,9 @@ export interface Track {
   url: string;
   mimeType?: string;
   hasStoredAudio?: boolean;
+  sourceKind?: TrackSourceKind;
+  sourceId?: string;
+  path?: string;
   albumArt?: string;
   hasAlbumArt?: boolean;
   embeddedLyrics?: EmbeddedLyrics[];

diff --git a/Build/src/global.css b/Build/src/global.css
@@ -136,6 +136,11 @@ html {
   }
 }
 
+::view-transition-old(root),
+::view-transition-new(root) {
+  background: var(--themegradient);
+}
+
 html[data-vt-direction="forward"]::view-transition-old(root) {
   --vt-slide-offset: -60px;
   animation:
@@ -146,8 +151,7 @@ html[data-vt-direction="forward"]::view-transition-old(root) {
 html[data-vt-direction="forward"]::view-transition-new(root) {
   --vt-slide-offset: 60px;
   animation:
-    var(--animation-duration-fast) ease-out var(--animation-duration-fast) both
-      vtFade,
+    var(--animation-duration-fast) ease-out both vtFade,
     var(--animation-duration-normal) ease-in-out both vtSlide;
 }
 
@@ -161,8 +165,7 @@ html[data-vt-direction="back"]::view-transition-old(root) {
 html[data-vt-direction="back"]::view-transition-new(root) {
   --vt-slide-offset: -60px;
   animation:
-    var(--animation-duration-fast) ease-out var(--animation-duration-fast) both
-      vtFade,
+    var(--animation-duration-fast) ease-out both vtFade,
     var(--animation-duration-normal) ease-in-out both vtSlide;
 }
 

diff --git a/Build/src/helpers/addSong.ts b/Build/src/helpers/addSong.ts
@@ -1,13 +1,48 @@
-import type { Track } from "../core/engine/types";
+import type { Track, TrackSourceKind } from "../core/engine/types";
+import { saveAudio } from "../platform/storage/opfs";
 import { trackStorage } from "../platform/storage/trackStorage";
 
+export interface ImportContext {
+  sourceKind?: TrackSourceKind;
+  sourceId?: string;
+  path?: string;
+}
+
 export async function prepareAndStoreSong(
   song: Track,
   file: File,
 ): Promise<Track> {
   song.url = URL.createObjectURL(file);
   song.hasStoredAudio = true;
-  const arrayBuffer = await file.arrayBuffer();
-  await trackStorage.saveTrack(song, arrayBuffer);
+  await saveAudio(song.id, file);
+  await trackStorage.saveTrack(song);
+  return song;
+}
+
+export async function storeImportedSong(
+  song: Track,
+  file: File,
+  context?: ImportContext,
+): Promise<Track> {
+  const sourcePath = context?.path ?? song.path;
+  if (
+    context?.sourceKind === "folderHandle" &&
+    context.sourceId &&
+    sourcePath
+  ) {
+    song.sourceKind = context.sourceKind;
+    song.sourceId = context.sourceId;
+    song.path = sourcePath;
+    song.hasStoredAudio = true;
+    song.url = "";
+    await trackStorage.saveTrack(song);
+    return song;
+  }
+  return prepareAndStoreSong(song, file);
+}
+
+export async function storeRemoteSong(song: Track): Promise<Track> {
+  song.hasStoredAudio = false;
+  await trackStorage.saveTrack(song);
   return song;
 }