diff --git a/apps/web/app/layout.tsx b/apps/web/app/layout.tsx index 7e42423..c99ce77 100644 --- a/apps/web/app/layout.tsx +++ b/apps/web/app/layout.tsx @@ -20,11 +20,13 @@ export default function RootLayout({ children: React.ReactNode; }>) { return ( - + - {children} + +
{children}
+ ); diff --git a/apps/web/app/page.tsx b/apps/web/app/page.tsx index 4102775..f8341f2 100644 --- a/apps/web/app/page.tsx +++ b/apps/web/app/page.tsx @@ -9,9 +9,16 @@ export default async function Home() { return ( <> - +
+

+ 게시글 목록 +

+
+ +
+
- - + <> + +
+
+ + +
+
+ ); } diff --git a/apps/web/app/posts/edit/[id]/page.tsx b/apps/web/app/posts/edit/[id]/page.tsx index f06f95d..d8c02a3 100644 --- a/apps/web/app/posts/edit/[id]/page.tsx +++ b/apps/web/app/posts/edit/[id]/page.tsx @@ -15,9 +15,5 @@ export default async function PostEditPage({ params }: PostEditPageProps) { notFound(); } - return ( -
- -
- ); + return ; } diff --git a/apps/web/app/posts/write/page.tsx b/apps/web/app/posts/write/page.tsx index 04837cb..1f7342b 100644 --- a/apps/web/app/posts/write/page.tsx +++ b/apps/web/app/posts/write/page.tsx @@ -1,9 +1,5 @@ import { PostForm } from '@/features/post/post-editor'; export default function NewPostPage() { - return ( -
- -
- ); + return ; } diff --git a/apps/web/entities/post/model/post-view-model.ts b/apps/web/entities/post/model/post-view-model.ts index 6501625..20db1c6 100644 --- a/apps/web/entities/post/model/post-view-model.ts +++ b/apps/web/entities/post/model/post-view-model.ts @@ -1,7 +1,18 @@ import { Post } from '@/entities/post'; import { formatToLocaleDate } from '@/shared/lib'; -export const mapPostToViewModel = (post: Post) => ({ - ...post, +export interface PostViewModel { + id: string; + title: string; + content: string; + author: string; + localeCreatedAt: string; +} + +export const mapPostToViewModel = (post: Post): PostViewModel => ({ + id: post.id, + title: post.title, + content: post.content, + author: post.author, localeCreatedAt: formatToLocaleDate(post.createdAt), }); diff --git a/apps/web/features/post/post-detail/ui/post-detail.tsx b/apps/web/features/post/post-detail/ui/post-detail.tsx index 91dfff0..e03e8b3 100644 --- a/apps/web/features/post/post-detail/ui/post-detail.tsx +++ b/apps/web/features/post/post-detail/ui/post-detail.tsx @@ -1,61 +1,38 @@ -'use client'; +import { getPostById, mapPostToViewModel } from '@/entities/post'; +import { PostViewModel } from '@/entities/post/model/post-view-model'; -import { Button } from '@workspace/ui/components/button'; -import { useParams, useRouter } from 'next/navigation'; -import { useEffect, useState } from 'react'; - -import { getPostById } from '@/entities/post'; -import { Post } from '@/entities/post'; -import { formatToLocaleDate } from '@/shared/lib'; +interface PostDetailProps { + params: { id: string }; +} -// 특정 게시글 페이지 - 게시글 생성 후 넘어가지는지 확인용으로 만든 임시 컴포넌트 -export function PostDetail() { - const { id } = useParams(); - const router = useRouter(); - const [post, setPost] = useState(null); - const [isLoading, setIsLoading] = useState(true); - const [error, setError] = useState(null); +export async function PostDetail({ params }: PostDetailProps) { + let post: PostViewModel | null = null; + let error: string | null = null; - useEffect(() => { - if (!id) return; + const id = (await params).id; - async function fetchPost() { - try { - setIsLoading(true); - const data = await getPostById(id as string); - setPost(data); - } catch (err) { - setError('게시글을 불러오는 중 오류가 발생했습니다.'); - console.error(err); - } finally { - setIsLoading(false); - } - } - fetchPost(); - }, [id]); + try { + const data = await getPostById(id); + post = mapPostToViewModel(data); + } catch (err) { + console.error(err); + error = '게시글을 불러오는 중 오류가 발생했습니다.'; + } - if (isLoading) return

로딩 중...

; - if (error) return

{error}

; - if (!post) - return ( -

게시글을 찾을 수 없습니다.

- ); + if (error) return

{error}

; + if (!post) return

게시글을 찾을 수 없습니다.

; return ( -
-

{post.title}

-

{post.content}

-
-

작성자: {post.author}

-

작성일: {formatToLocaleDate(post.createdAt)}

-
-
- - +
+

{post.title}

+
+

{post.content}

+
+
+ + {post.author} + +
); diff --git a/apps/web/features/post/post-editor/ui/post-form.tsx b/apps/web/features/post/post-editor/ui/post-form.tsx index 30d1219..23a3d9d 100644 --- a/apps/web/features/post/post-editor/ui/post-form.tsx +++ b/apps/web/features/post/post-editor/ui/post-form.tsx @@ -22,8 +22,8 @@ export function PostForm({ post }: PostFormProps) { ); return ( -
-

+ +

{isEditMode ? '게시글 수정' : '새 게시글 작성'}

@@ -43,6 +43,7 @@ export function PostForm({ post }: PostFormProps) { disabled={isPending} isTextArea defaultValue={post?.content || ''} + className="min-h-[30vh]" /> {actionResult.error}

)} - - +
+ + +
); }