From e268bd31ece790780d777b8beeb5075af4578648 Mon Sep 17 00:00:00 2001 From: JASUN LEE Date: Thu, 20 Oct 2022 15:39:05 +0900 Subject: [PATCH 01/20] =?UTF-8?q?refactor:=20api=EC=9A=94=EC=B2=AD=20?= =?UTF-8?q?=ED=8F=B4=EB=8D=94=EB=B3=84=EB=A1=9C=20=EB=B6=84=EB=A5=98?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- frontend/src/__test__/vote/useGetVote.test.tsx | 2 +- frontend/src/api/{ => article}/article.ts | 0 frontend/src/api/{ => article}/image.ts | 0 frontend/src/api/{ => article}/like.ts | 0 frontend/src/api/{ => comment}/comments.ts | 0 frontend/src/api/{ => hashTag}/hashTag.ts | 0 frontend/src/api/{ => search}/search.ts | 0 frontend/src/api/{ => tempArticle}/tempArticle.ts | 0 frontend/src/api/{ => user}/login.ts | 0 frontend/src/api/{ => user}/myPage.ts | 0 frontend/src/api/{ => vote}/vote.ts | 0 frontend/src/components/@helper/accessHandler/LoginHandler.tsx | 2 +- .../components/@helper/accessHandler/RefreshTokenHandler.tsx | 2 +- frontend/src/hooks/article/useDeleteArticleContent.tsx | 2 +- frontend/src/hooks/article/useGetAllArticles.tsx | 2 +- frontend/src/hooks/article/useGetCategoryArticles.tsx | 2 +- frontend/src/hooks/article/useGetDetailArticle.tsx | 2 +- frontend/src/hooks/article/useGetPopularArticles.tsx | 2 +- frontend/src/hooks/article/useHeartClick.tsx | 2 +- frontend/src/hooks/article/usePostUpdateWritingArticle.tsx | 2 +- frontend/src/hooks/article/usePostWritingArticles.tsx | 2 +- frontend/src/hooks/comment/useDeleteComment.tsx | 2 +- frontend/src/hooks/comment/useGetDetailComment.tsx | 2 +- frontend/src/hooks/comment/usePostCommentInputModal.tsx | 2 +- frontend/src/hooks/comment/usePutCommentInputModal.tsx | 2 +- frontend/src/hooks/hashTag/useGetAllHashTags.tsx | 2 +- frontend/src/hooks/hashTag/useGetArticleByHashTag.tsx | 2 +- frontend/src/hooks/login/useDeleteRefreshToken.tsx | 2 +- frontend/src/hooks/login/useGetLoginURL.tsx | 2 +- frontend/src/hooks/search/useGetSearch.tsx | 2 +- frontend/src/hooks/tempArticle/useDeleteTempArticle.tsx | 2 +- frontend/src/hooks/tempArticle/useGetTempArticles.tsx | 2 +- frontend/src/hooks/tempArticle/useGetTempDetailArticles.tsx | 2 +- frontend/src/hooks/tempArticle/usePostTempArticle.tsx | 2 +- frontend/src/hooks/user/useGetUserArticles.tsx | 2 +- frontend/src/hooks/user/useGetUserComments.tsx | 2 +- frontend/src/hooks/user/useGetUserInfo.tsx | 2 +- frontend/src/hooks/user/usePutUserProfile.tsx | 2 +- frontend/src/hooks/vote/useGetVote.tsx | 2 +- frontend/src/hooks/vote/usePostVoteItem.tsx | 2 +- frontend/src/mock/vote.ts | 2 +- frontend/src/pages/VoteDeadlineGenerator/index.tsx | 2 +- frontend/src/storybook/Vote/Vote.stories.tsx | 2 +- frontend/src/utils/takeToastImgEditor.ts | 2 +- 44 files changed, 34 insertions(+), 34 deletions(-) rename frontend/src/api/{ => article}/article.ts (100%) rename frontend/src/api/{ => article}/image.ts (100%) rename frontend/src/api/{ => article}/like.ts (100%) rename frontend/src/api/{ => comment}/comments.ts (100%) rename frontend/src/api/{ => hashTag}/hashTag.ts (100%) rename frontend/src/api/{ => search}/search.ts (100%) rename frontend/src/api/{ => tempArticle}/tempArticle.ts (100%) rename frontend/src/api/{ => user}/login.ts (100%) rename frontend/src/api/{ => user}/myPage.ts (100%) rename frontend/src/api/{ => vote}/vote.ts (100%) diff --git a/frontend/src/__test__/vote/useGetVote.test.tsx b/frontend/src/__test__/vote/useGetVote.test.tsx index fc94089a5..0024e63b4 100644 --- a/frontend/src/__test__/vote/useGetVote.test.tsx +++ b/frontend/src/__test__/vote/useGetVote.test.tsx @@ -3,7 +3,7 @@ import React from 'react'; import { QueryClient, QueryClientProvider } from 'react-query'; import { BrowserRouter } from 'react-router-dom'; -import { registerVoteItems } from '@/api/vote'; +import { registerVoteItems } from '@/api/vote/vote'; import useVote from '@/hooks/vote/useGetVote'; import { VoteHandler } from '@/mock'; import { theme } from '@/styles/Theme'; diff --git a/frontend/src/api/article.ts b/frontend/src/api/article/article.ts similarity index 100% rename from frontend/src/api/article.ts rename to frontend/src/api/article/article.ts diff --git a/frontend/src/api/image.ts b/frontend/src/api/article/image.ts similarity index 100% rename from frontend/src/api/image.ts rename to frontend/src/api/article/image.ts diff --git a/frontend/src/api/like.ts b/frontend/src/api/article/like.ts similarity index 100% rename from frontend/src/api/like.ts rename to frontend/src/api/article/like.ts diff --git a/frontend/src/api/comments.ts b/frontend/src/api/comment/comments.ts similarity index 100% rename from frontend/src/api/comments.ts rename to frontend/src/api/comment/comments.ts diff --git a/frontend/src/api/hashTag.ts b/frontend/src/api/hashTag/hashTag.ts similarity index 100% rename from frontend/src/api/hashTag.ts rename to frontend/src/api/hashTag/hashTag.ts diff --git a/frontend/src/api/search.ts b/frontend/src/api/search/search.ts similarity index 100% rename from frontend/src/api/search.ts rename to frontend/src/api/search/search.ts diff --git a/frontend/src/api/tempArticle.ts b/frontend/src/api/tempArticle/tempArticle.ts similarity index 100% rename from frontend/src/api/tempArticle.ts rename to frontend/src/api/tempArticle/tempArticle.ts diff --git a/frontend/src/api/login.ts b/frontend/src/api/user/login.ts similarity index 100% rename from frontend/src/api/login.ts rename to frontend/src/api/user/login.ts diff --git a/frontend/src/api/myPage.ts b/frontend/src/api/user/myPage.ts similarity index 100% rename from frontend/src/api/myPage.ts rename to frontend/src/api/user/myPage.ts diff --git a/frontend/src/api/vote.ts b/frontend/src/api/vote/vote.ts similarity index 100% rename from frontend/src/api/vote.ts rename to frontend/src/api/vote/vote.ts diff --git a/frontend/src/components/@helper/accessHandler/LoginHandler.tsx b/frontend/src/components/@helper/accessHandler/LoginHandler.tsx index 6236b9d7c..34acfad75 100644 --- a/frontend/src/components/@helper/accessHandler/LoginHandler.tsx +++ b/frontend/src/components/@helper/accessHandler/LoginHandler.tsx @@ -3,7 +3,7 @@ import { useEffect } from 'react'; import { useMutation } from 'react-query'; import { useNavigate, useSearchParams } from 'react-router-dom'; -import { postLogin } from '@/api/login'; +import { postLogin } from '@/api/user/login'; import LoginLoading from '@/components/login/LoginLoading/LoginLoading'; import { ACCESSTOKEN_KEY } from '@/constants'; import { URL } from '@/constants/url'; diff --git a/frontend/src/components/@helper/accessHandler/RefreshTokenHandler.tsx b/frontend/src/components/@helper/accessHandler/RefreshTokenHandler.tsx index 8efa6c18e..a9946e7c1 100644 --- a/frontend/src/components/@helper/accessHandler/RefreshTokenHandler.tsx +++ b/frontend/src/components/@helper/accessHandler/RefreshTokenHandler.tsx @@ -2,7 +2,7 @@ import { AxiosError } from 'axios'; import { useEffect } from 'react'; import { useQuery } from 'react-query'; -import { getAccessTokenByRefreshToken } from '@/api/login'; +import { getAccessTokenByRefreshToken } from '@/api/user/login'; import LoginLoading from '@/components/login/LoginLoading/LoginLoading'; import { ErrorMessage } from '@/constants/ErrorMessage'; import { ACCESSTOKEN_KEY } from '@/constants/index'; diff --git a/frontend/src/hooks/article/useDeleteArticleContent.tsx b/frontend/src/hooks/article/useDeleteArticleContent.tsx index 7c9ad0615..66cc10946 100644 --- a/frontend/src/hooks/article/useDeleteArticleContent.tsx +++ b/frontend/src/hooks/article/useDeleteArticleContent.tsx @@ -3,7 +3,7 @@ import { useEffect } from 'react'; import { useMutation } from 'react-query'; import { useNavigate } from 'react-router-dom'; -import { deleteArticle } from '@/api/article'; +import { deleteArticle } from '@/api/article/article'; import { ErrorMessage } from '@/constants/ErrorMessage'; import { URL } from '@/constants/url'; import useSnackBar from '@/hooks/common/useSnackBar'; diff --git a/frontend/src/hooks/article/useGetAllArticles.tsx b/frontend/src/hooks/article/useGetAllArticles.tsx index 4ae9a825f..9700208c2 100644 --- a/frontend/src/hooks/article/useGetAllArticles.tsx +++ b/frontend/src/hooks/article/useGetAllArticles.tsx @@ -2,7 +2,7 @@ import { AxiosError } from 'axios'; import { useEffect, useState } from 'react'; import { useInfiniteQuery } from 'react-query'; -import { getAllArticle } from '@/api/article'; +import { getAllArticle } from '@/api/article/article'; import { ErrorMessage } from '@/constants/ErrorMessage'; import useThrowCustomError from '@/hooks/common/useThrowCustomError'; import { infiniteArticleResponse } from '@/types/articleResponse'; diff --git a/frontend/src/hooks/article/useGetCategoryArticles.tsx b/frontend/src/hooks/article/useGetCategoryArticles.tsx index 718a5387f..5fddd5c98 100644 --- a/frontend/src/hooks/article/useGetCategoryArticles.tsx +++ b/frontend/src/hooks/article/useGetCategoryArticles.tsx @@ -2,7 +2,7 @@ import { AxiosError } from 'axios'; import { useEffect, useState } from 'react'; import { useInfiniteQuery } from 'react-query'; -import { getAllArticle } from '@/api/article'; +import { getAllArticle } from '@/api/article/article'; import { ErrorMessage } from '@/constants/ErrorMessage'; import useThrowCustomError from '@/hooks/common/useThrowCustomError'; import { infiniteArticleResponse } from '@/types/articleResponse'; diff --git a/frontend/src/hooks/article/useGetDetailArticle.tsx b/frontend/src/hooks/article/useGetDetailArticle.tsx index 86f557345..c948bf6be 100644 --- a/frontend/src/hooks/article/useGetDetailArticle.tsx +++ b/frontend/src/hooks/article/useGetDetailArticle.tsx @@ -3,7 +3,7 @@ import { useEffect } from 'react'; import { useQuery } from 'react-query'; import { useSetRecoilState } from 'recoil'; -import { getDetailArticle } from '@/api/article'; +import { getDetailArticle } from '@/api/article/article'; import { ErrorMessage } from '@/constants/ErrorMessage'; import useThrowCustomError from '@/hooks/common/useThrowCustomError'; import { articleState } from '@/store/articleState'; diff --git a/frontend/src/hooks/article/useGetPopularArticles.tsx b/frontend/src/hooks/article/useGetPopularArticles.tsx index 727f4dbbb..69962820e 100644 --- a/frontend/src/hooks/article/useGetPopularArticles.tsx +++ b/frontend/src/hooks/article/useGetPopularArticles.tsx @@ -1,7 +1,7 @@ import { AxiosError } from 'axios'; import { useQuery } from 'react-query'; -import { getPopularArticles, PopularArticles } from '@/api/article'; +import { getPopularArticles, PopularArticles } from '@/api/article/article'; import { ErrorMessage } from '@/constants/ErrorMessage'; import useThrowCustomError from '@/hooks/common/useThrowCustomError'; diff --git a/frontend/src/hooks/article/useHeartClick.tsx b/frontend/src/hooks/article/useHeartClick.tsx index 2519a9f2d..4aba09bb6 100644 --- a/frontend/src/hooks/article/useHeartClick.tsx +++ b/frontend/src/hooks/article/useHeartClick.tsx @@ -2,7 +2,7 @@ import { AxiosError, AxiosResponse } from 'axios'; import React, { useEffect, useState } from 'react'; import { useMutation } from 'react-query'; -import { deleteLikeArticle, postAddLikeArticle } from '@/api/like'; +import { deleteLikeArticle, postAddLikeArticle } from '@/api/article/like'; import { ErrorMessage } from '@/constants/ErrorMessage'; import useThrowCustomError from '@/hooks/common/useThrowCustomError'; diff --git a/frontend/src/hooks/article/usePostUpdateWritingArticle.tsx b/frontend/src/hooks/article/usePostUpdateWritingArticle.tsx index 7cc692857..26e8621e4 100644 --- a/frontend/src/hooks/article/usePostUpdateWritingArticle.tsx +++ b/frontend/src/hooks/article/usePostUpdateWritingArticle.tsx @@ -4,7 +4,7 @@ import { useMutation } from 'react-query'; import { useNavigate } from 'react-router-dom'; import { useRecoilValue } from 'recoil'; -import { putArticle } from '@/api/article'; +import { putArticle } from '@/api/article/article'; import { ErrorMessage } from '@/constants/ErrorMessage'; import useThrowCustomError from '@/hooks/common/useThrowCustomError'; import { queryClient } from '@/index'; diff --git a/frontend/src/hooks/article/usePostWritingArticles.tsx b/frontend/src/hooks/article/usePostWritingArticles.tsx index c6917117f..6f5bad0d4 100644 --- a/frontend/src/hooks/article/usePostWritingArticles.tsx +++ b/frontend/src/hooks/article/usePostWritingArticles.tsx @@ -3,7 +3,7 @@ import { useEffect, useRef, useState } from 'react'; import { useMutation } from 'react-query'; import { useNavigate } from 'react-router-dom'; -import { postWritingArticle } from '@/api/article'; +import { postWritingArticle } from '@/api/article/article'; import { ErrorMessage } from '@/constants/ErrorMessage'; import { CATEGORY } from '@/constants/categoryType'; import useThrowCustomError from '@/hooks/common/useThrowCustomError'; diff --git a/frontend/src/hooks/comment/useDeleteComment.tsx b/frontend/src/hooks/comment/useDeleteComment.tsx index f085ace9a..d3446521b 100644 --- a/frontend/src/hooks/comment/useDeleteComment.tsx +++ b/frontend/src/hooks/comment/useDeleteComment.tsx @@ -2,7 +2,7 @@ import { AxiosError } from 'axios'; import { useEffect } from 'react'; import { useMutation } from 'react-query'; -import { deleteComments } from '@/api/comments'; +import { deleteComments } from '@/api/comment/comments'; import { ErrorMessage } from '@/constants/ErrorMessage'; import useThrowCustomError from '@/hooks/common/useThrowCustomError'; import { queryClient } from '@/index'; diff --git a/frontend/src/hooks/comment/useGetDetailComment.tsx b/frontend/src/hooks/comment/useGetDetailComment.tsx index 33a491f6a..bbd786c5a 100644 --- a/frontend/src/hooks/comment/useGetDetailComment.tsx +++ b/frontend/src/hooks/comment/useGetDetailComment.tsx @@ -1,7 +1,7 @@ import { AxiosError } from 'axios'; import { useQuery } from 'react-query'; -import { getComments } from '@/api/comments'; +import { getComments } from '@/api/comment/comments'; import { ErrorMessage } from '@/constants/ErrorMessage'; import useThrowCustomError from '@/hooks/common/useThrowCustomError'; import { CommentType } from '@/types/commentResponse'; diff --git a/frontend/src/hooks/comment/usePostCommentInputModal.tsx b/frontend/src/hooks/comment/usePostCommentInputModal.tsx index 26b3d4aae..345dd26f5 100644 --- a/frontend/src/hooks/comment/usePostCommentInputModal.tsx +++ b/frontend/src/hooks/comment/usePostCommentInputModal.tsx @@ -2,7 +2,7 @@ import { AxiosError } from 'axios'; import { useEffect } from 'react'; import { useMutation } from 'react-query'; -import { postComments } from '@/api/comments'; +import { postComments } from '@/api/comment/comments'; import { ErrorMessage } from '@/constants/ErrorMessage'; import useSnackBar from '@/hooks/common/useSnackBar'; import useThrowCustomError from '@/hooks/common/useThrowCustomError'; diff --git a/frontend/src/hooks/comment/usePutCommentInputModal.tsx b/frontend/src/hooks/comment/usePutCommentInputModal.tsx index 49e3f4209..75e40a3a2 100644 --- a/frontend/src/hooks/comment/usePutCommentInputModal.tsx +++ b/frontend/src/hooks/comment/usePutCommentInputModal.tsx @@ -2,7 +2,7 @@ import { AxiosError } from 'axios'; import { useEffect } from 'react'; import { useMutation } from 'react-query'; -import { putComments } from '@/api/comments'; +import { putComments } from '@/api/comment/comments'; import { ErrorMessage } from '@/constants/ErrorMessage'; import useSnackBar from '@/hooks/common/useSnackBar'; import useThrowCustomError from '@/hooks/common/useThrowCustomError'; diff --git a/frontend/src/hooks/hashTag/useGetAllHashTags.tsx b/frontend/src/hooks/hashTag/useGetAllHashTags.tsx index a765e2247..57e7ec621 100644 --- a/frontend/src/hooks/hashTag/useGetAllHashTags.tsx +++ b/frontend/src/hooks/hashTag/useGetAllHashTags.tsx @@ -1,7 +1,7 @@ import { AxiosError } from 'axios'; import { useQuery } from 'react-query'; -import { getAllHashTag } from '@/api/hashTag'; +import { getAllHashTag } from '@/api/hashTag/hashTag'; import { ErrorMessage } from '@/constants/ErrorMessage'; import useThrowCustomError from '@/hooks/common/useThrowCustomError'; diff --git a/frontend/src/hooks/hashTag/useGetArticleByHashTag.tsx b/frontend/src/hooks/hashTag/useGetArticleByHashTag.tsx index 7631ed8d9..3245c0882 100644 --- a/frontend/src/hooks/hashTag/useGetArticleByHashTag.tsx +++ b/frontend/src/hooks/hashTag/useGetArticleByHashTag.tsx @@ -2,7 +2,7 @@ import { AxiosError } from 'axios'; import { useEffect } from 'react'; import { useInfiniteQuery } from 'react-query'; -import { getArticleByHashTag } from '@/api/search'; +import { getArticleByHashTag } from '@/api/search/search'; import { ErrorMessage } from '@/constants/ErrorMessage'; import useThrowCustomError from '@/hooks/common/useThrowCustomError'; import { InfiniteHashTagSearchResultType } from '@/types/searchResponse'; diff --git a/frontend/src/hooks/login/useDeleteRefreshToken.tsx b/frontend/src/hooks/login/useDeleteRefreshToken.tsx index a4d522745..335d175b9 100644 --- a/frontend/src/hooks/login/useDeleteRefreshToken.tsx +++ b/frontend/src/hooks/login/useDeleteRefreshToken.tsx @@ -1,7 +1,7 @@ import { AxiosError, AxiosResponse } from 'axios'; import { useMutation } from 'react-query'; -import { deleteRefreshToken } from '@/api/login'; +import { deleteRefreshToken } from '@/api/user/login'; import { ErrorMessage } from '@/constants/ErrorMessage'; import useThrowCustomError from '@/hooks/common/useThrowCustomError'; diff --git a/frontend/src/hooks/login/useGetLoginURL.tsx b/frontend/src/hooks/login/useGetLoginURL.tsx index 91344dbda..ab8e0e586 100644 --- a/frontend/src/hooks/login/useGetLoginURL.tsx +++ b/frontend/src/hooks/login/useGetLoginURL.tsx @@ -2,7 +2,7 @@ import { AxiosError } from 'axios'; import { useEffect, useState } from 'react'; import { useQuery } from 'react-query'; -import { getGithubURL } from '@/api/login'; +import { getGithubURL } from '@/api/user/login'; import { ErrorMessage } from '@/constants/ErrorMessage'; import useThrowCustomError from '@/hooks/common/useThrowCustomError'; diff --git a/frontend/src/hooks/search/useGetSearch.tsx b/frontend/src/hooks/search/useGetSearch.tsx index 003e302d4..eedfd0982 100644 --- a/frontend/src/hooks/search/useGetSearch.tsx +++ b/frontend/src/hooks/search/useGetSearch.tsx @@ -1,7 +1,7 @@ import { AxiosError } from 'axios'; import { useInfiniteQuery } from 'react-query'; -import { getSearchResult } from '@/api/search'; +import { getSearchResult } from '@/api/search/search'; import { ErrorMessage } from '@/constants/ErrorMessage'; import useThrowCustomError from '@/hooks/common/useThrowCustomError'; import { InfiniteSearchResultType } from '@/types/searchResponse'; diff --git a/frontend/src/hooks/tempArticle/useDeleteTempArticle.tsx b/frontend/src/hooks/tempArticle/useDeleteTempArticle.tsx index 9b1f741e2..2dd1b1f12 100644 --- a/frontend/src/hooks/tempArticle/useDeleteTempArticle.tsx +++ b/frontend/src/hooks/tempArticle/useDeleteTempArticle.tsx @@ -1,7 +1,7 @@ import { AxiosError } from 'axios'; import { useMutation } from 'react-query'; -import { deleteArticleItem } from '@/api/tempArticle'; +import { deleteArticleItem } from '@/api/tempArticle/tempArticle'; import CustomError from '@/components/@helper/errorBoundary/CustomError'; import { ErrorMessage } from '@/constants/ErrorMessage'; import useSnackBar from '@/hooks/common/useSnackBar'; diff --git a/frontend/src/hooks/tempArticle/useGetTempArticles.tsx b/frontend/src/hooks/tempArticle/useGetTempArticles.tsx index 5dda77c2a..e0f027073 100644 --- a/frontend/src/hooks/tempArticle/useGetTempArticles.tsx +++ b/frontend/src/hooks/tempArticle/useGetTempArticles.tsx @@ -1,7 +1,7 @@ import { AxiosError } from 'axios'; import { useQuery } from 'react-query'; -import { getTempArticles } from '@/api/tempArticle'; +import { getTempArticles } from '@/api/tempArticle/tempArticle'; import { ErrorMessage } from '@/constants/ErrorMessage'; import useThrowCustomError from '@/hooks/common/useThrowCustomError'; import { TempArticleResponse } from '@/types/articleResponse'; diff --git a/frontend/src/hooks/tempArticle/useGetTempDetailArticles.tsx b/frontend/src/hooks/tempArticle/useGetTempDetailArticles.tsx index 965a17ac0..4f9a1228d 100644 --- a/frontend/src/hooks/tempArticle/useGetTempDetailArticles.tsx +++ b/frontend/src/hooks/tempArticle/useGetTempDetailArticles.tsx @@ -1,7 +1,7 @@ import { AxiosError, AxiosResponse } from 'axios'; import { useMutation } from 'react-query'; -import { getTempDetailArticle } from '@/api/tempArticle'; +import { getTempDetailArticle } from '@/api/tempArticle/tempArticle'; import { ErrorMessage } from '@/constants/ErrorMessage'; import useThrowCustomError from '@/hooks/common/useThrowCustomError'; import { TempArticleDetailResponse } from '@/types/articleResponse'; diff --git a/frontend/src/hooks/tempArticle/usePostTempArticle.tsx b/frontend/src/hooks/tempArticle/usePostTempArticle.tsx index f232d07e8..45f6a5568 100644 --- a/frontend/src/hooks/tempArticle/usePostTempArticle.tsx +++ b/frontend/src/hooks/tempArticle/usePostTempArticle.tsx @@ -2,7 +2,7 @@ import { AxiosError, AxiosResponse } from 'axios'; import { Dispatch, SetStateAction } from 'react'; import { useMutation } from 'react-query'; -import { postTempArticle } from '@/api/tempArticle'; +import { postTempArticle } from '@/api/tempArticle/tempArticle'; import { ErrorMessage } from '@/constants/ErrorMessage'; import useSnackBar from '@/hooks/common/useSnackBar'; import useThrowCustomError from '@/hooks/common/useThrowCustomError'; diff --git a/frontend/src/hooks/user/useGetUserArticles.tsx b/frontend/src/hooks/user/useGetUserArticles.tsx index 5614d37bb..ebae17d5a 100644 --- a/frontend/src/hooks/user/useGetUserArticles.tsx +++ b/frontend/src/hooks/user/useGetUserArticles.tsx @@ -1,7 +1,7 @@ import { AxiosError } from 'axios'; import { useQuery } from 'react-query'; -import { getUserArticles } from '@/api/myPage'; +import { getUserArticles } from '@/api/user/myPage'; import { ErrorMessage } from '@/constants/ErrorMessage'; import useThrowCustomError from '@/hooks/common/useThrowCustomError'; import { UserArticlesResponse } from '@/types/articleResponse'; diff --git a/frontend/src/hooks/user/useGetUserComments.tsx b/frontend/src/hooks/user/useGetUserComments.tsx index d2fe19df2..70f578501 100644 --- a/frontend/src/hooks/user/useGetUserComments.tsx +++ b/frontend/src/hooks/user/useGetUserComments.tsx @@ -1,7 +1,7 @@ import { AxiosError } from 'axios'; import { useQuery } from 'react-query'; -import { getUserComments } from '@/api/myPage'; +import { getUserComments } from '@/api/user/myPage'; import { ErrorMessage } from '@/constants/ErrorMessage'; import useThrowCustomError from '@/hooks/common/useThrowCustomError'; import { UserCommentResponse } from '@/types/commentResponse'; diff --git a/frontend/src/hooks/user/useGetUserInfo.tsx b/frontend/src/hooks/user/useGetUserInfo.tsx index 36e9e0bc3..2753ee1c1 100644 --- a/frontend/src/hooks/user/useGetUserInfo.tsx +++ b/frontend/src/hooks/user/useGetUserInfo.tsx @@ -1,7 +1,7 @@ import { AxiosError } from 'axios'; import { useQuery } from 'react-query'; -import { getUserInfo } from '@/api/myPage'; +import { getUserInfo } from '@/api/user/myPage'; import { ErrorMessage } from '@/constants/ErrorMessage'; import useThrowCustomError from '@/hooks/common/useThrowCustomError'; import { Author } from '@/types/author'; diff --git a/frontend/src/hooks/user/usePutUserProfile.tsx b/frontend/src/hooks/user/usePutUserProfile.tsx index 5a57e3c62..9f2cef25f 100644 --- a/frontend/src/hooks/user/usePutUserProfile.tsx +++ b/frontend/src/hooks/user/usePutUserProfile.tsx @@ -1,7 +1,7 @@ import { AxiosError, AxiosResponse } from 'axios'; import { useMutation } from 'react-query'; -import { editUserInfo } from '@/api/myPage'; +import { editUserInfo } from '@/api/user/myPage'; import { ErrorMessage } from '@/constants/ErrorMessage'; import useThrowCustomError from '@/hooks/common/useThrowCustomError'; diff --git a/frontend/src/hooks/vote/useGetVote.tsx b/frontend/src/hooks/vote/useGetVote.tsx index 981afef9c..75d0aec2d 100644 --- a/frontend/src/hooks/vote/useGetVote.tsx +++ b/frontend/src/hooks/vote/useGetVote.tsx @@ -2,7 +2,7 @@ import { AxiosError } from 'axios'; import { useEffect, useState } from 'react'; import { useQuery } from 'react-query'; -import { getVoteItems, TVote } from '@/api/vote'; +import { getVoteItems, TVote } from '@/api/vote/vote'; import { ErrorMessage } from '@/constants/ErrorMessage'; import useThrowCustomError from '@/hooks/common/useThrowCustomError'; diff --git a/frontend/src/hooks/vote/usePostVoteItem.tsx b/frontend/src/hooks/vote/usePostVoteItem.tsx index bed8da84e..d31b77e89 100644 --- a/frontend/src/hooks/vote/usePostVoteItem.tsx +++ b/frontend/src/hooks/vote/usePostVoteItem.tsx @@ -2,7 +2,7 @@ import { AxiosError } from 'axios'; import { useEffect } from 'react'; import { useMutation } from 'react-query'; -import { checkVoteItems } from '@/api/vote'; +import { checkVoteItems } from '@/api/vote/vote'; import { ErrorMessage } from '@/constants/ErrorMessage'; import useThrowCustomError from '@/hooks/common/useThrowCustomError'; import { queryClient } from '@/index'; diff --git a/frontend/src/mock/vote.ts b/frontend/src/mock/vote.ts index c3f61243b..7a1396f80 100644 --- a/frontend/src/mock/vote.ts +++ b/frontend/src/mock/vote.ts @@ -1,6 +1,6 @@ import { rest } from 'msw'; -import { TVote } from '@/api/vote'; +import { TVote } from '@/api/vote/vote'; import { HOME_URL } from '@/constants/apiUrl'; export const VoteHandler = [ diff --git a/frontend/src/pages/VoteDeadlineGenerator/index.tsx b/frontend/src/pages/VoteDeadlineGenerator/index.tsx index f705a2782..06ee1789d 100644 --- a/frontend/src/pages/VoteDeadlineGenerator/index.tsx +++ b/frontend/src/pages/VoteDeadlineGenerator/index.tsx @@ -3,7 +3,7 @@ import React, { useEffect, useState } from 'react'; import { useMutation } from 'react-query'; import { useNavigate } from 'react-router-dom'; -import { registerVoteItems } from '@/api/vote'; +import { registerVoteItems } from '@/api/vote/vote'; import Loading from '@/components/@common/Loading/Loading'; import { ErrorMessage } from '@/constants/ErrorMessage'; import useLocationState from '@/hooks/common/useLocationState'; diff --git a/frontend/src/storybook/Vote/Vote.stories.tsx b/frontend/src/storybook/Vote/Vote.stories.tsx index 1bd72a0e0..4786f4570 100644 --- a/frontend/src/storybook/Vote/Vote.stories.tsx +++ b/frontend/src/storybook/Vote/Vote.stories.tsx @@ -1,4 +1,4 @@ -import { registerVoteItems } from '@/api/vote'; +import { registerVoteItems } from '@/api/vote/vote'; import Vote from '@/components/vote/Vote/Vote'; import { VoteHandler } from '@/mock/vote'; import { Meta, Story } from '@storybook/react'; diff --git a/frontend/src/utils/takeToastImgEditor.ts b/frontend/src/utils/takeToastImgEditor.ts index bf3f61592..b934ccec0 100644 --- a/frontend/src/utils/takeToastImgEditor.ts +++ b/frontend/src/utils/takeToastImgEditor.ts @@ -1,6 +1,6 @@ import { MutableRefObject } from 'react'; -import { postImageUrlConverter } from '@/api/image'; +import { postImageUrlConverter } from '@/api/article/image'; import { Editor } from '@toast-ui/react-editor'; export const takeToastImgEditor = (content: MutableRefObject) => { From 2ce778d1002d326bf16d93298e6fa11df390fbfa Mon Sep 17 00:00:00 2001 From: JASUN LEE Date: Thu, 20 Oct 2022 16:38:47 +0900 Subject: [PATCH 02/20] =?UTF-8?q?fix:=20=EC=9C=A0=EC=8B=A4=EB=90=9C=20impo?= =?UTF-8?q?rt=20=EB=AC=B8=20=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../hashTag/HashTagSearchBox/HashTagSearchBox.styles.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/frontend/src/components/hashTag/HashTagSearchBox/HashTagSearchBox.styles.tsx b/frontend/src/components/hashTag/HashTagSearchBox/HashTagSearchBox.styles.tsx index c37cc2c1b..22646aa2f 100644 --- a/frontend/src/components/hashTag/HashTagSearchBox/HashTagSearchBox.styles.tsx +++ b/frontend/src/components/hashTag/HashTagSearchBox/HashTagSearchBox.styles.tsx @@ -1,4 +1,4 @@ -import { AiOutlineSearch } from 'react-icons/ai'; +import { AiOutlineSearch, AiOutlineDown } from 'react-icons/ai'; import { css } from '@emotion/react'; import styled from '@emotion/styled'; @@ -119,7 +119,7 @@ export const OpenButton = styled(AiOutlineDown)` `} `; -export const CloseButton = styled(AiOutlineUp)` +export const CloseButton = styled(AiOutlineDown)` border: none; background-color: transparent; From ca036e2b7903434b105fc6d3ea97f8f5cd7dc0d7 Mon Sep 17 00:00:00 2001 From: JASUN LEE Date: Thu, 20 Oct 2022 16:39:03 +0900 Subject: [PATCH 03/20] =?UTF-8?q?refactor:=20axiosInstance=EB=A1=9C=20?= =?UTF-8?q?=EC=A4=91=EB=B3=B5=EB=90=98=EB=8A=94=20=EC=84=A0=EC=96=B8=20?= =?UTF-8?q?=EC=A0=9C=EA=B1=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- frontend/src/api/article/article.ts | 116 ++++++-------------- frontend/src/api/article/like.ts | 24 +--- frontend/src/api/comment/comments.ts | 55 ++-------- frontend/src/api/hashTag/hashTag.ts | 16 +-- frontend/src/api/search/search.ts | 49 ++------- frontend/src/api/tempArticle/tempArticle.ts | 48 ++------ frontend/src/api/user/myPage.ts | 54 +++------ frontend/src/api/vote/vote.ts | 43 ++------ frontend/src/utils/generateAxiosInstance.ts | 15 +++ 9 files changed, 114 insertions(+), 306 deletions(-) create mode 100644 frontend/src/utils/generateAxiosInstance.ts diff --git a/frontend/src/api/article/article.ts b/frontend/src/api/article/article.ts index 9e52b4d30..a8cf0c7ef 100644 --- a/frontend/src/api/article/article.ts +++ b/frontend/src/api/article/article.ts @@ -1,9 +1,6 @@ -import axios from 'axios'; - -import { ACCESSTOKEN_KEY } from '@/constants'; -import { HOME_URL } from '@/constants/apiUrl'; import { AllArticleResponse, ArticleType } from '@/types/articleResponse'; import { convertSort } from '@/utils/converter'; +import { generateAxiosInstanceWithAccessToken } from '@/utils/generateAxiosInstance'; export interface WritingArticles { title: string; @@ -12,13 +9,8 @@ export interface WritingArticles { } export const postWritingArticle = (article: WritingArticles) => { - const accessToken = localStorage.getItem(ACCESSTOKEN_KEY); - return axios.post(`${HOME_URL}/api/articles`, article, { - headers: { - 'Access-Control-Allow-Origin': '*', - Authorization: `Bearer ${accessToken}`, - }, - }); + const axiosInstance = generateAxiosInstanceWithAccessToken(); + return axiosInstance.post('/api/articles', article); }; export interface PopularArticles { @@ -27,28 +19,17 @@ export interface PopularArticles { } export const getPopularArticles = async () => { - const accessToken = localStorage.getItem(ACCESSTOKEN_KEY); - - const result = await axios.get( - `${HOME_URL}/api/articles?category=all&sort=views&size=10`, - { - headers: { - 'Access-Control-Allow-Origin': '*', - Authorization: `Bearer ${accessToken}`, - }, - }, + const axiosInstance = generateAxiosInstanceWithAccessToken(); + const { data } = await axiosInstance.get( + '/api/articles?category=all&sort=views&size=10', ); - return result.data; + return data; }; export const getDetailArticle = async (id: string) => { - const accessToken = localStorage.getItem(ACCESSTOKEN_KEY); - const { data } = await axios.get(`${HOME_URL}/api/articles/${id}`, { - headers: { - 'Access-Control-Allow-Origin': '*', - Authorization: `Bearer ${accessToken}`, - }, - }); + const axiosInstance = generateAxiosInstanceWithAccessToken(); + const { data } = await axiosInstance.get(`/api/articles/${id}`); + return data; }; @@ -65,10 +46,8 @@ export const getAllArticle = async ({ cursorViews: string; cursorLikes: string; }) => { - const accessToken = localStorage.getItem(ACCESSTOKEN_KEY); - if (sort === '추천순') { - const data = await getAllArticlesByLikes({ category, cursorId, cursorLikes, accessToken }); + const data = await getAllArticlesByLikes({ category, cursorId, cursorLikes }); return data; } @@ -77,7 +56,6 @@ export const getAllArticle = async ({ sort, cursorId, cursorViews, - accessToken, }); return data; }; @@ -87,26 +65,17 @@ export const getAllArticleByViewsOrLatest = async ({ sort, cursorId, cursorViews, - accessToken, }: { category: string; sort: '추천순' | '조회순' | '최신순'; cursorId: string; cursorViews: string; - accessToken: string | null; }) => { const currentSort = convertSort(sort); - - const { data } = await axios.get( - `${HOME_URL}/api/articles?category=${category}&sort=${currentSort}&cursorId=${cursorId}&cursorViews=${cursorViews}&size=6`, - { - headers: { - 'Access-Control-Allow-Origin': '*', - Authorization: `Bearer ${accessToken}`, - }, - }, + const axiosInstance = generateAxiosInstanceWithAccessToken(); + const { data } = await axiosInstance.get( + `/api/articles?category=${category}&sort=${currentSort}&cursorId=${cursorId}&cursorViews=${cursorViews}&size=6`, ); - return { articles: data.articles, hasNext: data.hasNext, @@ -129,21 +98,15 @@ export const getAllArticlesByLikes = async ({ category, cursorId, cursorLikes = '', - accessToken, }: { category: string; cursorId: string; cursorLikes: string; - accessToken: string | null; }) => { - const { data } = await axios.get( - `${HOME_URL}/api/articles/likes?category=${category}&cursorId=${cursorId}&cursorLikes=${cursorLikes}&size=6`, - { - headers: { - 'Access-Control-Allow-Origin': '*', - Authorization: `Bearer ${accessToken}`, - }, - }, + const axiosInstance = generateAxiosInstanceWithAccessToken(); + + const { data } = await axiosInstance.get( + `/api/articles/likes?category=${category}&cursorId=${cursorId}&cursorLikes=${cursorLikes}&size=6`, ); return { @@ -165,18 +128,11 @@ export const getAllArticlesByLikes = async ({ }; export const postArticle = (article: { id: string; title: string; content: string }) => { - const accessToken = localStorage.getItem(ACCESSTOKEN_KEY); - - return axios.post<{ id: number; category: string }>( - `${HOME_URL}/api/articles/${article.id}`, - { title: article.title, content: article.content }, - { - headers: { - 'Access-Control-Allow-Origin': '*', - Authorization: `Bearer ${accessToken}`, - }, - }, - ); + const axiosInstance = generateAxiosInstanceWithAccessToken(); + return axiosInstance.post<{ id: number; category: string }>(`/api/articles/${article.id}`, { + title: article.title, + content: article.content, + }); }; export const putArticle = (article: { @@ -185,25 +141,15 @@ export const putArticle = (article: { content: string; tag: string[]; }) => { - const accessToken = localStorage.getItem(ACCESSTOKEN_KEY); - return axios.put<{ id: number; category: string }>( - `${HOME_URL}/api/articles/${article.id}`, - { title: article.title, content: article.content, tag: article.tag }, - { - headers: { - 'Access-Control-Allow-Origin': '*', - Authorization: `Bearer ${accessToken}`, - }, - }, - ); + const axiosInstance = generateAxiosInstanceWithAccessToken(); + return axiosInstance.put<{ id: number; category: string }>(`/api/articles/${article.id}`, { + title: article.title, + content: article.content, + tag: article.tag, + }); }; export const deleteArticle = (id: string) => { - const accessToken = localStorage.getItem(ACCESSTOKEN_KEY); - return axios.delete(`${HOME_URL}/api/articles/${id}`, { - headers: { - 'Access-Control-Allow-Origin': '*', - Authorization: `Bearer ${accessToken}`, - }, - }); + const axiosInstance = generateAxiosInstanceWithAccessToken(); + return axiosInstance.delete(`/api/articles/${id}`); }; diff --git a/frontend/src/api/article/like.ts b/frontend/src/api/article/like.ts index 5ff9731ae..1a1e025e6 100644 --- a/frontend/src/api/article/like.ts +++ b/frontend/src/api/article/like.ts @@ -1,24 +1,12 @@ -import axios from 'axios'; - -import { ACCESSTOKEN_KEY } from '@/constants'; -import { HOME_URL } from '@/constants/apiUrl'; +import { generateAxiosInstanceWithAccessToken } from '@/utils/generateAxiosInstance'; export const postAddLikeArticle = (articleId: string) => { - const accessToken = localStorage.getItem(ACCESSTOKEN_KEY); - return axios.post(`${HOME_URL}/api/articles/${articleId}/like`, null, { - headers: { - 'Access-Control-Allow-Origin': '*', - Authorization: `Bearer ${accessToken}`, - }, - }); + const axiosInstance = generateAxiosInstanceWithAccessToken(); + return axiosInstance.post(`/api/articles/${articleId}/like`, null); }; export const deleteLikeArticle = (articleId: string) => { - const accessToken = localStorage.getItem(ACCESSTOKEN_KEY); - return axios.delete(`${HOME_URL}/api/articles/${articleId}/like`, { - headers: { - 'Access-Control-Allow-Origin': '*', - Authorization: `Bearer ${accessToken}`, - }, - }); + const axiosInstance = generateAxiosInstanceWithAccessToken(); + + return axiosInstance.delete(`/api/articles/${articleId}/like`); }; diff --git a/frontend/src/api/comment/comments.ts b/frontend/src/api/comment/comments.ts index 1c280b401..f85d3b290 100644 --- a/frontend/src/api/comment/comments.ts +++ b/frontend/src/api/comment/comments.ts @@ -1,8 +1,5 @@ -import axios from 'axios'; - -import { ACCESSTOKEN_KEY } from '@/constants'; -import { HOME_URL } from '@/constants/apiUrl'; import { CommentType } from '@/types/commentResponse'; +import { generateAxiosInstanceWithAccessToken } from '@/utils/generateAxiosInstance'; export const postComments = ({ content, @@ -13,56 +10,26 @@ export const postComments = ({ id: string; isAnonymous: boolean; }) => { - const accessToken = localStorage.getItem(ACCESSTOKEN_KEY); - return axios.post( - `${HOME_URL}/api/articles/${id}/comments`, - { content, isAnonymous }, - { - headers: { - 'Access-Control-Allow-Origin': '*', - Authorization: `Bearer ${accessToken}`, - }, - }, - ); + const axiosInstance = generateAxiosInstanceWithAccessToken(); + + return axiosInstance.post(`/api/articles/${id}/comments`, { content, isAnonymous }); }; export const getComments = async (id: string) => { - const accessToken = localStorage.getItem(ACCESSTOKEN_KEY); + const axiosInstance = generateAxiosInstanceWithAccessToken(); - const { data } = await axios.get<{ comments: CommentType[] }>( - `${HOME_URL}/api/articles/${id}/comments`, - { - headers: { - 'Access-Control-Allow-Origin': '*', - Authorization: `Bearer ${accessToken}`, - }, - }, + const { data } = await axiosInstance.get<{ comments: CommentType[] }>( + `/api/articles/${id}/comments`, ); return data; }; export const putComments = ({ content, commentId }: { content: string; commentId: string }) => { - const accessToken = localStorage.getItem(ACCESSTOKEN_KEY); - - return axios.put( - `${HOME_URL}/api/articles/comments/${commentId}`, - { content }, - { - headers: { - 'Access-Control-Allow-Origin': '*', - Authorization: `Bearer ${accessToken}`, - }, - }, - ); + const axiosInstance = generateAxiosInstanceWithAccessToken(); + return axiosInstance.put(`/api/articles/comments/${commentId}`, { content }); }; export const deleteComments = ({ commentId }: { commentId: string }) => { - const accessToken = localStorage.getItem(ACCESSTOKEN_KEY); - - return axios.delete(`${HOME_URL}/api/articles/comments/${commentId}`, { - headers: { - 'Access-Control-Allow-Origin': '*', - Authorization: `Bearer ${accessToken}`, - }, - }); + const axiosInstance = generateAxiosInstanceWithAccessToken(); + return axiosInstance.delete(`/api/articles/comments/${commentId}`); }; diff --git a/frontend/src/api/hashTag/hashTag.ts b/frontend/src/api/hashTag/hashTag.ts index 633d28f0f..39fbc018f 100644 --- a/frontend/src/api/hashTag/hashTag.ts +++ b/frontend/src/api/hashTag/hashTag.ts @@ -1,15 +1,7 @@ -import axios from 'axios'; - -import { ACCESSTOKEN_KEY } from '@/constants'; -import { HOME_URL } from '@/constants/apiUrl'; +import { generateAxiosInstanceWithAccessToken } from '@/utils/generateAxiosInstance'; export const getAllHashTag = async () => { - const accessToken = localStorage.getItem(ACCESSTOKEN_KEY); - const data = await axios.get<{ tag: string[] }>(`${HOME_URL}/api/tags`, { - headers: { - 'Access-Control-Allow-Origin': '*', - Authorization: `Bearer ${accessToken}`, - }, - }); - return data.data; + const axiosInstance = generateAxiosInstanceWithAccessToken(); + const { data } = await axiosInstance.get<{ tag: string[] }>('/api/tags'); + return data; }; diff --git a/frontend/src/api/search/search.ts b/frontend/src/api/search/search.ts index ed22c534f..b54d2b917 100644 --- a/frontend/src/api/search/search.ts +++ b/frontend/src/api/search/search.ts @@ -1,29 +1,19 @@ -import axios from 'axios'; - -import { ACCESSTOKEN_KEY } from '@/constants'; -import { HOME_URL } from '@/constants/apiUrl'; import { SearchResultType } from '@/types/searchResponse'; +import { generateAxiosInstanceWithAccessToken } from '@/utils/generateAxiosInstance'; export const getUserSearchResult = async ({ - accessToken, target, cursorId, searchIndex, }: { - accessToken: string | null; target: string; cursorId: string; searchIndex: string; }) => { const encodedTarget = encodeURIComponent(target); - const { data } = await axios.get( - `${HOME_URL}/api/articles/search/author?author=${encodedTarget}&cursorId=${cursorId}&size=6`, - { - headers: { - 'Access-Control-Allow-Origin': '*', - Authorization: `Bearer ${accessToken}`, - }, - }, + const axiosInstance = generateAxiosInstanceWithAccessToken(); + const { data } = await axiosInstance.get( + `/api/articles/search/author?author=${encodedTarget}&cursorId=${cursorId}&size=6`, ); return { articles: data.articles, @@ -38,25 +28,18 @@ export const getUserSearchResult = async ({ }; export const getArticleSearchResult = async ({ - accessToken, target, cursorId, searchIndex, }: { - accessToken: string | null; target: string; cursorId: string; searchIndex: string; }) => { const encodedTarget = encodeURIComponent(target); - const { data } = await axios.get( - `${HOME_URL}/api/articles/search/text?text=${encodedTarget}&cursorId=${cursorId}&size=6`, - { - headers: { - 'Access-Control-Allow-Origin': '*', - Authorization: `Bearer ${accessToken}`, - }, - }, + const axiosInstance = generateAxiosInstanceWithAccessToken(); + const { data } = await axiosInstance.get( + `/api/articles/search/text?text=${encodedTarget}&cursorId=${cursorId}&size=6`, ); return { @@ -78,16 +61,10 @@ export const getArticleByHashTag = async ({ hashTags: string; cursorId: string; }) => { - const accessToken = localStorage.getItem(ACCESSTOKEN_KEY); const encodedTarget = encodeURIComponent(hashTags); - const { data } = await axios.get( - `${HOME_URL}/api/articles/search/tags?tagsText=${encodedTarget}&cursorId=${cursorId}&size=6`, - { - headers: { - 'Access-Control-Allow-Origin': '*', - Authorization: `Bearer ${accessToken}`, - }, - }, + const axiosInstance = generateAxiosInstanceWithAccessToken(); + const { data } = await axiosInstance.get( + `/api/articles/search/tags?tagsText=${encodedTarget}&cursorId=${cursorId}&size=6`, ); return { articles: data.articles, @@ -109,13 +86,11 @@ export const getSearchResult = async ({ searchIndex: string; cursorId: string; }) => { - const accessToken = localStorage.getItem(ACCESSTOKEN_KEY); - if (searchIndex === '유저') { - const data = await getUserSearchResult({ accessToken, target, searchIndex, cursorId }); + const data = await getUserSearchResult({ target, searchIndex, cursorId }); return data; } - const data = await getArticleSearchResult({ accessToken, target, searchIndex, cursorId }); + const data = await getArticleSearchResult({ target, searchIndex, cursorId }); return data; }; diff --git a/frontend/src/api/tempArticle/tempArticle.ts b/frontend/src/api/tempArticle/tempArticle.ts index 5e4c5eb36..01e0ed67f 100644 --- a/frontend/src/api/tempArticle/tempArticle.ts +++ b/frontend/src/api/tempArticle/tempArticle.ts @@ -1,52 +1,24 @@ -import axios from 'axios'; - -import { ACCESSTOKEN_KEY } from '@/constants'; -import { HOME_URL } from '@/constants/apiUrl'; import { postTempArticleProps } from '@/hooks/tempArticle/usePostTempArticle'; import { TempArticleDetailResponse, TempArticleResponse } from '@/types/articleResponse'; +import { generateAxiosInstanceWithAccessToken } from '@/utils/generateAxiosInstance'; export const getTempArticles = async () => { - const accessToken = localStorage.getItem(ACCESSTOKEN_KEY); - const result = await axios.get(`${HOME_URL}/api/temp-articles`, { - headers: { - 'Access-Control-Allow-Origin': '*', - Authorization: `Bearer ${accessToken}`, - }, - }); - return result.data; + const axiosInstance = generateAxiosInstanceWithAccessToken(); + const { data } = await axiosInstance.get(`/api/temp-articles`); + return data; }; export const getTempDetailArticle = ({ id }: { id: number | '' }) => { - const accessToken = localStorage.getItem(ACCESSTOKEN_KEY); - return axios.get(`${HOME_URL}/api/temp-articles/${id}`, { - headers: { - 'Access-Control-Allow-Origin': '*', - Authorization: `Bearer ${accessToken}`, - }, - }); + const axiosInstance = generateAxiosInstanceWithAccessToken(); + return axiosInstance.get(`/api/temp-articles/${id}`); }; export const postTempArticle = ({ ...props }: postTempArticleProps) => { - const accessToken = localStorage.getItem(ACCESSTOKEN_KEY); - - return axios.post<{ id: number }>( - `${HOME_URL}/api/temp-articles`, - { ...props }, - { - headers: { - 'Access-Control-Allow-Origin': '*', - Authorization: `Bearer ${accessToken}`, - }, - }, - ); + const axiosInstance = generateAxiosInstanceWithAccessToken(); + return axiosInstance.post<{ id: number }>('/api/temp-articles', { ...props }); }; export const deleteArticleItem = ({ tempArticleId }: { tempArticleId: number }) => { - const accessToken = localStorage.getItem(ACCESSTOKEN_KEY); - return axios.delete(`${HOME_URL}/api/temp-articles/${tempArticleId}`, { - headers: { - 'Access-Control-Allow-Origin': '*', - Authorization: `Bearer ${accessToken}`, - }, - }); + const axiosInstance = generateAxiosInstanceWithAccessToken(); + return axiosInstance.delete(`/api/temp-articles/${tempArticleId}`); }; diff --git a/frontend/src/api/user/myPage.ts b/frontend/src/api/user/myPage.ts index 8fd2a2288..d83e6ad78 100644 --- a/frontend/src/api/user/myPage.ts +++ b/frontend/src/api/user/myPage.ts @@ -1,55 +1,31 @@ -import axios, { AxiosResponse } from 'axios'; +import { AxiosResponse } from 'axios'; -import { ACCESSTOKEN_KEY } from '@/constants'; -import { HOME_URL } from '@/constants/apiUrl'; import { UserArticlesResponse } from '@/types/articleResponse'; import { Author } from '@/types/author'; import { UserCommentResponse } from '@/types/commentResponse'; +import { generateAxiosInstanceWithAccessToken } from '@/utils/generateAxiosInstance'; export const getUserInfo = async () => { - const accessToken = localStorage.getItem(ACCESSTOKEN_KEY); - const result = await axios.get(`${HOME_URL}/api/members/me`, { - headers: { - 'Access-Control-Allow-Origin': '*', - Authorization: `Bearer ${accessToken}`, - }, - }); - return result.data; + const axiosInstance = generateAxiosInstanceWithAccessToken(); + const { data } = await axiosInstance.get('/api/members/me'); + return data; }; export const getUserArticles = async () => { - const accessToken = localStorage.getItem(ACCESSTOKEN_KEY); - const result = await axios.get(`${HOME_URL}/api/members/me/articles`, { - headers: { - 'Access-Control-Allow-Origin': '*', - Authorization: `Bearer ${accessToken}`, - }, - }); - return result.data; + const axiosInstance = generateAxiosInstanceWithAccessToken(); + const { data } = await axiosInstance.get('/api/members/me/articles'); + return data; }; export const getUserComments = async () => { - const accessToken = localStorage.getItem(ACCESSTOKEN_KEY); - const result = await axios.get(`${HOME_URL}/api/members/me/comments`, { - headers: { - 'Access-Control-Allow-Origin': '*', - Authorization: `Bearer ${accessToken}`, - }, - }); - return result.data; + const axiosInstance = generateAxiosInstanceWithAccessToken(); + const { data } = await axiosInstance.get('/api/members/me/comments'); + return data; }; export const editUserInfo = ({ name }: { name: string }) => { - const accessToken = localStorage.getItem(ACCESSTOKEN_KEY); - - return axios.patch<{ name: string }, AxiosResponse<{ name: string }>>( - `${HOME_URL}/api/members/me`, - { name }, - { - headers: { - 'Access-Control-Allow-Origin': '*', - Authorization: `Bearer ${accessToken}`, - }, - }, - ); + const axiosInstance = generateAxiosInstanceWithAccessToken(); + return axiosInstance.patch<{ name: string }, AxiosResponse<{ name: string }>>('/api/members/me', { + name, + }); }; diff --git a/frontend/src/api/vote/vote.ts b/frontend/src/api/vote/vote.ts index 004940d54..b094428db 100644 --- a/frontend/src/api/vote/vote.ts +++ b/frontend/src/api/vote/vote.ts @@ -1,7 +1,4 @@ -import axios from 'axios'; - -import { ACCESSTOKEN_KEY } from '@/constants'; -import { HOME_URL } from '@/constants/apiUrl'; +import { generateAxiosInstanceWithAccessToken } from '@/utils/generateAxiosInstance'; export interface VoteItems { id: number; @@ -17,14 +14,9 @@ export interface TVote { } export const getVoteItems = async (articleId: string) => { - const accessToken = localStorage.getItem(ACCESSTOKEN_KEY); + const axiosInstance = generateAxiosInstanceWithAccessToken(); - const { data } = await axios.get(`${HOME_URL}/api/articles/${articleId}/votes`, { - headers: { - 'Access-Control-Allow-Origin': '*', - Authorization: `Bearer ${accessToken}`, - }, - }); + const { data } = await axiosInstance.get(`/api/articles/${articleId}/votes`); return data; }; @@ -38,18 +30,12 @@ export const registerVoteItems = ({ items: string[]; expiryDate: string; }) => { - const accessToken = localStorage.getItem(ACCESSTOKEN_KEY); + const axiosInstance = generateAxiosInstanceWithAccessToken(); - return axios.post<{ articleId: string }>( - `${HOME_URL}/api/articles/${articleId}/votes`, - { items, expiryDate }, - { - headers: { - 'Access-Control-Allow-Origin': '*', - Authorization: `Bearer ${accessToken}`, - }, - }, - ); + return axiosInstance.post<{ articleId: string }>(`/api/articles/${articleId}/votes`, { + items, + expiryDate, + }); }; export const checkVoteItems = ({ @@ -59,16 +45,7 @@ export const checkVoteItems = ({ articleId: string; votedItemId: string; }) => { - const accessToken = localStorage.getItem(ACCESSTOKEN_KEY); + const axiosInstance = generateAxiosInstanceWithAccessToken(); - return axios.post( - `${HOME_URL}/api/articles/${articleId}/votes/do`, - { votedItemId }, - { - headers: { - 'Access-Control-Allow-Origin': '*', - Authorization: `Bearer ${accessToken}`, - }, - }, - ); + return axiosInstance.post(`/api/articles/${articleId}/votes/do`, { votedItemId }); }; diff --git a/frontend/src/utils/generateAxiosInstance.ts b/frontend/src/utils/generateAxiosInstance.ts new file mode 100644 index 000000000..95dc5a4ed --- /dev/null +++ b/frontend/src/utils/generateAxiosInstance.ts @@ -0,0 +1,15 @@ +import axios from 'axios'; + +import { ACCESSTOKEN_KEY } from '@/constants'; +import { HOME_URL } from '@/constants/apiUrl'; + +export const generateAxiosInstanceWithAccessToken = () => { + const accessToken = localStorage.getItem(ACCESSTOKEN_KEY); + return axios.create({ + baseURL: HOME_URL, + headers: { + 'Access-Control-Allow-Origin': '*', + Authorization: `Bearer ${accessToken}`, + }, + }); +}; From b3621dde8da88f3bfa1cc8ee36197da5247739f0 Mon Sep 17 00:00:00 2001 From: JASUN LEE Date: Thu, 20 Oct 2022 17:20:04 +0900 Subject: [PATCH 04/20] =?UTF-8?q?feat:=20Article=EC=9D=98=20=EC=9D=91?= =?UTF-8?q?=EB=8B=B5=EA=B0=92=EC=97=90=20=EB=8C=80=ED=95=9C=20=ED=83=80?= =?UTF-8?q?=EC=9E=85=20=EC=A0=95=EC=9D=98?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- frontend/src/api/article/articleType.ts | 39 +++++++++++++++++++++++++ 1 file changed, 39 insertions(+) create mode 100644 frontend/src/api/article/articleType.ts diff --git a/frontend/src/api/article/articleType.ts b/frontend/src/api/article/articleType.ts new file mode 100644 index 000000000..72cf69c3d --- /dev/null +++ b/frontend/src/api/article/articleType.ts @@ -0,0 +1,39 @@ +export interface ArticleTotalResponseType extends AuthorResponseType { + id: number; + title: string; + tag: string[]; + content: string; + category: 'question' | 'discussion'; + createAt: string; + updatedAt: string; + + views: number; + likeCount: number; + commentCount: number; + + isAuthor: boolean; + hasVote: boolean; + isLike: boolean; +} + +export interface AuthorResponseType { + author: { + name: string; + avatarUrl: string; + }; +} + +export type DetailArticleResponseType = Omit< + ArticleTotalResponseType, + 'id' | 'category' | 'commentCount' +>; + +export type SingleArticleItemResponseType = Omit< + ArticleTotalResponseType, + 'updatedAt' | 'hasVote' | 'isAuthor' +>; + +export interface TotalArticleInquiredResponseType { + articles: SingleArticleItemResponseType[]; + hasNext: boolean; +} From 75cfbd3fe14f3d371b360c933ab71c97ea93b8b9 Mon Sep 17 00:00:00 2001 From: JASUN LEE Date: Thu, 20 Oct 2022 18:29:53 +0900 Subject: [PATCH 05/20] =?UTF-8?q?fix:=20api=EC=97=90=20=EC=83=88=EB=A1=9C?= =?UTF-8?q?=20=EC=A0=95=EB=A6=AC=ED=95=9C=20=ED=83=80=EC=9E=85=20=EC=A0=81?= =?UTF-8?q?=EC=9A=A9?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- frontend/src/api/article/article.ts | 18 ++++----- frontend/src/api/article/articleType.ts | 50 ++++++++++++++++++------- 2 files changed, 44 insertions(+), 24 deletions(-) diff --git a/frontend/src/api/article/article.ts b/frontend/src/api/article/article.ts index a8cf0c7ef..b5cc5c9ff 100644 --- a/frontend/src/api/article/article.ts +++ b/frontend/src/api/article/article.ts @@ -1,4 +1,7 @@ -import { AllArticleResponse, ArticleType } from '@/types/articleResponse'; +import { + DetailArticleResponseType, + TotalArticleInquiredResponseType, +} from '@/api/article/articleType'; import { convertSort } from '@/utils/converter'; import { generateAxiosInstanceWithAccessToken } from '@/utils/generateAxiosInstance'; @@ -13,14 +16,9 @@ export const postWritingArticle = (article: WritingArticles) => { return axiosInstance.post('/api/articles', article); }; -export interface PopularArticles { - articles: ArticleType[]; - hastNext: boolean; -} - export const getPopularArticles = async () => { const axiosInstance = generateAxiosInstanceWithAccessToken(); - const { data } = await axiosInstance.get( + const { data } = await axiosInstance.get( '/api/articles?category=all&sort=views&size=10', ); return data; @@ -28,7 +26,7 @@ export const getPopularArticles = async () => { export const getDetailArticle = async (id: string) => { const axiosInstance = generateAxiosInstanceWithAccessToken(); - const { data } = await axiosInstance.get(`/api/articles/${id}`); + const { data } = await axiosInstance.get(`/api/articles/${id}`); return data; }; @@ -73,7 +71,7 @@ export const getAllArticleByViewsOrLatest = async ({ }) => { const currentSort = convertSort(sort); const axiosInstance = generateAxiosInstanceWithAccessToken(); - const { data } = await axiosInstance.get( + const { data } = await axiosInstance.get( `/api/articles?category=${category}&sort=${currentSort}&cursorId=${cursorId}&cursorViews=${cursorViews}&size=6`, ); return { @@ -105,7 +103,7 @@ export const getAllArticlesByLikes = async ({ }) => { const axiosInstance = generateAxiosInstanceWithAccessToken(); - const { data } = await axiosInstance.get( + const { data } = await axiosInstance.get( `/api/articles/likes?category=${category}&cursorId=${cursorId}&cursorLikes=${cursorLikes}&size=6`, ); diff --git a/frontend/src/api/article/articleType.ts b/frontend/src/api/article/articleType.ts index 72cf69c3d..befb5802e 100644 --- a/frontend/src/api/article/articleType.ts +++ b/frontend/src/api/article/articleType.ts @@ -1,9 +1,18 @@ -export interface ArticleTotalResponseType extends AuthorResponseType { +export interface AuthorType { + author: { + name: string; + avatarUrl: string; + }; +} + +export type CategoryType = 'question' | 'discussion'; + +export interface ArticleTotalType extends AuthorType { id: number; title: string; tag: string[]; content: string; - category: 'question' | 'discussion'; + category: CategoryType; createAt: string; updatedAt: string; @@ -16,20 +25,10 @@ export interface ArticleTotalResponseType extends AuthorResponseType { isLike: boolean; } -export interface AuthorResponseType { - author: { - name: string; - avatarUrl: string; - }; -} - -export type DetailArticleResponseType = Omit< - ArticleTotalResponseType, - 'id' | 'category' | 'commentCount' ->; +export type DetailArticleResponseType = Omit; export type SingleArticleItemResponseType = Omit< - ArticleTotalResponseType, + ArticleTotalType, 'updatedAt' | 'hasVote' | 'isAuthor' >; @@ -37,3 +36,26 @@ export interface TotalArticleInquiredResponseType { articles: SingleArticleItemResponseType[]; hasNext: boolean; } + +export type SingleTempArticleItemResponseType = Pick< + ArticleTotalType, + 'id' | 'title' | 'createAt' | 'category' +>; + +export interface TotalTempArticleResponseType { + values: SingleTempArticleItemResponseType[]; +} + +export type CreateArticleResponseType = Pick; +export type UpdateArticleResponseType = Pick; + +export interface ArticleTotalRequestType { + title: string; + content: string; + category: CategoryType; + tag: string[]; + isAnonymous: boolean; + tempArticleId: number; +} + +export type UpdateArticleRequestType = Pick; From cbaeaf54831fbf2ce5269d95d28a62dc7fbe6cf1 Mon Sep 17 00:00:00 2001 From: JASUN LEE Date: Mon, 24 Oct 2022 15:08:48 +0900 Subject: [PATCH 06/20] =?UTF-8?q?refactor:=20article=EA=B4=80=EB=A0=A8=20?= =?UTF-8?q?=ED=83=80=EC=9E=85=20=EC=9E=AC=EC=A0=95=EB=A6=BD=20=EB=B0=8F=20?= =?UTF-8?q?=EB=B0=98=EC=98=81=20=EC=A7=84=ED=96=89?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- frontend/src/api/article/article.ts | 4 ++-- frontend/src/api/article/articleType.ts | 16 ++++++++++++++-- .../src/hooks/article/useGetAllArticles.tsx | 4 ++-- .../hooks/article/useGetCategoryArticles.tsx | 4 ++-- .../src/hooks/article/useGetDetailArticle.tsx | 4 ++-- .../hooks/article/useGetPopularArticles.tsx | 5 +++-- .../article/usePostUpdateWritingArticle.tsx | 3 ++- .../hooks/article/usePostWritingArticles.tsx | 18 ++++++++---------- .../hooks/common/useToastImageConverter.tsx | 2 +- 9 files changed, 36 insertions(+), 24 deletions(-) diff --git a/frontend/src/api/article/article.ts b/frontend/src/api/article/article.ts index b5cc5c9ff..a1dc10ca3 100644 --- a/frontend/src/api/article/article.ts +++ b/frontend/src/api/article/article.ts @@ -5,13 +5,13 @@ import { import { convertSort } from '@/utils/converter'; import { generateAxiosInstanceWithAccessToken } from '@/utils/generateAxiosInstance'; -export interface WritingArticles { +export interface WritingArticlesProp { title: string; content: string; category: string; } -export const postWritingArticle = (article: WritingArticles) => { +export const postWritingArticle = (article: WritingArticlesProp) => { const axiosInstance = generateAxiosInstanceWithAccessToken(); return axiosInstance.post('/api/articles', article); }; diff --git a/frontend/src/api/article/articleType.ts b/frontend/src/api/article/articleType.ts index befb5802e..e4620cfbb 100644 --- a/frontend/src/api/article/articleType.ts +++ b/frontend/src/api/article/articleType.ts @@ -37,6 +37,12 @@ export interface TotalArticleInquiredResponseType { hasNext: boolean; } +export interface InfiniteArticleResponse extends TotalArticleInquiredResponseType { + cursorId: string; + cursorViews?: string; + cursorLikes?: string; +} + export type SingleTempArticleItemResponseType = Pick< ArticleTotalType, 'id' | 'title' | 'createAt' | 'category' @@ -55,7 +61,13 @@ export interface ArticleTotalRequestType { category: CategoryType; tag: string[]; isAnonymous: boolean; - tempArticleId: number; + tempArticleId: number | ''; + id: string; } -export type UpdateArticleRequestType = Pick; +export type UpdateArticleRequestType = Pick< + ArticleTotalRequestType, + 'title' | 'content' | 'tag' | 'id' +>; + +export type CreateArticleRequestType = Omit; diff --git a/frontend/src/hooks/article/useGetAllArticles.tsx b/frontend/src/hooks/article/useGetAllArticles.tsx index 154302c3c..ff77182c2 100644 --- a/frontend/src/hooks/article/useGetAllArticles.tsx +++ b/frontend/src/hooks/article/useGetAllArticles.tsx @@ -4,17 +4,17 @@ import { useInfiniteQuery } from 'react-query'; import { useRecoilState } from 'recoil'; import { getAllArticle } from '@/api/article/article'; +import { InfiniteArticleResponse } from '@/api/article/articleType'; import { ErrorMessage } from '@/constants/ErrorMessage'; import useThrowCustomError from '@/hooks/common/useThrowCustomError'; import { categoryState } from '@/store/categoryState'; -import { infiniteArticleResponse } from '@/types/articleResponse'; const useGetAllArticles = () => { const [currentCategory, setCurrentCategory] = useRecoilState(categoryState); const [sortIndex, setSortIndex] = useState('최신순'); const { data, isLoading, isError, isSuccess, error, refetch, fetchNextPage } = useInfiniteQuery< - infiniteArticleResponse, + InfiniteArticleResponse, AxiosError<{ errorCode: keyof typeof ErrorMessage; message: string }> >( ['all-articles', currentCategory], diff --git a/frontend/src/hooks/article/useGetCategoryArticles.tsx b/frontend/src/hooks/article/useGetCategoryArticles.tsx index 5fddd5c98..f1e7c2ae9 100644 --- a/frontend/src/hooks/article/useGetCategoryArticles.tsx +++ b/frontend/src/hooks/article/useGetCategoryArticles.tsx @@ -3,15 +3,15 @@ import { useEffect, useState } from 'react'; import { useInfiniteQuery } from 'react-query'; import { getAllArticle } from '@/api/article/article'; +import { InfiniteArticleResponse } from '@/api/article/articleType'; import { ErrorMessage } from '@/constants/ErrorMessage'; import useThrowCustomError from '@/hooks/common/useThrowCustomError'; -import { infiniteArticleResponse } from '@/types/articleResponse'; const useGetCategoryArticles = (category: string) => { const [sortIndex, setSortIndex] = useState('최신순'); const { data, isLoading, isError, isSuccess, error, refetch, fetchNextPage } = useInfiniteQuery< - infiniteArticleResponse, + InfiniteArticleResponse, AxiosError<{ errorCode: keyof typeof ErrorMessage; message: string }> >( ['articles', category], diff --git a/frontend/src/hooks/article/useGetDetailArticle.tsx b/frontend/src/hooks/article/useGetDetailArticle.tsx index c948bf6be..3ef7dddc4 100644 --- a/frontend/src/hooks/article/useGetDetailArticle.tsx +++ b/frontend/src/hooks/article/useGetDetailArticle.tsx @@ -4,14 +4,14 @@ import { useQuery } from 'react-query'; import { useSetRecoilState } from 'recoil'; import { getDetailArticle } from '@/api/article/article'; +import { DetailArticleResponseType } from '@/api/article/articleType'; import { ErrorMessage } from '@/constants/ErrorMessage'; import useThrowCustomError from '@/hooks/common/useThrowCustomError'; import { articleState } from '@/store/articleState'; -import { ArticleType } from '@/types/articleResponse'; const useGetDetailArticle = (id: string) => { const { data, isSuccess, isError, isLoading, error, isIdle } = useQuery< - ArticleType, + DetailArticleResponseType, AxiosError<{ errorCode: keyof typeof ErrorMessage; message: string }> >(['detail-article', `article${id}`], () => getDetailArticle(id), { retry: false, diff --git a/frontend/src/hooks/article/useGetPopularArticles.tsx b/frontend/src/hooks/article/useGetPopularArticles.tsx index 69962820e..a8d8c4ddc 100644 --- a/frontend/src/hooks/article/useGetPopularArticles.tsx +++ b/frontend/src/hooks/article/useGetPopularArticles.tsx @@ -1,13 +1,14 @@ import { AxiosError } from 'axios'; import { useQuery } from 'react-query'; -import { getPopularArticles, PopularArticles } from '@/api/article/article'; +import { getPopularArticles } from '@/api/article/article'; +import { TotalArticleInquiredResponseType } from '@/api/article/articleType'; import { ErrorMessage } from '@/constants/ErrorMessage'; import useThrowCustomError from '@/hooks/common/useThrowCustomError'; const useGetPopularArticles = () => { const { data, error, isError, isLoading } = useQuery< - PopularArticles, + TotalArticleInquiredResponseType, AxiosError<{ errorCode: keyof typeof ErrorMessage; message: string }> >('popular-articles', getPopularArticles, { retry: 1, diff --git a/frontend/src/hooks/article/usePostUpdateWritingArticle.tsx b/frontend/src/hooks/article/usePostUpdateWritingArticle.tsx index 26e8621e4..e6f09b53f 100644 --- a/frontend/src/hooks/article/usePostUpdateWritingArticle.tsx +++ b/frontend/src/hooks/article/usePostUpdateWritingArticle.tsx @@ -5,6 +5,7 @@ import { useNavigate } from 'react-router-dom'; import { useRecoilValue } from 'recoil'; import { putArticle } from '@/api/article/article'; +import { UpdateArticleRequestType } from '@/api/article/articleType'; import { ErrorMessage } from '@/constants/ErrorMessage'; import useThrowCustomError from '@/hooks/common/useThrowCustomError'; import { queryClient } from '@/index'; @@ -27,7 +28,7 @@ const usePostUpdateWritingArticle = () => { const { data, isSuccess, isError, isLoading, error, mutate } = useMutation< AxiosResponse<{ id: number; category: string }>, AxiosError<{ errorCode: keyof typeof ErrorMessage; message: string }>, - { title: string; content: string; id: string; tag: string[] } + UpdateArticleRequestType >(putArticle, { retry: 1 }); useEffect(() => { diff --git a/frontend/src/hooks/article/usePostWritingArticles.tsx b/frontend/src/hooks/article/usePostWritingArticles.tsx index 6f5bad0d4..e8c722420 100644 --- a/frontend/src/hooks/article/usePostWritingArticles.tsx +++ b/frontend/src/hooks/article/usePostWritingArticles.tsx @@ -4,6 +4,11 @@ import { useMutation } from 'react-query'; import { useNavigate } from 'react-router-dom'; import { postWritingArticle } from '@/api/article/article'; +import { + CategoryType, + CreateArticleRequestType, + CreateArticleResponseType, +} from '@/api/article/articleType'; import { ErrorMessage } from '@/constants/ErrorMessage'; import { CATEGORY } from '@/constants/categoryType'; import useThrowCustomError from '@/hooks/common/useThrowCustomError'; @@ -18,16 +23,9 @@ const usePostWritingArticles = ({ isAnonymous: boolean; }) => { const { data, mutate, isError, isLoading, isSuccess, error } = useMutation< - AxiosResponse<{ id: string }>, + AxiosResponse, AxiosError<{ errorCode: keyof typeof ErrorMessage; message: string }>, - { - title: string; - category: string; - content: string; - tag: string[]; - isAnonymous: boolean; - tempArticleId: number | ''; - } + CreateArticleRequestType >(postWritingArticle, { retry: 1 }); const content = useRef(null); @@ -57,7 +55,7 @@ const usePostWritingArticles = ({ } }, [isSuccess]); - const handleSubmitButtonClick = (categoryOption: string, tempArticleId: number | '') => { + const handleSubmitButtonClick = (categoryOption: CategoryType, tempArticleId: number | '') => { if (content.current === null) { return; } diff --git a/frontend/src/hooks/common/useToastImageConverter.tsx b/frontend/src/hooks/common/useToastImageConverter.tsx index 28f8fd0ff..5b3c9fcbf 100644 --- a/frontend/src/hooks/common/useToastImageConverter.tsx +++ b/frontend/src/hooks/common/useToastImageConverter.tsx @@ -2,7 +2,7 @@ import { AxiosError, AxiosResponse } from 'axios'; import { MutableRefObject, useEffect, useState } from 'react'; import { useMutation } from 'react-query'; -import { postImageUrlConverter } from '@/api/image'; +import { postImageUrlConverter } from '@/api/article/image'; import { ErrorMessage } from '@/constants/ErrorMessage'; import useSnackBar from '@/hooks/common/useSnackBar'; import useThrowCustomError from '@/hooks/common/useThrowCustomError'; From 6836e88db934144f216ea6cb1a8830daff2bf1ed Mon Sep 17 00:00:00 2001 From: JASUN LEE Date: Mon, 24 Oct 2022 15:45:56 +0900 Subject: [PATCH 07/20] =?UTF-8?q?refactor:=20component=EB=8B=A8=EC=97=90?= =?UTF-8?q?=EC=84=9C=EC=9D=98=20=ED=83=80=EC=9E=85=20=EB=A6=AC=ED=8C=A9?= =?UTF-8?q?=ED=86=A0=EB=A7=81=20=EC=A0=81=EC=9A=A9?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- frontend/src/api/article/articleType.ts | 10 ++- frontend/src/api/tempArticle/tempArticle.ts | 9 ++- .../article/ArticleContent/ArticleContent.tsx | 7 +- .../article/ArticleItem/ArticleItem.tsx | 17 +---- .../article/PopularArticle/PopularArticle.tsx | 4 +- .../PopularArticleItem/PopularArticleItem.tsx | 4 +- .../hooks/article/usePostWritingArticles.tsx | 14 +++- .../tempArticle/useGetTempDetailArticles.tsx | 4 +- .../CategoryArticles/CategoryArticles.tsx | 6 +- frontend/src/pages/Home/index.tsx | 6 +- frontend/src/pages/UpdateWriting/index.tsx | 1 - frontend/src/types/articleResponse.ts | 68 ------------------- frontend/src/types/author.ts | 4 -- 13 files changed, 44 insertions(+), 110 deletions(-) delete mode 100644 frontend/src/types/articleResponse.ts delete mode 100644 frontend/src/types/author.ts diff --git a/frontend/src/api/article/articleType.ts b/frontend/src/api/article/articleType.ts index e4620cfbb..5bc33fe55 100644 --- a/frontend/src/api/article/articleType.ts +++ b/frontend/src/api/article/articleType.ts @@ -13,7 +13,7 @@ export interface ArticleTotalType extends AuthorType { tag: string[]; content: string; category: CategoryType; - createAt: string; + createdAt: string; updatedAt: string; views: number; @@ -45,13 +45,19 @@ export interface InfiniteArticleResponse extends TotalArticleInquiredResponseTyp export type SingleTempArticleItemResponseType = Pick< ArticleTotalType, - 'id' | 'title' | 'createAt' | 'category' + 'id' | 'title' | 'createdAt' | 'category' >; export interface TotalTempArticleResponseType { values: SingleTempArticleItemResponseType[]; } +export interface DetailTempArticleResponseType extends SingleTempArticleItemResponseType { + tag: string[]; + content: string; + isAnonymous: boolean; +} + export type CreateArticleResponseType = Pick; export type UpdateArticleResponseType = Pick; diff --git a/frontend/src/api/tempArticle/tempArticle.ts b/frontend/src/api/tempArticle/tempArticle.ts index 01e0ed67f..6825a125e 100644 --- a/frontend/src/api/tempArticle/tempArticle.ts +++ b/frontend/src/api/tempArticle/tempArticle.ts @@ -1,16 +1,19 @@ +import { + DetailTempArticleResponseType, + TotalTempArticleResponseType, +} from '@/api/article/articleType'; import { postTempArticleProps } from '@/hooks/tempArticle/usePostTempArticle'; -import { TempArticleDetailResponse, TempArticleResponse } from '@/types/articleResponse'; import { generateAxiosInstanceWithAccessToken } from '@/utils/generateAxiosInstance'; export const getTempArticles = async () => { const axiosInstance = generateAxiosInstanceWithAccessToken(); - const { data } = await axiosInstance.get(`/api/temp-articles`); + const { data } = await axiosInstance.get(`/api/temp-articles`); return data; }; export const getTempDetailArticle = ({ id }: { id: number | '' }) => { const axiosInstance = generateAxiosInstanceWithAccessToken(); - return axiosInstance.get(`/api/temp-articles/${id}`); + return axiosInstance.get(`/api/temp-articles/${id}`); }; export const postTempArticle = ({ ...props }: postTempArticleProps) => { diff --git a/frontend/src/components/article/ArticleContent/ArticleContent.tsx b/frontend/src/components/article/ArticleContent/ArticleContent.tsx index e934ffe92..0a1ca8bd2 100644 --- a/frontend/src/components/article/ArticleContent/ArticleContent.tsx +++ b/frontend/src/components/article/ArticleContent/ArticleContent.tsx @@ -1,19 +1,18 @@ import { useNavigate } from 'react-router-dom'; +import { ArticleTotalType, AuthorType } from '@/api/article/articleType'; import Card from '@/components/@common/Card/Card'; import ToastUiViewer from '@/components/@common/ToastUiViewer/ToastUiViewer'; import * as S from '@/components/article/ArticleContent/ArticleContent.styles'; import useDeleteArticleContent from '@/hooks/article/useDeleteArticleContent'; import useHeartClick from '@/hooks/article/useHeartClick'; import { ArticleContentCardStyle } from '@/styles/cardStyle'; -import { ArticleType } from '@/types/articleResponse'; -import { Author } from '@/types/author'; import { dateTimeConverter } from '@/utils/converter'; export interface ArticleContentProps { category: string; - article: ArticleType; - author: Author; + article: Omit; + author: AuthorType['author']; articleId: string; } diff --git a/frontend/src/components/article/ArticleItem/ArticleItem.tsx b/frontend/src/components/article/ArticleItem/ArticleItem.tsx index fd6ded84b..79f5f215e 100644 --- a/frontend/src/components/article/ArticleItem/ArticleItem.tsx +++ b/frontend/src/components/article/ArticleItem/ArticleItem.tsx @@ -1,26 +1,13 @@ +import { ArticleTotalType } from '@/api/article/articleType'; import Card from '@/components/@common/Card/Card'; import * as S from '@/components/article/ArticleItem/ArticleItem.styles'; import useHeartClick from '@/hooks/article/useHeartClick'; import { ArticleItemCardStyle } from '@/styles/cardStyle'; -import { Category } from '@/types/articleResponse'; -import { Author } from '@/types/author'; import { convertGithubAvatarUrlForResize } from '@/utils/converter'; import { dateTimeConverter } from '@/utils/converter'; export interface ArticleItemProps { - article: { - id: number; - title: string; - author: Author; - content: string; - category: Category; - commentCount: number; - createdAt: string; - tag: string[]; - isLike: boolean; - likeCount: number; - views: number; - }; + article: Omit; onClick: () => void; } diff --git a/frontend/src/components/article/PopularArticle/PopularArticle.tsx b/frontend/src/components/article/PopularArticle/PopularArticle.tsx index da0d17ba4..28dec51dc 100644 --- a/frontend/src/components/article/PopularArticle/PopularArticle.tsx +++ b/frontend/src/components/article/PopularArticle/PopularArticle.tsx @@ -1,12 +1,12 @@ import { useNavigate } from 'react-router-dom'; +import { CategoryType } from '@/api/article/articleType'; import EmptyMessage from '@/components/@common/EmptyMessage/EmptyMessage'; import Loading from '@/components/@common/Loading/Loading'; import * as S from '@/components/article/PopularArticle/PopularArticle.styles'; import PopularArticleItem from '@/components/article/PopularArticleItem/PopularArticleItem'; import useGetPopularArticles from '@/hooks/article/useGetPopularArticles'; import useCarousel from '@/hooks/common/useCarousel'; -import { Category } from '@/types/articleResponse'; const PopularArticle = () => { const { handleCarouselElementRef, handleLeftSlideEvent, handleRightSlideEvent, currentIndex } = @@ -22,7 +22,7 @@ const PopularArticle = () => { return 게시글이 존재하지 않습니다; } - const handleClickArticleItem = ({ id, category }: { id: string; category: Category }) => { + const handleClickArticleItem = ({ id, category }: { id: string; category: CategoryType }) => { navigate(`/articles/${category}/${id}`); }; diff --git a/frontend/src/components/article/PopularArticleItem/PopularArticleItem.tsx b/frontend/src/components/article/PopularArticleItem/PopularArticleItem.tsx index 829536ef5..0aeacf6f2 100644 --- a/frontend/src/components/article/PopularArticleItem/PopularArticleItem.tsx +++ b/frontend/src/components/article/PopularArticleItem/PopularArticleItem.tsx @@ -1,11 +1,11 @@ import { useEffect, useRef } from 'react'; +import { ArticleTotalType } from '@/api/article/articleType'; import Card from '@/components/@common/Card/Card'; import * as S from '@/components/article/ArticleItem/ArticleItem.styles'; import * as PopularS from '@/components/article/PopularArticleItem/PopularArticleItem.styles'; import { CAROUSEL_AUTO_PLAY_TIME } from '@/constants/index'; import { PopularArticleItemCardStyle } from '@/styles/cardStyle'; -import { CommonArticleType } from '@/types/articleResponse'; import { convertGithubAvatarUrlForResize, dateTimeConverter } from '@/utils/converter'; const PopularArticleItem = ({ @@ -14,7 +14,7 @@ const PopularArticleItem = ({ onClick, rightSlide, }: { - article: CommonArticleType; + article: Omit; isActive: boolean; onClick?: () => void; rightSlide?: () => void; diff --git a/frontend/src/hooks/article/usePostWritingArticles.tsx b/frontend/src/hooks/article/usePostWritingArticles.tsx index e8c722420..cc1ae5dcf 100644 --- a/frontend/src/hooks/article/usePostWritingArticles.tsx +++ b/frontend/src/hooks/article/usePostWritingArticles.tsx @@ -19,7 +19,7 @@ const usePostWritingArticles = ({ category, isAnonymous, }: { - category?: string; + category?: CategoryType | string; isAnonymous: boolean; }) => { const { data, mutate, isError, isLoading, isSuccess, error } = useMutation< @@ -30,7 +30,9 @@ const usePostWritingArticles = ({ const content = useRef(null); const [title, setTitle] = useState(''); - const [categoryOption, setCategoryOption] = useState(category ? category : ''); + const [categoryOption, setCategoryOption] = useState( + category ? category : 'question', + ); const [isValidTitleInput, setIsValidTitleInput] = useState(true); const [hashTags, setHashTags] = useState([]); const titleInputRef = useRef(null); @@ -55,10 +57,16 @@ const usePostWritingArticles = ({ } }, [isSuccess]); - const handleSubmitButtonClick = (categoryOption: CategoryType, tempArticleId: number | '') => { + const handleSubmitButtonClick = ( + categoryOption: CategoryType | string, + tempArticleId: number | '', + ) => { if (content.current === null) { return; } + if (categoryOption !== 'question' && categoryOption !== 'discussion') { + return; + } if (!validatedTitleInput(title)) { setIsValidTitleInput(false); diff --git a/frontend/src/hooks/tempArticle/useGetTempDetailArticles.tsx b/frontend/src/hooks/tempArticle/useGetTempDetailArticles.tsx index 4f9a1228d..6e8d9f440 100644 --- a/frontend/src/hooks/tempArticle/useGetTempDetailArticles.tsx +++ b/frontend/src/hooks/tempArticle/useGetTempDetailArticles.tsx @@ -1,14 +1,14 @@ import { AxiosError, AxiosResponse } from 'axios'; import { useMutation } from 'react-query'; +import { DetailTempArticleResponseType } from '@/api/article/articleType'; import { getTempDetailArticle } from '@/api/tempArticle/tempArticle'; import { ErrorMessage } from '@/constants/ErrorMessage'; import useThrowCustomError from '@/hooks/common/useThrowCustomError'; -import { TempArticleDetailResponse } from '@/types/articleResponse'; const useGetTempDetailArticles = ({ tempArticleId }: { tempArticleId: number | '' }) => { const { data, isLoading, isSuccess, isError, error, mutate } = useMutation< - AxiosResponse, + AxiosResponse, AxiosError<{ errorCode: keyof typeof ErrorMessage; message: string }>, { tempArticleId: number; diff --git a/frontend/src/pages/CategoryArticles/CategoryArticles.tsx b/frontend/src/pages/CategoryArticles/CategoryArticles.tsx index 7be3d10f4..64909e3c5 100644 --- a/frontend/src/pages/CategoryArticles/CategoryArticles.tsx +++ b/frontend/src/pages/CategoryArticles/CategoryArticles.tsx @@ -1,5 +1,6 @@ import { useNavigate, useParams } from 'react-router-dom'; +import { ArticleTotalType } from '@/api/article/articleType'; import EmptyMessage from '@/components/@common/EmptyMessage/EmptyMessage'; import Loading from '@/components/@common/Loading/Loading'; import ResponsiveInfiniteCardList from '@/components/@common/ResponsiveInfiniteCardList/ResponsiveInfiniteCardList'; @@ -8,7 +9,6 @@ import ArticleItem from '@/components/article/ArticleItem/ArticleItem'; import { URL } from '@/constants/url'; import useGetCategoryArticles from '@/hooks/article/useGetCategoryArticles'; import * as S from '@/pages/CategoryArticles/CategoryArticles.styles'; -import { CommonArticleType } from '@/types/articleResponse'; import { categoryNameConverter } from '@/utils/converter'; const CategoryArticles = () => { @@ -27,7 +27,9 @@ const CategoryArticles = () => { const { data, fetchNextPage, sortIndex, setSortIndex, isLoading } = useGetCategoryArticles(category); - const handleClickArticleItem = (item: CommonArticleType) => { + const handleClickArticleItem = ( + item: Omit, + ) => { navigate(`/articles/${category}/${item.id}`); }; diff --git a/frontend/src/pages/Home/index.tsx b/frontend/src/pages/Home/index.tsx index bb9e1329d..9aa40f770 100644 --- a/frontend/src/pages/Home/index.tsx +++ b/frontend/src/pages/Home/index.tsx @@ -1,13 +1,13 @@ import React, { Suspense } from 'react'; import { useNavigate } from 'react-router-dom'; +import { ArticleTotalType } from '@/api/article/articleType'; import EmptyMessage from '@/components/@common/EmptyMessage/EmptyMessage'; import Loading from '@/components/@common/Loading/Loading'; import SortDropdown from '@/components/@common/SortDropdown/SortDropDown'; import useGetAllArticles from '@/hooks/article/useGetAllArticles'; import useEnterToClick from '@/hooks/common/useEnterToClick'; import * as S from '@/pages/Home/index.styles'; -import { CommonArticleType } from '@/types/articleResponse'; const ResponsiveInfiniteCardList = React.lazy( () => import('@/components/@common/ResponsiveInfiniteCardList/ResponsiveInfiniteCardList'), @@ -29,7 +29,9 @@ const Home = () => { setCurrentCategory(category); }; - const handleLinkToArticleDetail = (item: CommonArticleType) => { + const handleLinkToArticleDetail = ( + item: Omit, + ) => { navigate(`/articles/${currentCategory}/${item.id}`); }; diff --git a/frontend/src/pages/UpdateWriting/index.tsx b/frontend/src/pages/UpdateWriting/index.tsx index 7cf58e29a..f95810642 100644 --- a/frontend/src/pages/UpdateWriting/index.tsx +++ b/frontend/src/pages/UpdateWriting/index.tsx @@ -1,4 +1,3 @@ -import { useEffect } from 'react'; import { useParams } from 'react-router-dom'; import Card from '@/components/@common/Card/Card'; diff --git a/frontend/src/types/articleResponse.ts b/frontend/src/types/articleResponse.ts deleted file mode 100644 index a1a126d3e..000000000 --- a/frontend/src/types/articleResponse.ts +++ /dev/null @@ -1,68 +0,0 @@ -import { Author } from '@/types/author'; - -export type Category = 'question' | 'discussion'; - -export interface CommonArticleType { - id: number; - title: string; - author: Author; - content: string; - category: Category; - commentCount: number; - createdAt: string; - views: number; - tag: string[]; - isLike: boolean; - likeCount: number; - hasVote: boolean; -} - -export interface ArticleType extends CommonArticleType { - isAuthor: boolean; -} - -export interface AllArticleResponse { - articles: CommonArticleType[]; - hasNext: boolean; -} - -export interface infiniteArticleResponse extends AllArticleResponse { - cursorId: string; - cursorViews?: string; - cursorLikes?: string; -} - -export interface UserArticleItemType { - id: number; - title: string; - category: string; - commentCount: number; - createdAt: string; - updatedAt: string; - views: number; -} - -export interface UserArticlesResponse { - articles: UserArticleItemType[]; -} - -export interface TempArticleItem { - id: number; - title: string; - createAt: string; - category: 'discussion' | 'question'; -} - -export interface TempArticleResponse { - values: TempArticleItem[]; -} - -export interface TempArticleDetailResponse { - id: number; - title: string; - content: string; - tag: string[]; - category: 'question' | 'discussion'; - isAnonymous: boolean; - createdAt: string; -} diff --git a/frontend/src/types/author.ts b/frontend/src/types/author.ts deleted file mode 100644 index 57a6197cb..000000000 --- a/frontend/src/types/author.ts +++ /dev/null @@ -1,4 +0,0 @@ -export interface Author { - name: string; - avatarUrl: string; -} From e8219f4ac23dfd351824a553ae2fb750b55065a9 Mon Sep 17 00:00:00 2001 From: JASUN LEE Date: Mon, 24 Oct 2022 16:41:54 +0900 Subject: [PATCH 08/20] =?UTF-8?q?refactor:=20author=EC=97=90=20=EB=8C=80?= =?UTF-8?q?=ED=95=9C=20=ED=83=80=EC=9E=85=20=EB=B6=84=EB=A6=AC=20=EC=A7=84?= =?UTF-8?q?=ED=96=89=20=EB=B0=8F=20tsc=EB=A5=BC=20=ED=86=B5=ED=95=B4=20?= =?UTF-8?q?=ED=99=95=EC=9D=B8=EB=90=9C=20=ED=83=80=EC=9E=85=EB=93=A4?= =?UTF-8?q?=EC=97=90=20=EB=8C=80=ED=95=B4=EC=84=9C=20=EB=A6=AC=ED=8C=A9?= =?UTF-8?q?=ED=86=A0=EB=A7=81=20=EC=A7=84=ED=96=89?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- frontend/src/api/article/articleType.ts | 22 ++++++++++++------- frontend/src/api/user/myPage.ts | 9 ++++---- frontend/src/api/vote/vote.ts | 2 +- .../observer/InfiniteScrollObserver.tsx | 4 ++-- .../article/ArticleContent/ArticleContent.tsx | 4 ++-- .../PopularArticleItem.styles.tsx | 4 ++-- .../PopularArticleItem/PopularArticleItem.tsx | 2 +- .../HashTagSearchResult.tsx | 6 +++-- .../search/SearchResult/SearchResult.tsx | 6 +++-- .../TemporaryArticleItem.tsx | 5 +++-- .../TemporaryArticleList.tsx | 4 ++-- .../user/UserArticleItem/UserArticleItem.tsx | 4 ++-- .../hooks/tempArticle/useGetTempArticles.tsx | 4 ++-- .../src/hooks/user/useGetUserArticles.tsx | 4 ++-- frontend/src/hooks/user/useGetUserInfo.tsx | 4 ++-- frontend/src/mock/myPage.ts | 7 +++--- frontend/src/mock/search.ts | 4 ++-- frontend/src/pages/Detail/index.tsx | 4 ++-- .../Article/ArticleContent.stories.tsx | 2 -- .../Article/TemporaryArticleItem.stories.tsx | 2 +- .../User/UserArticleItem.stories.tsx | 6 +++-- frontend/src/types/commentResponse.ts | 4 ++-- frontend/src/types/searchResponse.ts | 4 ++-- 23 files changed, 64 insertions(+), 53 deletions(-) diff --git a/frontend/src/api/article/articleType.ts b/frontend/src/api/article/articleType.ts index 5bc33fe55..04cb41f77 100644 --- a/frontend/src/api/article/articleType.ts +++ b/frontend/src/api/article/articleType.ts @@ -1,13 +1,8 @@ -export interface AuthorType { - author: { - name: string; - avatarUrl: string; - }; -} +export type AuthorType = { name: string; avatarUrl: string }; export type CategoryType = 'question' | 'discussion'; -export interface ArticleTotalType extends AuthorType { +export interface ArticleTotalType { id: number; title: string; tag: string[]; @@ -15,6 +10,7 @@ export interface ArticleTotalType extends AuthorType { category: CategoryType; createdAt: string; updatedAt: string; + author: AuthorType; views: number; likeCount: number; @@ -25,7 +21,7 @@ export interface ArticleTotalType extends AuthorType { isLike: boolean; } -export type DetailArticleResponseType = Omit; +export type DetailArticleResponseType = Omit; export type SingleArticleItemResponseType = Omit< ArticleTotalType, @@ -58,6 +54,16 @@ export interface DetailTempArticleResponseType extends SingleTempArticleItemResp isAnonymous: boolean; } +export interface SingleMyPageUserArticleResponseType extends SingleTempArticleItemResponseType { + commentCount: number; + updatedAt: string; + views: number; +} + +export interface MyPageUserArticleResponseType { + articles: SingleMyPageUserArticleResponseType[]; +} + export type CreateArticleResponseType = Pick; export type UpdateArticleResponseType = Pick; diff --git a/frontend/src/api/user/myPage.ts b/frontend/src/api/user/myPage.ts index d83e6ad78..236f49602 100644 --- a/frontend/src/api/user/myPage.ts +++ b/frontend/src/api/user/myPage.ts @@ -1,19 +1,20 @@ import { AxiosResponse } from 'axios'; -import { UserArticlesResponse } from '@/types/articleResponse'; -import { Author } from '@/types/author'; +import { AuthorType, MyPageUserArticleResponseType } from '@/api/article/articleType'; import { UserCommentResponse } from '@/types/commentResponse'; import { generateAxiosInstanceWithAccessToken } from '@/utils/generateAxiosInstance'; export const getUserInfo = async () => { const axiosInstance = generateAxiosInstanceWithAccessToken(); - const { data } = await axiosInstance.get('/api/members/me'); + const { data } = await axiosInstance.get('/api/members/me'); return data; }; export const getUserArticles = async () => { const axiosInstance = generateAxiosInstanceWithAccessToken(); - const { data } = await axiosInstance.get('/api/members/me/articles'); + const { data } = await axiosInstance.get( + '/api/members/me/articles', + ); return data; }; diff --git a/frontend/src/api/vote/vote.ts b/frontend/src/api/vote/vote.ts index b094428db..623b79e3d 100644 --- a/frontend/src/api/vote/vote.ts +++ b/frontend/src/api/vote/vote.ts @@ -10,7 +10,7 @@ export interface TVote { articleId: string; voteItems: VoteItems[]; votedItemId: number | null; - isExpired: boolean; + expired: boolean; } export const getVoteItems = async (articleId: string) => { diff --git a/frontend/src/components/@helper/observer/InfiniteScrollObserver.tsx b/frontend/src/components/@helper/observer/InfiniteScrollObserver.tsx index 91da5ab5d..45196ca73 100644 --- a/frontend/src/components/@helper/observer/InfiniteScrollObserver.tsx +++ b/frontend/src/components/@helper/observer/InfiniteScrollObserver.tsx @@ -2,10 +2,10 @@ import { PropsWithStrictChildren } from 'gongseek-types'; import { useEffect, useRef } from 'react'; import { InfiniteQueryObserverResult } from 'react-query'; -import { infiniteArticleResponse } from '@/types/articleResponse'; +import { InfiniteArticleResponse } from '@/api/article/articleType'; import { InfiniteSearchResultType } from '@/types/searchResponse'; -export type ObserverResponseType = infiniteArticleResponse | InfiniteSearchResultType; +export type ObserverResponseType = InfiniteArticleResponse | InfiniteSearchResultType; interface infiniteScrollObserverProps { hasNext: boolean; fetchNextPage: () => Promise>; diff --git a/frontend/src/components/article/ArticleContent/ArticleContent.tsx b/frontend/src/components/article/ArticleContent/ArticleContent.tsx index 0a1ca8bd2..d235b5227 100644 --- a/frontend/src/components/article/ArticleContent/ArticleContent.tsx +++ b/frontend/src/components/article/ArticleContent/ArticleContent.tsx @@ -11,8 +11,8 @@ import { dateTimeConverter } from '@/utils/converter'; export interface ArticleContentProps { category: string; - article: Omit; - author: AuthorType['author']; + article: Omit; + author: AuthorType; articleId: string; } diff --git a/frontend/src/components/article/PopularArticleItem/PopularArticleItem.styles.tsx b/frontend/src/components/article/PopularArticleItem/PopularArticleItem.styles.tsx index 0d5716a34..805ac670e 100644 --- a/frontend/src/components/article/PopularArticleItem/PopularArticleItem.styles.tsx +++ b/frontend/src/components/article/PopularArticleItem/PopularArticleItem.styles.tsx @@ -1,12 +1,12 @@ import { AiOutlineEye, AiOutlineMessage, AiFillHeart } from 'react-icons/ai'; +import { CategoryType } from '@/api/article/articleType'; import { UserProfile, ArticleItemTitle, HashTagListBox, } from '@/components/article/ArticleItem/ArticleItem.styles'; import { TextOverflow, TwoLineTextOverFlow } from '@/styles/mixin'; -import { Category } from '@/types/articleResponse'; import { css } from '@emotion/react'; import styled from '@emotion/styled'; @@ -76,7 +76,7 @@ export const PopularArticleUserProfile = styled(UserProfile)` background-clip: content-box, border-box; `; -export const PopularArticleHeader = styled.div<{ category: Category }>` +export const PopularArticleHeader = styled.div<{ category: CategoryType }>` ${({ theme, category }) => css` background: ${category === 'question' ? theme.colors.RED_500 : theme.colors.BLUE_500}; opacity: 0.8; diff --git a/frontend/src/components/article/PopularArticleItem/PopularArticleItem.tsx b/frontend/src/components/article/PopularArticleItem/PopularArticleItem.tsx index 0aeacf6f2..d55b24552 100644 --- a/frontend/src/components/article/PopularArticleItem/PopularArticleItem.tsx +++ b/frontend/src/components/article/PopularArticleItem/PopularArticleItem.tsx @@ -14,7 +14,7 @@ const PopularArticleItem = ({ onClick, rightSlide, }: { - article: Omit; + article: Omit; isActive: boolean; onClick?: () => void; rightSlide?: () => void; diff --git a/frontend/src/components/hashTag/HashTagSearchResult/HashTagSearchResult.tsx b/frontend/src/components/hashTag/HashTagSearchResult/HashTagSearchResult.tsx index 59d6b3d2d..7719adeef 100644 --- a/frontend/src/components/hashTag/HashTagSearchResult/HashTagSearchResult.tsx +++ b/frontend/src/components/hashTag/HashTagSearchResult/HashTagSearchResult.tsx @@ -1,12 +1,12 @@ import { useNavigate } from 'react-router-dom'; +import { ArticleTotalType } from '@/api/article/articleType'; import Loading from '@/components/@common/Loading/Loading'; import ResponsiveInfiniteCardList from '@/components/@common/ResponsiveInfiniteCardList/ResponsiveInfiniteCardList'; import ArticleItem from '@/components/article/ArticleItem/ArticleItem'; import * as S from '@/components/hashTag/HashTagSearchResult/HashTagSearchResult.styles'; import useGetArticleByHashTag from '@/hooks/hashTag/useGetArticleByHashTag'; import { EmptyMessage } from '@/pages/Search/index.styles'; -import { CommonArticleType } from '@/types/articleResponse'; export interface HashTagSearchResultProps { hashTags: string[]; @@ -17,7 +17,9 @@ const HashTagSearchResult = ({ hashTags }: HashTagSearchResultProps) => { const { data, isLoading, fetchNextPage } = useGetArticleByHashTag(hashTags); - const handleClickArticleItem = (article: CommonArticleType) => { + const handleClickArticleItem = ( + article: Omit, + ) => { navigate(`/articles/${article.category}/${article.id}`); }; diff --git a/frontend/src/components/search/SearchResult/SearchResult.tsx b/frontend/src/components/search/SearchResult/SearchResult.tsx index 480ddc074..7def88adb 100644 --- a/frontend/src/components/search/SearchResult/SearchResult.tsx +++ b/frontend/src/components/search/SearchResult/SearchResult.tsx @@ -1,12 +1,12 @@ import React, { Suspense, useEffect } from 'react'; import { useNavigate } from 'react-router-dom'; +import { ArticleTotalType } from '@/api/article/articleType'; import EmptyMessage from '@/components/@common/EmptyMessage/EmptyMessage'; import Loading from '@/components/@common/Loading/Loading'; import ArticleItem from '@/components/article/ArticleItem/ArticleItem'; import * as S from '@/components/search/SearchResult/SearchResult.styles'; import useGetSearch from '@/hooks/search/useGetSearch'; -import { CommonArticleType } from '@/types/articleResponse'; const ResponsiveInfiniteCardList = React.lazy( () => import('@/components/@common/ResponsiveInfiniteCardList/ResponsiveInfiniteCardList'), @@ -20,7 +20,9 @@ const SearchResult = ({ target, searchIndex }: { target: string; searchIndex: st refetch(); }, [target, searchIndex]); - const handleClickArticleItem = (article: CommonArticleType) => { + const handleClickArticleItem = ( + article: Omit, + ) => { navigate(`/articles/${article.category}/${article.id}`); }; diff --git a/frontend/src/components/tempArticle/TemporaryArticleItem/TemporaryArticleItem.tsx b/frontend/src/components/tempArticle/TemporaryArticleItem/TemporaryArticleItem.tsx index 96c33d456..e41e8f7c9 100644 --- a/frontend/src/components/tempArticle/TemporaryArticleItem/TemporaryArticleItem.tsx +++ b/frontend/src/components/tempArticle/TemporaryArticleItem/TemporaryArticleItem.tsx @@ -1,8 +1,9 @@ +import { SingleTempArticleItemResponseType } from '@/api/article/articleType'; import * as S from '@/components/tempArticle/TemporaryArticleItem/TemporaryArticleItem.styles'; import { categoryNameConverter, dateTimeConverter } from '@/utils/converter'; export interface TemporaryArticleItemProps { - article: { title: string; createAt: string; category: string }; + article: Omit; onClick: () => void; } @@ -13,7 +14,7 @@ const TemporaryArticleItem = ({ article, onClick }: TemporaryArticleItemProps) = {categoryNameConverter(article.category)} - {article.createAt && dateTimeConverter(article.createAt)} + {article.createdAt && dateTimeConverter(article.createdAt)} ); diff --git a/frontend/src/components/tempArticle/TemporaryArticleList/TemporaryArticleList.tsx b/frontend/src/components/tempArticle/TemporaryArticleList/TemporaryArticleList.tsx index 446c953f5..3c5c7d390 100644 --- a/frontend/src/components/tempArticle/TemporaryArticleList/TemporaryArticleList.tsx +++ b/frontend/src/components/tempArticle/TemporaryArticleList/TemporaryArticleList.tsx @@ -1,12 +1,12 @@ import { useNavigate } from 'react-router-dom'; +import { SingleTempArticleItemResponseType } from '@/api/article/articleType'; import EmptyMessage from '@/components/@common/EmptyMessage/EmptyMessage'; import Loading from '@/components/@common/Loading/Loading'; import TemporaryArticleItem from '@/components/tempArticle/TemporaryArticleItem/TemporaryArticleItem'; import * as S from '@/components/tempArticle/TemporaryArticleList/TemporaryArticleList.styles'; import useDeleteTempArticle from '@/hooks/tempArticle/useDeleteTempArticle'; import useGetTempArticles from '@/hooks/tempArticle/useGetTempArticles'; -import { TempArticleItem } from '@/types/articleResponse'; const TemporaryArticleList = () => { const { data, isLoading } = useGetTempArticles(); @@ -22,7 +22,7 @@ const TemporaryArticleList = () => { } }; - const handleClickTemporaryArticleItem = (item: TempArticleItem) => { + const handleClickTemporaryArticleItem = (item: SingleTempArticleItemResponseType) => { navigate(`/temp-article/${item.category}/${item.id}`); }; diff --git a/frontend/src/components/user/UserArticleItem/UserArticleItem.tsx b/frontend/src/components/user/UserArticleItem/UserArticleItem.tsx index a4a515d90..35e45ffed 100644 --- a/frontend/src/components/user/UserArticleItem/UserArticleItem.tsx +++ b/frontend/src/components/user/UserArticleItem/UserArticleItem.tsx @@ -1,10 +1,10 @@ import { useNavigate } from 'react-router-dom'; +import { SingleMyPageUserArticleResponseType } from '@/api/article/articleType'; import * as S from '@/components/user/UserArticleItem/UserArticleItem.styles'; -import { UserArticleItemType } from '@/types/articleResponse'; import { categoryNameConverter, dateTimeConverter } from '@/utils/converter'; -const UserArticleItem = ({ article }: { article: UserArticleItemType }) => { +const UserArticleItem = ({ article }: { article: SingleMyPageUserArticleResponseType }) => { const navigate = useNavigate(); const { id, title, category, commentCount, createdAt, updatedAt, views } = article; diff --git a/frontend/src/hooks/tempArticle/useGetTempArticles.tsx b/frontend/src/hooks/tempArticle/useGetTempArticles.tsx index e0f027073..685c4c147 100644 --- a/frontend/src/hooks/tempArticle/useGetTempArticles.tsx +++ b/frontend/src/hooks/tempArticle/useGetTempArticles.tsx @@ -1,14 +1,14 @@ import { AxiosError } from 'axios'; import { useQuery } from 'react-query'; +import { TotalTempArticleResponseType } from '@/api/article/articleType'; import { getTempArticles } from '@/api/tempArticle/tempArticle'; import { ErrorMessage } from '@/constants/ErrorMessage'; import useThrowCustomError from '@/hooks/common/useThrowCustomError'; -import { TempArticleResponse } from '@/types/articleResponse'; const useGetTempArticles = () => { const { data, isError, isLoading, error } = useQuery< - TempArticleResponse, + TotalTempArticleResponseType, AxiosError<{ errorCode: keyof typeof ErrorMessage; message: string }> >('temp-articles', getTempArticles, { retry: false, diff --git a/frontend/src/hooks/user/useGetUserArticles.tsx b/frontend/src/hooks/user/useGetUserArticles.tsx index ebae17d5a..5fcfd6e1c 100644 --- a/frontend/src/hooks/user/useGetUserArticles.tsx +++ b/frontend/src/hooks/user/useGetUserArticles.tsx @@ -1,14 +1,14 @@ import { AxiosError } from 'axios'; import { useQuery } from 'react-query'; +import { MyPageUserArticleResponseType } from '@/api/article/articleType'; import { getUserArticles } from '@/api/user/myPage'; import { ErrorMessage } from '@/constants/ErrorMessage'; import useThrowCustomError from '@/hooks/common/useThrowCustomError'; -import { UserArticlesResponse } from '@/types/articleResponse'; const useGetUserArticles = () => { const { data, isSuccess, isError, isLoading, error } = useQuery< - UserArticlesResponse, + MyPageUserArticleResponseType, AxiosError<{ errorCode: keyof typeof ErrorMessage; message: string }> >('user-articles', getUserArticles, { retry: 1, refetchOnWindowFocus: false }); diff --git a/frontend/src/hooks/user/useGetUserInfo.tsx b/frontend/src/hooks/user/useGetUserInfo.tsx index 2753ee1c1..b5096f560 100644 --- a/frontend/src/hooks/user/useGetUserInfo.tsx +++ b/frontend/src/hooks/user/useGetUserInfo.tsx @@ -1,14 +1,14 @@ import { AxiosError } from 'axios'; import { useQuery } from 'react-query'; +import { AuthorType } from '@/api/article/articleType'; import { getUserInfo } from '@/api/user/myPage'; import { ErrorMessage } from '@/constants/ErrorMessage'; import useThrowCustomError from '@/hooks/common/useThrowCustomError'; -import { Author } from '@/types/author'; const useGetUserInfo = () => { const { data, isSuccess, isError, isLoading, error } = useQuery< - Author, + AuthorType, AxiosError<{ errorCode: keyof typeof ErrorMessage; message: string }> >('user-info', getUserInfo, { retry: 1, refetchOnWindowFocus: false }); diff --git a/frontend/src/mock/myPage.ts b/frontend/src/mock/myPage.ts index 47a37a0ac..c551dedff 100644 --- a/frontend/src/mock/myPage.ts +++ b/frontend/src/mock/myPage.ts @@ -1,12 +1,11 @@ import { rest } from 'msw'; +import { AuthorType, MyPageUserArticleResponseType } from '@/api/article/articleType'; import { HOME_URL } from '@/constants/apiUrl'; -import { UserArticlesResponse } from '@/types/articleResponse'; -import { Author } from '@/types/author'; import { UserCommentResponse } from '@/types/commentResponse'; export const MyPageHandler = [ - rest.get(`${HOME_URL}/api/members/me`, (req, res, ctx) => + rest.get(`${HOME_URL}/api/members/me`, (req, res, ctx) => res( ctx.status(200), ctx.json({ @@ -16,7 +15,7 @@ export const MyPageHandler = [ ), ), - rest.get(`${HOME_URL}/api/members/me/articles`, (req, res, ctx) => + rest.get(`${HOME_URL}/api/members/me/articles`, (req, res, ctx) => res( ctx.status(200), ctx.json({ diff --git a/frontend/src/mock/search.ts b/frontend/src/mock/search.ts index c58fdc406..1f33b7cdd 100644 --- a/frontend/src/mock/search.ts +++ b/frontend/src/mock/search.ts @@ -1,7 +1,7 @@ import { rest } from 'msw'; +import { ArticleTotalType } from '@/api/article/articleType'; import { HOME_URL } from '@/constants/apiUrl'; -import { CommonArticleType } from '@/types/articleResponse'; import { SearchResultType } from '@/types/searchResponse'; export const SearchHandler = [ @@ -119,7 +119,7 @@ export const SearchHandler = [ ); }), - rest.get<{ articles: CommonArticleType[] }>( + rest.get<{ articles: Omit[] }>( `${HOME_URL}/api/articles/search/tags`, (req, res, ctx) => res( diff --git a/frontend/src/pages/Detail/index.tsx b/frontend/src/pages/Detail/index.tsx index 540076551..4fbe21112 100644 --- a/frontend/src/pages/Detail/index.tsx +++ b/frontend/src/pages/Detail/index.tsx @@ -1,14 +1,14 @@ import { PropsWithOptionalChildren } from 'gongseek-types'; +import { ArticleTotalType } from '@/api/article/articleType'; import ArticleContent from '@/components/article/ArticleContent/ArticleContent'; import CommentContent from '@/components/comment/CommentContent/CommentContent'; import useScrollToTop from '@/hooks/common/useScrollToTop'; import * as S from '@/pages/Detail/index.styles'; -import { ArticleType } from '@/types/articleResponse'; import { CommentType } from '@/types/commentResponse'; export interface DetailProps { - article: ArticleType; + article: Omit; commentList: CommentType[]; articleId: string; category: string; diff --git a/frontend/src/storybook/Article/ArticleContent.stories.tsx b/frontend/src/storybook/Article/ArticleContent.stories.tsx index 9a2299ed0..ee7ece09f 100644 --- a/frontend/src/storybook/Article/ArticleContent.stories.tsx +++ b/frontend/src/storybook/Article/ArticleContent.stories.tsx @@ -42,8 +42,6 @@ DefaultComment.args = { name: '자스민', avatarUrl: 'http://openimage.interpark.com/goods_image_big/0/3/2/7/8317700327e_l.jpg', }, - category: 'discussion', - commentCount: 2, }, author: { name: '자스민', diff --git a/frontend/src/storybook/Article/TemporaryArticleItem.stories.tsx b/frontend/src/storybook/Article/TemporaryArticleItem.stories.tsx index a1fe38aa6..dd7f19966 100644 --- a/frontend/src/storybook/Article/TemporaryArticleItem.stories.tsx +++ b/frontend/src/storybook/Article/TemporaryArticleItem.stories.tsx @@ -24,7 +24,7 @@ Default.args = { article: { title: '글 상세페이지에서의 글 제목이 들어가는 곳, 글 제목이 2줄 이상이 넘어갔을때 어떻게 처리할 것인지 처리하기 위한 예시 문장입니다', - createAt: '2022-08-11T13:34:11', + createdAt: '2022-08-11T13:34:11', category: 'question', }, onClick: () => { diff --git a/frontend/src/storybook/User/UserArticleItem.stories.tsx b/frontend/src/storybook/User/UserArticleItem.stories.tsx index 14bce128a..3e677fbd2 100644 --- a/frontend/src/storybook/User/UserArticleItem.stories.tsx +++ b/frontend/src/storybook/User/UserArticleItem.stories.tsx @@ -1,7 +1,7 @@ import { BrowserRouter } from 'react-router-dom'; +import { SingleMyPageUserArticleResponseType } from '@/api/article/articleType'; import UserArticleItem from '@/components/user/UserArticleItem/UserArticleItem'; -import { UserArticleItemType } from '@/types/articleResponse'; import { Meta, Story } from '@storybook/react'; export default { @@ -18,7 +18,9 @@ export default { ], } as Meta; -const Template: Story<{ article: UserArticleItemType }> = (args) => ; +const Template: Story<{ article: SingleMyPageUserArticleResponseType }> = (args) => ( + +); export const DiscussionUserItemBox = Template.bind({}); DiscussionUserItemBox.args = { diff --git a/frontend/src/types/commentResponse.ts b/frontend/src/types/commentResponse.ts index 8ccb48b87..5b93a2c12 100644 --- a/frontend/src/types/commentResponse.ts +++ b/frontend/src/types/commentResponse.ts @@ -1,8 +1,8 @@ -import { Author } from '@/types/author'; +import { AuthorType } from '@/api/article/articleType'; export interface CommentType { id: number; - author: Author; + author: AuthorType; content: string; createdAt: string; isAuthor: boolean; diff --git a/frontend/src/types/searchResponse.ts b/frontend/src/types/searchResponse.ts index bbfdf6716..5f855d599 100644 --- a/frontend/src/types/searchResponse.ts +++ b/frontend/src/types/searchResponse.ts @@ -1,7 +1,7 @@ -import { CommonArticleType } from '@/types/articleResponse'; +import { ArticleTotalType } from '@/api/article/articleType'; export interface SearchResultType { - articles: CommonArticleType[]; + articles: Omit[]; hasNext: boolean; } From 56cd069fa102d11d27490e932a830f34c3502f44 Mon Sep 17 00:00:00 2001 From: JASUN LEE Date: Mon, 24 Oct 2022 16:44:50 +0900 Subject: [PATCH 09/20] =?UTF-8?q?fix:=20type=EB=AA=85=20=EB=81=9D=EC=97=90?= =?UTF-8?q?=20type=20=EB=B6=99=EC=9D=B4=EA=B8=B0=EB=A1=9C=20=EC=88=98?= =?UTF-8?q?=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- frontend/src/api/article/articleType.ts | 2 +- .../components/@helper/observer/InfiniteScrollObserver.tsx | 4 ++-- frontend/src/hooks/article/useGetAllArticles.tsx | 4 ++-- frontend/src/hooks/article/useGetCategoryArticles.tsx | 4 ++-- 4 files changed, 7 insertions(+), 7 deletions(-) diff --git a/frontend/src/api/article/articleType.ts b/frontend/src/api/article/articleType.ts index 04cb41f77..a751d3104 100644 --- a/frontend/src/api/article/articleType.ts +++ b/frontend/src/api/article/articleType.ts @@ -33,7 +33,7 @@ export interface TotalArticleInquiredResponseType { hasNext: boolean; } -export interface InfiniteArticleResponse extends TotalArticleInquiredResponseType { +export interface InfiniteArticleResponseType extends TotalArticleInquiredResponseType { cursorId: string; cursorViews?: string; cursorLikes?: string; diff --git a/frontend/src/components/@helper/observer/InfiniteScrollObserver.tsx b/frontend/src/components/@helper/observer/InfiniteScrollObserver.tsx index 45196ca73..2b4092752 100644 --- a/frontend/src/components/@helper/observer/InfiniteScrollObserver.tsx +++ b/frontend/src/components/@helper/observer/InfiniteScrollObserver.tsx @@ -2,10 +2,10 @@ import { PropsWithStrictChildren } from 'gongseek-types'; import { useEffect, useRef } from 'react'; import { InfiniteQueryObserverResult } from 'react-query'; -import { InfiniteArticleResponse } from '@/api/article/articleType'; +import { InfiniteArticleResponseType } from '@/api/article/articleType'; import { InfiniteSearchResultType } from '@/types/searchResponse'; -export type ObserverResponseType = InfiniteArticleResponse | InfiniteSearchResultType; +export type ObserverResponseType = InfiniteArticleResponseType | InfiniteSearchResultType; interface infiniteScrollObserverProps { hasNext: boolean; fetchNextPage: () => Promise>; diff --git a/frontend/src/hooks/article/useGetAllArticles.tsx b/frontend/src/hooks/article/useGetAllArticles.tsx index ff77182c2..a458dc3b6 100644 --- a/frontend/src/hooks/article/useGetAllArticles.tsx +++ b/frontend/src/hooks/article/useGetAllArticles.tsx @@ -4,7 +4,7 @@ import { useInfiniteQuery } from 'react-query'; import { useRecoilState } from 'recoil'; import { getAllArticle } from '@/api/article/article'; -import { InfiniteArticleResponse } from '@/api/article/articleType'; +import { InfiniteArticleResponseType } from '@/api/article/articleType'; import { ErrorMessage } from '@/constants/ErrorMessage'; import useThrowCustomError from '@/hooks/common/useThrowCustomError'; import { categoryState } from '@/store/categoryState'; @@ -14,7 +14,7 @@ const useGetAllArticles = () => { const [sortIndex, setSortIndex] = useState('최신순'); const { data, isLoading, isError, isSuccess, error, refetch, fetchNextPage } = useInfiniteQuery< - InfiniteArticleResponse, + InfiniteArticleResponseType, AxiosError<{ errorCode: keyof typeof ErrorMessage; message: string }> >( ['all-articles', currentCategory], diff --git a/frontend/src/hooks/article/useGetCategoryArticles.tsx b/frontend/src/hooks/article/useGetCategoryArticles.tsx index f1e7c2ae9..1d61b7d40 100644 --- a/frontend/src/hooks/article/useGetCategoryArticles.tsx +++ b/frontend/src/hooks/article/useGetCategoryArticles.tsx @@ -3,7 +3,7 @@ import { useEffect, useState } from 'react'; import { useInfiniteQuery } from 'react-query'; import { getAllArticle } from '@/api/article/article'; -import { InfiniteArticleResponse } from '@/api/article/articleType'; +import { InfiniteArticleResponseType } from '@/api/article/articleType'; import { ErrorMessage } from '@/constants/ErrorMessage'; import useThrowCustomError from '@/hooks/common/useThrowCustomError'; @@ -11,7 +11,7 @@ const useGetCategoryArticles = (category: string) => { const [sortIndex, setSortIndex] = useState('최신순'); const { data, isLoading, isError, isSuccess, error, refetch, fetchNextPage } = useInfiniteQuery< - InfiniteArticleResponse, + InfiniteArticleResponseType, AxiosError<{ errorCode: keyof typeof ErrorMessage; message: string }> >( ['articles', category], From aecea2fa3a505cbd5262fa8df58d79aaf049ed78 Mon Sep 17 00:00:00 2001 From: JASUN LEE Date: Mon, 24 Oct 2022 17:03:38 +0900 Subject: [PATCH 10/20] =?UTF-8?q?refactor:=20=EA=B8=B0=EC=A1=B4=EC=97=90?= =?UTF-8?q?=20types=ED=95=98=EC=9C=84=EC=97=90=20=EC=A1=B4=EC=9E=AC?= =?UTF-8?q?=ED=95=98=EB=8D=98=20type=20=EC=A0=9C=EA=B1=B0=20=EB=B0=8F=20?= =?UTF-8?q?=EC=83=88=EB=A1=AD=EA=B2=8C=20=EC=A7=A0=20commentType=20?= =?UTF-8?q?=EC=A0=81=EC=9A=A9?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- frontend/src/api/comment/commentType.ts | 36 +++++++++++++++++++ frontend/src/api/comment/comments.ts | 8 ++--- frontend/src/api/user/myPage.ts | 4 +-- .../components/comment/Comment/Comment.tsx | 4 +-- .../comment/CommentContent/CommentContent.tsx | 4 +-- .../user/UserCommentItem/UserCommentItem.tsx | 4 +-- .../src/hooks/comment/useGetDetailComment.tsx | 4 +-- .../src/hooks/user/useGetUserComments.tsx | 4 +-- frontend/src/mock/comment.ts | 5 +-- frontend/src/mock/myPage.ts | 4 +-- frontend/src/pages/Detail/index.tsx | 4 +-- .../User/UserCommentItem.stories.tsx | 6 ++-- frontend/src/types/commentResponse.ts | 23 ------------ 13 files changed, 63 insertions(+), 47 deletions(-) create mode 100644 frontend/src/api/comment/commentType.ts delete mode 100644 frontend/src/types/commentResponse.ts diff --git a/frontend/src/api/comment/commentType.ts b/frontend/src/api/comment/commentType.ts new file mode 100644 index 000000000..0e6bffdea --- /dev/null +++ b/frontend/src/api/comment/commentType.ts @@ -0,0 +1,36 @@ +import { AuthorType } from '@/api/article/articleType'; + +export interface SingleCommentItemType { + id: number; + content: string; + author: AuthorType; + isAuthor: boolean; + createdAt: string; + updatedAt: string; +} + +export interface TotalCommentResponseType { + comments: SingleCommentItemType[]; +} + +export interface MyPageCommentItemResponse { + id: number; + content: string; + createdAt: string; + updatedAt: string; + articleId: number; + articleTitle: string; + category: string; +} + +export interface MyPageCommentResponse { + comments: MyPageCommentItemResponse[]; +} + +export interface CreateCommentRequestType { + content: string; + isAnonymous: boolean; +} +export interface UpdateCommentRequestType { + content: string; +} diff --git a/frontend/src/api/comment/comments.ts b/frontend/src/api/comment/comments.ts index f85d3b290..e2b5abce7 100644 --- a/frontend/src/api/comment/comments.ts +++ b/frontend/src/api/comment/comments.ts @@ -1,13 +1,13 @@ -import { CommentType } from '@/types/commentResponse'; +import { TotalCommentResponseType } from '@/api/comment/commentType'; import { generateAxiosInstanceWithAccessToken } from '@/utils/generateAxiosInstance'; export const postComments = ({ - content, id, + content, isAnonymous, }: { - content: string; id: string; + content: string; isAnonymous: boolean; }) => { const axiosInstance = generateAxiosInstanceWithAccessToken(); @@ -18,7 +18,7 @@ export const postComments = ({ export const getComments = async (id: string) => { const axiosInstance = generateAxiosInstanceWithAccessToken(); - const { data } = await axiosInstance.get<{ comments: CommentType[] }>( + const { data } = await axiosInstance.get( `/api/articles/${id}/comments`, ); return data; diff --git a/frontend/src/api/user/myPage.ts b/frontend/src/api/user/myPage.ts index 236f49602..93e9fe6a6 100644 --- a/frontend/src/api/user/myPage.ts +++ b/frontend/src/api/user/myPage.ts @@ -1,7 +1,7 @@ import { AxiosResponse } from 'axios'; import { AuthorType, MyPageUserArticleResponseType } from '@/api/article/articleType'; -import { UserCommentResponse } from '@/types/commentResponse'; +import { MyPageCommentResponse } from '@/api/comment/commentType'; import { generateAxiosInstanceWithAccessToken } from '@/utils/generateAxiosInstance'; export const getUserInfo = async () => { @@ -20,7 +20,7 @@ export const getUserArticles = async () => { export const getUserComments = async () => { const axiosInstance = generateAxiosInstanceWithAccessToken(); - const { data } = await axiosInstance.get('/api/members/me/comments'); + const { data } = await axiosInstance.get('/api/members/me/comments'); return data; }; diff --git a/frontend/src/components/comment/Comment/Comment.tsx b/frontend/src/components/comment/Comment/Comment.tsx index f70d1b3c6..b965e527f 100644 --- a/frontend/src/components/comment/Comment/Comment.tsx +++ b/frontend/src/components/comment/Comment/Comment.tsx @@ -1,13 +1,13 @@ +import { SingleCommentItemType } from '@/api/comment/commentType'; import Loading from '@/components/@common/Loading/Loading'; import ToastUiViewer from '@/components/@common/ToastUiViewer/ToastUiViewer'; import * as S from '@/components/comment/Comment/Comment.styles'; import useDeleteComment from '@/hooks/comment/useDeleteComment'; import useDetailCommentState from '@/hooks/comment/useDetailCommentState'; -import { CommentType } from '@/types/commentResponse'; import { convertGithubAvatarUrlForResize } from '@/utils/converter'; import { dateTimeConverter } from '@/utils/converter'; -export interface CommentProps extends CommentType { +export interface CommentProps extends Omit { articleId: string; tabIndex: number; } diff --git a/frontend/src/components/comment/CommentContent/CommentContent.tsx b/frontend/src/components/comment/CommentContent/CommentContent.tsx index c33f5939d..1abc4625a 100644 --- a/frontend/src/components/comment/CommentContent/CommentContent.tsx +++ b/frontend/src/components/comment/CommentContent/CommentContent.tsx @@ -1,12 +1,12 @@ +import { SingleCommentItemType } from '@/api/comment/commentType'; import EmptyMessage from '@/components/@common/EmptyMessage/EmptyMessage'; import Comment from '@/components/comment/Comment/Comment'; import * as S from '@/components/comment/CommentContent/CommentContent.styles'; import useDetailCommentState from '@/hooks/comment/useDetailCommentState'; -import { CommentType } from '@/types/commentResponse'; export interface CommentContentProps { articleId: string; - commentList: CommentType[]; + commentList: SingleCommentItemType[]; } const CommentContent = ({ articleId, commentList }: CommentContentProps) => { diff --git a/frontend/src/components/user/UserCommentItem/UserCommentItem.tsx b/frontend/src/components/user/UserCommentItem/UserCommentItem.tsx index 238031daf..9e9ddde11 100644 --- a/frontend/src/components/user/UserCommentItem/UserCommentItem.tsx +++ b/frontend/src/components/user/UserCommentItem/UserCommentItem.tsx @@ -1,10 +1,10 @@ import { useNavigate } from 'react-router-dom'; +import { MyPageCommentItemResponse } from '@/api/comment/commentType'; import * as S from '@/components/user/UserCommentItem/UserCommentItem.styles'; -import { UserComment } from '@/types/commentResponse'; import { dateTimeConverter } from '@/utils/converter'; -const UserCommentItem = ({ comment }: { comment: UserComment }) => { +const UserCommentItem = ({ comment }: { comment: MyPageCommentItemResponse }) => { const { id, content, createdAt, updatedAt, articleId, category, articleTitle } = comment; const navigate = useNavigate(); const 한글_카테고리 = category === 'question' ? '질문' : '토론'; diff --git a/frontend/src/hooks/comment/useGetDetailComment.tsx b/frontend/src/hooks/comment/useGetDetailComment.tsx index bbd786c5a..04614da9b 100644 --- a/frontend/src/hooks/comment/useGetDetailComment.tsx +++ b/frontend/src/hooks/comment/useGetDetailComment.tsx @@ -1,14 +1,14 @@ import { AxiosError } from 'axios'; import { useQuery } from 'react-query'; +import { TotalCommentResponseType } from '@/api/comment/commentType'; import { getComments } from '@/api/comment/comments'; import { ErrorMessage } from '@/constants/ErrorMessage'; import useThrowCustomError from '@/hooks/common/useThrowCustomError'; -import { CommentType } from '@/types/commentResponse'; const useGetDetailComment = (id: string) => { const { data, isSuccess, isError, isLoading, isIdle, error } = useQuery< - { comments: CommentType[] }, + TotalCommentResponseType, AxiosError<{ errorCode: keyof typeof ErrorMessage; message: string }> >('comments', () => getComments(id), { retry: false, refetchOnWindowFocus: false }); diff --git a/frontend/src/hooks/user/useGetUserComments.tsx b/frontend/src/hooks/user/useGetUserComments.tsx index 70f578501..60d779fe4 100644 --- a/frontend/src/hooks/user/useGetUserComments.tsx +++ b/frontend/src/hooks/user/useGetUserComments.tsx @@ -1,14 +1,14 @@ import { AxiosError } from 'axios'; import { useQuery } from 'react-query'; +import { MyPageCommentResponse } from '@/api/comment/commentType'; import { getUserComments } from '@/api/user/myPage'; import { ErrorMessage } from '@/constants/ErrorMessage'; import useThrowCustomError from '@/hooks/common/useThrowCustomError'; -import { UserCommentResponse } from '@/types/commentResponse'; const useGetUserComments = () => { const { data, isSuccess, isError, isLoading, error } = useQuery< - UserCommentResponse, + MyPageCommentResponse, AxiosError<{ errorCode: keyof typeof ErrorMessage; message: string }> >('user-comments', getUserComments, { retry: 1, refetchOnWindowFocus: false }); diff --git a/frontend/src/mock/comment.ts b/frontend/src/mock/comment.ts index 71e98336e..43c342094 100644 --- a/frontend/src/mock/comment.ts +++ b/frontend/src/mock/comment.ts @@ -1,12 +1,12 @@ import { rest } from 'msw'; +import { SingleCommentItemType } from '@/api/comment/commentType'; import { HOME_URL } from '@/constants/apiUrl'; import mockData from '@/mock/data/comment.json'; -import { CommentType } from '@/types/commentResponse'; const data = localStorage.getItem('mock-comments'); -const mockComments = data ? (JSON.parse(data) as CommentType[][]) : []; +const mockComments = data ? (JSON.parse(data) as SingleCommentItemType[][]) : []; export const CommentHandler = [ rest.post<{ content: string }>( @@ -31,6 +31,7 @@ export const CommentHandler = [ }, createdAt: '2022-07-28', isAuthor: true, + updatedAt: '2022-08-08', }); localStorage.setItem('mock-comments', JSON.stringify(mockComments)); diff --git a/frontend/src/mock/myPage.ts b/frontend/src/mock/myPage.ts index c551dedff..d3941cc25 100644 --- a/frontend/src/mock/myPage.ts +++ b/frontend/src/mock/myPage.ts @@ -1,8 +1,8 @@ import { rest } from 'msw'; import { AuthorType, MyPageUserArticleResponseType } from '@/api/article/articleType'; +import { MyPageCommentResponse } from '@/api/comment/commentType'; import { HOME_URL } from '@/constants/apiUrl'; -import { UserCommentResponse } from '@/types/commentResponse'; export const MyPageHandler = [ rest.get(`${HOME_URL}/api/members/me`, (req, res, ctx) => @@ -55,7 +55,7 @@ export const MyPageHandler = [ ), ), - rest.get(`${HOME_URL}/api/members/me/comments`, (req, res, ctx) => + rest.get(`${HOME_URL}/api/members/me/comments`, (req, res, ctx) => res( ctx.status(200), ctx.json({ diff --git a/frontend/src/pages/Detail/index.tsx b/frontend/src/pages/Detail/index.tsx index 4fbe21112..a83df906b 100644 --- a/frontend/src/pages/Detail/index.tsx +++ b/frontend/src/pages/Detail/index.tsx @@ -1,15 +1,15 @@ import { PropsWithOptionalChildren } from 'gongseek-types'; import { ArticleTotalType } from '@/api/article/articleType'; +import { SingleCommentItemType } from '@/api/comment/commentType'; import ArticleContent from '@/components/article/ArticleContent/ArticleContent'; import CommentContent from '@/components/comment/CommentContent/CommentContent'; import useScrollToTop from '@/hooks/common/useScrollToTop'; import * as S from '@/pages/Detail/index.styles'; -import { CommentType } from '@/types/commentResponse'; export interface DetailProps { article: Omit; - commentList: CommentType[]; + commentList: SingleCommentItemType[]; articleId: string; category: string; } diff --git a/frontend/src/storybook/User/UserCommentItem.stories.tsx b/frontend/src/storybook/User/UserCommentItem.stories.tsx index 81a6919b1..777a0fc6a 100644 --- a/frontend/src/storybook/User/UserCommentItem.stories.tsx +++ b/frontend/src/storybook/User/UserCommentItem.stories.tsx @@ -1,7 +1,7 @@ import { BrowserRouter } from 'react-router-dom'; +import { MyPageCommentItemResponse } from '@/api/comment/commentType'; import UserCommentItem from '@/components/user/UserCommentItem/UserCommentItem'; -import { UserComment } from '@/types/commentResponse'; import { Meta, Story } from '@storybook/react'; export default { @@ -18,7 +18,9 @@ export default { ], } as Meta; -const Template: Story<{ comment: UserComment }> = (args) => ; +const Template: Story<{ comment: MyPageCommentItemResponse }> = (args) => ( + +); export const UserCommentItemTemplate = Template.bind({}); diff --git a/frontend/src/types/commentResponse.ts b/frontend/src/types/commentResponse.ts deleted file mode 100644 index 5b93a2c12..000000000 --- a/frontend/src/types/commentResponse.ts +++ /dev/null @@ -1,23 +0,0 @@ -import { AuthorType } from '@/api/article/articleType'; - -export interface CommentType { - id: number; - author: AuthorType; - content: string; - createdAt: string; - isAuthor: boolean; -} - -export interface UserComment { - id: number; - content: string; - createdAt: string; - updatedAt: string; - articleId: number; - articleTitle: string; - category: string; -} - -export interface UserCommentResponse { - comments: UserComment[]; -} From 035f2d992f6193e0840303934c0153dfe78feaf9 Mon Sep 17 00:00:00 2001 From: JASUN LEE Date: Mon, 24 Oct 2022 17:17:55 +0900 Subject: [PATCH 11/20] =?UTF-8?q?refactor:=20=EA=B8=B0=EC=A1=B4=EC=97=90?= =?UTF-8?q?=20=EC=9E=88=EB=8D=98=20HashTagType=EC=82=AD=EC=A0=9C=20?= =?UTF-8?q?=EB=B0=8F=20=EB=B3=80=EB=8F=99=EB=90=9C=20=ED=83=80=EC=9E=85=20?= =?UTF-8?q?=EC=A0=81=EC=9A=A9?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- frontend/src/api/hashTag/hashTag.ts | 3 ++- frontend/src/api/hashTag/hashTagType.ts | 20 +++++++++++++++++++ frontend/src/api/search/search.ts | 3 ++- .../src/hooks/hashTag/useGetAllHashTags.tsx | 3 ++- .../hooks/hashTag/useGetArticleByHashTag.tsx | 4 ++-- 5 files changed, 28 insertions(+), 5 deletions(-) create mode 100644 frontend/src/api/hashTag/hashTagType.ts diff --git a/frontend/src/api/hashTag/hashTag.ts b/frontend/src/api/hashTag/hashTag.ts index 39fbc018f..e75c4bbad 100644 --- a/frontend/src/api/hashTag/hashTag.ts +++ b/frontend/src/api/hashTag/hashTag.ts @@ -1,7 +1,8 @@ +import { HashTagResponseType } from '@/api/hashTag/hashTagType'; import { generateAxiosInstanceWithAccessToken } from '@/utils/generateAxiosInstance'; export const getAllHashTag = async () => { const axiosInstance = generateAxiosInstanceWithAccessToken(); - const { data } = await axiosInstance.get<{ tag: string[] }>('/api/tags'); + const { data } = await axiosInstance.get('/api/tags'); return data; }; diff --git a/frontend/src/api/hashTag/hashTagType.ts b/frontend/src/api/hashTag/hashTagType.ts new file mode 100644 index 000000000..3087acd86 --- /dev/null +++ b/frontend/src/api/hashTag/hashTagType.ts @@ -0,0 +1,20 @@ +import { ArticleTotalType } from '@/api/article/articleType'; + +export interface HashTagResponseType { + tag: string[]; +} + +export type SingleHashTagSearchItemType = Omit< + ArticleTotalType, + 'updatedAt' | 'isAuthor' | 'hasVote' +>; + +export interface HashTagSearchResponseType { + articles: SingleHashTagSearchItemType[]; + hasNext: boolean; +} + +export interface InfiniteHashTagSearchResponseType extends HashTagSearchResponseType { + cursorId: string; + hashTags: string; +} diff --git a/frontend/src/api/search/search.ts b/frontend/src/api/search/search.ts index b54d2b917..eafae0502 100644 --- a/frontend/src/api/search/search.ts +++ b/frontend/src/api/search/search.ts @@ -1,3 +1,4 @@ +import { HashTagSearchResponseType } from '@/api/hashTag/hashTagType'; import { SearchResultType } from '@/types/searchResponse'; import { generateAxiosInstanceWithAccessToken } from '@/utils/generateAxiosInstance'; @@ -63,7 +64,7 @@ export const getArticleByHashTag = async ({ }) => { const encodedTarget = encodeURIComponent(hashTags); const axiosInstance = generateAxiosInstanceWithAccessToken(); - const { data } = await axiosInstance.get( + const { data } = await axiosInstance.get( `/api/articles/search/tags?tagsText=${encodedTarget}&cursorId=${cursorId}&size=6`, ); return { diff --git a/frontend/src/hooks/hashTag/useGetAllHashTags.tsx b/frontend/src/hooks/hashTag/useGetAllHashTags.tsx index 57e7ec621..4a656b48e 100644 --- a/frontend/src/hooks/hashTag/useGetAllHashTags.tsx +++ b/frontend/src/hooks/hashTag/useGetAllHashTags.tsx @@ -2,12 +2,13 @@ import { AxiosError } from 'axios'; import { useQuery } from 'react-query'; import { getAllHashTag } from '@/api/hashTag/hashTag'; +import { HashTagResponseType } from '@/api/hashTag/hashTagType'; import { ErrorMessage } from '@/constants/ErrorMessage'; import useThrowCustomError from '@/hooks/common/useThrowCustomError'; const useGetAllHashTags = () => { const { data, isLoading, isError, isSuccess, error } = useQuery< - { tag: string[] }, + HashTagResponseType, AxiosError<{ errorCode: keyof typeof ErrorMessage; message: string }> >('all-hash-tag', getAllHashTag); diff --git a/frontend/src/hooks/hashTag/useGetArticleByHashTag.tsx b/frontend/src/hooks/hashTag/useGetArticleByHashTag.tsx index 3245c0882..21abb3b96 100644 --- a/frontend/src/hooks/hashTag/useGetArticleByHashTag.tsx +++ b/frontend/src/hooks/hashTag/useGetArticleByHashTag.tsx @@ -2,16 +2,16 @@ import { AxiosError } from 'axios'; import { useEffect } from 'react'; import { useInfiniteQuery } from 'react-query'; +import { InfiniteHashTagSearchResponseType } from '@/api/hashTag/hashTagType'; import { getArticleByHashTag } from '@/api/search/search'; import { ErrorMessage } from '@/constants/ErrorMessage'; import useThrowCustomError from '@/hooks/common/useThrowCustomError'; -import { InfiniteHashTagSearchResultType } from '@/types/searchResponse'; const useGetArticleByHashTag = (hashTag: string[]) => { const tags = hashTag.join(','); const cursorId = ''; const { data, isLoading, isSuccess, isError, error, refetch, fetchNextPage } = useInfiniteQuery< - InfiniteHashTagSearchResultType, + InfiniteHashTagSearchResponseType, AxiosError<{ errorCode: keyof typeof ErrorMessage; message: string }> >( ['hashtag-search-result', tags], From 70c41521d948945e0fd16931859c4d834f917553 Mon Sep 17 00:00:00 2001 From: JASUN LEE Date: Mon, 24 Oct 2022 17:26:12 +0900 Subject: [PATCH 12/20] =?UTF-8?q?refactor:=20searchType=EC=97=90=20?= =?UTF-8?q?=EB=8C=80=ED=95=9C=20=EC=9C=84=EC=B9=98=20=EC=A1=B0=EC=A0=95=20?= =?UTF-8?q?=EB=B0=8F=20=EC=83=88=EB=A1=9C=EC=9A=B4=20searchType=20?= =?UTF-8?q?=EC=A0=81=EC=9A=A9?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- frontend/src/api/search/search.ts | 6 +++--- frontend/src/api/search/searchType.ts | 12 ++++++++++++ .../@helper/observer/InfiniteScrollObserver.tsx | 4 ++-- frontend/src/hooks/search/useGetSearch.tsx | 4 ++-- frontend/src/mock/search.ts | 6 +++--- frontend/src/types/searchResponse.ts | 17 ----------------- 6 files changed, 22 insertions(+), 27 deletions(-) create mode 100644 frontend/src/api/search/searchType.ts delete mode 100644 frontend/src/types/searchResponse.ts diff --git a/frontend/src/api/search/search.ts b/frontend/src/api/search/search.ts index eafae0502..705efe314 100644 --- a/frontend/src/api/search/search.ts +++ b/frontend/src/api/search/search.ts @@ -1,5 +1,5 @@ import { HashTagSearchResponseType } from '@/api/hashTag/hashTagType'; -import { SearchResultType } from '@/types/searchResponse'; +import { ArticleSearchResponseType } from '@/api/search/searchType'; import { generateAxiosInstanceWithAccessToken } from '@/utils/generateAxiosInstance'; export const getUserSearchResult = async ({ @@ -13,7 +13,7 @@ export const getUserSearchResult = async ({ }) => { const encodedTarget = encodeURIComponent(target); const axiosInstance = generateAxiosInstanceWithAccessToken(); - const { data } = await axiosInstance.get( + const { data } = await axiosInstance.get( `/api/articles/search/author?author=${encodedTarget}&cursorId=${cursorId}&size=6`, ); return { @@ -39,7 +39,7 @@ export const getArticleSearchResult = async ({ }) => { const encodedTarget = encodeURIComponent(target); const axiosInstance = generateAxiosInstanceWithAccessToken(); - const { data } = await axiosInstance.get( + const { data } = await axiosInstance.get( `/api/articles/search/text?text=${encodedTarget}&cursorId=${cursorId}&size=6`, ); diff --git a/frontend/src/api/search/searchType.ts b/frontend/src/api/search/searchType.ts new file mode 100644 index 000000000..b1bcbd689 --- /dev/null +++ b/frontend/src/api/search/searchType.ts @@ -0,0 +1,12 @@ +import { ArticleTotalType } from '@/api/article/articleType'; + +export interface ArticleSearchResponseType { + articles: Omit[]; + hasNext: boolean; +} + +export interface InfiniteArticleSearchResponseType extends ArticleSearchResponseType { + cursorId: string; + target: string; + searchIndex: string; +} diff --git a/frontend/src/components/@helper/observer/InfiniteScrollObserver.tsx b/frontend/src/components/@helper/observer/InfiniteScrollObserver.tsx index 2b4092752..d3b5c5833 100644 --- a/frontend/src/components/@helper/observer/InfiniteScrollObserver.tsx +++ b/frontend/src/components/@helper/observer/InfiniteScrollObserver.tsx @@ -3,9 +3,9 @@ import { useEffect, useRef } from 'react'; import { InfiniteQueryObserverResult } from 'react-query'; import { InfiniteArticleResponseType } from '@/api/article/articleType'; -import { InfiniteSearchResultType } from '@/types/searchResponse'; +import { InfiniteArticleSearchResponseType } from '@/api/search/searchType'; -export type ObserverResponseType = InfiniteArticleResponseType | InfiniteSearchResultType; +export type ObserverResponseType = InfiniteArticleResponseType | InfiniteArticleSearchResponseType; interface infiniteScrollObserverProps { hasNext: boolean; fetchNextPage: () => Promise>; diff --git a/frontend/src/hooks/search/useGetSearch.tsx b/frontend/src/hooks/search/useGetSearch.tsx index eedfd0982..34c4c9efb 100644 --- a/frontend/src/hooks/search/useGetSearch.tsx +++ b/frontend/src/hooks/search/useGetSearch.tsx @@ -2,15 +2,15 @@ import { AxiosError } from 'axios'; import { useInfiniteQuery } from 'react-query'; import { getSearchResult } from '@/api/search/search'; +import { InfiniteArticleSearchResponseType } from '@/api/search/searchType'; import { ErrorMessage } from '@/constants/ErrorMessage'; import useThrowCustomError from '@/hooks/common/useThrowCustomError'; -import { InfiniteSearchResultType } from '@/types/searchResponse'; const useGetSearch = ({ target, searchIndex }: { target: string; searchIndex: string }) => { const cursorId = ''; const { data, isSuccess, isLoading, isError, isIdle, error, refetch, fetchNextPage } = useInfiniteQuery< - InfiniteSearchResultType, + InfiniteArticleSearchResponseType, AxiosError<{ errorCode: keyof typeof ErrorMessage; message: string }> >( ['search-result', `${searchIndex}-${target}`], diff --git a/frontend/src/mock/search.ts b/frontend/src/mock/search.ts index 1f33b7cdd..9615c54ec 100644 --- a/frontend/src/mock/search.ts +++ b/frontend/src/mock/search.ts @@ -1,11 +1,11 @@ import { rest } from 'msw'; import { ArticleTotalType } from '@/api/article/articleType'; +import { ArticleSearchResponseType } from '@/api/search/searchType'; import { HOME_URL } from '@/constants/apiUrl'; -import { SearchResultType } from '@/types/searchResponse'; export const SearchHandler = [ - rest.get(`${HOME_URL}/api/articles/search/author`, (req, res, ctx) => { + rest.get(`${HOME_URL}/api/articles/search/author`, (req, res, ctx) => { const cursorId = req.url.searchParams.get('cursorId'); const pageSize = req.url.searchParams.get('size'); const author = req.url.searchParams.get('author'); @@ -62,7 +62,7 @@ export const SearchHandler = [ }), ); }), - rest.get(`${HOME_URL}/api/articles/search/text`, (req, res, ctx) => { + rest.get(`${HOME_URL}/api/articles/search/text`, (req, res, ctx) => { const cursorId = req.url.searchParams.get('cursorId'); const pageSize = req.url.searchParams.get('size'); const searchText = req.url.searchParams.get('text'); diff --git a/frontend/src/types/searchResponse.ts b/frontend/src/types/searchResponse.ts deleted file mode 100644 index 5f855d599..000000000 --- a/frontend/src/types/searchResponse.ts +++ /dev/null @@ -1,17 +0,0 @@ -import { ArticleTotalType } from '@/api/article/articleType'; - -export interface SearchResultType { - articles: Omit[]; - hasNext: boolean; -} - -export interface InfiniteSearchResultType extends SearchResultType { - cursorId: string; - target: string; - searchIndex: string; -} - -export interface InfiniteHashTagSearchResultType extends SearchResultType { - cursorId: string; - hashTags: string; -} From 15a9ff94c1c456135b4238df7e5ece96d2da6f18 Mon Sep 17 00:00:00 2001 From: JASUN LEE Date: Mon, 24 Oct 2022 17:33:10 +0900 Subject: [PATCH 13/20] =?UTF-8?q?refactor:=20tempArticle=EA=B3=BC=20?= =?UTF-8?q?=EA=B4=80=EB=A0=A8=EB=90=9C=20=ED=83=80=EC=9E=85=EB=81=BC?= =?UTF-8?q?=EB=A6=AC=20=EB=B6=84=EB=A6=AC=20=EB=B0=8F=20=EC=A0=81=EC=9A=A9?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- frontend/src/api/article/articleType.ts | 17 ++--------------- frontend/src/api/tempArticle/tempArticle.ts | 2 +- frontend/src/api/tempArticle/tempArticleType.ts | 16 ++++++++++++++++ .../TemporaryArticleItem.tsx | 2 +- .../TemporaryArticleList.tsx | 2 +- .../hooks/tempArticle/useGetTempArticles.tsx | 2 +- .../tempArticle/useGetTempDetailArticles.tsx | 2 +- 7 files changed, 23 insertions(+), 20 deletions(-) create mode 100644 frontend/src/api/tempArticle/tempArticleType.ts diff --git a/frontend/src/api/article/articleType.ts b/frontend/src/api/article/articleType.ts index a751d3104..b5eb0eb1e 100644 --- a/frontend/src/api/article/articleType.ts +++ b/frontend/src/api/article/articleType.ts @@ -1,3 +1,5 @@ +import { SingleTempArticleItemResponseType } from '@/api/tempArticle/tempArticleType'; + export type AuthorType = { name: string; avatarUrl: string }; export type CategoryType = 'question' | 'discussion'; @@ -39,21 +41,6 @@ export interface InfiniteArticleResponseType extends TotalArticleInquiredRespons cursorLikes?: string; } -export type SingleTempArticleItemResponseType = Pick< - ArticleTotalType, - 'id' | 'title' | 'createdAt' | 'category' ->; - -export interface TotalTempArticleResponseType { - values: SingleTempArticleItemResponseType[]; -} - -export interface DetailTempArticleResponseType extends SingleTempArticleItemResponseType { - tag: string[]; - content: string; - isAnonymous: boolean; -} - export interface SingleMyPageUserArticleResponseType extends SingleTempArticleItemResponseType { commentCount: number; updatedAt: string; diff --git a/frontend/src/api/tempArticle/tempArticle.ts b/frontend/src/api/tempArticle/tempArticle.ts index 6825a125e..f13753374 100644 --- a/frontend/src/api/tempArticle/tempArticle.ts +++ b/frontend/src/api/tempArticle/tempArticle.ts @@ -1,7 +1,7 @@ import { DetailTempArticleResponseType, TotalTempArticleResponseType, -} from '@/api/article/articleType'; +} from '@/api/tempArticle/tempArticleType'; import { postTempArticleProps } from '@/hooks/tempArticle/usePostTempArticle'; import { generateAxiosInstanceWithAccessToken } from '@/utils/generateAxiosInstance'; diff --git a/frontend/src/api/tempArticle/tempArticleType.ts b/frontend/src/api/tempArticle/tempArticleType.ts new file mode 100644 index 000000000..483720d2a --- /dev/null +++ b/frontend/src/api/tempArticle/tempArticleType.ts @@ -0,0 +1,16 @@ +import { ArticleTotalType } from '@/api/article/articleType'; + +export type SingleTempArticleItemResponseType = Pick< + ArticleTotalType, + 'id' | 'title' | 'createdAt' | 'category' +>; + +export interface TotalTempArticleResponseType { + values: SingleTempArticleItemResponseType[]; +} + +export interface DetailTempArticleResponseType extends SingleTempArticleItemResponseType { + tag: string[]; + content: string; + isAnonymous: boolean; +} diff --git a/frontend/src/components/tempArticle/TemporaryArticleItem/TemporaryArticleItem.tsx b/frontend/src/components/tempArticle/TemporaryArticleItem/TemporaryArticleItem.tsx index e41e8f7c9..a87060c84 100644 --- a/frontend/src/components/tempArticle/TemporaryArticleItem/TemporaryArticleItem.tsx +++ b/frontend/src/components/tempArticle/TemporaryArticleItem/TemporaryArticleItem.tsx @@ -1,4 +1,4 @@ -import { SingleTempArticleItemResponseType } from '@/api/article/articleType'; +import { SingleTempArticleItemResponseType } from '@/api/tempArticle/tempArticleType'; import * as S from '@/components/tempArticle/TemporaryArticleItem/TemporaryArticleItem.styles'; import { categoryNameConverter, dateTimeConverter } from '@/utils/converter'; diff --git a/frontend/src/components/tempArticle/TemporaryArticleList/TemporaryArticleList.tsx b/frontend/src/components/tempArticle/TemporaryArticleList/TemporaryArticleList.tsx index 3c5c7d390..51c6739e6 100644 --- a/frontend/src/components/tempArticle/TemporaryArticleList/TemporaryArticleList.tsx +++ b/frontend/src/components/tempArticle/TemporaryArticleList/TemporaryArticleList.tsx @@ -1,6 +1,6 @@ import { useNavigate } from 'react-router-dom'; -import { SingleTempArticleItemResponseType } from '@/api/article/articleType'; +import { SingleTempArticleItemResponseType } from '@/api/tempArticle/tempArticleType'; import EmptyMessage from '@/components/@common/EmptyMessage/EmptyMessage'; import Loading from '@/components/@common/Loading/Loading'; import TemporaryArticleItem from '@/components/tempArticle/TemporaryArticleItem/TemporaryArticleItem'; diff --git a/frontend/src/hooks/tempArticle/useGetTempArticles.tsx b/frontend/src/hooks/tempArticle/useGetTempArticles.tsx index 685c4c147..099ec06ca 100644 --- a/frontend/src/hooks/tempArticle/useGetTempArticles.tsx +++ b/frontend/src/hooks/tempArticle/useGetTempArticles.tsx @@ -1,8 +1,8 @@ import { AxiosError } from 'axios'; import { useQuery } from 'react-query'; -import { TotalTempArticleResponseType } from '@/api/article/articleType'; import { getTempArticles } from '@/api/tempArticle/tempArticle'; +import { TotalTempArticleResponseType } from '@/api/tempArticle/tempArticleType'; import { ErrorMessage } from '@/constants/ErrorMessage'; import useThrowCustomError from '@/hooks/common/useThrowCustomError'; diff --git a/frontend/src/hooks/tempArticle/useGetTempDetailArticles.tsx b/frontend/src/hooks/tempArticle/useGetTempDetailArticles.tsx index 6e8d9f440..2b8165c0d 100644 --- a/frontend/src/hooks/tempArticle/useGetTempDetailArticles.tsx +++ b/frontend/src/hooks/tempArticle/useGetTempDetailArticles.tsx @@ -1,8 +1,8 @@ import { AxiosError, AxiosResponse } from 'axios'; import { useMutation } from 'react-query'; -import { DetailTempArticleResponseType } from '@/api/article/articleType'; import { getTempDetailArticle } from '@/api/tempArticle/tempArticle'; +import { DetailTempArticleResponseType } from '@/api/tempArticle/tempArticleType'; import { ErrorMessage } from '@/constants/ErrorMessage'; import useThrowCustomError from '@/hooks/common/useThrowCustomError'; From dcf214697e51052b4958da0aff32357dd59b57b4 Mon Sep 17 00:00:00 2001 From: JASUN LEE Date: Mon, 24 Oct 2022 19:01:45 +0900 Subject: [PATCH 14/20] =?UTF-8?q?refactor:=20=ED=88=AC=ED=91=9C=EC=97=90?= =?UTF-8?q?=20=EB=8C=80=ED=95=9C=20=ED=83=80=EC=9E=85=20=EB=B6=84=EB=A6=AC?= =?UTF-8?q?=20=EB=B0=8F=20=EC=A0=81=EC=9A=A9?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- frontend/src/api/vote/vote.ts | 36 +++------------------ frontend/src/api/vote/voteType.ts | 23 +++++++++++++ frontend/src/hooks/vote/useGetVote.tsx | 5 +-- frontend/src/hooks/vote/usePostVoteItem.tsx | 3 +- frontend/src/mock/vote.ts | 8 ++--- 5 files changed, 37 insertions(+), 38 deletions(-) create mode 100644 frontend/src/api/vote/voteType.ts diff --git a/frontend/src/api/vote/vote.ts b/frontend/src/api/vote/vote.ts index 623b79e3d..74d594dee 100644 --- a/frontend/src/api/vote/vote.ts +++ b/frontend/src/api/vote/vote.ts @@ -1,35 +1,15 @@ +import { CheckVoteRequestType, CreateVoteRequestType, VoteResponseType } from '@/api/vote/voteType'; import { generateAxiosInstanceWithAccessToken } from '@/utils/generateAxiosInstance'; -export interface VoteItems { - id: number; - content: string; - amount: number; -} - -export interface TVote { - articleId: string; - voteItems: VoteItems[]; - votedItemId: number | null; - expired: boolean; -} - export const getVoteItems = async (articleId: string) => { const axiosInstance = generateAxiosInstanceWithAccessToken(); - const { data } = await axiosInstance.get(`/api/articles/${articleId}/votes`); + const { data } = await axiosInstance.get(`/api/articles/${articleId}/votes`); return data; }; -export const registerVoteItems = ({ - articleId, - items, - expiryDate, -}: { - articleId: string; - items: string[]; - expiryDate: string; -}) => { +export const registerVoteItems = ({ articleId, items, expiryDate }: CreateVoteRequestType) => { const axiosInstance = generateAxiosInstanceWithAccessToken(); return axiosInstance.post<{ articleId: string }>(`/api/articles/${articleId}/votes`, { @@ -38,14 +18,8 @@ export const registerVoteItems = ({ }); }; -export const checkVoteItems = ({ - articleId, - votedItemId, -}: { - articleId: string; - votedItemId: string; -}) => { +export const checkVoteItems = ({ articleId, voteItemId }: CheckVoteRequestType) => { const axiosInstance = generateAxiosInstanceWithAccessToken(); - return axiosInstance.post(`/api/articles/${articleId}/votes/do`, { votedItemId }); + return axiosInstance.post(`/api/articles/${articleId}/votes/do`, { voteItemId }); }; diff --git a/frontend/src/api/vote/voteType.ts b/frontend/src/api/vote/voteType.ts new file mode 100644 index 000000000..dba2d64a8 --- /dev/null +++ b/frontend/src/api/vote/voteType.ts @@ -0,0 +1,23 @@ +export interface SingleVoteItemType { + id: number; + content: string; + amount: number; +} + +export interface VoteResponseType { + articleId: string; + voteItems: SingleVoteItemType[]; + votedItemId: number | null; + expired: boolean; +} + +export interface CreateVoteRequestType { + items: string[]; + expiryDate: string; + articleId: string; +} + +export interface CheckVoteRequestType { + voteItemId: string; + articleId: string; +} diff --git a/frontend/src/hooks/vote/useGetVote.tsx b/frontend/src/hooks/vote/useGetVote.tsx index 75d0aec2d..8f070b717 100644 --- a/frontend/src/hooks/vote/useGetVote.tsx +++ b/frontend/src/hooks/vote/useGetVote.tsx @@ -2,13 +2,14 @@ import { AxiosError } from 'axios'; import { useEffect, useState } from 'react'; import { useQuery } from 'react-query'; -import { getVoteItems, TVote } from '@/api/vote/vote'; +import { getVoteItems } from '@/api/vote/vote'; +import { VoteResponseType } from '@/api/vote/voteType'; import { ErrorMessage } from '@/constants/ErrorMessage'; import useThrowCustomError from '@/hooks/common/useThrowCustomError'; const useVote = (articleId: string) => { const { data, isLoading, isError, isSuccess, error } = useQuery< - TVote, + VoteResponseType, AxiosError<{ errorCode: keyof typeof ErrorMessage; message: string }> >(['vote', `vote${articleId}`], () => getVoteItems(articleId), { retry: false, diff --git a/frontend/src/hooks/vote/usePostVoteItem.tsx b/frontend/src/hooks/vote/usePostVoteItem.tsx index 378c8e030..e5898deb7 100644 --- a/frontend/src/hooks/vote/usePostVoteItem.tsx +++ b/frontend/src/hooks/vote/usePostVoteItem.tsx @@ -3,6 +3,7 @@ import { useEffect } from 'react'; import { useMutation } from 'react-query'; import { checkVoteItems } from '@/api/vote/vote'; +import { CheckVoteRequestType } from '@/api/vote/voteType'; import { ErrorMessage } from '@/constants/ErrorMessage'; import useThrowCustomError from '@/hooks/common/useThrowCustomError'; import { queryClient } from '@/index'; @@ -11,7 +12,7 @@ const usePostVoteItem = (articleId: string) => { const { error, mutate, isError, isSuccess, isLoading } = useMutation< unknown, AxiosError<{ errorCode: keyof typeof ErrorMessage; message: string }>, - { articleId: string; voteItemId: string } + CheckVoteRequestType >(checkVoteItems); useEffect(() => { diff --git a/frontend/src/mock/vote.ts b/frontend/src/mock/vote.ts index 9873befe3..9c5ab3086 100644 --- a/frontend/src/mock/vote.ts +++ b/frontend/src/mock/vote.ts @@ -1,12 +1,12 @@ import { rest } from 'msw'; -import { TVote } from '@/api/vote/vote'; +import { VoteResponseType } from '@/api/vote/voteType'; import { HOME_URL } from '@/constants/apiUrl'; export const VoteHandler = [ rest.post<{ items: string[] }>(`${HOME_URL}/api/articles/:articleId/votes`, (req, res, ctx) => { const data = localStorage.getItem('mock-votes'); - const mockVotes = data ? (JSON.parse(data) as TVote[]) : []; + const mockVotes = data ? (JSON.parse(data) as VoteResponseType[]) : []; const { articleId } = req.params; const { items } = req.body; @@ -42,7 +42,7 @@ export const VoteHandler = [ rest.get(`${HOME_URL}/api/articles/:articleId/votes`, (req, res, ctx) => { const { articleId } = req.params; const data = localStorage.getItem('mock-votes'); - const mockVotes = data ? (JSON.parse(data) as TVote[]) : []; + const mockVotes = data ? (JSON.parse(data) as VoteResponseType[]) : []; const vote = mockVotes.find((mockVote) => mockVote.articleId === articleId); if (typeof vote === 'undefined') { @@ -56,7 +56,7 @@ export const VoteHandler = [ `${HOME_URL}/api/articles/:articleId/votes/do`, (req, res, ctx) => { const data = localStorage.getItem('mock-votes'); - const mockVotes = data ? (JSON.parse(data) as TVote[]) : []; + const mockVotes = data ? (JSON.parse(data) as VoteResponseType[]) : []; const { articleId } = req.params; const { voteItemId } = req.body; From b2c1d81959ee1d0bb27f438a069d7a424b2021e6 Mon Sep 17 00:00:00 2001 From: Jungmin Hwang <85891751+hwangstar156@users.noreply.github.com> Date: Wed, 26 Oct 2022 18:12:43 +0900 Subject: [PATCH 15/20] =?UTF-8?q?=EC=9D=B4=EB=AF=B8=EC=A7=80=20=EB=A6=AC?= =?UTF-8?q?=EC=82=AC=EC=9D=B4=EC=A7=95=EC=9D=B4=20=EB=90=98=EC=A7=80=20?= =?UTF-8?q?=EC=95=8A=EB=8A=94=20=EB=AC=B8=EC=A0=9C=20=ED=95=B4=EA=B2=B0=20?= =?UTF-8?q?(#879)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- frontend/src/utils/converter.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/frontend/src/utils/converter.ts b/frontend/src/utils/converter.ts index cc9ae7510..59fa8e867 100644 --- a/frontend/src/utils/converter.ts +++ b/frontend/src/utils/converter.ts @@ -77,7 +77,7 @@ export const convertGithubAvatarUrlForResize = (avatarUrl: string) => { return avatarUrl; } - if (typeof global.process === 'undefined') { + if (process.env.STORYBOOK) { return avatarUrl; } From c32e4b89e373cc4facbead04f2d9c77c57838b91 Mon Sep 17 00:00:00 2001 From: JASUN LEE Date: Sat, 5 Nov 2022 01:18:57 +0900 Subject: [PATCH 16/20] =?UTF-8?q?fix:=20props=20interface=EB=A1=9C=20?= =?UTF-8?q?=EB=B6=84=EB=A6=AC?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- frontend/src/api/article/article.ts | 42 ++++++++++++++++------------- 1 file changed, 24 insertions(+), 18 deletions(-) diff --git a/frontend/src/api/article/article.ts b/frontend/src/api/article/article.ts index a1dc10ca3..768ad65a3 100644 --- a/frontend/src/api/article/article.ts +++ b/frontend/src/api/article/article.ts @@ -31,19 +31,21 @@ export const getDetailArticle = async (id: string) => { return data; }; +interface getArticleProps { + category: string; + sort: '추천순' | '조회순' | '최신순'; + cursorId: string; + cursorViews: string; + cursorLikes: string; +} + export const getAllArticle = async ({ category, sort, cursorId, cursorViews, cursorLikes, -}: { - category: string; - sort: '추천순' | '조회순' | '최신순'; - cursorId: string; - cursorViews: string; - cursorLikes: string; -}) => { +}: getArticleProps) => { if (sort === '추천순') { const data = await getAllArticlesByLikes({ category, cursorId, cursorLikes }); return data; @@ -58,17 +60,19 @@ export const getAllArticle = async ({ return data; }; +interface getAllArticleByViewsOrLatestProps { + category: string; + sort: '추천순' | '조회순' | '최신순'; + cursorId: string; + cursorViews: string; +} + export const getAllArticleByViewsOrLatest = async ({ category, sort, cursorId, cursorViews, -}: { - category: string; - sort: '추천순' | '조회순' | '최신순'; - cursorId: string; - cursorViews: string; -}) => { +}: getAllArticleByViewsOrLatestProps) => { const currentSort = convertSort(sort); const axiosInstance = generateAxiosInstanceWithAccessToken(); const { data } = await axiosInstance.get( @@ -92,15 +96,17 @@ export const getAllArticleByViewsOrLatest = async ({ }; }; +interface getAllArticlesByLikesProps { + category: string; + cursorId: string; + cursorLikes: string; +} + export const getAllArticlesByLikes = async ({ category, cursorId, cursorLikes = '', -}: { - category: string; - cursorId: string; - cursorLikes: string; -}) => { +}: getAllArticlesByLikesProps) => { const axiosInstance = generateAxiosInstanceWithAccessToken(); const { data } = await axiosInstance.get( From 8d41768d3a89f021a0b9070d3f935016ec8816cc Mon Sep 17 00:00:00 2001 From: JASUN LEE Date: Sat, 5 Nov 2022 01:27:42 +0900 Subject: [PATCH 17/20] =?UTF-8?q?type:=20interface=20=EB=A1=9C=20prop=20?= =?UTF-8?q?=EB=B6=84=EB=A6=AC?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- frontend/src/api/article/article.ts | 26 +++++++++++----- frontend/src/api/comment/comments.ts | 17 +++++----- frontend/src/api/search/search.ts | 46 ++++++++++++++++------------ 3 files changed, 56 insertions(+), 33 deletions(-) diff --git a/frontend/src/api/article/article.ts b/frontend/src/api/article/article.ts index 768ad65a3..e3c4cb74d 100644 --- a/frontend/src/api/article/article.ts +++ b/frontend/src/api/article/article.ts @@ -131,7 +131,15 @@ export const getAllArticlesByLikes = async ({ }; }; -export const postArticle = (article: { id: string; title: string; content: string }) => { +interface postArticleProps { + article: { + id: string; + title: string; + content: string; + }; +} + +export const postArticle = (article: postArticleProps['article']) => { const axiosInstance = generateAxiosInstanceWithAccessToken(); return axiosInstance.post<{ id: number; category: string }>(`/api/articles/${article.id}`, { title: article.title, @@ -139,12 +147,16 @@ export const postArticle = (article: { id: string; title: string; content: strin }); }; -export const putArticle = (article: { - id: string; - title: string; - content: string; - tag: string[]; -}) => { +interface putArticleProps { + article: { + id: string; + title: string; + content: string; + tag: string[]; + }; +} + +export const putArticle = (article: putArticleProps['article']) => { const axiosInstance = generateAxiosInstanceWithAccessToken(); return axiosInstance.put<{ id: number; category: string }>(`/api/articles/${article.id}`, { title: article.title, diff --git a/frontend/src/api/comment/comments.ts b/frontend/src/api/comment/comments.ts index e2b5abce7..fa18a200a 100644 --- a/frontend/src/api/comment/comments.ts +++ b/frontend/src/api/comment/comments.ts @@ -1,15 +1,13 @@ import { TotalCommentResponseType } from '@/api/comment/commentType'; import { generateAxiosInstanceWithAccessToken } from '@/utils/generateAxiosInstance'; -export const postComments = ({ - id, - content, - isAnonymous, -}: { +interface postCommentsProps { id: string; content: string; isAnonymous: boolean; -}) => { +} + +export const postComments = ({ id, content, isAnonymous }: postCommentsProps) => { const axiosInstance = generateAxiosInstanceWithAccessToken(); return axiosInstance.post(`/api/articles/${id}/comments`, { content, isAnonymous }); @@ -24,7 +22,12 @@ export const getComments = async (id: string) => { return data; }; -export const putComments = ({ content, commentId }: { content: string; commentId: string }) => { +interface putCommentsProps { + content: string; + commentId: string; +} + +export const putComments = ({ content, commentId }: putCommentsProps) => { const axiosInstance = generateAxiosInstanceWithAccessToken(); return axiosInstance.put(`/api/articles/comments/${commentId}`, { content }); }; diff --git a/frontend/src/api/search/search.ts b/frontend/src/api/search/search.ts index 705efe314..d4cc21f57 100644 --- a/frontend/src/api/search/search.ts +++ b/frontend/src/api/search/search.ts @@ -2,15 +2,17 @@ import { HashTagSearchResponseType } from '@/api/hashTag/hashTagType'; import { ArticleSearchResponseType } from '@/api/search/searchType'; import { generateAxiosInstanceWithAccessToken } from '@/utils/generateAxiosInstance'; +interface getUserSearchResultProps { + target: string; + cursorId: string; + searchIndex: string; +} + export const getUserSearchResult = async ({ target, cursorId, searchIndex, -}: { - target: string; - cursorId: string; - searchIndex: string; -}) => { +}: getUserSearchResultProps) => { const encodedTarget = encodeURIComponent(target); const axiosInstance = generateAxiosInstanceWithAccessToken(); const { data } = await axiosInstance.get( @@ -28,15 +30,17 @@ export const getUserSearchResult = async ({ }; }; +interface getArticleSearchResultProps { + target: string; + cursorId: string; + searchIndex: string; +} + export const getArticleSearchResult = async ({ target, cursorId, searchIndex, -}: { - target: string; - cursorId: string; - searchIndex: string; -}) => { +}: getArticleSearchResultProps) => { const encodedTarget = encodeURIComponent(target); const axiosInstance = generateAxiosInstanceWithAccessToken(); const { data } = await axiosInstance.get( @@ -55,13 +59,15 @@ export const getArticleSearchResult = async ({ }; }; +interface getArticleByHashTagProps { + hashTags: string; + cursorId: string; +} + export const getArticleByHashTag = async ({ hashTags, cursorId = '', -}: { - hashTags: string; - cursorId: string; -}) => { +}: getArticleByHashTagProps) => { const encodedTarget = encodeURIComponent(hashTags); const axiosInstance = generateAxiosInstanceWithAccessToken(); const { data } = await axiosInstance.get( @@ -78,15 +84,17 @@ export const getArticleByHashTag = async ({ }; }; +interface getSearchResultProps { + target: string; + searchIndex: string; + cursorId: string; +} + export const getSearchResult = async ({ target, searchIndex, cursorId = '', -}: { - target: string; - searchIndex: string; - cursorId: string; -}) => { +}: getSearchResultProps) => { if (searchIndex === '유저') { const data = await getUserSearchResult({ target, searchIndex, cursorId }); return data; From 920c59f3e9fb2252e89009bbb33ecd5a919973af Mon Sep 17 00:00:00 2001 From: JASUN LEE Date: Sat, 5 Nov 2022 01:37:19 +0900 Subject: [PATCH 18/20] =?UTF-8?q?fix:=20props=20interface=EB=A1=9C?= =?UTF-8?q?=EB=B6=84=EB=A6=AC?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- frontend/src/hooks/article/useHeartClick.tsx | 10 ++++------ 1 file changed, 4 insertions(+), 6 deletions(-) diff --git a/frontend/src/hooks/article/useHeartClick.tsx b/frontend/src/hooks/article/useHeartClick.tsx index 4aba09bb6..81d75e861 100644 --- a/frontend/src/hooks/article/useHeartClick.tsx +++ b/frontend/src/hooks/article/useHeartClick.tsx @@ -6,15 +6,13 @@ import { deleteLikeArticle, postAddLikeArticle } from '@/api/article/like'; import { ErrorMessage } from '@/constants/ErrorMessage'; import useThrowCustomError from '@/hooks/common/useThrowCustomError'; -const useHeartClick = ({ - prevIsLike, - prevLikeCount, - articleId, -}: { +interface useHeartClickProps { prevIsLike: boolean; prevLikeCount: number; articleId: string; -}) => { +} + +const useHeartClick = ({ prevIsLike, prevLikeCount, articleId }: useHeartClickProps) => { const [isLike, setIsLike] = useState(prevIsLike); const [likeCount, setLikeCount] = useState(prevLikeCount); const { From 66bbece4ea0b0ae57f3ff5a1906d215234d91bd5 Mon Sep 17 00:00:00 2001 From: JASUN LEE Date: Tue, 6 Dec 2022 14:31:12 +0900 Subject: [PATCH 19/20] =?UTF-8?q?fix:=20mock=EC=9D=98=20HOME=5FURL?= =?UTF-8?q?=EC=9D=98=20=EC=A3=BC=EC=86=8C=20=EB=B3=80=EA=B2=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit api instance 적용에 따라서 test에서 base url이 localhost로 인식되어 이와 관련하여 수정 진행 --- frontend/src/constants/apiUrl.ts | 3 +-- frontend/src/mock/article.ts | 3 ++- frontend/src/mock/comment.ts | 2 +- frontend/src/mock/hashTag.ts | 3 +-- frontend/src/mock/like.ts | 3 ++- frontend/src/mock/myPage.ts | 3 ++- frontend/src/mock/search.ts | 3 ++- frontend/src/mock/vote.ts | 3 ++- frontend/src/utils/generateAxiosInstance.ts | 2 +- 9 files changed, 14 insertions(+), 11 deletions(-) diff --git a/frontend/src/constants/apiUrl.ts b/frontend/src/constants/apiUrl.ts index 9678d0177..5e2086d4b 100644 --- a/frontend/src/constants/apiUrl.ts +++ b/frontend/src/constants/apiUrl.ts @@ -1,2 +1 @@ -export const HOME_URL = process.env.HOME_URL; - +export const HOME_URL = process.env.STORYBOOK ? 'http://localhost' : process.env.HOME_URL; diff --git a/frontend/src/mock/article.ts b/frontend/src/mock/article.ts index 062f2ae16..b8f6868ce 100644 --- a/frontend/src/mock/article.ts +++ b/frontend/src/mock/article.ts @@ -1,9 +1,10 @@ import { rest } from 'msw'; import type { PathParams } from 'msw'; -import { HOME_URL } from '@/constants/apiUrl'; import mockArticle from '@/mock/data/articles.json'; +const HOME_URL = 'http://localhost'; + export const ArticleHandler = [ rest.post<{ title: string; content: string; category: string }, never, { id: number }>( `${HOME_URL}/api/articles`, diff --git a/frontend/src/mock/comment.ts b/frontend/src/mock/comment.ts index 43c342094..af2f2fcbf 100644 --- a/frontend/src/mock/comment.ts +++ b/frontend/src/mock/comment.ts @@ -1,12 +1,12 @@ import { rest } from 'msw'; import { SingleCommentItemType } from '@/api/comment/commentType'; -import { HOME_URL } from '@/constants/apiUrl'; import mockData from '@/mock/data/comment.json'; const data = localStorage.getItem('mock-comments'); const mockComments = data ? (JSON.parse(data) as SingleCommentItemType[][]) : []; +const HOME_URL = 'http://localhost'; export const CommentHandler = [ rest.post<{ content: string }>( diff --git a/frontend/src/mock/hashTag.ts b/frontend/src/mock/hashTag.ts index b62f41e7b..507d20bf2 100644 --- a/frontend/src/mock/hashTag.ts +++ b/frontend/src/mock/hashTag.ts @@ -1,7 +1,6 @@ import { rest } from 'msw'; -import { HOME_URL } from '@/constants/apiUrl'; - +const HOME_URL = 'http://localhost'; export const HashTagHandler = [ rest.get<{ tags: string[] }>(`${HOME_URL}/api/tags`, (req, res, ctx) => res( diff --git a/frontend/src/mock/like.ts b/frontend/src/mock/like.ts index 4c8f89a42..345f30e93 100644 --- a/frontend/src/mock/like.ts +++ b/frontend/src/mock/like.ts @@ -1,8 +1,9 @@ import { rest } from 'msw'; -import { HOME_URL } from '@/constants/apiUrl'; import mockArticle from '@/mock/data/articles.json'; +const HOME_URL = 'http://localhost'; + export const LikeHandler = [ rest.post(`${HOME_URL}/api/articles/:articleId/like`, (req, res, ctx) => { const { articleId } = req.params; diff --git a/frontend/src/mock/myPage.ts b/frontend/src/mock/myPage.ts index d3941cc25..8abfe8d2b 100644 --- a/frontend/src/mock/myPage.ts +++ b/frontend/src/mock/myPage.ts @@ -2,7 +2,8 @@ import { rest } from 'msw'; import { AuthorType, MyPageUserArticleResponseType } from '@/api/article/articleType'; import { MyPageCommentResponse } from '@/api/comment/commentType'; -import { HOME_URL } from '@/constants/apiUrl'; + +const HOME_URL = 'http://localhost'; export const MyPageHandler = [ rest.get(`${HOME_URL}/api/members/me`, (req, res, ctx) => diff --git a/frontend/src/mock/search.ts b/frontend/src/mock/search.ts index 9615c54ec..d23f15f49 100644 --- a/frontend/src/mock/search.ts +++ b/frontend/src/mock/search.ts @@ -2,7 +2,8 @@ import { rest } from 'msw'; import { ArticleTotalType } from '@/api/article/articleType'; import { ArticleSearchResponseType } from '@/api/search/searchType'; -import { HOME_URL } from '@/constants/apiUrl'; + +const HOME_URL = 'http://localhost'; export const SearchHandler = [ rest.get(`${HOME_URL}/api/articles/search/author`, (req, res, ctx) => { diff --git a/frontend/src/mock/vote.ts b/frontend/src/mock/vote.ts index 9c5ab3086..309a55ff7 100644 --- a/frontend/src/mock/vote.ts +++ b/frontend/src/mock/vote.ts @@ -1,7 +1,8 @@ import { rest } from 'msw'; import { VoteResponseType } from '@/api/vote/voteType'; -import { HOME_URL } from '@/constants/apiUrl'; + +const HOME_URL = 'http://localhost'; export const VoteHandler = [ rest.post<{ items: string[] }>(`${HOME_URL}/api/articles/:articleId/votes`, (req, res, ctx) => { diff --git a/frontend/src/utils/generateAxiosInstance.ts b/frontend/src/utils/generateAxiosInstance.ts index 95dc5a4ed..44c81e92d 100644 --- a/frontend/src/utils/generateAxiosInstance.ts +++ b/frontend/src/utils/generateAxiosInstance.ts @@ -8,8 +8,8 @@ export const generateAxiosInstanceWithAccessToken = () => { return axios.create({ baseURL: HOME_URL, headers: { - 'Access-Control-Allow-Origin': '*', Authorization: `Bearer ${accessToken}`, + 'content-Type': 'Application/json', }, }); }; From d99b0e27ab0af6803fefc62e0d03715e86050c5f Mon Sep 17 00:00:00 2001 From: JASUN LEE Date: Tue, 6 Dec 2022 14:42:26 +0900 Subject: [PATCH 20/20] =?UTF-8?q?fix:=20cardStyle=EC=97=90=20props=20type?= =?UTF-8?q?=20=EC=A7=80=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- frontend/src/styles/cardStyle.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/frontend/src/styles/cardStyle.ts b/frontend/src/styles/cardStyle.ts index b16916f1b..a73af51ad 100644 --- a/frontend/src/styles/cardStyle.ts +++ b/frontend/src/styles/cardStyle.ts @@ -1,7 +1,7 @@ import { theme } from '@/styles/Theme'; import { CardProps } from '@/types/card'; -export const PopularArticleItemCardStyle = { +export const PopularArticleItemCardStyle: CardProps = { cssObject: { width: '85%', height: 'fit-content',