feat: 참석여부 리스트 조회

src/app/(playground)/playground/invitation-response/invitation-response-list.tsx

@@ -0,0 +1,45 @@
+"use client";
+
+import { useQuery } from "@tanstack/react-query";
+import {
+  Card,
+  CardContent,
+  CardDescription,
+  CardHeader,
+  CardTitle,
+} from "~/components/ui/card";
+import type { InvitationResponse } from "~/lib/db/schema/invitation_response";
+import { getAllInvitationResponses } from "~/lib/db/schema/invitation_response.query";
+
+export default function InvitationResponseList() {
+  const { data, isLoading, error } = useQuery<InvitationResponse[]>({
+    queryKey: ["invitationResponses"],
+    queryFn: () => getAllInvitationResponses(),
+  });
+
+  if (isLoading) return <div>로딩중...</div>;
+  if (error) return <div>에러가 발생했습니다: {error.message}</div>;
+  if (!data || data.length === 0) return <div>데이터를 찾을 수 없습니다.</div>;
+
+  return (
+    <div className="grid grid-cols-3 gap-2">
+      {data.map((response) => (
+        <Card key={response.id}>
+          <CardHeader>
+            <CardTitle>{response.participant_name}</CardTitle>
+            <CardDescription>
+              {response.attendance ? "참석" : "불참"}
+            </CardDescription>
+          </CardHeader>
+          <CardContent>
+            <CardDescription>ID: {response.id}</CardDescription>
+            <CardDescription>사유: {response.reason || "없음"}</CardDescription>
+            <CardDescription>
+              생성일: {new Date(response.created_at).toLocaleString()}
+            </CardDescription>
+          </CardContent>
+        </Card>
+      ))}
+    </div>
+  );
+}

src/app/(playground)/playground/invitation-response/page.tsx

@@ -0,0 +1,29 @@
+import {
+  dehydrate,
+  HydrationBoundary,
+  QueryClient,
+} from "@tanstack/react-query";
+import { cache } from "react";
+import { ALink, AMain } from "~/app/(playground)/playground/inner-tools";
+import InvitationResponseList from "~/app/(playground)/playground/invitation-response/invitation-response-list";
+import { getAllInvitationResponses } from "~/lib/db/schema/invitation_response.query";
+
+const getQueryClient = cache(() => new QueryClient());
+
+export default async function Page() {
+  const queryClient = getQueryClient();
+
+  await queryClient.prefetchQuery({
+    queryKey: ["invitationResponses"],
+    queryFn: getAllInvitationResponses,
+  });
+
+  return (
+    <HydrationBoundary state={dehydrate(queryClient)}>
+      <AMain>
+        <ALink href="/playground">playground</ALink>
+        <InvitationResponseList />
+      </AMain>
+    </HydrationBoundary>
+  );
+}

src/lib/db/schema/invitation_response.query.ts

@@ -0,0 +1,8 @@
+"use server";
+
+import { db } from "~/lib/db";
+import { invitationResponses } from "~/lib/db/schema/invitation_response";
+
+export async function getAllInvitationResponses() {
+  return db.select().from(invitationResponses);
+}