[Fix] 타입 지정

src/api/cards.api.ts

@@ -73,7 +73,7 @@ const getCardList = ({ size, cursorId, columnId }: GetCardListProp) => {
 /**
  * 카드 수정 api
  */
-const putEditCard = (
+const putEditCard = ({
   cardId,
   columnId,
   assigneeUserId,
@@ -82,7 +82,7 @@ const putEditCard = (
   dueDate,
   tags,
   imageUrl,
-) => {
+}: PutEditCardProp) => {
   return instance({
     url: API_CARDS.BY_ID(cardId),
     method: 'PUT',
@@ -101,7 +101,7 @@ const putEditCard = (
 /**
  * 카드 상세 조회 api
  */
-const getCardDetails = ({ cardId }) => {
+const getCardDetails = ({ cardId }: { cardId: number }) => {
   return instance({
     url: API_CARDS.BY_ID(cardId),
     method: 'GET',
@@ -111,7 +111,7 @@ const getCardDetails = ({ cardId }) => {
 /**
  * 카드 삭제 api
  */
-const deleteCard = ({ cardId }) => {
+const deleteCard = ({ cardId }: { cardId: number }) => {
   return instance({
     url: API_CARDS.BY_ID(cardId),
     method: 'DELETE',

src/api/comment.api.ts

@@ -7,6 +7,12 @@ interface CreateComments {
   columnId: number;
   dashboardId: number;
 }
+
+interface PutCommentEditProps {
+  content: string;
+  commentId: number;
+}
+
 const postCreateComment = ({
   content,
   cardId,
@@ -45,7 +51,7 @@ const getCommentList = ({
   });
 };
 
-const putCommentEdit = (content, commentId) => {
+const putCommentEdit = ({ content, commentId }: PutCommentEditProps) => {
   return instance({
     url: API_COMMENTS.BY_ID(commentId),
     method: 'PUT',

src/api/dashboards.api.ts

@@ -1,10 +1,37 @@
 import { API, API_DASHBOARDS } from '@/constants/API';
 import instance from '@/api/instance';
 
+interface PostCreateDashboardProps {
+  title: string;
+  color: string;
+}
+
+interface GetDashboardListProps {
+  navigationMethod: () => void;
+  page: number;
+  size: number;
+}
+
+interface PutEditDashboardProps {
+  dashboardId: number;
+  title: string;
+  color: string;
+}
+
+interface GetDashboardInvitationProps {
+  dashboardId: number;
+  page: number;
+  size: number;
+}
+
+interface DeleteDashboardInvitationProps {
+  dashboardId: number;
+  invitationId: number;
+}
 /**
  * 대시보드 생성 api
  */
-const postCreateDashboard = ({ title, color }) => {
+const postCreateDashboard = ({ title, color }: PostCreateDashboardProps) => {
   return instance({
     url: API.DASHBOARDS,
     method: 'POST',
@@ -18,7 +45,11 @@ const postCreateDashboard = ({ title, color }) => {
 /**
  * 대시보드 목록조회 api
  */
-const getDashboardList = ({ navigationMethod, page, size }) => {
+const getDashboardList = ({
+  navigationMethod,
+  page,
+  size,
+}: GetDashboardListProps) => {
   return instance({
     url: API.DASHBOARDS,
     method: 'GET',
@@ -43,7 +74,11 @@ const getDashboardDetail = (dashboardId: number) => {
 /**
  * 대시보드 수정 api
  */
-const putEditDashboard = ({ dashboardId, title, color }) => {
+const putEditDashboard = ({
+  dashboardId,
+  title,
+  color,
+}: PutEditDashboardProps) => {
   return instance({
     url: API_DASHBOARDS.BY_ID(dashboardId),
     method: 'PUT',
@@ -87,7 +122,11 @@ const postInviteDashboard = ({
 /**
  * 대시보드 초대 불러오는 api
  */
-const getDashboardInvitation = ({ dashboardId, page, size }) => {
+const getDashboardInvitation = ({
+  dashboardId,
+  page,
+  size,
+}: GetDashboardInvitationProps) => {
   return instance({
     url: API_DASHBOARDS.INVITATIONS(dashboardId),
     method: 'GET',
@@ -102,7 +141,10 @@ const getDashboardInvitation = ({ dashboardId, page, size }) => {
 /**
  * 대시보드 초대 취소 api
  */
-const deleteDashboardInvitation = ({ dashboardId, invitationId }) => {
+const deleteDashboardInvitation = ({
+  dashboardId,
+  invitationId,
+}: DeleteDashboardInvitationProps) => {
   return instance({
     url: API_DASHBOARDS.INVITATIONS_CANCLE(dashboardId, invitationId),
     method: 'DELETE',

src/api/instance.ts

@@ -13,7 +13,7 @@ instance.interceptors.request.use(
   (config) => {
     const accessToken = localStorage.getItem('accessToken')?.replace(/"/gi, '');
     if (!accessToken) return config;
-
+    // eslint-disable-next-line
     config.headers.Authorization = `Bearer ${accessToken}`;
     return config;
   },

src/api/members.api.ts

@@ -4,8 +4,7 @@ import instance from '@/api/instance';
 /**
  * 대시보드 멤버 목록 조회
  */
-
-const getDashboardMembers = (dashboardId, page = 1, size = 30) => {
+const getDashboardMembers = (dashboardId: number, page = 1, size = 30) => {
   return instance({
     url: API.MEMBERS,
     method: 'GET',
@@ -17,7 +16,7 @@ const getDashboardMembers = (dashboardId, page = 1, size = 30) => {
   });
 };
 
-const deleteDashboardMembers = (memberId) => {
+const deleteDashboardMembers = (memberId: number) => {
   return instance({
     url: API_MEMBERS.BY_ID(memberId),
     method: 'DELETE',

src/api/users.api.ts

@@ -1,10 +1,21 @@
 import { API, API_USERS } from '@/constants/API';
 import instance from '@/api/instance';
 
+interface PostSignUpProps {
+  email: string;
+  nickname: string;
+  password: string;
+}
+
+interface PutMyProfileEditProps {
+  nickname: string;
+  profileImageUrl: string;
+}
+
 /**
  * 회원가입
  */
-const postSignUp = ({ email, nickname, password }) => {
+const postSignUp = ({ email, nickname, password }: PostSignUpProps) => {
   return instance({
     url: API.USERS,
     method: 'POST',
@@ -25,7 +36,10 @@ const getMyProfile = () => {
 /**
  * 내 정보 수정
  */
-const putMyProfileEdit = ({ nickname, profileImageUrl }) => {
+const putMyProfileEdit = ({
+  nickname,
+  profileImageUrl,
+}: PutMyProfileEditProps) => {
   return instance({
     url: API_USERS.MY_INFO,
     method: 'PUT',
@@ -36,7 +50,11 @@ const putMyProfileEdit = ({ nickname, profileImageUrl }) => {
 /**
  * 프로필 이미지 업로드
  */
-const postProfileImgUpload = ({ profileImageUrl }) => {
+const postProfileImgUpload = ({
+  profileImageUrl,
+}: {
+  profileImageUrl: string;
+}) => {
   return instance({
     url: API_USERS.PROFILE_IMG_UPLOAD,
     method: 'POST',

src/components/common/Card.tsx

@@ -136,7 +136,7 @@ const S = {
   `,
 };
 
-function Card({ data, columnTitle }) {
+function Card({ data, columnTitle }: { data: any; columnTitle: string }) {
   const cardInfoData = data;
 
   const { width }: Size = useWindowSize();
@@ -167,11 +167,15 @@ function Card({ data, columnTitle }) {
           <S.Title>{cardInfoData?.title}</S.Title>
           <S.CardContent>
             <S.HashTagContainer>
-              {cardInfoData?.tags.map((tag, index) => (
-                <HashTag key={index} index={index} isMobile={isTablet}>
-                  {tag}
-                </HashTag>
-              ))}
+              {cardInfoData?.tags.map(
+                // eslint-disable-next-line
+                ({ tag, index }: { tag: string[]; index: number }) => (
+                  // eslint-disable-next-line
+                  <HashTag key={index} index={index} isMobile={isTablet}>
+                    {tag}
+                  </HashTag>
+                ),
+              )}
             </S.HashTagContainer>
             <S.DateAndProfileWrapper>
               <S.CalendarIconWrapper>

src/components/common/DateSelector.tsx

@@ -27,10 +27,16 @@ const S = {
   `,
 };
 
-function DateSelector({ onChange, value = '' }) {
+function DateSelector({
+  onChange,
+  value = '',
+}: {
+  onChange: any;
+  value: string;
+}) {
   const [dueDate, setDueDate] = useState<Date | null>(null);
 
-  const handleChange = (date) => {
+  const handleChange = (date: any) => {
     setDueDate(date);
     onChange(date);
   };

src/components/common/button/AddIconButton.tsx

@@ -9,7 +9,6 @@ const S = {
     align-items: center;
     gap: 1.2rem;
 
-    /* min-width: 24rem; */
     padding: 0.6rem 1rem;
     border: 1px solid ${({ theme }) => theme.color.grayLight};
     border-radius: 0.8rem;

src/components/common/form/Form.tsx

@@ -114,10 +114,9 @@ type FormType = 'signIn' | 'signUp' | 'editProfile' | 'editPassword';
 interface FormProps extends InputHTMLAttributes<HTMLInputElement> {
   formType: FormType;
   btnSize?: 'S' | 'M' | 'L';
-  submit?: (data: FormValues) => void;
+  submit?: (data: any) => void;
   profileInfo?: { mail: string; name: string };
   children?: React.ReactNode;
-  // placeholder?: { email?: string; name?: string };
 }
 
 /**
@@ -174,7 +173,9 @@ function Form({
   useEffect(() => {
     const requiredKeys = Keys[formType];
     let allFieldsFilled = false;
-    const termsChecked = formType === 'signUp' ? watchFields.terms : true;
+
+    const termsChecked =
+      formType === 'signUp' ? (watchFields as any).terms : true;
 
     if (formType === 'editProfile') {
       const filteredKeys = requiredKeys.filter((key) => key !== 'email');
@@ -203,7 +204,7 @@ function Form({
 
   const fieldsToRender = formFields[formType] || [];
   return (
-    <S.Form onSubmit={handleSubmit(submit)}>
+    <S.Form onSubmit={handleSubmit(submit ?? (() => {}))}>
       {fieldsToRender.map((field) => (
         <S.Container key={field.id}>
           <S.Label htmlFor={field.id}>{field.label}</S.Label>

src/components/common/modal/card-detail/CardConfirmModal.tsx

@@ -1,8 +1,8 @@
-import BackDropModal from '../BackDropModal';
-import MainBox from './MainBox';
-import ModalHeader from './ModalHeader';
-import SideBox from './SideBox';
 import styled from 'styled-components';
+import BackDropModal from '@/components/common/modal/BackDropModal';
+import MainBox from '@/components/common/modal/card-detail/MainBox';
+import ModalHeader from '@/components/common/modal/card-detail/ModalHeader';
+import SideBox from '@/components/common/modal/card-detail/SideBox';
 import useDetailCardQuery from '@/hooks/query/cards/useDetailCardQuery';
 import MEDIA_QUERIES from '@/constants/MEDIAQUERIES';
 
@@ -56,7 +56,7 @@ function CardConfirmModal({
   openToDoEditModal,
 }: ModalOpenAndCloseProps) {
   const { data: cardDetailData } = useDetailCardQuery({
-    cardId: cardId,
+    cardId,
   });
 
   return (

src/components/common/modal/card-detail/CommentItem.tsx

@@ -150,8 +150,7 @@ function CommentItem({
 
   return (
     <S.CommentItemContainer>
-
-       {author.profileImageUrl ? (
+      {author.profileImageUrl ? (
         <S.ProfileImage
           width={34}
           height={34}

src/components/common/modal/card-detail/CommentList.tsx

@@ -48,7 +48,7 @@ interface CommentItemDataProps {
     id: number;
   };
 }
-function CommentList({ cardDetailData }) {
+function CommentList({ cardDetailData }: { cardDetailData: any }) {
   const loaderRef = useRef();
 
   const { data, fetchNextPage } = useCommentsListQuery({

src/components/common/modal/card-detail/ModalHeader.tsx

@@ -1,7 +1,6 @@
 import { useRef, useState } from 'react';
 import styled from 'styled-components';
 import ConfirmDeleteModal from '@/components/common/modal/ConfirmDeleteModal';
-import WarningModal from '@/components/common/modal/WarningModal';
 import useDeleteCardMutation from '@/hooks/query/cards/useDeleteCardMutation';
 import useOutSideClick from '@/hooks/useClickOutside';
 import MEDIA_QUERIES from '@/constants/MEDIAQUERIES';
@@ -158,9 +157,7 @@ function ModalHeader({
             isOpen={isDeleteOpen}
             onClose={() => setIsDeleteOpen(false)}
             message="정말 삭제하시겠습니까?🥹"
-            onClick={() =>
-              responseInvitationMutate({ cardId: String(card_Id) })
-            }
+            onClick={() => responseInvitationMutate({ cardId: card_Id })}
           />
         </S.DropdownContainer>
         <S.CloseIcon onClick={onClose} />

src/components/common/modal/card-detail/SideBox.tsx

@@ -1,5 +1,5 @@
-import AvatarImage from '../../AvatarImage';
 import styled from 'styled-components';
+import AvatarImage from '@/components/common/AvatarImage';
 import useDetailCardQuery from '@/hooks/query/cards/useDetailCardQuery';
 import useWindowSize, { Size } from '@/hooks/useWindowSize';
 import MEDIA_QUERIES from '@/constants/MEDIAQUERIES';

src/components/dashboard/column/CardLoader.tsx

@@ -1,9 +1,10 @@
 import CardSkeleton from '@/components/dashboard/column/CardSkeleton';
 
-function CardLoader({ loaderRef, ...props }) {
+function CardLoader({ loaderRef, ...props }: { loaderRef: any }) {
   return (
     <div ref={loaderRef} {...props}>
       {Array.from({ length: 1 }).map((el, index) => (
+        // eslint-disable-next-line
         <CardSkeleton key={index} />
       ))}
     </div>