fix: private, public axios 분리

go-cham · Aug 21, 2023 · ab1c2b2 · ab1c2b2
1 parent c7058a9
commit ab1c2b2
Show file tree

Hide file tree

Showing 20 changed files with 51 additions and 43 deletions.
diff --git a/src/common/libs/axios.ts b/src/common/libs/axios.ts
@@ -1,11 +1,15 @@
 import axios from 'axios';
 import { getBearerToken } from '@/common/utils/localStorageManager';
 
-export const axiosInstance = axios.create({
+export const axiosPublic = axios.create({
   baseURL: import.meta.env.VITE_SERVER_API,
 });
 
-axiosInstance.interceptors.request.use((config) => {
+export const axiosPrivate = axios.create({
+  baseURL: import.meta.env.VITE_SERVER_API,
+});
+
+axiosPrivate.interceptors.request.use((config) => {
   const token = getBearerToken();
   if (token) {
     config.headers.Authorization = `Bearer ${token}`;

diff --git a/src/features/auth/queries/useAcceptTerms.tsx b/src/features/auth/queries/useAcceptTerms.tsx
@@ -1,9 +1,9 @@
 import { useMutation } from '@tanstack/react-query';
-import { axiosInstance } from '@/common/libs/axios';
+import { axiosPrivate } from '@/common/libs/axios';
 import { AcceptTermsRequest, AcceptTermsResponse } from './dto/accept-terms';
 
 async function acceptTerms(data: AcceptTermsRequest) {
-  const res = await axiosInstance.patch<AcceptTermsResponse>(
+  const res = await axiosPrivate.patch<AcceptTermsResponse>(
     '/user/acceptance-of-terms',
     data,
   );

diff --git a/src/features/comments/queries/useAddComment.tsx b/src/features/comments/queries/useAddComment.tsx
@@ -1,11 +1,11 @@
 import { useMutation, useQueryClient } from '@tanstack/react-query';
-import { axiosInstance } from '@/common/libs/axios';
+import { axiosPrivate } from '@/common/libs/axios';
 import { GetCommentsResponse } from '@/features/comments/queries/dto/get-comments';
 import { useUser } from '@/features/user/queries';
 import { AddCommentRequest, AddCommentResponse } from './dto/add-comment';
 
 async function addComment(data: AddCommentRequest) {
-  const res = await axiosInstance.post<AddCommentResponse>('/worry-reply', {
+  const res = await axiosPrivate.post<AddCommentResponse>('/worry-reply', {
     ...data,
     mentionUserNickname: undefined,
   });

diff --git a/src/features/comments/queries/useDeleteComment.tsx b/src/features/comments/queries/useDeleteComment.tsx
@@ -1,9 +1,9 @@
 import { useMutation, useQueryClient } from '@tanstack/react-query';
-import { axiosInstance } from '@/common/libs/axios';
+import { axiosPrivate } from '@/common/libs/axios';
 import { DeleteCommentResponse } from './dto/delete-comment';
 
 async function deleteComment(id: number) {
-  const res = await axiosInstance.patch<DeleteCommentResponse>(
+  const res = await axiosPrivate.patch<DeleteCommentResponse>(
     `/worry-reply/${id}/soft-delete`,
   );
   return res.data;

diff --git a/src/features/comments/queries/useGetComments.tsx b/src/features/comments/queries/useGetComments.tsx
@@ -1,9 +1,9 @@
 import { useQuery } from '@tanstack/react-query';
-import { axiosInstance } from '@/common/libs/axios';
+import { axiosPrivate } from '@/common/libs/axios';
 import { GetCommentsResponse } from './dto/get-comments';
 
 async function getComments(postId: number) {
-  const res = await axiosInstance.get<GetCommentsResponse>('/worry-replies', {
+  const res = await axiosPrivate.get<GetCommentsResponse>('/worry-replies', {
     params: {
       worryId: postId,
     },

diff --git a/src/features/posts/queries/useAddPost.tsx b/src/features/posts/queries/useAddPost.tsx
@@ -1,9 +1,9 @@
 import { useMutation, useQueryClient } from '@tanstack/react-query';
-import { axiosInstance } from '@/common/libs/axios';
+import { axiosPrivate } from '@/common/libs/axios';
 import { AddPostRequest, AddPostResponse } from './dto/add-post';
 
 async function addPost(data: AddPostRequest) {
-  const res = await axiosInstance.post<AddPostResponse>('/worry', data);
+  const res = await axiosPrivate.post<AddPostResponse>('/worry', data);
   return res.data;
 }
 

diff --git a/src/features/posts/queries/useDeletePost.tsx b/src/features/posts/queries/useDeletePost.tsx
@@ -1,9 +1,9 @@
 import { useMutation, useQueryClient } from '@tanstack/react-query';
-import { axiosInstance } from '@/common/libs/axios';
+import { axiosPrivate } from '@/common/libs/axios';
 import { DeletePostResponse } from './dto/delete-post';
 
 async function deletePost(id: number) {
-  const res = await axiosInstance.patch<DeletePostResponse>(
+  const res = await axiosPrivate.patch<DeletePostResponse>(
     `/worry/${id}/soft-delete`,
   );
   return res.data;

diff --git a/src/features/posts/queries/useEditPost.tsx b/src/features/posts/queries/useEditPost.tsx
@@ -1,9 +1,9 @@
 import { useMutation, useQueryClient } from '@tanstack/react-query';
-import { axiosInstance } from '@/common/libs/axios';
+import { axiosPrivate } from '@/common/libs/axios';
 import { EditPostRequest, EditPostResponse } from './dto/edit-post';
 
 async function editPost(data: EditPostRequest) {
-  const res = await axiosInstance.patch<EditPostResponse>(
+  const res = await axiosPrivate.patch<EditPostResponse>(
     `/worries/${data.id}`,
     data,
   );

diff --git a/src/features/posts/queries/useGetPost.tsx b/src/features/posts/queries/useGetPost.tsx
@@ -1,9 +1,9 @@
 import { useQuery } from '@tanstack/react-query';
-import { axiosInstance } from '@/common/libs/axios';
+import { axiosPrivate } from '@/common/libs/axios';
 import { GetPostResponse } from './dto/get-post';
 
 async function getPost(postId?: number) {
-  const res = await axiosInstance.get<GetPostResponse>(`/worries/${postId}`);
+  const res = await axiosPrivate.get<GetPostResponse>(`/worries/${postId}`);
   return res.data;
 }
 

diff --git a/src/features/posts/queries/useGetPosts.tsx b/src/features/posts/queries/useGetPosts.tsx
@@ -2,7 +2,7 @@ import { useInfiniteQuery } from '@tanstack/react-query';
 import { useEffect } from 'react';
 import { useInView } from 'react-intersection-observer';
 import { POST_TYPE } from '@/common/constants/post-type';
-import { axiosInstance } from '@/common/libs/axios';
+import { axiosPrivate, axiosPublic } from '@/common/libs/axios';
 import { Post } from '@/features/posts/types/post';
 import { GetPostsResponse } from './dto/get-posts';
 
@@ -17,6 +17,8 @@ async function getPosts({
   participatingUserId,
   pageParam,
 }: getPostsArgs) {
+  const axiosInstance =
+    authorId || participatingUserId ? axiosPrivate : axiosPublic;
   const res = await axiosInstance.get<GetPostsResponse>('/worries', {
     params: {
       sort: 'DESC',

diff --git a/src/features/report/queries/useReportComment.tsx b/src/features/report/queries/useReportComment.tsx
@@ -1,12 +1,12 @@
 import { useMutation } from '@tanstack/react-query';
-import { axiosInstance } from '@/common/libs/axios';
+import { axiosPrivate } from '@/common/libs/axios';
 import {
   ReportCommentRequest,
   ReportCommentResponse,
 } from './dto/report-comment';
 
 async function reportComment(data: ReportCommentRequest) {
-  const res = await axiosInstance.post<ReportCommentResponse>(
+  const res = await axiosPrivate.post<ReportCommentResponse>(
     '/worry-reply-report',
     data,
   );

diff --git a/src/features/report/queries/useReportPost.tsx b/src/features/report/queries/useReportPost.tsx
@@ -1,9 +1,9 @@
 import { useMutation } from '@tanstack/react-query';
-import { axiosInstance } from '@/common/libs/axios';
+import { axiosPrivate } from '@/common/libs/axios';
 import { ReportPostRequest, ReportPostResponse } from './dto/report-post';
 
 async function reportPost(data: ReportPostRequest) {
-  const res = await axiosInstance.post<ReportPostResponse>(
+  const res = await axiosPrivate.post<ReportPostResponse>(
     '/worry-report',
     data,
   );

diff --git a/src/features/user/components/NicknameAgeGenderForm/NicknameAgeGenderForm.tsx b/src/features/user/components/NicknameAgeGenderForm/NicknameAgeGenderForm.tsx
@@ -1,6 +1,6 @@
 import { AxiosError } from 'axios';
 import { useCallback, useEffect, useState } from 'react';
-import { axiosInstance } from '@/common/libs/axios';
+import { axiosPrivate } from '@/common/libs/axios';
 import { parseDateString } from '@/common/utils/date/parseDateString';
 import { validateBirthDate } from '@/common/utils/validations/birth-date';
 import { validateNickname } from '@/common/utils/validations/nickname';
@@ -53,7 +53,7 @@ export function NicknameAgeGenderForm({
       let error = validateNickname(nickname);
       if (!error) {
         try {
-          await axiosInstance.get(`/user/${user?.id}/validate-nickname`, {
+          await axiosPrivate.get(`/user/${user?.id}/validate-nickname`, {
             params: { nickname },
           });
         } catch (e) {

diff --git a/src/features/user/queries/useEditProfile.tsx b/src/features/user/queries/useEditProfile.tsx
@@ -1,9 +1,9 @@
 import { useMutation, useQueryClient } from '@tanstack/react-query';
-import { axiosInstance } from '@/common/libs/axios';
+import { axiosPrivate } from '@/common/libs/axios';
 import { EditProfileRequest, EditProfileResponse } from './dto/edit-profile';
 
 async function editProfile(data: EditProfileRequest) {
-  const res = await axiosInstance.patch<EditProfileResponse>('/user', data);
+  const res = await axiosPrivate.patch<EditProfileResponse>('/user', data);
   return res.data;
 }
 

diff --git a/src/features/user/queries/useUnregister.tsx b/src/features/user/queries/useUnregister.tsx
@@ -1,8 +1,8 @@
 import { useMutation } from '@tanstack/react-query';
-import { axiosInstance } from '@/common/libs/axios';
+import { axiosPrivate } from '@/common/libs/axios';
 
 async function unregister(data: { userId: number; reason: string }) {
-  const res = await axiosInstance.patch(`/user/${data.userId}/soft-delete`, {
+  const res = await axiosPrivate.patch(`/user/${data.userId}/soft-delete`, {
     reason: data.reason,
   });
   return res.data;

diff --git a/src/features/user/queries/useUser.tsx b/src/features/user/queries/useUser.tsx
@@ -1,28 +1,29 @@
-import { useQuery } from '@tanstack/react-query';
+import { useQuery, useQueryClient } from '@tanstack/react-query';
 import { useEffect, useMemo } from 'react';
-import { axiosInstance } from '@/common/libs/axios';
+import { axiosPrivate } from '@/common/libs/axios';
 import { User } from '@/features/user/types';
 import { userLocalStorage } from '@/features/user/utils/user-local-storage';
 import { GetUserResponse } from './dto/get-user';
 
 async function getUser() {
-  const res = await axiosInstance.get<GetUserResponse>('/user');
+  const res = await axiosPrivate.get<GetUserResponse>('/user');
   return res.data;
 }
 
 export function useUser() {
   const { data, isLoading, isError } = useQuery({
+    // @ts-ignore
     queryKey: ['user'],
     queryFn: getUser,
-    refetchOnMount: false,
     refetchOnWindowFocus: false,
     refetchOnReconnect: false,
     initialData: userLocalStorage.getUser(),
+    retry: false,
   });
 
   const user: User | null = useMemo(
     () =>
-      data
+      data && !isError
         ? {
             id: data.id,
             joinStatus: data.joinStatus,
@@ -46,7 +47,7 @@ export function useUser() {
             image: data.profileImageUrl,
           }
         : null,
-    [data],
+    [data, isError],
   );
 
   useEffect(() => {
@@ -60,6 +61,7 @@ export function useUser() {
   useEffect(() => {
     if (isError) {
       userLocalStorage.removeUser();
+      localStorage.removeItem('token');
     }
   }, [isError]);
 

diff --git a/src/features/vote/queries/useChooseOption.tsx b/src/features/vote/queries/useChooseOption.tsx
@@ -1,9 +1,9 @@
 import { useMutation, useQueryClient } from '@tanstack/react-query';
-import { axiosInstance } from '@/common/libs/axios';
+import { axiosPrivate } from '@/common/libs/axios';
 import { ChooseOptionRequest, ChooseOptionResponse } from './dto/choose-option';
 
 async function chooseOption(data: ChooseOptionRequest) {
-  const res = await axiosInstance.post<ChooseOptionResponse>(
+  const res = await axiosPrivate.post<ChooseOptionResponse>(
     '/user-worry-choice',
     {
       userId: data.userId,

diff --git a/src/features/vote/queries/useGetChoiceOptions.tsx b/src/features/vote/queries/useGetChoiceOptions.tsx
@@ -1,9 +1,9 @@
 import { useSuspenseQuery } from '@suspensive/react-query';
-import { axiosInstance } from '@/common/libs/axios';
+import { axiosPrivate } from '@/common/libs/axios';
 import { GetChoiceOptionsResponse } from './dto/get-choice-options';
 
 async function getChoiceOptions(postId: number) {
-  const res = await axiosInstance.get<GetChoiceOptionsResponse>(
+  const res = await axiosPrivate.get<GetChoiceOptionsResponse>(
     '/worry-choices',
     {
       params: {

diff --git a/src/features/vote/queries/useGetMyChoice.tsx b/src/features/vote/queries/useGetMyChoice.tsx
@@ -1,9 +1,9 @@
 import { useQuery } from '@tanstack/react-query';
-import { axiosInstance } from '@/common/libs/axios';
+import { axiosPrivate } from '@/common/libs/axios';
 import { GetMyChoiceResponse } from './dto/get-my-choice';
 
 async function getMyChoice(postId?: number, userId?: number) {
-  const res = await axiosInstance.get<GetMyChoiceResponse>(
+  const res = await axiosPrivate.get<GetMyChoiceResponse>(
     '/user-worry-choice',
     {
       params: {

diff --git a/src/features/vote/queries/useGetUsersChoices.tsx b/src/features/vote/queries/useGetUsersChoices.tsx
@@ -1,9 +1,9 @@
 import { useSuspenseQuery } from '@suspensive/react-query';
-import { axiosInstance } from '@/common/libs/axios';
+import { axiosPrivate } from '@/common/libs/axios';
 import { GetUsersChoices } from './dto/get-users-choices';
 
 async function getUserChoices(postId?: number) {
-  const res = await axiosInstance.get<GetUsersChoices>('/user-worry-choice', {
+  const res = await axiosPrivate.get<GetUsersChoices>('/user-worry-choice', {
     params: {
       worryId: postId,
     },