From 0b078854a9d998a3dae8da740b1079f84f90f73c Mon Sep 17 00:00:00 2001 From: uniS2 Date: Mon, 11 Mar 2024 17:40:21 +0900 Subject: [PATCH 1/9] =?UTF-8?q?Fix:=20=EC=9D=B4=EB=AF=B8=EC=A7=80=20?= =?UTF-8?q?=EA=B2=BD=EB=A1=9C=20=EC=98=A4=EB=A5=98=20-=20'svg/*'=20->=20'/?= =?UTF-8?q?svg/*'?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/common/DefaultImage.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/common/DefaultImage.tsx b/src/components/common/DefaultImage.tsx index 1a312b2..d8ae49e 100644 --- a/src/components/common/DefaultImage.tsx +++ b/src/components/common/DefaultImage.tsx @@ -31,7 +31,7 @@ const DefaultImage = ({ className={`flex justify-center align-middle min-w-14 ${width} ${heigth} rounded-xl bg-[#EFF2F6]`} > 기본 이미지 Date: Mon, 11 Mar 2024 17:41:38 +0900 Subject: [PATCH 2/9] =?UTF-8?q?Feat:=20TripPlace=20=ED=8E=98=EC=9D=B4?= =?UTF-8?q?=EC=A7=80=20-=20PlacesStore=20storage=20state=20=EC=9E=AC?= =?UTF-8?q?=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 변경 전 state: `[ {'1': [{데이터}, {데이터}, ... ]}, {...}, ...]` - 변경 후 state: `[ [{데이터}, {데이터}, ...], [...], .. ]` - `setSelctedPlaces` action 수정 - `resetSelectedPlaces` action 삭제 Github issue #59 --- src/store/PlacesStore.ts | 55 ++++++++++++++++++---------------------- 1 file changed, 25 insertions(+), 30 deletions(-) diff --git a/src/store/PlacesStore.ts b/src/store/PlacesStore.ts index 2a23165..005fcd7 100644 --- a/src/store/PlacesStore.ts +++ b/src/store/PlacesStore.ts @@ -11,8 +11,7 @@ type LocationPlacesStoreType = { type SelectPlacesStoreType = { selectedPlaces: PlaceDataType[][] | null; setTripPlacesRange: (range: number) => void; - // setSelctedPlaces: (id: number) => void; - resetSelectedPlaces: () => void; + setSelctedPlaces: (date: number, id: number) => void; }; export const LocationPlacesStore = create((set) => ({ @@ -27,36 +26,32 @@ export const SelectPlacesStore = create( selectedPlaces: null, setTripPlacesRange: (range: number) => set({ selectedPlaces: setTripRange(range) }), - /* setSelctedPlaces: (id: number) => - set((state) => {d - if ( - !state.selectedPlaces?.filter((sa) => sa.contentid == id).length - ) { - return state.selectedPlaces - ? { - selectedPlaces: [ - ...state.selectedPlaces, - ...state.locationPlaces!.filter( - (location) => location.contentid == id, - ), - ], - } - : { - selectedPlaces: [ - ...state.locationPlaces!.filter( - (location) => location.contentid == id, - ), - ], - }; + setSelctedPlaces: (date: number, id: number) => + set((state) => { + if (!state.selectedPlaces || !state.selectedPlaces[date]) { + state.selectedPlaces = []; + state.selectedPlaces[date] = []; + } + + const locationPlaces = LocationPlacesStore.getState().locationPlaces; + const index = state.selectedPlaces![date]!.findIndex( + (place) => place.contentid === id, + ); + + if (index == -1) { + const selectPlace = locationPlaces!.find( + (place) => place.contentid === id, + ); + if (selectPlace) { + state.selectedPlaces[date].push(selectPlace); + } } else { - return { - selectedPlaces: state.selectedPlaces?.filter( - (sa) => sa.contentid != id, - ), - }; + state.selectedPlaces[date].splice(index, 1); } - }), */ - resetSelectedPlaces: () => set({ selectedPlaces: null }), + return { + selectedPlaces: [...state.selectedPlaces], + }; + }), }), { name: "tripPlaceStorage", From 289f39a3386a4025995b416a3b6e748bb62756a1 Mon Sep 17 00:00:00 2001 From: uniS2 Date: Mon, 11 Mar 2024 17:49:00 +0900 Subject: [PATCH 3/9] =?UTF-8?q?Feat:=20TripPlace=20=ED=8E=98=EC=9D=B4?= =?UTF-8?q?=EC=A7=80=20-=20PlacesStore=20storage=20=EC=9E=AC=EC=88=98?= =?UTF-8?q?=EC=A0=95=20=EC=82=AC=ED=95=AD=20=EB=B0=98=EC=98=81?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 동적 경로 적용: `[tripdate]` - `useParams()` 이용하여 tripDate, index 값 하위 컴포넌트에 전달 - 각 컴포넌트에서 `useParams()`를 불러와 관리할지 고민입니다. Github issue #59 --- .../tripplace/{index.tsx => [tripdate].tsx} | 38 ++++++++++++------- 1 file changed, 25 insertions(+), 13 deletions(-) rename src/pages/tripplace/{index.tsx => [tripdate].tsx} (77%) diff --git a/src/pages/tripplace/index.tsx b/src/pages/tripplace/[tripdate].tsx similarity index 77% rename from src/pages/tripplace/index.tsx rename to src/pages/tripplace/[tripdate].tsx index 6f98468..d49752a 100644 --- a/src/pages/tripplace/index.tsx +++ b/src/pages/tripplace/[tripdate].tsx @@ -1,3 +1,4 @@ +import { useParams } from "next/navigation"; import TripPlaceLayout from "@/layout/tripplace/layout"; import HeaderTripSelect from "@/components/header/HeaderTripSelect"; import TripPlacesMap from "@/components/tripplace/TripPlacesMap"; @@ -5,18 +6,29 @@ import TripRegionDaysEdit from "@/components/common/TripRegionDaysEdit"; import SelectDateInfo from "@/components/common/SelectDateInfo"; import SelectItem from "@/components/common/SelectItem"; import ButtonLarge from "@/components/common/ButtonLarge"; -import { LocationPlacesStore, SelectPlacesStore } from "@/store/PlacesStore"; import DefaultImage from "@/components/common/DefaultImage"; import LocalPlaceItem from "@/components/tripplace/LocalPlaceItem"; -import { useRouter } from "next/router"; +import { DatesStore } from "@/store/DatesStore"; +import { LocationPlacesStore, SelectPlacesStore } from "@/store/PlacesStore"; +import { useEffect, useState } from "react"; -const TripPlacePage = ({ params }: { params: { index: number } }) => { +const TripPlacePage = () => { + const params = useParams(); const { locationPlaces } = LocationPlacesStore(); - const { selectedPlaces, resetSelectedPlaces } = SelectPlacesStore(); - const router = useRouter(); - const { index } = router.query; - const isSelected = Boolean(selectedPlaces); - const totalNumberText = selectedPlaces!.length; + const { tripDates } = DatesStore(); + const { selectedPlaces, setTripPlacesRange } = SelectPlacesStore(); + + const date = Number(params?.tripdate); + const dateIndex = date - 1; + + const [isSelected, SetIsSelected] = useState(false); + + useEffect(() => { + if (selectedPlaces && selectedPlaces[dateIndex]) { + const length = selectedPlaces[dateIndex].length; + SetIsSelected(Boolean(length)); + } + }, [selectedPlaces]); return ( @@ -25,10 +37,10 @@ const TripPlacePage = ({ params }: { params: { index: number } }) => {
- +