diff --git a/src/components/ButtonsInAddingCandidate/AddToCandidateButton/AddToCandidateButton.tsx b/src/components/ButtonsInAddingCandidate/AddToCandidateButton/AddToCandidateButton.tsx index 06f9302e..8df49004 100644 --- a/src/components/ButtonsInAddingCandidate/AddToCandidateButton/AddToCandidateButton.tsx +++ b/src/components/ButtonsInAddingCandidate/AddToCandidateButton/AddToCandidateButton.tsx @@ -2,9 +2,10 @@ import {Button} from '@chakra-ui/react'; import {useLocation, useNavigate} from 'react-router-dom'; import {useRecoilValue, useSetRecoilState} from 'recoil'; -import {usePostPlaces} from '@/hooks/Spaces/space'; +import {usePostPlaces, usePostSearchPlaces} from '@/hooks/Spaces/space'; -import {selectedPlaceState, selectedTripPlaceState} from '@/recoil/vote/selectPlace'; +import {activeTabIndexState} from '@/recoil/spaces/trip'; +import {selectedPlaceState, selectedTripPlaceState, selectedTripSearchPlaceState} from '@/recoil/vote/selectPlace'; //prop이나 params로 trip or vote 판별, onClick에 삼항연산자로 함수 넣기 const AddToCandidateButton = () => { @@ -18,9 +19,17 @@ const AddToCandidateButton = () => { const voteId = voteIdArray[1]; const selectedPlaces = useRecoilValue(selectedPlaceState); const selectedTripPlaces = useRecoilValue(selectedTripPlaceState); + const selectedTripSearchPlace = useRecoilValue(selectedTripSearchPlaceState); const setTripRecoil = useSetRecoilState(selectedTripPlaceState); - const counts = isInVote ? selectedPlaces.length : selectedTripPlaces.length; + const setTripSearchRecoil = useSetRecoilState(selectedTripSearchPlaceState); const postPlaces = usePostPlaces(); + const path = location.pathname; + const setSelectedTabIndex = useSetRecoilState(activeTabIndexState); + const counts = isInVote + ? selectedPlaces.length + : path === '/wishes/bring' + ? selectedTripPlaces.length + : selectedTripSearchPlace.length; const addPlaces = async () => { await postPlaces.mutateAsync({ @@ -28,8 +37,22 @@ const AddToCandidateButton = () => { journeyId: Number(voteId), placeIds: selectedTripPlaces, }); - navigate(`/trip/${spaceId}`, {state: {id: spaceId}}); + setSelectedTabIndex(1); setTripRecoil([]); + navigate(`/trip/${spaceId}`, {state: {id: spaceId}}); + }; + + const postSearchPlaces = usePostSearchPlaces(); + + const addSearchPlaces = async () => { + await postSearchPlaces.mutateAsync({ + spaceId: Number(spaceId), + journeyId: Number(voteId), + places: selectedTripSearchPlace, + }); + navigate(`/trip/${spaceId}`, {state: {id: spaceId}}); + setTripSearchRecoil([]); + setSelectedTabIndex(1); }; const handleAddCandidates = () => { @@ -37,7 +60,11 @@ const AddToCandidateButton = () => { if (isInVote) { navigate(`/trip/${spaceId}/votes/${voteId}/votememo`, {replace: true}); } else { - addPlaces(); + if (path === '/wishes/bring') { + addPlaces(); + } else { + addSearchPlaces(); + } } }; return ( diff --git a/src/components/ButtonsInAddingCandidate/SelectButton/SelectButton.tsx b/src/components/ButtonsInAddingCandidate/SelectButton/SelectButton.tsx index 1409692e..93418ada 100644 --- a/src/components/ButtonsInAddingCandidate/SelectButton/SelectButton.tsx +++ b/src/components/ButtonsInAddingCandidate/SelectButton/SelectButton.tsx @@ -5,7 +5,7 @@ import styles from './SelectButton.module.scss'; import useGetSelectedArray from '@/hooks/useGetSelectedArray'; -import {selectedPlaceState, selectedTripPlaceState} from '@/recoil/vote/selectPlace'; +import {selectedPlaceState, selectedTripPlaceState, selectedTripSearchPlaceState} from '@/recoil/vote/selectPlace'; import {SearchItemType} from '@/types/home'; @@ -22,7 +22,9 @@ const SelectButton = ({data}: Propstype) => { const selectedPlaces = useRecoilValue(selectedPlaceState); const selectedTripPlaces = useRecoilValue(selectedTripPlaceState); const setRecoil = useSetRecoilState(selectedTripPlaceState); + const setSearchRecoil = useSetRecoilState(selectedTripSearchPlaceState); const {toggleItemInNewArray} = useGetSelectedArray(selectedPlaceState); + const pathname = location.pathname; const handleClick = (e: React.MouseEvent) => { console.log(selectedTripPlaces); @@ -32,19 +34,35 @@ const SelectButton = ({data}: Propstype) => { if (isInVote) { toggleItemInNewArray(data); } else { - setRecoil((currentArray) => { - const index = currentArray.findIndex((item) => item === data.id); + if (pathname === '/wishes/bring') { + setRecoil((currentArray) => { + const index = currentArray.findIndex((item) => item === data.id); - if (index !== -1) { - const newArray = [...currentArray.slice(0, index), ...currentArray.slice(index + 1)]; - console.log('newArray:', newArray); - return newArray; - } else { - const newArray = [...currentArray, data.id]; - console.log('newArray:', newArray); - return newArray; - } - }); + if (index !== -1) { + const newArray = [...currentArray.slice(0, index), ...currentArray.slice(index + 1)]; + console.log('newArray:', newArray); + return newArray; + } else { + const newArray = [...currentArray, data.id]; + console.log('newArray:', newArray); + return newArray; + } + }); + } else { + setSearchRecoil((currentArray) => { + const index = currentArray.findIndex((item) => item.placeId === data.id); + + if (index !== -1) { + const newArray = [...currentArray.slice(0, index), ...currentArray.slice(index + 1)]; + console.log('newArray:', newArray); + return newArray; + } else { + const newArray = [...currentArray, {placeId: data.id, contentTypeId: data.contentTypeId}]; + console.log('newArray:', newArray); + return newArray; + } + }); + } } }; diff --git a/src/components/SearchFromHome/SearchHome/SearchKeyword/SearchKeyword.module.scss b/src/components/SearchFromHome/SearchHome/SearchKeyword/SearchKeyword.module.scss index e50c9a10..630bae60 100644 --- a/src/components/SearchFromHome/SearchHome/SearchKeyword/SearchKeyword.module.scss +++ b/src/components/SearchFromHome/SearchHome/SearchKeyword/SearchKeyword.module.scss @@ -1,9 +1,10 @@ -@use "@/sass" as *; +@use '@/sass' as *; .container { @include slide_button_container; .slide_box { + padding: 0 20px; @include slide_list_container; gap: 8px; diff --git a/src/recoil/vote/selectPlace.ts b/src/recoil/vote/selectPlace.ts index 6f405241..9063c55c 100644 --- a/src/recoil/vote/selectPlace.ts +++ b/src/recoil/vote/selectPlace.ts @@ -14,3 +14,9 @@ export const selectedTripPlaceState = atom({ default: [], effects_UNSTABLE: [persistAtom], }); + +export const selectedTripSearchPlaceState = atom<{placeId: number; contentTypeId: number}[]>({ + key: 'selectedTripPlaceState', + default: [], + effects_UNSTABLE: [persistAtom], +});