From ac68921f87109b886706f030959a4273ec301914 Mon Sep 17 00:00:00 2001
From: ngc2207 <cfngc3109@gmail.com>
Date: Sat, 23 Nov 2024 13:19:32 +0800
Subject: [PATCH] feat: add question management pages and integrate Prisma for
 data fetching

---
 package.json                         |  1 +
 src/app/questions/[id]/edit/page.tsx | 30 +++++++++++++++++++++++++
 src/app/questions/[id]/page.tsx      | 12 ++++++++++
 src/app/questions/new/page.tsx       |  7 ++++++
 src/app/questions/page.tsx           | 33 ++++++++++++++++++++++++++++
 5 files changed, 83 insertions(+)
 create mode 100644 src/app/questions/[id]/edit/page.tsx
 create mode 100644 src/app/questions/[id]/page.tsx
 create mode 100644 src/app/questions/new/page.tsx
 create mode 100644 src/app/questions/page.tsx

diff --git a/package.json b/package.json
index 1e81afc..fbf4827 100644
--- a/package.json
+++ b/package.json
@@ -9,6 +9,7 @@
     "lint": "next lint"
   },
   "dependencies": {
+    "@monaco-editor/react": "^4.6.0",
     "@prisma/client": "^5.22.0",
     "class-variance-authority": "^0.7.0",
     "clsx": "^2.1.1",
diff --git a/src/app/questions/[id]/edit/page.tsx b/src/app/questions/[id]/edit/page.tsx
new file mode 100644
index 0000000..b9a57c4
--- /dev/null
+++ b/src/app/questions/[id]/edit/page.tsx
@@ -0,0 +1,30 @@
+import prisma from "@/lib/prisma";
+import { CodeLanguage, CodeTemplate } from "@prisma/client";
+
+export default async function QuestionEditPage({
+  params,
+}: {
+  params: Promise<{ id: string }>;
+}) {
+  const questionId = (await params).id;
+  // 获取所有的 codeTemplate
+  const codeTemplates = await prisma.codeTemplate.findMany({
+    where: {
+      questionId: questionId,
+    },
+  });
+
+  // 使用对象映射来存储 CodeTemplate
+  const codeLanguageMap = codeTemplates.reduce((map, codeTemplate) => {
+    map[codeTemplate.language] = codeTemplate;
+    return map;
+  }, {} as Record<CodeLanguage, CodeTemplate>);
+
+  console.log(codeLanguageMap);
+
+  return (
+    <div>
+      <h1>Edit Question {questionId}</h1>
+    </div>
+  );
+}
diff --git a/src/app/questions/[id]/page.tsx b/src/app/questions/[id]/page.tsx
new file mode 100644
index 0000000..fc9f65b
--- /dev/null
+++ b/src/app/questions/[id]/page.tsx
@@ -0,0 +1,12 @@
+export default async function QuestionPage({
+  params,
+}: {
+  params: Promise<{ id: string }>;
+}) {
+  const slug = (await params).id;
+  return (
+    <div>
+      <h1>Question {slug}</h1>
+    </div>
+  );
+}
diff --git a/src/app/questions/new/page.tsx b/src/app/questions/new/page.tsx
new file mode 100644
index 0000000..459c918
--- /dev/null
+++ b/src/app/questions/new/page.tsx
@@ -0,0 +1,7 @@
+export default function QuestionNewPage() {
+  return (
+    <div>
+      <h1>New Question</h1>
+    </div>
+  );
+}
diff --git a/src/app/questions/page.tsx b/src/app/questions/page.tsx
new file mode 100644
index 0000000..966ec18
--- /dev/null
+++ b/src/app/questions/page.tsx
@@ -0,0 +1,33 @@
+import Link from "next/link";
+import prisma from "@/lib/prisma";
+
+export default async function HomePage() {
+  const questions = await prisma.question.findMany();
+
+  const renderedQuestions = questions.map((question) => {
+    return (
+      <Link
+        key={question.id}
+        href={`/questions/${question.id}`}
+        className="flex justify-between items-center p-2 border rounded"
+      >
+        <div>{question.name}</div>
+        <div>{question.difficulty}</div>
+      </Link>
+    );
+  });
+
+  return (
+    <div className="flex justify-center">
+      <div className="container max-w-2xl flex flex-col justify-center">
+        <div className="flex m-2 justify-between items-center">
+          <h1 className="text-xl font-bold">Questions</h1>
+          <Link href="/questions/new" className="border p-2 rounded">
+            New
+          </Link>
+        </div>
+        <div className="flex flex-col gap-2">{renderedQuestions}</div>
+      </div>
+    </div>
+  );
+}