dh_demo

commit 4515c7e90fe05973eedea96d12aafdb8182b34d0
parent 351320c1afe60b05c811d7987deb0ff4ff8c5d11
Author: Yongbin Kim <iam@yongbin.kim>
Date:   Mon, 30 Jan 2023 10:22:24 +0900

feat: 유저 프로필 페이지 추가

Signed-off-by: Yongbin Kim <iam@yongbin.kim>

Diffstat:
A
pages/users/[id]/index.tsx
 | 
71
+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++

1 file changed, 71 insertions(+), 0 deletions(-)
diff --git a/pages/users/[id]/index.tsx b/pages/users/[id]/index.tsx
@@ -0,0 +1,71 @@
+import Title from '@/components/elements/Title'
+import Container from '@/components/layout/Container'
+import Hero from '@/components/layout/Hero'
+import Section from '@/components/layout/Section'
+import { withConnection } from '@/lib/model_helpers'
+import { getUserProfile, UserProfile } from '@/lib/models/user_profile'
+import { listWikiLinksByOwnerId } from '@/lib/models/wiki_info'
+import { parseIntOrDefault } from '@/lib/utils/number'
+import { GetServerSideProps } from 'next'
+
+interface UserProfilePageProps {
+  profile: UserProfile
+  wikiList: Array<{ slug: string, title: string }>
+}
+
+export const getServerSideProps: GetServerSideProps<UserProfilePageProps> = async (context) => {
+  const id = parseIntOrDefault(context.query.id, -1)
+  if (id < 0) {
+    return { notFound: true }
+  }
+
+  return await withConnection(async (conn) => {
+    const user = await getUserProfile(conn, [id])
+    if (user == null) {
+      return { notFound: true }
+    }
+
+    const wikiList = await listWikiLinksByOwnerId(conn, [id])
+
+    return {
+      props: {
+        profile: user,
+        wikiList: wikiList,
+      }
+    }
+  })
+}
+
+export default function UserProfilePage (props: UserProfilePageProps) {
+  return (
+    <>
+      <Hero>
+        <Title kind="headline">{props.profile.nickname}님의 프로필</Title>
+      </Hero>
+
+      <Container>
+        <Section>
+          <Title kind="headline" size="medium">프로필</Title>
+          <article>
+            {props.profile.bio ?? '소개글이 없습니다.'}
+          </article>
+        </Section>
+
+        <Section>
+          <Title kind="headline" size="medium">위키 목록</Title>
+          <ul>
+            {props.wikiList.map((wiki) => (
+              <li key={wiki.slug}>
+                <a href={`/wiki/${wiki.slug}`}>{wiki.title}</a>
+              </li>
+            ))}
+
+            {props.wikiList.length === 0 && (
+              <li>위키가 없습니다.</li>
+            )}
+          </ul>
+        </Section>
+      </Container>
+    </>
+  )
+}