From 7df607578def1fad111238f7a3842e64c5ffb08d Mon Sep 17 00:00:00 2001
From: Choi siun <siun0331@gmail.com>
Date: Sat, 24 Aug 2024 00:53:58 +0900
Subject: [PATCH] =?UTF-8?q?feat:=20editor=20id=20=EA=B8=B0=EB=B0=98=20invt?=
 =?UTF-8?q?ation=20=EC=A0=95=EB=B3=B4=20=EB=B6=88=EB=9F=AC=EC=98=A4?=
 =?UTF-8?q?=EA=B8=B0=20=EB=B0=8F=20ScrollArea=20=EC=A0=81=EC=9A=A9?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/app/(main)/i/[subdomain]/page.tsx                 | 5 +++--
 src/components/editor/fab/invitation-response-fab.tsx | 7 +++++--
 2 files changed, 8 insertions(+), 4 deletions(-)

diff --git a/src/app/(main)/i/[subdomain]/page.tsx b/src/app/(main)/i/[subdomain]/page.tsx
index 2221e30..1667438 100644
--- a/src/app/(main)/i/[subdomain]/page.tsx
+++ b/src/app/(main)/i/[subdomain]/page.tsx
@@ -3,6 +3,7 @@ import { notFound } from "next/navigation";
 import Recursive from "~/components/editor/elements/recursive";
 import FloatingActionButton from "~/components/editor/fab";
 import EditorProvider from "~/components/editor/provider";
+import { ScrollArea } from "~/components/ui/scroll-area";
 import { getInvitationByEventUrl } from "~/lib/db/schema/invitations.query";
 
 type Props = {
@@ -54,11 +55,11 @@ export default async function Page({ params }: Props) {
       editorState={{ isPreviewMode: true }}
     >
       <main className="relative mx-auto max-w-lg">
-        <div className={"h-lvh overflow-y-auto"}>
+        <ScrollArea className={"h-lvh overflow-y-auto"}>
           {invitation.customFields.elements.map((childElement) => (
             <Recursive key={childElement.id} element={childElement} />
           ))}
-        </div>
+        </ScrollArea>
         <FloatingActionButton />
       </main>
     </EditorProvider>
diff --git a/src/components/editor/fab/invitation-response-fab.tsx b/src/components/editor/fab/invitation-response-fab.tsx
index 2b52125..d9410b3 100644
--- a/src/components/editor/fab/invitation-response-fab.tsx
+++ b/src/components/editor/fab/invitation-response-fab.tsx
@@ -8,12 +8,13 @@ import { Drawer } from "vaul";
 import AttendanceFalseDefault from "~/assets/attendance/attendance-false-default.svg";
 import AttendanceTrueDefault from "~/assets/attendance/attendance-true-default.svg";
 import ImageRadio from "~/components/editor/fab/image-radio";
+import { useEditor } from "~/components/editor/provider";
 import { Button } from "~/components/ui/button";
 import { Input } from "~/components/ui/input";
 import { Label } from "~/components/ui/label";
 import { SheetHeader, SheetTitle } from "~/components/ui/sheet";
 import { createInvitationResponses } from "~/lib/db/schema/invitation_response.query";
-import { getInvitationByEventUrl } from "~/lib/db/schema/invitations.query";
+import { getInvitationById } from "~/lib/db/schema/invitations.query";
 
 export default function InvitationResponseFab() {
   return (
@@ -38,10 +39,12 @@ function InvitationResponseForm() {
   const params = useParams<{ subdomain: string }>();
   const [invitationId, setInvitationId] = useState<string>("");
 
+  const { editor } = useEditor();
+
   useEffect(() => {
     (async () => {
       try {
-        const invitation = await getInvitationByEventUrl(params.subdomain);
+        const invitation = await getInvitationById(editor.config.invitationId);
         return setInvitationId(invitation.id);
       } catch (error) {
         console.error("Failed to fetch invitation:", error);