Hoàn thành bước 3.3. Interactive Workbook (The Core Viewer)

frontend/src/app/workbook/[id]/page.tsx

@@ -0,0 +1,23 @@
+import dynamic from "next/dynamic";
+
+// Disable SSR — WorkbookViewer uses pdfjs-dist and fabric which require browser APIs
+const WorkbookViewer = dynamic(() => import("@/components/WorkbookViewer"), {
+  ssr: false,
+  loading: () => (
+    <div className="min-h-screen flex items-center justify-center">
+      <svg className="animate-spin h-8 w-8 text-blue-500" viewBox="0 0 24 24" fill="none">
+        <circle className="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" strokeWidth="4" />
+        <path className="opacity-75" fill="currentColor" d="M4 12a8 8 0 018-8v4a4 4 0 00-4 4H4z" />
+      </svg>
+    </div>
+  ),
+});
+
+export default function WorkbookPage({
+  params,
+}: {
+  params: { id: string };
+}) {
+  const pdfId = parseInt(params.id, 10);
+  return <WorkbookViewer pdfId={pdfId} />;
+}