Aurora SpotiRip desktop and web app

- Spotify playlist, library, album and artist browsing with in-app playback - Song, playlist and album downloads via spotdl with YouTube and Bandcamp fallbacks - Electron desktop app (castLabs Widevine) with a permanent sidebar layout - Linux and Windows packaging scripts
2026-09-25 23:20:57 -05:00
commit 3178b8f4f7
204 changed files with 26045 additions and 0 deletions
@@ -0,0 +1,83 @@
+import { Link, useLocation } from "react-router-dom";
+import {
+  Activity,
+  AudioLines,
+  Database,
+  Download,
+  Ellipsis,
+  Heart,
+  History,
+  Home,
+  Settings2,
+} from "lucide-react";
+import {
+  DropdownMenu,
+  DropdownMenuContent,
+  DropdownMenuItem,
+  DropdownMenuSeparator,
+  DropdownMenuTrigger,
+} from "./DropdownMenu";
+import styles from "./MobileNav.module.css";
+
+function activeClass(current: string, target: string) {
+  return current === target ? styles.active : "";
+}
+
+export function MobileNav() {
+  const location = useLocation();
+  const path = location.pathname;
+  const moreActive = ["/library", "/analyze", "/history", "/settings"].includes(path);
+
+  return (
+    <nav className={styles.nav} aria-label="Mobile navigation">
+      <Link className={styles.item + " " + activeClass(path, "/")} to="/">
+        <Home size={20} />
+        <span>Home</span>
+      </Link>
+      <Link className={styles.item + " " + activeClass(path, "/identify")} to="/identify">
+        <AudioLines size={20} />
+        <span>Identify</span>
+      </Link>
+      <Link className={styles.item + " " + activeClass(path, "/convert")} to="/convert">
+        <Download size={20} />
+        <span>Convert</span>
+      </Link>
+      <Link
+        className={
+          styles.item +
+          " " +
+          (path === "/spotify-library" || path.startsWith("/artist/") || path.startsWith("/album/")
+            ? styles.active
+            : "")
+        }
+        to="/spotify-library"
+      >
+        <Heart size={20} />
+        <span>Spotify</span>
+      </Link>
+      <DropdownMenu>
+        <DropdownMenuTrigger asChild>
+          <button className={styles.item + " " + (moreActive ? styles.active : "")} type="button">
+            <Ellipsis size={20} />
+            <span>More</span>
+          </button>
+        </DropdownMenuTrigger>
+        <DropdownMenuContent side="top" align="end" sideOffset={10} className={styles.menu}>
+          <DropdownMenuItem asChild>
+            <Link to="/library"><Database size={16} /> Local Library</Link>
+          </DropdownMenuItem>
+          <DropdownMenuItem asChild>
+            <Link to="/analyze"><Activity size={16} /> Audio Analyzer</Link>
+          </DropdownMenuItem>
+          <DropdownMenuItem asChild>
+            <Link to="/history"><History size={16} /> History</Link>
+          </DropdownMenuItem>
+          <DropdownMenuSeparator />
+          <DropdownMenuItem asChild>
+            <Link to="/settings"><Settings2 size={16} /> Settings</Link>
+          </DropdownMenuItem>
+        </DropdownMenuContent>
+      </DropdownMenu>
+    </nav>
+  );
+}