Merge pull request #248 from kakao-tech-campus-2nd-step3/Week11

Week11 4

src/api/services/profile/profile-question.api.ts

@@ -7,15 +7,15 @@ type ProfileQuestionResponse = {
   content: QuestionItem[]
 }
 
-const getProfileQuestion = async (userId: string) => {
+const getProfileQuestion = async (userId: number) => {
   const response = await fetchInstance.get<ProfileQuestionResponse>(
     `/api/profile/question/${userId}`
   )
 
-  return response?.data.content
+  return response.data.content
 }
 
-export const useGetProfileQuestion = (userId: string) => {
+export const useGetProfileQuestion = (userId: number) => {
   return useQuery({
     queryKey: ['profileQuestion', userId],
     queryFn: () => getProfileQuestion(userId),

src/components/ChatBox/index.tsx

@@ -2,10 +2,20 @@ import { BiX } from 'react-icons/bi'
 
 import { Box, Button, Flex } from '@chakra-ui/react'
 
-import { ChatBoxProps } from '@/types'
+interface ChatBoxProps {
+  direction: 'left' | 'right'
+  content: string
+  createdAt: string
+  deleteBtn?: boolean
+  onDelete?: () => void
+}
 
 export const ChatBox = ({
-  chatItem: { direction, content, createdAt, deleteBtn = false, onDelete },
+  direction,
+  content,
+  createdAt,
+  deleteBtn = false,
+  onDelete,
 }: ChatBoxProps) => {
   const isRight = direction === 'right'
 

src/pages/GroupPage/Management/CreateQuestion/index.tsx

@@ -1,4 +1,4 @@
-import { useEffect, useState } from 'react'
+import { useState } from 'react'
 import { useForm } from 'react-hook-form'
 import { BiError, BiPlus } from 'react-icons/bi'
 
@@ -29,6 +29,7 @@ export const GroupQuestionCreateModal = ({
   groupId,
 }: GroupQuestionCreateModalProps) => {
   const errorAlert = useDisclosure()
+
   const [errorMessage, setErrorMessage] = useState('')
 
   const form = useForm<CreateQuestionFields>({
@@ -57,18 +58,14 @@ export const GroupQuestionCreateModal = ({
     },
   })
 
-  useEffect(() => {
-    form.reset({
-      groupId,
-      content: '',
-    })
-  }, [groupId, form])
-
   return (
     <Box>
       <FormModal
         isOpen={isOpen}
-        onClose={onClose}
+        onClose={() => {
+          onClose()
+          form.reset({ groupId, content: '' })
+        }}
         icon={<BiPlus />}
         title="그룹 질문 추가 요청"
         description="그룹에 새로운 질문을 요청해보세요"
@@ -86,7 +83,6 @@ export const GroupQuestionCreateModal = ({
           <CreateQuestionForm form={form} />
         </Flex>
       </FormModal>
-
       <AlertModal
         isOpen={errorAlert.isOpen}
         onClose={errorAlert.onClose}

src/pages/Layout/ProfileQuestionLayout/CreateQuestionButton/index.tsx

@@ -36,9 +36,8 @@ export const CreateQuestionButton = ({ userId }: CreateQuestionButtonProps) => {
     onSuccess: () => {
       formModal.onClose()
       setNewQuestionContent('')
-      queryClient.invalidateQueries({ queryKey: ['postNewQuestion'] })
       queryClient.invalidateQueries({
-        queryKey: ['profileQuestion', userId.toString()],
+        queryKey: ['profileQuestion', userId],
       })
     },
     onError: () => {
@@ -52,6 +51,7 @@ export const CreateQuestionButton = ({ userId }: CreateQuestionButtonProps) => {
     if (!newQuestionContent.trim()) {
       setErrorMessage('질문을 입력해주세요')
       formModal.onClose()
+      setNewQuestionContent('')
       errorAlert.onOpen()
       return
     }
@@ -82,7 +82,10 @@ export const CreateQuestionButton = ({ userId }: CreateQuestionButtonProps) => {
       </Button>
       <FormModal
         isOpen={formModal.isOpen}
-        onClose={formModal.onClose}
+        onClose={() => {
+          formModal.onClose()
+          setNewQuestionContent('')
+        }}
         icon={<BiPlus />}
         title="프로필 질문 추가하기"
         description="친구들에게 궁금한 질문을 추가해보세요"