운영 반영

@types/session.ts

@@ -9,28 +9,30 @@ export interface SessionList {
   language: 'KOREAN' | 'ENGLISH';
   category: number;
   category_name: string;
-  user: User | null;
   day_of_week: 'Sat' | 'Sun' | null;
+  host_name: string;
+  host_introduction: string;
+  host_profile_image: string | null;
+  user: User | null;
 }
 
 export interface SessionDetail {
   id: number;
   title: string;
-  brief?: string; // 리뷰용: 발표에 대한 간단한 설명.
-  desc?: string; // 리뷰용: 발표에 대한 자세한 설명
-  comment?: string; // 리뷰용: 파준위에게 전하고 싶은 말
   difficulty: SessionDifficulty;
   duration: SessionDuration;
   language: SessionLanguage;
   category: number;
   category_name: string;
-  accepted: boolean;
   introduction: string;
   video_url: string | null;
   slide_url: string | null;
   room_num: SessionRoomNumber;
-  created_at: string;
-  updated_at: string;
+  day_of_week: 'Sat' | 'Sun' | null;
+  start_at: string;
+  host_name: string;
+  host_introduction: string;
+  host_profile_image: string | null;
   user: User | null;
 }
 

api/session.ts

@@ -10,6 +10,5 @@ export async function getSessionDetail(
   sessionId: string
 ): Promise<SessionDetail> {
   const response = await axios.get<SessionDetail>(`/sessions/${sessionId}/`);
-  const { brief, desc, comment, ...data } = response.data;
-  return data;
+  return response.data;
 }

components/session/SpeakerInfo.tsx

@@ -1,4 +1,3 @@
-import { User } from '@/@types/session';
 import * as P from '@/components/session/styles';
 import Image from 'next/image';
 import { H4 } from '../heading';
@@ -21,20 +20,28 @@ export const ImageContainer = styled('div', {
   },
 });
 
-export const SpeakerInfo = ({ user }: { user: User }) => {
+export const SpeakerInfo = ({
+  user,
+}: {
+  user: {
+    hostName: string;
+    hostIntroduction: string;
+    hostProfileImage: string | null;
+  };
+}) => {
   return (
     <SpeakerContainer>
       <ImageContainer>
         <Image
-          src={user.profile_img || '/images/Logo.png'}
+          src={user.hostProfileImage || '/images/Logo.png'}
           fill
           style={{ objectFit: 'cover', borderRadius: '50%' }}
-          alt={user.nickname}
+          alt={user.hostName}
         />
       </ImageContainer>
       <div>
-        <H4>{user.nickname}</H4>
-        <P.DescContainer>{user.bio}</P.DescContainer>
+        <H4>{user.hostName}</H4>
+        <P.DescContainer>{user.hostIntroduction}</P.DescContainer>
       </div>
     </SpeakerContainer>
   );

pages/session/[id].tsx

@@ -12,6 +12,12 @@ import { SessionBasicInfo } from '@/components/session/SessionBasicInfo';
 import { SpeakerInfo } from '@/components/session/SpeakerInfo';
 
 const SessionInfo: NextPage<{ info: SessionDetail }> = ({ info }) => {
+  const {
+    host_name: hostName,
+    host_introduction: hostIntroduction,
+    host_profile_image: hostProfileImage,
+  } = info;
+  const user = { hostName, hostIntroduction, hostProfileImage };
   return (
     <P.PageContainer>
       <SeoHeader title={Routes.SESSION.title} />
@@ -36,10 +42,10 @@ const SessionInfo: NextPage<{ info: SessionDetail }> = ({ info }) => {
             <div style={{ marginTop: '8px' }}>{info.slide_url}</div>
           </P.Block>
         )}
-        {info.user && (
+        {user.hostName && (
           <P.Block css={{ marginTop: '64px' }}>
             <H2>발표자 소개</H2>
-            <SpeakerInfo user={info.user} />
+            <SpeakerInfo user={user} />
           </P.Block>
         )}
       </P.Section>

pages/session/schedule.tsx

@@ -93,10 +93,10 @@ export const getStaticProps: GetStaticProps = async () => {
   const { Day1: day1, Day2: day2 } = TimeTables;
   const idByNickName: { [hostName: string]: number } = sessionList.reduce(
     (prev, session: SessionList) => {
-      if (session.user?.nickname) {
+      if (session.host_name) {
         return {
           ...prev,
-          [session.user?.nickname]: session.id,
+          [session.host_name]: session.id,
         };
       }
       return prev;

utils/timeTable.ts

@@ -8,10 +8,15 @@ export const setIdAtDayTimeTable = (
     return {
       ...time,
       sessions: time.sessions.map((session) => {
-        if (!session.host_name) return session;
+        if (
+          session.id ||
+          !session.host_name ||
+          !idByNickName[session.host_name]
+        )
+          return session;
         return {
           ...session,
-          // id: `${idByNickName[session.host_name] || ''}`,
+          id: `${idByNickName[session.host_name] || ''}`,
         };
       }),
     };