style: reformat codebase

Author: pan93412

app/(admin)/(question-management)/database/[id]/_components/description-card.tsx

@@ -2,13 +2,18 @@
 
 import { CardLayout } from "@/components/card-layout";
 import { useSuspenseQuery } from "@apollo/client/react";
-import { DATABASE_DETAIL_QUERY } from "./query";
 import { Remark } from "react-remark";
+import { DATABASE_DETAIL_QUERY } from "./query";
 
 export function DescriptionCard({ id }: { id: string }) {
   return (
     <CardLayout title="資料表描述" description="這個資料表的簡單介紹。">
-      <article className="prose dark:prose-invert">
+      <article
+        className={`
+          prose
+          dark:prose-invert
+        `}
+      >
         <Description id={id} />
       </article>
     </CardLayout>

app/(admin)/(question-management)/database/[id]/_components/relation-card.tsx

@@ -20,9 +20,8 @@ function RelationFigure({ id }: { id: string }) {
   const database = data.database;
 
   // Check if the relation figure looks like a URL (basic check)
-  const isUrl =
-    database.relationFigure.startsWith("http://") ||
-    database.relationFigure.startsWith("https://");
+  const isUrl = database.relationFigure.startsWith("http://")
+    || database.relationFigure.startsWith("https://");
 
   if (isUrl) {
     return (
@@ -31,7 +30,7 @@ function RelationFigure({ id }: { id: string }) {
           <img
             src={database.relationFigure}
             alt="資料庫關係圖"
-            className="h-auto max-h-80 w-full object-contain rounded"
+            className="h-auto max-h-80 w-full rounded object-contain"
           />
         </picture>
       </a>
@@ -42,8 +41,8 @@ function RelationFigure({ id }: { id: string }) {
     <div>
       <pre
         className={`
-          max-h-80 overflow-x-auto rounded-lg border bg-muted p-4
-          font-mono text-sm whitespace-pre-wrap
+          max-h-80 overflow-x-auto rounded-lg border bg-muted p-4 font-mono
+          text-sm whitespace-pre-wrap
         `}
       >
         {database.relationFigure}

app/(admin)/(question-management)/database/[id]/_components/schema-card.tsx

@@ -38,5 +38,5 @@ function Schema({ id }: { id: string }) {
     >
       {database.schema}
     </pre>
-  )
+  );
 }

app/(admin)/(question-management)/database/[id]/page.tsx

@@ -1,11 +1,11 @@
 import { SiteHeader } from "@/components/site-header";
+import { Suspense } from "react";
 import { DeleteDatabaseButtonTrigger } from "../_components/delete";
 import { UpdateDatabaseButtonTrigger } from "../_components/update";
+import { DescriptionCard } from "./_components/description-card";
 import { Header } from "./_components/header";
 import { RelationCard } from "./_components/relation-card";
 import { SchemaCard } from "./_components/schema-card";
-import { DescriptionCard } from "./_components/description-card";
-import { Suspense } from "react";
 
 export default async function DatabasePage({
   params,

app/(admin)/(question-management)/questions/[id]/_components/description-card.tsx

@@ -2,8 +2,8 @@
 
 import { CardLayout } from "@/components/card-layout";
 import { useSuspenseQuery } from "@apollo/client/react";
-import { QUESTION_DETAIL_QUERY } from "./query";
 import { Remark } from "react-remark";
+import { QUESTION_DETAIL_QUERY } from "./query";
 
 export function DescriptionCard({ id }: { id: string }) {
   const { data } = useSuspenseQuery(QUESTION_DETAIL_QUERY, {
@@ -14,12 +14,15 @@ export function DescriptionCard({ id }: { id: string }) {
 
   return (
     <CardLayout title="題幹描述" description="這道題目的詳細說明。">
-      <article className="prose dark:prose-invert">
-        {!question.description ? (
-          <p className="text-muted-foreground">無描述</p>
-        ) : (
-          <Remark>{question.description}</Remark>
-        )}
+      <article
+        className={`
+          prose
+          dark:prose-invert
+        `}
+      >
+        {!question.description
+          ? <p className="text-muted-foreground">無描述</p>
+          : <Remark>{question.description}</Remark>}
       </article>
     </CardLayout>
   );

app/(admin)/(question-management)/questions/[id]/_components/result.tsx

@@ -12,9 +12,12 @@ export function ReferenceAnswerResult({ id }: { id: string }) {
 
   return (
     <div className="space-y-4">
-      <details className="group overflow-hidden rounded-lg border border-border" onToggle={(e) => {
-        setIsOpen(e.currentTarget.open);
-      }}>
+      <details
+        className="group overflow-hidden rounded-lg border border-border"
+        onToggle={(e) => {
+          setIsOpen(e.currentTarget.open);
+        }}
+      >
         <summary
           className={`
             flex cursor-pointer items-center justify-between bg-muted/50 px-4
@@ -38,7 +41,7 @@ export function ReferenceAnswerResult({ id }: { id: string }) {
   );
 }
 
-function ReferenceAnswerResultContent({ id, open }: { id: string, open: boolean }) {
+function ReferenceAnswerResultContent({ id, open }: { id: string; open: boolean }) {
   const { data, loading, error } = useQuery(QUESTION_REFERENCE_ANSWER_RESULT_QUERY, {
     variables: { id },
     skip: !open,