feat(fe): add error handling with console.error

Author: cjeongmin

apps/client/.eslintrc.json

@@ -27,6 +27,7 @@
       },
       "plugins": ["react-hooks", "react-refresh"],
       "rules": {
+        "no-console": ["error", { "allow": ["warn", "error"] }],
         "@typescript-eslint/no-throw-literal": "off",
         "react/react-in-jsx-scope": "off",
         "react/require-default-props": "off",

apps/client/src/components/Header.tsx

@@ -22,15 +22,17 @@ function Header() {
   const navigate = useNavigate();
 
   const handleLogout = () =>
-    logout().then(() => {
-      clearAccessToken();
-      navigate({ to: '/' });
-      addToast({
-        type: 'SUCCESS',
-        message: '로그아웃 되었습니다.',
-        duration: 3000,
-      });
-    });
+    logout()
+      .then(() => {
+        clearAccessToken();
+        navigate({ to: '/' });
+        addToast({
+          type: 'SUCCESS',
+          message: '로그아웃 되었습니다.',
+          duration: 3000,
+        });
+      })
+      .catch(console.error);
 
   return (
     <>

apps/client/src/components/modal/CreateQuestionModal.tsx

@@ -40,6 +40,7 @@ function CreateQuestionModal({ question }: CreateQuestionModalProps) {
         });
         closeModal();
       },
+      onError: console.error,
     });
 
   const { mutate: patchQuestionBodyQuery, isPending: isPatchInProgress } =
@@ -64,6 +65,7 @@ function CreateQuestionModal({ question }: CreateQuestionModalProps) {
         });
         closeModal();
       },
+      onError: console.error,
     });
 
   const submitDisabled =

apps/client/src/components/modal/CreateReplyModal.tsx

@@ -47,6 +47,7 @@ function CreateReplyModal({ question, reply }: CreateReplyModalProps) {
         closeModal();
       }
     },
+    onError: console.error,
   });
 
   const { mutate: patchReplyBodyQuery, isPending: isPatchInProgress } =
@@ -73,6 +74,7 @@ function CreateReplyModal({ question, reply }: CreateReplyModalProps) {
           closeModal();
         }
       },
+      onError: console.error,
     });
 
   const submitDisabled =

apps/client/src/components/modal/CreateSessionModal.tsx

@@ -33,6 +33,7 @@ function CreateSessionModal() {
         params: { sessionId: res.sessionId },
       });
     },
+    onError: console.error,
   });
 
   const enableCreateSession =

apps/client/src/components/modal/SessionParticipantsModal.tsx

@@ -84,9 +84,11 @@ function SessionParticipantsModal() {
 
   useEffect(() => {
     if (sessionId && sessionToken)
-      getSessionUsers({ sessionId, token: sessionToken }).then(({ users }) => {
-        setSessionUsers(users);
-      });
+      getSessionUsers({ sessionId, token: sessionToken })
+        .then(({ users }) => {
+          setSessionUsers(users);
+        })
+        .catch(console.error);
   }, [sessionId, sessionToken, setSessionUsers]);
 
   const users = sessionUsers.filter(({ nickname }) =>

apps/client/src/components/qna/ChattingList.tsx

@@ -82,6 +82,7 @@ function ChattingList() {
               container.scrollTop = heightDiff;
             });
           })
+          .catch(console.error)
           .finally(() => {
             setIsLoading(false);
           });

apps/client/src/components/qna/QuestionItem.tsx

@@ -79,6 +79,7 @@ function QuestionItem({ question, onQuestionSelect }: QuestionItemProps) {
           ...res,
         });
       },
+      onError: console.error,
     });
 
   const handleLike = useCallback(
@@ -124,6 +125,7 @@ function QuestionItem({ question, onQuestionSelect }: QuestionItemProps) {
           closed: !question.closed,
         });
       },
+      onError: console.error,
     });
 
   const handleClose = () => {
@@ -163,6 +165,7 @@ function QuestionItem({ question, onQuestionSelect }: QuestionItemProps) {
         pinned: !question.pinned,
       });
     },
+    onError: console.error,
   });
 
   const handlePin = () => {
@@ -196,6 +199,7 @@ function QuestionItem({ question, onQuestionSelect }: QuestionItemProps) {
         });
         removeQuestion(question.questionId);
       },
+      onError: console.error,
     });
 
   const handleDelete = () => {

apps/client/src/components/qna/ReplyItem.tsx

@@ -57,6 +57,7 @@ function ReplyItem({ question, reply }: ReplyItemProps) {
           ...res,
         });
       },
+      onError: console.error,
     });
 
   const handleLike = useCallback(
@@ -105,6 +106,7 @@ function ReplyItem({ question, reply }: ReplyItemProps) {
           deleted: true,
         });
       },
+      onError: console.error,
     });
 
   const handleDelete = () => {

apps/client/src/main.tsx

@@ -18,6 +18,8 @@ declare module '@tanstack/react-router' {
   }
 }
 
+if (import.meta.env.MODE !== 'development') console.error = () => {};
+
 createRoot(document.getElementById('root')!).render(
   <StrictMode>
     <QueryClientProvider client={queryClient}>