diff --git a/src/app/features/dashboard_Id/Card/cardFormModals/CreateCardModal.tsx b/src/app/features/dashboard_Id/Card/cardFormModals/CreateCardModal.tsx index 981a7ac..9588720 100644 --- a/src/app/features/dashboard_Id/Card/cardFormModals/CreateCardModal.tsx +++ b/src/app/features/dashboard_Id/Card/cardFormModals/CreateCardModal.tsx @@ -13,7 +13,10 @@ export default function CreateCardModal({ children }: ModalProps) { if (!modalRoot) return null return createPortal( -
+
e.stopPropagation()} + >
{children}
diff --git a/src/app/features/dashboard_Id/Column/Column.tsx b/src/app/features/dashboard_Id/Column/Column.tsx index 1ddb116..d5a4f94 100644 --- a/src/app/features/dashboard_Id/Column/Column.tsx +++ b/src/app/features/dashboard_Id/Column/Column.tsx @@ -109,7 +109,6 @@ export default function Column({ className="BG-white Border-section flex justify-center rounded-6 py-9" onClick={() => setOpenCreateCard(true)} > - {/*
*/}
{ return } - // A. 이전 컬럼에서 카드 제거 & 카드 추출 + // A. 이전 컬럼에서 카드currentCard 제거 // setQueryData의 콜백함수의 리턴값이 쿼리키 캐시에 저장됨(캐시 업데이트) queryClient.setQueryData>( ['columnId', currentCard.cardData.columnId], @@ -66,6 +66,7 @@ export const useCardMutation = () => { return { ...page, cards: page.cards.filter((card) => card.id !== cardData.id), + totalCount: page.totalCount - 1, } }) return { ...oldData, pages: updatedPages } @@ -84,6 +85,7 @@ export const useCardMutation = () => { return { ...page, cards: [...page.cards, movedCard], + totalCount: page.totalCount + 1, } } return page diff --git a/src/app/tester/page.tsx b/src/app/tester/page.tsx deleted file mode 100644 index bd67600..0000000 --- a/src/app/tester/page.tsx +++ /dev/null @@ -1,94 +0,0 @@ -'use client' - -import Image from 'next/image' - -import Header from '@/app/shared/components/common/header/Header' -import Sidebar from '@/app/shared/components/common/sidebar/Sidebar' -import ThemeToggle from '@/app/shared/components/ThemeToggle' - -import CreateDashboardModal from '../shared/components/common/modal/CreateDashboardModal' -import { useModalStore } from '../shared/store/useModalStore' - -//<초기 설정 안내> - -// 이미지 파일에 접근할 때: /images/파일명 -// 그 외, alias 설정 참고: alias규칙은 - tsconfig.json파일 내의 "paths": {}에 작성 -// 그 외, e.g. import { someUtil } from '@shared/utils'; - -// pxr 단위 사용 -// - 원래 gap-4는 16px인데, pxr적용 시에는 gap-16으로 작성 -// - 원래 [300px] -> 300으로 작성 - -// next-themes 라이트, 다크 모드 -// globals.css에 작성한 커스텀 유틸 클래스(@apply) 참고해서, 클래스명 가져다 사용하거나 직접 커스텀 - -export default function Home() { - const { openModal } = useModalStore() - - return ( - <> -
-
- {/* 사이드바 */} - - {/* 메인 콘텐츠 영역 */} -
- {/* 헤더 영역 */} -
-

Sidebar 테스트 페이지

-

왼쪽에 사이드바 만들어보자잇!

- - {/* 모달 테스트 버튼 - 이 부분을 추가! */} - - {/* 모달 버튼 컴포넌트 추가 - 이 부분도 추가! */} - -
- - {/* 기존 테스트 요소들 */} -
-
-

로고 테스트

-
- Logo -
-
- - {/* pxr 단위 테스트 */} -
-

pxr 단위 테스트

-
-

This text should be 16px (일반 px 단위)

-
-
-

- This text should be 1rem → converted 16 to 1rem: using pxr -

-
-
- - {/* Gap 테스트 */} -
-

Gap 테스트

-
-
AAA
-
BBB
-
CCC
-
-
-
-
-
- - ) -}