From 49c78bf8af5111a88ebe36c70cb341b4aec1cb56 Mon Sep 17 00:00:00 2001 From: Lee Youl <2yulrang@gmail.com> Date: Sat, 16 Nov 2024 14:14:23 +0900 Subject: [PATCH 1/7] =?UTF-8?q?=F0=9F=9A=9A=20Chore:=20=ED=8C=8C=EC=9D=BC?= =?UTF-8?q?=20=EC=9D=B4=EB=8F=99=EB=8F=99?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../_components/create-crew-form/create-crew-form.stories.tsx | 0 .../crew/{ => create}/_components/create-crew-form/index.tsx | 0 src/app/(crew)/crew/create/page.tsx | 2 +- .../create-gathering-form/create-gathering-form.stories.tsx | 0 .../create-gathering}/create-gathering-form/index.tsx | 0 .../create-gathering}/create-gathering-modal/container.tsx | 0 .../create-gathering}/create-gathering-modal/presenter.tsx | 2 +- .../{create-gathering.tsx => create-gathering/index.tsx} | 2 +- .../[id]}/_components/gathering-detail-modal/container.tsx | 0 .../gathering-detail-modal/gathering-detail-modal.stories.tsx | 0 .../[id]}/_components/gathering-detail-modal/presenter.tsx | 0 src/app/(crew)/crew/detail/[id]/edit/page.tsx | 2 +- src/app/(crew)/crew/detail/[id]/page.tsx | 2 +- src/components/common/gathering-card/container.tsx | 2 +- .../gathering-card/scheduled-gathering-card/container.tsx | 2 +- 15 files changed, 7 insertions(+), 7 deletions(-) rename src/app/(crew)/crew/{ => create}/_components/create-crew-form/create-crew-form.stories.tsx (100%) rename src/app/(crew)/crew/{ => create}/_components/create-crew-form/index.tsx (100%) rename src/app/(crew)/crew/{_components => detail/[id]/_components/create-gathering}/create-gathering-form/create-gathering-form.stories.tsx (100%) rename src/app/(crew)/crew/{_components => detail/[id]/_components/create-gathering}/create-gathering-form/index.tsx (100%) rename src/app/(crew)/crew/{_components => detail/[id]/_components/create-gathering}/create-gathering-modal/container.tsx (100%) rename src/app/(crew)/crew/{_components => detail/[id]/_components/create-gathering}/create-gathering-modal/presenter.tsx (90%) rename src/app/(crew)/crew/detail/[id]/_components/{create-gathering.tsx => create-gathering/index.tsx} (93%) rename src/app/(crew)/crew/{ => detail/[id]}/_components/gathering-detail-modal/container.tsx (100%) rename src/app/(crew)/crew/{ => detail/[id]}/_components/gathering-detail-modal/gathering-detail-modal.stories.tsx (100%) rename src/app/(crew)/crew/{ => detail/[id]}/_components/gathering-detail-modal/presenter.tsx (100%) diff --git a/src/app/(crew)/crew/_components/create-crew-form/create-crew-form.stories.tsx b/src/app/(crew)/crew/create/_components/create-crew-form/create-crew-form.stories.tsx similarity index 100% rename from src/app/(crew)/crew/_components/create-crew-form/create-crew-form.stories.tsx rename to src/app/(crew)/crew/create/_components/create-crew-form/create-crew-form.stories.tsx diff --git a/src/app/(crew)/crew/_components/create-crew-form/index.tsx b/src/app/(crew)/crew/create/_components/create-crew-form/index.tsx similarity index 100% rename from src/app/(crew)/crew/_components/create-crew-form/index.tsx rename to src/app/(crew)/crew/create/_components/create-crew-form/index.tsx diff --git a/src/app/(crew)/crew/create/page.tsx b/src/app/(crew)/crew/create/page.tsx index 50f9e044..ecd4d47e 100644 --- a/src/app/(crew)/crew/create/page.tsx +++ b/src/app/(crew)/crew/create/page.tsx @@ -7,7 +7,7 @@ import { Loader } from '@mantine/core'; import { useMutation, useQueryClient } from '@tanstack/react-query'; import { createCrew } from '@/src/_apis/crew/crew'; import { getImageUrl } from '@/src/_apis/image/get-image-url'; -import CreateCrewForm from '@/src/app/(crew)/crew/_components/create-crew-form'; +import CreateCrewForm from '@/src/app/(crew)/crew/create/_components/create-crew-form'; import { CreateCrewFormTypes, CreateCrewRequestTypes } from '@/src/types/create-crew'; import IcoCreateCrew from '@/public/assets/icons/ic-create-crew.svg'; diff --git a/src/app/(crew)/crew/_components/create-gathering-form/create-gathering-form.stories.tsx b/src/app/(crew)/crew/detail/[id]/_components/create-gathering/create-gathering-form/create-gathering-form.stories.tsx similarity index 100% rename from src/app/(crew)/crew/_components/create-gathering-form/create-gathering-form.stories.tsx rename to src/app/(crew)/crew/detail/[id]/_components/create-gathering/create-gathering-form/create-gathering-form.stories.tsx diff --git a/src/app/(crew)/crew/_components/create-gathering-form/index.tsx b/src/app/(crew)/crew/detail/[id]/_components/create-gathering/create-gathering-form/index.tsx similarity index 100% rename from src/app/(crew)/crew/_components/create-gathering-form/index.tsx rename to src/app/(crew)/crew/detail/[id]/_components/create-gathering/create-gathering-form/index.tsx diff --git a/src/app/(crew)/crew/_components/create-gathering-modal/container.tsx b/src/app/(crew)/crew/detail/[id]/_components/create-gathering/create-gathering-modal/container.tsx similarity index 100% rename from src/app/(crew)/crew/_components/create-gathering-modal/container.tsx rename to src/app/(crew)/crew/detail/[id]/_components/create-gathering/create-gathering-modal/container.tsx diff --git a/src/app/(crew)/crew/_components/create-gathering-modal/presenter.tsx b/src/app/(crew)/crew/detail/[id]/_components/create-gathering/create-gathering-modal/presenter.tsx similarity index 90% rename from src/app/(crew)/crew/_components/create-gathering-modal/presenter.tsx rename to src/app/(crew)/crew/detail/[id]/_components/create-gathering/create-gathering-modal/presenter.tsx index 7c5e7b75..71f1ea4e 100644 --- a/src/app/(crew)/crew/_components/create-gathering-modal/presenter.tsx +++ b/src/app/(crew)/crew/detail/[id]/_components/create-gathering/create-gathering-modal/presenter.tsx @@ -1,5 +1,5 @@ import { Modal, ScrollArea } from '@mantine/core'; -import CreateGatheringForm from '@/src/app/(crew)/crew/_components/create-gathering-form'; +import CreateGatheringForm from '@/src/app/(crew)/crew/detail/[id]/_components/create-gathering/create-gathering-form'; import { CreateGatheringFormTypes } from '@/src/types/gathering-data'; export interface GatheringDetailModalProps { diff --git a/src/app/(crew)/crew/detail/[id]/_components/create-gathering.tsx b/src/app/(crew)/crew/detail/[id]/_components/create-gathering/index.tsx similarity index 93% rename from src/app/(crew)/crew/detail/[id]/_components/create-gathering.tsx rename to src/app/(crew)/crew/detail/[id]/_components/create-gathering/index.tsx index dfcec562..53248d9e 100644 --- a/src/app/(crew)/crew/detail/[id]/_components/create-gathering.tsx +++ b/src/app/(crew)/crew/detail/[id]/_components/create-gathering/index.tsx @@ -3,7 +3,7 @@ import { useRouter } from 'next/navigation'; import { useDisclosure } from '@mantine/hooks'; import { useAuthStore } from '@/src/store/use-auth-store'; -import CreateGatheringModalContainer from '@/src/app/(crew)/crew/_components/create-gathering-modal/container'; +import CreateGatheringModalContainer from '@/src/app/(crew)/crew/detail/[id]/_components/create-gathering/create-gathering-modal/container'; import Button from '@/src/components/common/input/button'; import { CreateGatheringFormTypes } from '@/src/types/gathering-data'; diff --git a/src/app/(crew)/crew/_components/gathering-detail-modal/container.tsx b/src/app/(crew)/crew/detail/[id]/_components/gathering-detail-modal/container.tsx similarity index 100% rename from src/app/(crew)/crew/_components/gathering-detail-modal/container.tsx rename to src/app/(crew)/crew/detail/[id]/_components/gathering-detail-modal/container.tsx diff --git a/src/app/(crew)/crew/_components/gathering-detail-modal/gathering-detail-modal.stories.tsx b/src/app/(crew)/crew/detail/[id]/_components/gathering-detail-modal/gathering-detail-modal.stories.tsx similarity index 100% rename from src/app/(crew)/crew/_components/gathering-detail-modal/gathering-detail-modal.stories.tsx rename to src/app/(crew)/crew/detail/[id]/_components/gathering-detail-modal/gathering-detail-modal.stories.tsx diff --git a/src/app/(crew)/crew/_components/gathering-detail-modal/presenter.tsx b/src/app/(crew)/crew/detail/[id]/_components/gathering-detail-modal/presenter.tsx similarity index 100% rename from src/app/(crew)/crew/_components/gathering-detail-modal/presenter.tsx rename to src/app/(crew)/crew/detail/[id]/_components/gathering-detail-modal/presenter.tsx diff --git a/src/app/(crew)/crew/detail/[id]/edit/page.tsx b/src/app/(crew)/crew/detail/[id]/edit/page.tsx index 1ba58730..e1a7f101 100644 --- a/src/app/(crew)/crew/detail/[id]/edit/page.tsx +++ b/src/app/(crew)/crew/detail/[id]/edit/page.tsx @@ -3,7 +3,7 @@ import Image from 'next/image'; import { useParams } from 'next/navigation'; import { useGetCrewDetailQuery } from '@/src/_queries/crew/crew-detail-queries'; -import CreateCrewForm from '@/src/app/(crew)/crew/_components/create-crew-form'; +import CreateCrewForm from '@/src/app/(crew)/crew/create/_components/create-crew-form'; import { CreateCrewFormTypes } from '@/src/types/create-crew'; import IcoCreateCrew from '@/public/assets/icons/ic-create-crew.svg'; diff --git a/src/app/(crew)/crew/detail/[id]/page.tsx b/src/app/(crew)/crew/detail/[id]/page.tsx index 2753ac93..2ad2e63a 100644 --- a/src/app/(crew)/crew/detail/[id]/page.tsx +++ b/src/app/(crew)/crew/detail/[id]/page.tsx @@ -23,7 +23,7 @@ export default async function CrewDetailPage({ params }: CrewDetailPageProps) {

크루 약속

- {/* */} +
diff --git a/src/components/common/gathering-card/container.tsx b/src/components/common/gathering-card/container.tsx index 40505485..29d296b3 100644 --- a/src/components/common/gathering-card/container.tsx +++ b/src/components/common/gathering-card/container.tsx @@ -5,7 +5,7 @@ import { toast } from 'react-toastify'; import { useDisclosure } from '@mantine/hooks'; import { useGetGatheringDetailQuery } from '@/src/_queries/gathering/gathering-detail-queries'; import { ApiError } from '@/src/utils/api'; -import GatheringDetailModalContainer from '@/src/app/(crew)/crew/_components/gathering-detail-modal/container'; +import GatheringDetailModalContainer from '@/src/app/(crew)/crew/detail/[id]/_components/gathering-detail-modal/container'; import { GatheringType } from '@/src/types/gathering-data'; import GatheringCardPresenter from './presenter'; diff --git a/src/components/common/gathering-card/scheduled-gathering-card/container.tsx b/src/components/common/gathering-card/scheduled-gathering-card/container.tsx index fa0fb373..33de86a9 100644 --- a/src/components/common/gathering-card/scheduled-gathering-card/container.tsx +++ b/src/components/common/gathering-card/scheduled-gathering-card/container.tsx @@ -1,5 +1,5 @@ import { useCallback, useState } from 'react'; -import GatheringDetailModalContainer from '@/src/app/(crew)/crew/_components/gathering-detail-modal/container'; +import GatheringDetailModalContainer from '@/src/app/(crew)/crew/detail/[id]/_components/gathering-detail-modal/container'; import ScheduledGatheringCardPresenter from './presenter'; interface ScheduledGatheringCardContainerProps { From 2de94b7ae76c65c30def0fe1f2099804c5da2082 Mon Sep 17 00:00:00 2001 From: Lee Youl <2yulrang@gmail.com> Date: Sat, 16 Nov 2024 15:20:20 +0900 Subject: [PATCH 2/7] =?UTF-8?q?=E2=9C=A8=20Feat:=20=EC=95=BD=EC=86=8D=20?= =?UTF-8?q?=EB=A7=8C=EB=93=A4=EA=B8=B0=20=EA=B8=B0=EB=8A=A5=20=EC=B6=94?= =?UTF-8?q?=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/_apis/gathering/gathering-detail-apis.ts | 17 +++++++++- .../gathering/gathering-detail-queries.ts | 24 +++++++++++-- .../create-gathering-form/index.tsx | 3 +- .../create-gathering-modal/container.tsx | 34 +++++++++++++++++-- .../create-gathering-modal/presenter.tsx | 2 +- .../_components/create-gathering/index.tsx | 9 +++-- src/app/(crew)/crew/detail/[id]/page.tsx | 2 +- 7 files changed, 79 insertions(+), 12 deletions(-) diff --git a/src/_apis/gathering/gathering-detail-apis.ts b/src/_apis/gathering/gathering-detail-apis.ts index 3830233a..85b82def 100644 --- a/src/_apis/gathering/gathering-detail-apis.ts +++ b/src/_apis/gathering/gathering-detail-apis.ts @@ -1,5 +1,5 @@ import { fetchApi } from '@/src/utils/api'; -import { GatheringDetailType } from '@/src/types/gathering-data'; +import { CreateGatheringRequestTypes, GatheringDetailType } from '@/src/types/gathering-data'; // NOTE: 약속 디테일 불러오기 export async function GetGatheringDetail( @@ -52,3 +52,18 @@ export async function LeaveGathering(crewId: number, gatheringId: number): Promi }, }); } + +export async function createGathering(id: number, data: CreateGatheringRequestTypes) { + try { + await fetchApi(`/api/crews/${id}/gatherings`, { + method: 'POST', + headers: { + 'Content-Type': 'application/json', + }, + credentials: 'include', // Include authentication credentials + body: JSON.stringify(data), + }); + } catch (error) { + throw error; + } +} diff --git a/src/_queries/gathering/gathering-detail-queries.ts b/src/_queries/gathering/gathering-detail-queries.ts index 293c2aac..e7e29cc5 100644 --- a/src/_queries/gathering/gathering-detail-queries.ts +++ b/src/_queries/gathering/gathering-detail-queries.ts @@ -1,5 +1,7 @@ -import { useQuery } from '@tanstack/react-query'; -import { GetGatheringDetail } from '@/src/_apis/gathering/gathering-detail-apis'; +import { toast } from 'react-toastify'; +import { useMutation, useQuery, useQueryClient } from '@tanstack/react-query'; +import { GetGatheringDetail, createGathering } from '@/src/_apis/gathering/gathering-detail-apis'; +import { CreateGatheringRequestTypes } from '@/src/types/gathering-data'; export function useGetGatheringDetailQuery(crewId: number, gatheringId: number) { return useQuery({ @@ -7,3 +9,21 @@ export function useGetGatheringDetailQuery(crewId: number, gatheringId: number) queryFn: () => GetGatheringDetail(crewId, gatheringId), }); } + +export function useCreateGatheringQuery(crewId: number) { + const queryClient = useQueryClient(); + + return useMutation({ + mutationFn: (data: CreateGatheringRequestTypes) => createGathering(crewId, data), + onSuccess: () => { + queryClient.invalidateQueries({ + queryKey: ['gatheringList', crewId], + refetchType: 'all', + }); + toast.success('크루가 생성되었습니다.'); + }, + onError: (error) => { + toast.error(error.message); + }, + }); +} diff --git a/src/app/(crew)/crew/detail/[id]/_components/create-gathering/create-gathering-form/index.tsx b/src/app/(crew)/crew/detail/[id]/_components/create-gathering/create-gathering-form/index.tsx index 4028a52d..871384c6 100644 --- a/src/app/(crew)/crew/detail/[id]/_components/create-gathering/create-gathering-form/index.tsx +++ b/src/app/(crew)/crew/detail/[id]/_components/create-gathering/create-gathering-form/index.tsx @@ -162,8 +162,7 @@ export default function CreateGatheringForm({ {...field} fullDate={new Date()} onChange={(date) => { - const formattedDate = date.toLocaleString(); - onChange(formattedDate); + onChange(date); trigger('dateTime'); // 유효성 검사 실행 }} /> diff --git a/src/app/(crew)/crew/detail/[id]/_components/create-gathering/create-gathering-modal/container.tsx b/src/app/(crew)/crew/detail/[id]/_components/create-gathering/create-gathering-modal/container.tsx index 9ab71265..bd8a03a4 100644 --- a/src/app/(crew)/crew/detail/[id]/_components/create-gathering/create-gathering-modal/container.tsx +++ b/src/app/(crew)/crew/detail/[id]/_components/create-gathering/create-gathering-modal/container.tsx @@ -1,21 +1,42 @@ 'use client'; -import { CreateGatheringFormTypes } from '@/src/types/gathering-data'; +import { Loader } from '@mantine/core'; +import { getImageUrl } from '@/src/_apis/image/get-image-url'; +import { useCreateGatheringQuery } from '@/src/_queries/gathering/gathering-detail-queries'; +import { CreateGatheringFormTypes, CreateGatheringRequestTypes } from '@/src/types/gathering-data'; import CreateGatheringModalPresenter from './presenter'; export interface CreateGatheringModalContainerProps { + crewId: number; opened: boolean; close: () => void; data: CreateGatheringFormTypes; } export default function CreateGatheringModalContainer({ + crewId, opened, close, data, }: CreateGatheringModalContainerProps) { - const handleSubmit = () => { - // TODO : 약속 만들기 API 연결 + const { isPending, mutate } = useCreateGatheringQuery(crewId); + + const handleSubmit = async (createdData: CreateGatheringFormTypes) => { + let newImageUrl = createdData.imageUrl as string; + if (createdData.imageUrl instanceof File) { + const imgResponse = await getImageUrl(createdData.imageUrl, 'CREW'); + newImageUrl = imgResponse?.imageUrl as string; + } + const newData: CreateGatheringRequestTypes = { + title: createdData.title, + imageUrl: newImageUrl ?? '', + dateTime: createdData.dateTime, + location: createdData.location, + totalCount: createdData.totalCount, + introduce: createdData.introduce, + }; + + mutate(newData); close(); }; const handleEdit = () => { @@ -23,6 +44,13 @@ export default function CreateGatheringModalContainer({ close(); }; + if (isPending) + return ( +
+ +
+ ); + return ( void; - onSubmit: () => void; + onSubmit: (data: CreateGatheringFormTypes) => void; onEdit: () => void; data: CreateGatheringFormTypes; } diff --git a/src/app/(crew)/crew/detail/[id]/_components/create-gathering/index.tsx b/src/app/(crew)/crew/detail/[id]/_components/create-gathering/index.tsx index 53248d9e..6446ed09 100644 --- a/src/app/(crew)/crew/detail/[id]/_components/create-gathering/index.tsx +++ b/src/app/(crew)/crew/detail/[id]/_components/create-gathering/index.tsx @@ -7,7 +7,7 @@ import CreateGatheringModalContainer from '@/src/app/(crew)/crew/detail/[id]/_co import Button from '@/src/components/common/input/button'; import { CreateGatheringFormTypes } from '@/src/types/gathering-data'; -export default function CreateGathering() { +export default function CreateGathering({ crewId }: { crewId: number }) { const { isAuth } = useAuthStore(); const router = useRouter(); const [opened, { open, close }] = useDisclosure(false); @@ -34,7 +34,12 @@ export default function CreateGathering() { - + ); } diff --git a/src/app/(crew)/crew/detail/[id]/page.tsx b/src/app/(crew)/crew/detail/[id]/page.tsx index 2ad2e63a..5437d08b 100644 --- a/src/app/(crew)/crew/detail/[id]/page.tsx +++ b/src/app/(crew)/crew/detail/[id]/page.tsx @@ -23,7 +23,7 @@ export default async function CrewDetailPage({ params }: CrewDetailPageProps) {

크루 약속

- +
From db4a1c0b8b4a4539b7254dbcc74d6c6390d240bb Mon Sep 17 00:00:00 2001 From: Lee Youl <2yulrang@gmail.com> Date: Mon, 18 Nov 2024 09:06:23 +0900 Subject: [PATCH 3/7] =?UTF-8?q?=F0=9F=90=9B=20Fix:=20=EB=8B=AC=EB=A0=A5?= =?UTF-8?q?=EB=A7=8C=20=EC=84=A0=ED=83=9D=ED=95=B4=EB=8F=84=20=ED=8F=BC=20?= =?UTF-8?q?=ED=86=B5=EA=B3=BC=EB=90=98=EB=8A=94=20=EB=AC=B8=EC=A0=9C=20?= =?UTF-8?q?=ED=95=B4=EA=B2=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/common/input/date-time-picker/index.tsx | 1 - 1 file changed, 1 deletion(-) diff --git a/src/components/common/input/date-time-picker/index.tsx b/src/components/common/input/date-time-picker/index.tsx index 2097a51c..8e96f992 100644 --- a/src/components/common/input/date-time-picker/index.tsx +++ b/src/components/common/input/date-time-picker/index.tsx @@ -22,7 +22,6 @@ export default function DateTimePicker({ fullDate, onChange }: DateTimePickerPro if (isSelected) { setSelected(date); - onChange(date); } }; From 648d0de74edd0bb6838e579b52825f143755eade Mon Sep 17 00:00:00 2001 From: Lee Youl <2yulrang@gmail.com> Date: Mon, 18 Nov 2024 14:47:33 +0900 Subject: [PATCH 4/7] =?UTF-8?q?=F0=9F=90=9B=20Fix:=20=EC=9D=B4=EB=AF=B8?= =?UTF-8?q?=EC=A7=80=20=EC=97=85=EB=A1=9C=EB=93=9C=20=EC=8B=9C=EC=A0=90=20?= =?UTF-8?q?=EB=B3=80=EA=B2=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../create-gathering/create-gathering-form/index.tsx | 12 ++++++++++++ .../create-gathering-modal/container.tsx | 8 +------- 2 files changed, 13 insertions(+), 7 deletions(-) diff --git a/src/app/(crew)/crew/detail/[id]/_components/create-gathering/create-gathering-form/index.tsx b/src/app/(crew)/crew/detail/[id]/_components/create-gathering/create-gathering-form/index.tsx index 871384c6..2e037d86 100644 --- a/src/app/(crew)/crew/detail/[id]/_components/create-gathering/create-gathering-form/index.tsx +++ b/src/app/(crew)/crew/detail/[id]/_components/create-gathering/create-gathering-form/index.tsx @@ -2,6 +2,7 @@ import { Controller, useForm, useWatch } from 'react-hook-form'; import { NumberInput } from '@mantine/core'; +import { getImageUrl } from '@/src/_apis/image/get-image-url'; import Button from '@/src/components/common/input/button'; import DateTimePicker from '@/src/components/common/input/date-time-picker'; import FileInputWrap from '@/src/components/common/input/file-input-wrap'; @@ -38,6 +39,16 @@ export default function CreateGatheringForm({ const location = useWatch({ control, name: 'location' }); const introduce = useWatch({ control, name: 'introduce' }); + const handleFileChange = async ( + file: File | string | null, + onChange: (value: string | File) => void, + ) => { + if (file instanceof File) { + const imgResponse = await getImageUrl(file, 'CREW'); + onChange(imgResponse?.imageUrl || ''); + } + }; + return (
@@ -103,6 +114,7 @@ export default function CreateGatheringForm({ {...field} sample={ImgGatheringSampleUrls} onChange={(newValue) => { + handleFileChange(newValue, field.onChange); field.onChange(newValue); trigger('imageUrl'); }} diff --git a/src/app/(crew)/crew/detail/[id]/_components/create-gathering/create-gathering-modal/container.tsx b/src/app/(crew)/crew/detail/[id]/_components/create-gathering/create-gathering-modal/container.tsx index bd8a03a4..38919cab 100644 --- a/src/app/(crew)/crew/detail/[id]/_components/create-gathering/create-gathering-modal/container.tsx +++ b/src/app/(crew)/crew/detail/[id]/_components/create-gathering/create-gathering-modal/container.tsx @@ -1,7 +1,6 @@ 'use client'; import { Loader } from '@mantine/core'; -import { getImageUrl } from '@/src/_apis/image/get-image-url'; import { useCreateGatheringQuery } from '@/src/_queries/gathering/gathering-detail-queries'; import { CreateGatheringFormTypes, CreateGatheringRequestTypes } from '@/src/types/gathering-data'; import CreateGatheringModalPresenter from './presenter'; @@ -22,14 +21,9 @@ export default function CreateGatheringModalContainer({ const { isPending, mutate } = useCreateGatheringQuery(crewId); const handleSubmit = async (createdData: CreateGatheringFormTypes) => { - let newImageUrl = createdData.imageUrl as string; - if (createdData.imageUrl instanceof File) { - const imgResponse = await getImageUrl(createdData.imageUrl, 'CREW'); - newImageUrl = imgResponse?.imageUrl as string; - } const newData: CreateGatheringRequestTypes = { title: createdData.title, - imageUrl: newImageUrl ?? '', + imageUrl: (createdData.imageUrl as string) ?? '', dateTime: createdData.dateTime, location: createdData.location, totalCount: createdData.totalCount, From b1af98a9e46a65d605c6413d499ec2897a4c1073 Mon Sep 17 00:00:00 2001 From: Lee Youl <2yulrang@gmail.com> Date: Tue, 19 Nov 2024 15:19:37 +0900 Subject: [PATCH 5/7] =?UTF-8?q?Fix:=20=EC=8B=9C=EA=B0=84=EC=84=A0=ED=83=9D?= =?UTF-8?q?=20=EB=8F=99=EC=9E=91=EA=B0=9C=EC=84=A0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../common/input/date-time-picker/index.tsx | 14 +++++++++++--- 1 file changed, 11 insertions(+), 3 deletions(-) diff --git a/src/components/common/input/date-time-picker/index.tsx b/src/components/common/input/date-time-picker/index.tsx index 8e96f992..a20ecec7 100644 --- a/src/components/common/input/date-time-picker/index.tsx +++ b/src/components/common/input/date-time-picker/index.tsx @@ -9,7 +9,7 @@ import IconArrow from '@/public/assets/icons/ic-arrow'; export interface DateTimePickerProps { fullDate: Date; - onChange: (date: Date) => void; + onChange: (date: string) => void; } export default function DateTimePicker({ fullDate, onChange }: DateTimePickerProps) { @@ -26,9 +26,17 @@ export default function DateTimePicker({ fullDate, onChange }: DateTimePickerPro }; const handleTime = () => { - const newDate = dayjs(selected).hour(Number(hour)).minute(Number(minute)).toDate(); + const newDate = new Date(selected); + + newDate.setHours(Number(hour)); + newDate.setMinutes(Number(minute)); + + const kstDate = new Date(newDate.getTime() - newDate.getTimezoneOffset() * 60000).toISOString(); + setSelected(newDate); - onChange(newDate); + + // KST 기준 ISO 문자열 전달 + onChange(kstDate); }; return ( From 8d1fb760dc67b630366260a86066948a397f9dde Mon Sep 17 00:00:00 2001 From: Lee Youl <2yulrang@gmail.com> Date: Tue, 19 Nov 2024 16:37:19 +0900 Subject: [PATCH 6/7] =?UTF-8?q?=F0=9F=90=9B=20Fix:=20popover=20calendar=20?= =?UTF-8?q?=EB=8F=99=EC=9E=91=EA=B0=9C=EC=84=A0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../common/input/calendar-filter/index.tsx | 8 ++- .../common/input/pop-over-calendar/index.tsx | 50 ++++++++++++------- 2 files changed, 40 insertions(+), 18 deletions(-) diff --git a/src/components/common/input/calendar-filter/index.tsx b/src/components/common/input/calendar-filter/index.tsx index 3be9bdf6..26ad4047 100644 --- a/src/components/common/input/calendar-filter/index.tsx +++ b/src/components/common/input/calendar-filter/index.tsx @@ -12,7 +12,12 @@ export interface CalendarFilterProps { onChange: (date: Date) => void; } -export default function CalendarFilter({ value, toDoDates, onChange }: CalendarFilterProps) { +export default function CalendarFilter({ + value, + toDoDates, + onChange, + ...rest +}: CalendarFilterProps) { const [selected, setSelected] = useState(value); const handleSelect = (date: Date) => { @@ -69,6 +74,7 @@ export default function CalendarFilter({ value, toDoDates, onChange }: CalendarF ); }} + {...rest} /> ); diff --git a/src/components/common/input/pop-over-calendar/index.tsx b/src/components/common/input/pop-over-calendar/index.tsx index 648314cf..395810d3 100644 --- a/src/components/common/input/pop-over-calendar/index.tsx +++ b/src/components/common/input/pop-over-calendar/index.tsx @@ -1,4 +1,4 @@ -import { useState } from 'react'; +import { useEffect, useRef, useState } from 'react'; import { Button, Popover } from '@mantine/core'; import { useDisclosure, useMediaQuery } from '@mantine/hooks'; import CalendarFilter from '@/src/components/common/input/calendar-filter'; @@ -11,46 +11,62 @@ export interface PopOverProps { } export default function PopOverCalendar({ value, onChange }: PopOverProps) { - const [opened, { close, open }] = useDisclosure(false); - const [inputTheme, setInputTheme] = useState('white'); + const [opened, { open, close }] = useDisclosure(); + const [inputTheme, setInputTheme] = useState(opened ? 'dark' : 'light'); const [date, setDate] = useState(value); const isMobile = useMediaQuery(`(max-width: ${theme.breakpoints.md})`); + const popOver = useRef(null); - const handleClear = () => { + const handleClear = (e: React.MouseEvent) => { + e.stopPropagation(); setDate(new Date()); onChange(new Date()); close(); }; - const handleSubmit = () => { + const handleSubmit = (e: React.MouseEvent) => { + e.stopPropagation(); onChange(date); close(); }; - + const handleOutsideClick = (e: MouseEvent) => { + if (popOver.current && !popOver.current.contains(e.target as Node)) { + close(); + } + }; + useEffect(() => { + document.addEventListener('click', handleOutsideClick); + return () => document.removeEventListener('click', handleOutsideClick); + }, []); return ( - +
From 780424c1cb4842aa77547109bb26e00d44a85a6d Mon Sep 17 00:00:00 2001 From: Lee Youl <2yulrang@gmail.com> Date: Tue, 19 Nov 2024 16:59:49 +0900 Subject: [PATCH 7/7] =?UTF-8?q?=F0=9F=9A=A8=20Fix:=20=EB=B9=8C=EB=93=9C?= =?UTF-8?q?=EC=98=A4=EB=A5=98=20=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../common/input/date-time-picker/date-time-picker.stories.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/common/input/date-time-picker/date-time-picker.stories.tsx b/src/components/common/input/date-time-picker/date-time-picker.stories.tsx index abc103c7..8b6805a7 100644 --- a/src/components/common/input/date-time-picker/date-time-picker.stories.tsx +++ b/src/components/common/input/date-time-picker/date-time-picker.stories.tsx @@ -29,7 +29,7 @@ export default meta; const Template: StoryFn = function DateTimePickerStory() { const [date, setDate] = useState(new Date()); - return ; + return setDate(new Date(newValue))} />; }; export const DateTimePicker01 = Template.bind({});