✨ Feat(hub): public architecture 상세 페이지에서 서버에 저장된 svg를 출력하도록 변경

boostcampwm-2024 · Dec 5, 2024 · edd3cf8 · edd3cf8
1 parent 65e46cb
commit edd3cf8
Showing 1 changed file with 17 additions and 3 deletions.
diff --git a/apps/hub/src/app/architectures/[id]/page.tsx b/apps/hub/src/app/architectures/[id]/page.tsx
@@ -39,6 +39,7 @@ export default function ArchitectureDetailPage() {
     const {
         title,
         author: { name: author },
+        architecture,
         createdAt,
         cost,
         tags,
@@ -76,7 +77,7 @@ export default function ArchitectureDetailPage() {
     };
 
     const handleImport = async () => {
-        await fetch(
+        const res = await fetch(
             `${process.env.BACK_URL}/public-architectures/${params.id}/imports`,
             {
                 method: 'POST',
@@ -87,7 +88,13 @@ export default function ArchitectureDetailPage() {
             ...data!,
             _count: { ...data!._count, imports: data!._count.imports + 1 },
         });
-        alert('Imported!');
+        const shouldMove = confirm(
+            '저장되었습니다. 캔버스로 이동하시겠습니까?',
+        );
+        if (shouldMove) {
+            const privateArchitecutre = await res.json();
+            location.href = `/canvas/${privateArchitecutre.id}`;
+        }
     };
 
     return (
@@ -144,7 +151,14 @@ export default function ArchitectureDetailPage() {
                 </div>
                 <hr />
             </header>
-            <ArchitectureImageExample />
+            {architecture?.svg ? (
+                <div
+                    className="w-[48rem]"
+                    dangerouslySetInnerHTML={{ __html: `${architecture.svg}` }}
+                ></div>
+            ) : (
+                <ArchitectureImageExample />
+            )}
         </div>
     );
 }