Add src/app/chapter/[id]/page.tsx

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

@@ -0,0 +1,35 @@
+"use client";
+
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import { useParams } from "next/navigation";
+import React from "react";
+
+export default function ChapterPage() {
+  const { id } = useParams();
+  
+  return (
+    <ThemeProvider>
+      <main className="min-h-screen p-8 md:p-24">
+        <div className="max-w-4xl mx-auto space-y-8">
+          <h1 className="text-4xl font-bold">الفصل {id}</h1>
+          <section>
+            <h2 className="text-2xl font-semibold mb-2">ملخص الفصل</h2>
+            <p className="text-lg">هذا هو ملخص الفصل {id}، حيث يتم استعراض الأحداث الرئيسية وتطور القصة.</p>
+          </section>
+          <section>
+            <h2 className="text-2xl font-semibold mb-2">أحداث رئيسية</h2>
+            <ul className="list-disc list-inside space-y-2">
+              <li>حدث محوري في بداية الفصل.</li>
+              <li>تطور في علاقات الشخصيات.</li>
+              <li>خاتمة مشوقة للفصل.</li>
+            </ul>
+          </section>
+          <section>
+            <h2 className="text-2xl font-semibold mb-2">الشخصيات</h2>
+            <p>الشخصيات التي ظهرت في هذا الفصل: [قائمة الشخصيات]</p>
+          </section>
+        </div>
+      </main>
+    </ThemeProvider>
+  );
+}