Merge pull request #211 from gsainfoteam/210-feature-add-reaction

210 feature add reaction
gsainfoteam · Feb 14, 2024 · af4b413 · af4b413
2 parents 36514ea + 2981881
commit af4b413
Show file tree

Hide file tree

Showing 36 changed files with 598 additions and 615 deletions.
diff --git a/.env b/.env
@@ -1,4 +1,4 @@
-NEXT_PUBLIC_API_BASE_URL=https://api.stg.ziggle.gistory.me/
-NEXT_PUBLIC_IDP_BASE_URL=https://idp.gistory.me/
+NEXT_PUBLIC_API_BASE_URL=https://api.stg.ziggle.gistory.me/v3/
+NEXT_PUBLIC_IDP_BASE_URL=https://stg.idp.gistory.me/
 NEXT_PUBLIC_IDP_CLIENT_ID=ziggle2023
 NEXT_PUBLIC_IDP_REDIRECT_URI=https://stg.ziggle.gistory.me/api/login
diff --git a/src/api/notice/get-notice.ts b/src/api/notice/get-notice.ts
@@ -0,0 +1,18 @@
+import { cookies } from 'next/headers';
+
+import api from '..';
+import { NoticeDetail } from './notice';
+
+export const getNotice = async (id: number) => {
+  return api
+    .get<NoticeDetail>(`/notice/${id}`, {
+      headers: {
+        Authorization: `Bearer ${cookies().get('access_token')?.value}`,
+      },
+    })
+    .then(({ data }) => ({
+      ...data,
+      deadline: data.deadline || null,
+      currentDeadline: data.currentDeadline || null,
+    }));
+};
diff --git a/src/api/notice/notice.ts b/src/api/notice/notice.ts
@@ -1,4 +1,5 @@
 import dayjs from 'dayjs';
+import { cookies } from 'next/headers';
 
 import { gql } from '@/generated';
 
@@ -9,6 +10,11 @@ export interface NoticePaginationParams {
   limit?: number;
 }
 
