diff --git a/frontend/src/features/killingParts/components/RegisterPart.tsx b/frontend/src/features/killingParts/components/RegisterPart.tsx index 30cd7ab6..3536473c 100644 --- a/frontend/src/features/killingParts/components/RegisterPart.tsx +++ b/frontend/src/features/killingParts/components/RegisterPart.tsx @@ -3,7 +3,7 @@ import styled from 'styled-components'; import { useAuthContext } from '@/features/auth/components/AuthProvider'; import useCollectingPartContext from '@/features/killingParts/hooks/useCollectingPartContext'; import useVideoPlayerContext from '@/features/youtube/hooks/useVideoPlayerContext'; -import { useConfirmContext } from '@/shared/components/ConfirmModal/hooks/useConfirmContext'; +import { useConfirmModal } from '@/shared/components/ConfirmModal/hooks/useConfirmModal'; import Spacing from '@/shared/components/Spacing'; import { useMutation } from '@/shared/hooks/useMutation'; import { toPlayingTimeText } from '@/shared/utils/convertTime'; @@ -13,7 +13,7 @@ const RegisterPart = () => { const { user } = useAuthContext(); const { interval, partStartTime, songId } = useCollectingPartContext(); const video = useVideoPlayerContext(); - const { confirmPopup } = useConfirmContext(); + const { openConfirmModal } = useConfirmModal(); const voteTimeText = toPlayingTimeText(partStartTime, partStartTime + interval); const { mutateData: createKillingPart } = useMutation(postKillingPart); const navigate = useNavigate(); @@ -24,7 +24,7 @@ const RegisterPart = () => { const submitKillingPart = async () => { video.pause(); - const isConfirmed = await confirmPopup({ + const isConfirmed = await openConfirmModal({ title: `${user?.nickname}님의 파트 저장`, content: ( diff --git a/frontend/src/features/songs/components/KillingPartTrack.tsx b/frontend/src/features/songs/components/KillingPartTrack.tsx index de30e1be..a58b593c 100644 --- a/frontend/src/features/songs/components/KillingPartTrack.tsx +++ b/frontend/src/features/songs/components/KillingPartTrack.tsx @@ -8,7 +8,7 @@ import { useAuthContext } from '@/features/auth/components/AuthProvider'; import LoginModal from '@/features/auth/components/LoginModal'; import { deleteMemberParts } from '@/features/member/remotes/memberParts'; import useVideoPlayerContext from '@/features/youtube/hooks/useVideoPlayerContext'; -import { useConfirmContext } from '@/shared/components/ConfirmModal/hooks/useConfirmContext'; +import { useConfirmModal } from '@/shared/components/ConfirmModal/hooks/useConfirmModal'; import useTimerContext from '@/shared/components/Timer/hooks/useTimerContext'; import useToastContext from '@/shared/components/Toast/hooks/useToastContext'; import { GA_ACTIONS, GA_CATEGORIES } from '@/shared/constants/GAEventName'; @@ -45,7 +45,7 @@ const KillingPartTrack = ({ }: KillingPartTrackProps) => { const { showToast } = useToastContext(); const { seekTo, pause, playerState, videoPlayer } = useVideoPlayerContext(); - const { confirmPopup } = useConfirmContext(); + const { openConfirmModal } = useConfirmModal(); const { heartIcon, toggleKillingPartLikes } = useKillingPartLikes({ likeCount, likeStatus, @@ -154,7 +154,7 @@ const KillingPartTrack = ({ const { mutateData: deleteMemberPart } = useMutation(() => deleteMemberParts(partId)); const handleClickDeletePart = async () => { - const isConfirmed = await confirmPopup({ + const isConfirmed = await openConfirmModal({ title: '내 파트 삭제', content:

정말 삭제하시겠습니까?

, confirmation: '삭제', diff --git a/frontend/src/pages/EditProfilePage.tsx b/frontend/src/pages/EditProfilePage.tsx index 2c850a61..7c8165c0 100644 --- a/frontend/src/pages/EditProfilePage.tsx +++ b/frontend/src/pages/EditProfilePage.tsx @@ -4,14 +4,14 @@ import shookshook from '@/assets/icon/shookshook.svg'; import { useAuthContext } from '@/features/auth/components/AuthProvider'; import WITHDRAWAL_MESSAGE from '@/features/member/constants/withdrawalMessage'; import { deleteMember } from '@/features/member/remotes/member'; -import { useConfirmContext } from '@/shared/components/ConfirmModal/hooks/useConfirmContext'; +import { useConfirmModal } from '@/shared/components/ConfirmModal/hooks/useConfirmModal'; import Spacing from '@/shared/components/Spacing'; import ROUTE_PATH from '@/shared/constants/path'; import { useMutation } from '@/shared/hooks/useMutation'; const EditProfilePage = () => { const { user, logout } = useAuthContext(); - const { confirmPopup } = useConfirmContext(); + const { openConfirmModal } = useConfirmModal(); const { mutateData: withdrawal } = useMutation(deleteMember); const navigate = useNavigate(); @@ -21,7 +21,7 @@ const EditProfilePage = () => { } const handleClickWithdrawal = async () => { - const isConfirmed = await confirmPopup({ + const isConfirmed = await openConfirmModal({ title: '회원 탈퇴', content: {WITHDRAWAL_MESSAGE}, confirmation: '탈퇴', diff --git a/frontend/src/shared/components/ConfirmModal/ConfirmModal.stories.tsx b/frontend/src/shared/components/ConfirmModal/ConfirmModal.stories.tsx index 9bc0284e..53b27c15 100644 --- a/frontend/src/shared/components/ConfirmModal/ConfirmModal.stories.tsx +++ b/frontend/src/shared/components/ConfirmModal/ConfirmModal.stories.tsx @@ -1,31 +1,22 @@ import styled from 'styled-components'; -import ConfirmModalProvider from './ConfirmModalProvider'; -import { useConfirmContext } from './hooks/useConfirmContext'; +import { useConfirmModal } from './hooks/useConfirmModal'; import type { Meta, StoryObj } from '@storybook/react'; -const meta: Meta = { - title: 'shared/Confirm', - component: ConfirmModalProvider, - decorators: [ - (Story) => ( - - - - ), - ], +const meta: Meta = { + title: 'shared/ConfirmModal', }; export default meta; -type Story = StoryObj; +type Story = StoryObj; export const Example: Story = { render: () => { const Modal = () => { - const { confirmPopup } = useConfirmContext(); + const { openConfirmModal } = useConfirmModal(); const clickHiByeBtn = async () => { - const isConfirmed = await confirmPopup({ + const isConfirmed = await openConfirmModal({ title: '하이바이 모달', content: ( <> @@ -47,7 +38,7 @@ export const Example: Story = { // denial과 confirmation 기본값은 '닫기'와 '확인'입니다. const clickOpenCloseBtn = async () => { - const isConfirmed = await confirmPopup({ + const isConfirmed = await openConfirmModal({ title: '오쁜클로즈 모달', content: ( <>