feat: 컴포넌트 추가, 스타일 수정

web-app/app/shared/components/modal/ModalRenderer.tsx

@@ -0,0 +1,29 @@
+'use client';
+import { useSyncExternalStore } from 'react';
+
+import { modalStore } from './store';
+
+export const ModalRenderer = () => {
+  const modals = useSyncExternalStore(modalStore.subscribe, modalStore.getSnapshot, modalStore.getServerSnapshot);
+
+  return (
+    <>
+      {modals.map((modal) => {
+        const { Component, props, id, resolve } = modal;
+        return (
+          <Component
+            key={id}
+            {...props}
+            isOpen={true}
+            onOpenChange={(open: boolean) => {
+              if (!open) {
+                resolve();
+                modalStore.removeModal(id);
+              }
+            }}
+          />
+        );
+      })}
+    </>
+  );
+};