feat: Location 필터링의 경우 지역 세분화 처리

kusitms-com · Nov 28, 2024 · 4cbf3dd · 4cbf3dd
1 parent 6f01149
commit 4cbf3dd
Show file tree

Hide file tree

Showing 4 changed files with 12 additions and 4 deletions.
diff --git a/src/components/Browse/ShowFilter/index.tsx b/src/components/Browse/ShowFilter/index.tsx
@@ -154,7 +154,7 @@ export const ShowFilter = ({ onClose, onApply }: ShowFilterProps) => {
           </span>
           <Location
             selectedLocation={selectedLocation}
-            onLocationClick={handleLocationClick}
+            onLocationFilterClick={handleLocationClick}
           />
         </div>
         <div className="flex flex-col mb-[58px] gap-8">

diff --git a/src/components/common/Location/index.tsx b/src/components/common/Location/index.tsx
@@ -14,15 +14,21 @@ const AREA_LIST = [
 
 export const Location = ({
   selectedLocation,
+  onLocationFilterClick,
   onLocationClick,
+  isFilter = false,
 }: LocationProps) => {
   return (
     <div className="grid grid-cols-2 gap-[0.63rem]">
       {AREA_LIST.map((location, index) => (
         <TypeButton
           key={index}
           isChecked={location.value.every((v) => selectedLocation.includes(v))}
-          onClick={() => onLocationClick(location.value, location.label)}
+          onClick={() =>
+            isFilter
+              ? onLocationFilterClick?.(location.value, location.label)
+              : onLocationClick?.(location.label)
+          }
         >
           {location.label}
         </TypeButton>

diff --git a/src/pages/Onboarding/UserRegistration/Location/page.tsx b/src/pages/Onboarding/UserRegistration/Location/page.tsx
@@ -31,7 +31,7 @@ export const SelectLocationPage = () => {
   };
 
   return (
-    <div className="w-full h-screen overflow-y-auto bg-background-dark flex flex-col">
+    <div className="flex flex-col w-full h-screen overflow-y-auto bg-background-dark">
       <div className="flex flex-col flex-grow w-full h-auto px-[24px] pt-[4.75rem] pb-[4.56rem] gap-[0.5rem]">
         <div className="flex flex-col gap-[2.44rem]">
           <div className="flex-col">

diff --git a/src/types/onboarding.ts b/src/types/onboarding.ts
@@ -23,7 +23,9 @@ export type PriceProps = {
 
 export type LocationProps = {
   selectedLocation: string[];
-  onLocationClick: (value: string[], label: string) => void;
+  onLocationFilterClick?: (value: string[], label: string) => void;
+  onLocationClick?: (label: string) => void;
+  isFilter?: boolean;
 };
 
 export type ConceptProps = {