initial version

src/app/library/[id]/page.tsx

@@ -0,0 +1,34 @@
+import { getLibrary } from '@/lib/libraries'
+import { notFound } from 'next/navigation'
+import GamesView from '@/components/games/GamesView'
+import MixedView from '@/components/mixed/MixedView'
+
+interface Props {
+  params: Promise<{ id: string }>
+  searchParams: Promise<{ path?: string }>
+}
+
+export default async function LibraryPage({ params, searchParams }: Props) {
+  const { id } = await params
+  const { path: subpath } = await searchParams
+
+  const library = getLibrary(id)
+  if (!library) notFound()
+
+  return (
+    <div>
+      <div className="flex items-center gap-2 mb-6">
+        <a href="/" className="text-sm transition-colors" style={{ color: 'var(--text-secondary)' }}>
+          Libraries
+        </a>
+        <span style={{ color: 'var(--text-secondary)' }}>/</span>
+        <span className="text-sm font-medium" style={{ color: 'var(--text-primary)' }}>
+          {library.name}
+        </span>
+      </div>
+
+      {library.type === 'games' && <GamesView libraryId={id} />}
+      {library.type === 'mixed' && <MixedView libraryId={id} initialPath={subpath ?? ''} />}
+    </div>
+  )
+}