Merge pull request #189 from themoment-team/feature/postDetailNotFound

apps/client/src/app/post/[postSeq]/page.tsx

@@ -1,3 +1,5 @@
+import { notFound } from 'next/navigation';
+
 import { Footer, Header, AssembledPost } from 'client/components';
 
 import { postUrl } from 'api/client';
@@ -23,19 +25,26 @@ export default function PostPage({ params: { postSeq } }: PostPageProps) {
 export const generateMetadata = async ({
   params,
 }: PostPageProps): Promise<Metadata> => {
-  const postSeq = Number(params.postSeq);
-
-  const post: Promise<PostDetailType> = await fetch(
-    `${process.env.BASE_URL}/api/client${postUrl.postDetail(postSeq)}`
-  ).then((res) => res.json());
-
-  return {
-    title: { absolute: (await post).postTitle },
-    description: (await post).postContent,
-    openGraph: {
-      title: (await post).postTitle,
-      description: (await post).postContent,
-      url: `https://official.hellogsm.kr/post/${postSeq}`,
-    },
-  };
+  try {
+    const postSeq = Number(params.postSeq);
+
+    const post: PostDetailType = await fetch(
+      `${process.env.BASE_URL}/api/client${postUrl.postDetail(postSeq)}`
+    ).then((res) => res.json());
+
+    return {
+      title: { absolute: post.postTitle },
+      description: descriptionFormatting(post.postContent),
+      openGraph: {
+        title: post.postTitle,
+        description: descriptionFormatting(post.postContent),
+        url: `https://official.hellogsm.kr/post/${postSeq}`,
+      },
+    };
+  } catch (e) {
+    return notFound();
+  }
 };
+
+const descriptionFormatting = (description: string) =>
+  description.replace(/\n/g, ' ').replace(/\s+/g, ' ').slice(0, 120);

apps/client/src/assets/svg/NotFoundTitle.tsx

@@ -27,7 +27,7 @@ const NotFoundTitle = () => (
         y2='328.025'
         gradientUnits='userSpaceOnUse'
       >
-        <stop stop-color='#B2E449' />
+        <stop stopColor='#B2E449' />
         <stop offset='0.488435' stopColor='#7ACDF4' />
         <stop offset='0.614583' stopColor='#5CA7D1' />
         <stop offset='1' stopColor='#003365' />
@@ -40,7 +40,7 @@ const NotFoundTitle = () => (
         y2='328.025'
         gradientUnits='userSpaceOnUse'
       >
-        <stop stop-color='#B2E449' />
+        <stop stopColor='#B2E449' />
         <stop offset='0.488435' stopColor='#7ACDF4' />
         <stop offset='0.614583' stopColor='#5CA7D1' />
         <stop offset='1' stopColor='#003365' />