feat: editor id 기반 invtation 정보 불러오기 및 ScrollArea 적용

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>

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);