+export interface Tag {
+  id: number;
+  name: string;
+}
+
 export enum NoticeKind {
   RECRUIT = 'recruit',
   EVENT = 'event',
@@ -25,102 +31,71 @@ export interface NoticeSearchParams {
 
 export interface Notice {
   id: number;
-  views: number;
-  currentDeadline?: dayjs.Dayjs | string | null;
-  createdAt: dayjs.Dayjs | string;
-  updatedAt: dayjs.Dayjs | string;
-  deletedAt?: dayjs.Dayjs | string | null;
-  author: string;
-  tags: Tag[];
-  logName?: string;
-  contents: Content[];
-  imagesUrl: string[];
-  files?: NoticeFile[] | null;
-}
-
-export interface Content {
-  id: number;
-  lang: string; // TODO: enum graphql과의 호환성 문제로 임시로 string으로 사용
   title: string;
-  body: string;
-  deadline?: dayjs.Dayjs | string | null;
+  deadline: dayjs.Dayjs | string | null;
+  currentDeadline: dayjs.Dayjs | string | null;
+  langs: string[];
+  content: string;
+  author: {
+    name: string;
+    uuid: string;
+  };
   createdAt: dayjs.Dayjs | string;
-  noticeId: number;
+  tags: string[];
+  views: number;
+  imageUrls: string[];
+  documentUrls: string[];
+  isReminded: boolean;
+  reactions: Reaction[];
 }
 
-interface NoticeFile {
-  uuid: string;
-  name: string;
-  createdAt: dayjs.Dayjs | string;
-  url: string;
-  type: string; // TODO: enum
-  noticeId: number;
+export interface Reaction {
+  emoji: string;
+  count: number;
+  isReacted: boolean;
 }
 
-export interface Tag {
+export interface Content {
   id: number;
-  name: string;
+  deadline: Date | null;
+  content: string;
+  lang: string;
+  createdAt: Date;
 }
 
 export interface NoticeDetail extends Notice {
-  reminder: boolean;
-  authorId: string;
+  additionalContents: Content[];
 }
 
 export interface Notices {
   list: Notice[];
   total: number;
 }
 
-export const getAllNotices = async (
-  params: NoticePaginationParams & NoticeSearchParams = {},
-) =>
-  api.get<Notices>('/notice', { params }).then(({ data }) => ({
-    ...data,
-    list: data.list.map(({ currentDeadline, ...notice }) => ({
-      ...notice,
-      currentDeadline: currentDeadline ?? null,
-      contents: notice.contents.map(({ deadline, ...content }) => ({
-        ...content,
-        deadline: deadline ?? null,
-      })),
-    })),
-  }));
-
-export const getNotice = async (id: number) =>
-  api.get<NoticeDetail>(`/notice/${id}`).then(({ data }) => ({
-    ...data,
-    currentDeadline: data.currentDeadline || null,
-    contents: data.contents.map(({ deadline, ...content }) => ({
-      ...content,
-      deadline: deadline || null,
-    })),
-  }));
-
 export const GET_NOTICES = gql(`
   query GetNotices($offset: Int, $limit: Int) {
     notices(offset: $offset, limit: $limit, orderBy: RECENT) {
       list {
         id
-        views
+        title
+        deadline
         currentDeadline
-        createdAt
-        updatedAt
-        deletedAt
-        author
-        imagesUrl
-        tags {
-          id
+        langs
+        content
+        author {
           name
+          uuid
         }
-        contents {
-          id
-          lang
-          title
-          body
-          deadline
-          createdAt
-          noticeId
+        createdAt
+        tags
+        views
+        imageUrls
+        documentUrls
+        isReminded
+        reactions {
+          emoji
+          count
+          isReacted
         }
       }
       total
@@ -132,14 +107,12 @@ export const CREATE_NOTICE = gql(`
   mutation CreateNotice($title: String!, $body: String!, $deadline: Date, $tags: [Int!], $images: [String!]) {
     createNotice(title: $title, body: $body, deadline: $deadline, tags: $tags, images: $images) {
       id
-      contents {
+      additionalContents {
         id
-        lang
-        title
-        body
         deadline
+        content
+        lang
         createdAt
-        noticeId
       }
     }
   }
@@ -149,14 +122,6 @@ export const ATTACH_INTERNATIONAL_NOTICE = gql(`
   mutation AttachInternationalNotice($title: String!, $body: String!, $deadline: Date, $noticeId: Int!, $contentId: Int!, $lang: String!) {
     attachInternationalNotice(title: $title, body: $body, deadline: $deadline, noticeId: $noticeId, contentId: $contentId, lang: $lang) {
       id
-      contents {
-        id
-        lang
-        title
-        body
-        deadline
-        createdAt
-      }
     }
   }
 `);
@@ -165,14 +130,12 @@ export const CREATE_ADDITIONAL_NOTICE = gql(`
   mutation CreateAdditionalNotice($title: String, $body: String!, $deadline: Date, $noticeId: Int!) {
     createAdditionalNotice(title: $title, body: $body, deadline: $deadline, noticeId: $noticeId) {
       id
-      contents {
+      additionalContents {
         id
-        lang
-        title
-        body
         deadline
+        content
+        lang
         createdAt
-        noticeId
       }
     }
   }
@@ -183,3 +146,59 @@ export const DELETE_NOTICE = gql(`
     deleteNotice(id: $id)
   }
 `);
+
+export const ADD_REACTION = gql(`
+  mutation AddReaction($noticeId: Int!, $emoji: String!) {
+    addReaction(noticeId: $noticeId, emoji: $emoji) {
+      id
+        title
+        deadline
+        currentDeadline
+        langs
+        content
+        author {
+          name
+          uuid
+        }
+        createdAt
+        tags
+        views
+        imageUrls
+        documentUrls
+        isReminded
+        reactions {
+          emoji
+          count
+          isReacted
+        }
+    }
+  }
+`);
+
+export const DELETE_REACTION = gql(`
+  mutation DeleteReaction($noticeId: Int!, $emoji: String!) {
+    deleteReaction(noticeId: $noticeId, emoji: $emoji) {
+      id
+        title
+        deadline
+        currentDeadline
+        langs
+        content
+        author {
+          name
+          uuid
+        }
+        createdAt
+        tags
+        views
+        imageUrls
+        documentUrls
+        isReminded
+        reactions {
+          emoji
+          count
+          isReacted
+        }
+    }
+  }
+`);
diff --git a/src/app/[lng]/(common)/mypage/MypageTable.tsx b/src/app/[lng]/(common)/mypage/MypageTable.tsx
@@ -5,7 +5,6 @@ import { Notice } from '@/api/notice/notice';
 import { createTranslation, PropsWithLng } from '@/app/i18next';
 import { Locale } from '@/app/i18next/settings';
 import LazyCat from '@/assets/lazy-cat.svg';
-import getLocaleContents from '@/utils/getLocaleContents';
 
 interface MypageTableProps {
   title: string;
@@ -49,7 +48,6 @@ const MypageTable = async ({
         {articles.map((articleObj, index) => {
           const isLastRow = index === articles.length - 1;
           const underLine = isLastRow ? '' : 'border-b border-gray-300';
-          const localeContents = getLocaleContents(articleObj.contents, lng);
 
           return (
             <Link
@@ -59,7 +57,7 @@ const MypageTable = async ({
             >
               <div className="leading-1.5 pb-0  sm:pb-0">
                 <div className="text-regular m-3.5 text-text dark:text-white">
-                  {localeContents[0].title}
+                  {articleObj.title}
                 </div>
               </div>
               <div className="items-end justify-end">

diff --git a/src/app/[lng]/(common)/notice/[id]/AddAdditionalNotice.tsx b/src/app/[lng]/(common)/notice/[id]/AddAdditionalNotice.tsx
@@ -24,17 +24,16 @@ import AddIcon from '@/assets/icons/add.svg';
 import { WarningSwal } from '@/utils/swals';
 
 import { apolloClient } from '../../InitClient';
-import AddNoticeRadio from './AddNoticeRadio';
 
 interface AddAddtionalNoticesProps {
   noticeId: number;
   originallyHasDeadline: string | Dayjs | null;
-  supportLanguage: string[];
+  supportedLanguage: string[];
 }
 
 const AddAdditionalNotice = ({
   noticeId,
-  supportLanguage,
+  supportedLanguage,
   originallyHasDeadline,
   lng,
 }: AddAddtionalNoticesProps & PropsWithLng) => {
@@ -46,7 +45,7 @@ const AddAdditionalNotice = ({
 
   const { t } = useTranslation(lng);
 
-  const supportEnglish = supportLanguage.includes('en');
+  const supportEnglish = supportedLanguage.includes('en');
 
   const { refresh } = useRouter();
 
@@ -72,7 +71,7 @@ const AddAdditionalNotice = ({
       },
     });
 
-    const contents = notice.data?.createAdditionalNotice.contents;
+    const contents = notice.data?.createAdditionalNotice.additionalContents;
     if (!contents) {
       return;
     }
@@ -156,7 +155,7 @@ const AddAdditionalNotice = ({
           />
         </div>
 
-        {supportLanguage.includes('en') && (
+        {supportedLanguage.includes('en') && (
           <div>
             <div className="ml-8 text-lg font-bold">
               {t('zabo.additionalNotices.englishAdditionalNotice')}