Restart repository history from target event

2026-07-18 16:54:26 +01:00
commit e08aa0a667
71 changed files with 15963 additions and 0 deletions
@@ -0,0 +1,56 @@
+import { Disc, Music, ChevronRight } from "lucide-react";
+import { cn } from "@/lib/utils";
+import { motion } from "motion/react";
+import { Album } from "@/types";
+
+interface AlbumSelectorProps {
+    albums: Album[];
+    selectedAlbum: Album | null;
+    onSelect: (album: Album) => void;
+}
+
+export function AlbumSelector({ albums, selectedAlbum, onSelect }: AlbumSelectorProps) {
+    if (albums.length === 0) return null;
+
+    return (
+        <div className="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-6">
+            {albums.map((album, i) => (
+                <motion.div
+                    key={album.path}
+                    initial={{ opacity: 0, scale: 0.9 }}
+                    animate={{ opacity: 1, scale: 1 }}
+                    transition={{ duration: 0.2, delay: i * 0.03 }}
+                    onClick={() => onSelect(album)}
+                    className={cn(
+                        "group cursor-pointer flex flex-col gap-3 relative",
+                        selectedAlbum?.path === album.path ? "opacity-80" : ""
+                    )}
+                >
+                    <div className="aspect-square rounded-lg bg-muted/20 overflow-hidden shadow-lg border border-white/5 group-hover:border-primary/50 group-hover:shadow-primary/10 transition-all duration-300 relative">
+                        {album.coverPath ? (
+                            <img
+                                src={`/api/cover?path=${encodeURIComponent(album.coverPath)}`}
+                                alt={album.name}
+                                className="w-full h-full object-cover transition-transform duration-500 group-hover:scale-105"
+                            />
+                        ) : (
+                            <div className="w-full h-full flex items-center justify-center bg-muted/10">
+                                <Music className="w-16 h-16 text-muted-foreground/20" />
+                            </div>
+                        )}
+                        <div className="absolute inset-0 bg-black/0 group-hover:bg-black/10 transition-colors" />
+                    </div>
+
+                    <div className="space-y-1">
+                        <h3 className="font-semibold text-sm leading-tight truncate group-hover:text-primary transition-colors">
+                            {album.name}
+                        </h3>
+                        <p className="text-xs text-muted-foreground truncate font-mono opacity-60">
+                            {album.path.split('/').pop()}
+                        </p>
+                    </div>
+                </motion.div>
+            ))}
+        </div>
+    );
+}