modify: build error 수정

Author: bbinya1224

app/blog/(main)/layout.tsx

@@ -1,4 +1,4 @@
-import type { ReactNode } from "react";
+import { type ReactNode, Suspense } from "react";
 import PostListProvider from "@/app/provider/PostListProvider";
 import getAllPosts from "@/entities/post/api/getAllPosts";
 import Nav from "@/widgets/header/ui/Nav";
@@ -11,7 +11,9 @@ const Layout = ({ children }: { children: ReactNode }) => {
     <PostListProvider initialPosts={posts}>
       <main className="flex flex-col gap-6 lg:flex-row lg:gap-24">
         <div className="flex-1">
-          <Nav />
+          <Suspense fallback={<div className="h-10" />}>
+            <Nav />
+          </Suspense>
           {children}
         </div>
         <aside className="w-full shrink-0 border-gray-100 lg:w-[320px] lg:border-l dark:border-gray-800">

src/widgets/post/ui/skeleton/PostWidgetSkeleton.tsx

@@ -2,31 +2,29 @@ import Skeleton from "react-loading-skeleton";
 
 const PostWidgetSkeleton = () => {
   return (
-    <article className="relative flex h-full w-full flex-row justify-between gap-4 px-6 py-6 sm:h-48 sm:py-4 sm:pr-2 sm:pl-7 lg:gap-0">
-      <div className="flex-1">
-        <div className="mb-3 w-full gap-2">
-          <Skeleton width="70%" height={32} borderRadius={6} />
+    <article className="flex w-full flex-row justify-between gap-1 border-b border-gray-100 py-8 lg:max-w-[680px] dark:border-gray-800">
+      <div className="flex flex-1 flex-col justify-center pr-4">
+        {/* Title */}
+        <div className="mb-2">
+          <Skeleton width="60%" height={32} />
         </div>
-
-        <div className="flex flex-row gap-9">
-          <p className="flex flex-row items-center gap-1">
-            <Skeleton width={120} height={16} borderRadius={4} />
-          </p>
-
-          <p className="flex flex-row items-center gap-1">
-            <Skeleton width={100} height={16} borderRadius={4} />
-          </p>
-
-          <p className="hidden flex-row items-center gap-1 sm:flex">
-            <Skeleton width={80} height={16} borderRadius={4} />
-          </p>
+        
+        {/* Description */}
+        <div className="mb-4 space-y-2">
+          <Skeleton count={2} height={20} />
         </div>
 
-        <div className="mt-4 space-y-2 pr-4">
-          <Skeleton height={16} borderRadius={4} />
-          <Skeleton width="80%" height={16} borderRadius={4} />
+        {/* Date / Metadata */}
+        <div className="flex gap-2">
+          <Skeleton width={100} height={16} />
+          <Skeleton width={60} height={16} />
         </div>
       </div>
+
+      {/* Thumbnail Placeholder */}
+      <div className="hidden h-[112px] w-[112px] shrink-0 sm:block">
+        <Skeleton height={112} width={112} borderRadius={8} />
+      </div>
     </article>
   );
 };