diff --git a/src/api/auth/auth.ts b/src/api/auth/auth.ts index 3eeef26..48f6d9a 100644 --- a/src/api/auth/auth.ts +++ b/src/api/auth/auth.ts @@ -11,7 +11,7 @@ import type { TSignupValues, TSocialLoginResponse, TSocialLoginValues, -} from '@/types/auth'; +} from '@/types/auth/auth'; import { axiosInstance } from '../axiosInstance'; diff --git a/src/api/course/course.ts b/src/api/course/course.ts index 972654f..fa176f3 100644 --- a/src/api/course/course.ts +++ b/src/api/course/course.ts @@ -1,4 +1,4 @@ -import type { TSearchRegionResponse, TSearchRegionValues } from '@/types/dateCourse'; +import type { TSearchRegionResponse, TSearchRegionValues } from '@/types/dateCourse/dateCourse'; import { axiosInstance } from '../axiosInstance'; diff --git a/src/components/dateCourse/dateCourseOptionButton.tsx b/src/components/dateCourse/dateCourseOptionButton.tsx index 8511a09..5ecbe4f 100644 --- a/src/components/dateCourse/dateCourseOptionButton.tsx +++ b/src/components/dateCourse/dateCourseOptionButton.tsx @@ -1,4 +1,4 @@ -import type { TDateCourseOptionButtonProps } from '@/types/dateCourse'; +import type { TDateCourseOptionButtonProps } from '@/types/dateCourse/dateCourse'; export default function DateCourseOptionButton({ option, isSelected, onClick }: TDateCourseOptionButtonProps) { return ( diff --git a/src/components/dateCourse/dateCourseSearchFilterOption.tsx b/src/components/dateCourse/dateCourseSearchFilterOption.tsx index 348f15d..38b8c80 100644 --- a/src/components/dateCourse/dateCourseSearchFilterOption.tsx +++ b/src/components/dateCourse/dateCourseSearchFilterOption.tsx @@ -1,10 +1,9 @@ import React, { useEffect, useRef, useState } from 'react'; -import type { TDateCourseSearchFilterOption } from '@/types/dateCourse'; +import type { TDateCourseSearchFilterOption, TRegion } from '@/types/dateCourse/dateCourse'; import DATE_KEYWORD from '@/constants/dateKeywords'; import { useSearchRegion } from '@/hooks/course/useSearchRegion'; -import useDebounce from '@/hooks/useDebounce'; import DateCourseOptionButton from './dateCourseOptionButton'; import DateKeyword from './dateKeyword'; @@ -24,9 +23,6 @@ export default function DateCourseSearchFilterOption({ options, type, value, onC const [date, setDate] = useState(defaultDate); const [time, setTime] = useState(defaultTime); const [inputValue, setInputValue] = useState(''); - const [showSearchResults, setShowSearchResults] = useState(false); - - const debouncedInputValue = useDebounce(inputValue, 3000); useEffect(() => { onChange(`${date} ${time}`); @@ -50,11 +46,12 @@ export default function DateCourseSearchFilterOption({ options, type, value, onC setInputValue(e.target.value); }; - const { data: regionList } = useSearchRegion({ keyword: debouncedInputValue }); + const { data: regionList, refetch } = useSearchRegion({ keyword: inputValue }, { enabled: false }); const handleSearch = () => { - if (!inputValue.trim()) return; - setShowSearchResults(true); + const keyword = inputValue.trim(); + if (!keyword) return; + refetch(); }; return ( @@ -96,22 +93,21 @@ export default function DateCourseSearchFilterOption({ options, type, value, onC onChange={handleInputChange} /> - {showSearchResults && regionList && regionList.result.regions.length > 0 && ( + {regionList && regionList.result.regions.length > 0 && ( diff --git a/src/components/dateCourse/dateKeyword.tsx b/src/components/dateCourse/dateKeyword.tsx index 229678e..961556c 100644 --- a/src/components/dateCourse/dateKeyword.tsx +++ b/src/components/dateCourse/dateKeyword.tsx @@ -1,4 +1,4 @@ -import type { TDateKeyword } from '@/types/dateCourse'; +import type { TDateKeyword } from '@/types/dateCourse/dateCourse'; import KeywordButton from './keywordButton'; diff --git a/src/components/dateCourse/info.tsx b/src/components/dateCourse/info.tsx index e147100..a0bb6ec 100644 --- a/src/components/dateCourse/info.tsx +++ b/src/components/dateCourse/info.tsx @@ -1,4 +1,4 @@ -import type { TInfo } from '@/types/dateCourse'; +import type { TInfo } from '@/types/dateCourse/dateCourse'; import InfoElement from './infoElement'; diff --git a/src/components/dateCourse/keywordButton.tsx b/src/components/dateCourse/keywordButton.tsx index df17519..47613ef 100644 --- a/src/components/dateCourse/keywordButton.tsx +++ b/src/components/dateCourse/keywordButton.tsx @@ -1,4 +1,4 @@ -import type { TKeywordButtonProps } from '@/types/dateCourse'; +import type { TKeywordButtonProps } from '@/types/dateCourse/dateCourse'; export default function KeywordButton({ tag, selected = false, onClick, isButton }: TKeywordButtonProps) { return ( diff --git a/src/components/dateCourse/timeline.tsx b/src/components/dateCourse/timeline.tsx index bfe1c0b..1b986ce 100644 --- a/src/components/dateCourse/timeline.tsx +++ b/src/components/dateCourse/timeline.tsx @@ -1,6 +1,6 @@ import { useState } from 'react'; -import type { TTimeline } from '@/types/dateCourse'; +import type { TTimeline } from '@/types/dateCourse/dateCourse'; import KeywordButton from './keywordButton'; diff --git a/src/hooks/auth/useAuth.ts b/src/hooks/auth/useAuth.ts index 2528da4..ce4c2e4 100644 --- a/src/hooks/auth/useAuth.ts +++ b/src/hooks/auth/useAuth.ts @@ -1,12 +1,8 @@ -// import { useNavigate } from 'react-router-dom'; - import { useCoreMutation } from '../customQuery'; import { checkEmailVerifications, defaultLogin, defaultSignup, emailVerifications, findPassword, logout, socialLogin } from '@/api/auth/auth'; export function useAuth() { - // const navigate = useNavigate(); - const useDefaultLogin = useCoreMutation(defaultLogin); const useDefaultSignup = useCoreMutation(defaultSignup); const useLogout = useCoreMutation(logout); diff --git a/src/hooks/course/useSearchRegion.tsx b/src/hooks/course/useSearchRegion.tsx index 919e621..4a7e07a 100644 --- a/src/hooks/course/useSearchRegion.tsx +++ b/src/hooks/course/useSearchRegion.tsx @@ -1,9 +1,11 @@ import { useCoreQuery } from '../customQuery'; import { searchRegion } from '@/api/course/course'; +import { regionKeys } from '@/queryKey/queryKey'; -export function useSearchRegion({ keyword }: { keyword: string }) { - return useCoreQuery(['searchRegion', keyword], () => searchRegion({ keyword }), { - enabled: !!keyword, +export function useSearchRegion({ keyword }: { keyword: string }, options?: { enabled?: boolean }) { + return useCoreQuery(regionKeys.search(keyword).queryKey, () => searchRegion({ keyword }), { + enabled: options?.enabled ?? true, + staleTime: 1000 * 60 * 5, }); } diff --git a/src/pages/RedirectPage.tsx b/src/pages/RedirectPage.tsx index ce47333..024dc89 100644 --- a/src/pages/RedirectPage.tsx +++ b/src/pages/RedirectPage.tsx @@ -1,7 +1,7 @@ import { useEffect } from 'react'; import { useLocation, useNavigate } from 'react-router-dom'; -import type { TSocialLoginPlatform } from '@/types/auth'; +import type { TSocialLoginPlatform } from '@/types/auth/auth'; import { useAuth } from '@/hooks/auth/useAuth'; diff --git a/src/pages/auth/FindPw.tsx b/src/pages/auth/FindPw.tsx index 3ec7059..23522ee 100644 --- a/src/pages/auth/FindPw.tsx +++ b/src/pages/auth/FindPw.tsx @@ -4,7 +4,7 @@ import { useForm, useWatch } from 'react-hook-form'; import { useNavigate } from 'react-router-dom'; import { zodResolver } from '@hookform/resolvers/zod'; -import type { TFormValues } from '@/types/auth'; +import type { TFormValues } from '@/types/auth/auth'; import { findingSchema } from '@/utils/validation'; diff --git a/src/pages/auth/JoinPage.tsx b/src/pages/auth/JoinPage.tsx index 0e467fc..f32adc4 100644 --- a/src/pages/auth/JoinPage.tsx +++ b/src/pages/auth/JoinPage.tsx @@ -4,7 +4,7 @@ import { useForm, useWatch } from 'react-hook-form'; import { useNavigate } from 'react-router-dom'; import { zodResolver } from '@hookform/resolvers/zod'; -import type { TFormValues } from '@/types/auth'; +import type { TFormValues } from '@/types/auth/auth'; import { signupSchema } from '@/utils/validation'; diff --git a/src/pages/auth/LoginPage.tsx b/src/pages/auth/LoginPage.tsx index 8769abd..d7db6cd 100644 --- a/src/pages/auth/LoginPage.tsx +++ b/src/pages/auth/LoginPage.tsx @@ -4,7 +4,7 @@ import { useForm, useWatch } from 'react-hook-form'; import { useNavigate } from 'react-router-dom'; import { zodResolver } from '@hookform/resolvers/zod'; -import type { TLoginFormValues } from '@/types/auth'; +import type { TLoginFormValues } from '@/types/auth/auth'; import { loginSchema } from '@/utils/validation'; diff --git a/src/pages/auth/RedirectPage.tsx b/src/pages/auth/RedirectPage.tsx index b21f430..6c39ab9 100644 --- a/src/pages/auth/RedirectPage.tsx +++ b/src/pages/auth/RedirectPage.tsx @@ -1,7 +1,7 @@ import { useEffect } from 'react'; import { useLocation, useNavigate } from 'react-router-dom'; -import type { TSocialLoginPlatform } from '@/types/auth'; +import type { TSocialLoginPlatform } from '@/types/auth/auth'; import { useAuth } from '@/hooks/auth/useAuth'; diff --git a/src/pages/auth/UserSetting.tsx b/src/pages/auth/UserSetting.tsx index bba43bd..22102e9 100644 --- a/src/pages/auth/UserSetting.tsx +++ b/src/pages/auth/UserSetting.tsx @@ -4,8 +4,8 @@ import { Controller, useForm } from 'react-hook-form'; import { useNavigate } from 'react-router-dom'; import { zodResolver } from '@hookform/resolvers/zod'; -import type { TUserSettingFormValues } from '@/types/auth'; -import { Gender } from '@/types/auth'; +import type { TUserSettingFormValues } from '@/types/auth/auth'; +import { Gender } from '@/types/auth/auth'; import formatDateInput from '@/utils/formatDateInput'; import formatInputNumber from '@/utils/formatPhoneNumber'; diff --git a/src/pages/dateCourse/MakeCourseStep.tsx b/src/pages/dateCourse/MakeCourseStep.tsx index e7d09b2..f8e47a5 100644 --- a/src/pages/dateCourse/MakeCourseStep.tsx +++ b/src/pages/dateCourse/MakeCourseStep.tsx @@ -2,7 +2,7 @@ import { useEffect, useState } from 'react'; import { useNavigate, useParams } from 'react-router-dom'; -import type { IQuestion } from '@/types/dateCourse'; +import type { IQuestion } from '@/types/dateCourse/dateCourse'; import { DateCourseQuestion } from '@/constants/dateCourseQuestion'; import { diff --git a/src/queryKey/queryKey.ts b/src/queryKey/queryKey.ts new file mode 100644 index 0000000..1e3fb30 --- /dev/null +++ b/src/queryKey/queryKey.ts @@ -0,0 +1,5 @@ +import { createQueryKeys } from '@lukemorales/query-key-factory'; + +export const regionKeys = createQueryKeys('region', { + search: (keyword: string) => [keyword], +}); diff --git a/src/types/auth.ts b/src/types/auth/auth.ts similarity index 96% rename from src/types/auth.ts rename to src/types/auth/auth.ts index 301e92e..64272bb 100644 --- a/src/types/auth.ts +++ b/src/types/auth/auth.ts @@ -1,4 +1,4 @@ -import type { TCommonResponse } from './common/common'; +import type { TCommonResponse } from '@/types/common/common'; export enum Gender { MALE = 'MALE', diff --git a/src/types/dateCourse.ts b/src/types/dateCourse/dateCourse.ts similarity index 78% rename from src/types/dateCourse.ts rename to src/types/dateCourse/dateCourse.ts index e6734f4..c53a426 100644 --- a/src/types/dateCourse.ts +++ b/src/types/dateCourse/dateCourse.ts @@ -1,6 +1,6 @@ import type { Dispatch, SetStateAction } from 'react'; -import type { TCommonResponse } from './common/common'; +import type { TCommonResponse } from '@/types/common/common'; export type TTimeline = { end?: boolean; @@ -70,7 +70,24 @@ export type TSearchRegionValues = { }; export type TSearchRegionResponse = TCommonResponse<{ - regions: string[]; + regions: TRegion[]; keyword: string; resultCount: number; }>; + +export type TRegion = { + regionId: number; + name: string; + latitude: number; + longitude: number; + gridX: number; + gridY: number; + regionCode: { + landRegCode: string; + tempRegCode: string; + regionCodeId: number; + name: string; + }; + createdAt: string; + updatedAt: string; +}; diff --git a/src/utils/validation.tsx b/src/utils/validation.tsx index 1be358a..ad0b308 100644 --- a/src/utils/validation.tsx +++ b/src/utils/validation.tsx @@ -1,6 +1,6 @@ import { z } from 'zod'; -import { Gender } from '@/types/auth'; +import { Gender } from '@/types/auth/auth'; const nicknamePattern = /^[a-zA-Z]+$/; const emailRegex = /^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,}$/; diff --git a/yarn.lock b/yarn.lock index e37e21e..f20e38c 100644 --- a/yarn.lock +++ b/yarn.lock @@ -600,7 +600,7 @@ "@lukemorales/query-key-factory@^1.3.4": version "1.3.4" - resolved "https://registry.npmjs.org/@lukemorales/query-key-factory/-/query-key-factory-1.3.4.tgz" + resolved "https://registry.yarnpkg.com/@lukemorales/query-key-factory/-/query-key-factory-1.3.4.tgz#d14001dbd781b024df93ca73bd785db590924486" integrity sha512-A3frRDdkmaNNQi6mxIshsDk4chRXWoXa05US8fBo4kci/H+lVmujS6QrwQLLGIkNIRFGjMqp2uKjC4XsLdydRw== "@napi-rs/wasm-runtime@^0.2.11":