Initial commit — YT Hub

Self-hosted personal YouTube management app.
FastAPI + SQLite backend, React + Vite + Tailwind frontend.
Dockerfiles and compose included for Portainer deployment.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

frontend/src/components/Shelf.jsx

@@ -0,0 +1,29 @@
+import VideoCard from "./VideoCard";
+
+export default function Shelf({ title, videos, action, emptyText }) {
+  if (!videos?.length && emptyText) {
+    return (
+      <section>
+        <h2 className="font-display font-semibold text-lg text-zinc-300 mb-3">{title}</h2>
+        <p className="text-sm text-zinc-600">{emptyText}</p>
+      </section>
+    );
+  }
+  if (!videos?.length) return null;
+
+  return (
+    <section>
+      <div className="flex items-center justify-between mb-3">
+        <h2 className="font-display font-semibold text-lg text-zinc-300">{title}</h2>
+        {action}
+      </div>
+      <div className="flex gap-4 overflow-x-auto pb-2 -mx-1 px-1">
+        {videos.map((v) => (
+          <div key={v.youtube_video_id || v.id} className="w-64 shrink-0">
+            <VideoCard video={v} />
+          </div>
+        ))}
+      </div>
+    </section>
+  );
+}