diff --git a/src/domains/home/features/customized-explore/customized-explore-content.tsx b/src/domains/home/features/customized-explore/customized-explore-content.tsx index 2a4bd57e..8d6fe644 100644 --- a/src/domains/home/features/customized-explore/customized-explore-content.tsx +++ b/src/domains/home/features/customized-explore/customized-explore-content.tsx @@ -99,7 +99,6 @@ export const CustomizedExploreContent = () => { key={filterItem.key} label={filterItem.label} pressed={appliedFilterKeys.includes(filterItem.key)} - icon={filterItem.icon} onPress={() => handleFilterPress(filterItem.key)} /> ))} diff --git a/src/domains/home/model/buddy-filter.ts b/src/domains/home/model/buddy-filter.ts index 256ab826..19f96623 100644 --- a/src/domains/home/model/buddy-filter.ts +++ b/src/domains/home/model/buddy-filter.ts @@ -1,14 +1,3 @@ -import type { SVGProps } from 'react'; - -import { - AgeIcon, - CertificationIcon, - CompanionIcon, - CountryIcon, - DateIcon, - GenderIcon, -} from '@/shared/components/icons'; - export type BuddyFilterKey = | 'country' | 'date' @@ -17,17 +6,14 @@ export type BuddyFilterKey = | 'buddyType' | 'verification'; -export type BuddyFilterIcon = React.ComponentType>; - export const buddyFilterItems = [ - { key: 'country', label: '국가', icon: CountryIcon }, - { key: 'date', label: '날짜', icon: DateIcon }, - { key: 'age', label: '나이', icon: AgeIcon }, - { key: 'gender', label: '성별', icon: GenderIcon }, - { key: 'buddyType', label: '동행 유형', icon: CompanionIcon }, - { key: 'verification', label: '인증 상태', icon: CertificationIcon }, + { key: 'country', label: '국가' }, + { key: 'date', label: '날짜' }, + { key: 'age', label: '나이' }, + { key: 'gender', label: '성별' }, + { key: 'buddyType', label: '동행 유형' }, + { key: 'verification', label: '인증 상태' }, ] satisfies { key: BuddyFilterKey; label: string; - icon?: BuddyFilterIcon; }[]; diff --git a/src/domains/home/sections/buddy-search-section.tsx b/src/domains/home/sections/buddy-search-section.tsx index a9f59949..11aea17e 100644 --- a/src/domains/home/sections/buddy-search-section.tsx +++ b/src/domains/home/sections/buddy-search-section.tsx @@ -127,7 +127,6 @@ export const BuddySearchSection = () => { key={filterItem.key} label={filterItem.label} pressed={appliedFilterKeys.includes(filterItem.key)} - icon={filterItem.icon} onPress={() => handleFilterPress(filterItem.key)} /> ))} diff --git a/src/shared/components/ui/filter/filter.tsx b/src/shared/components/ui/filter/filter.tsx index 5c2a12a9..7b833f6a 100644 --- a/src/shared/components/ui/filter/filter.tsx +++ b/src/shared/components/ui/filter/filter.tsx @@ -5,8 +5,8 @@ import { cn } from '@/lib/cn'; const FILTER_STYLES = { default: { bg: 'bg-white', - text: 'text-gray-800', - border: 'border border-gray-300', + text: 'text-gray-500', + border: 'border border-gray-100', }, pressed: { bg: 'bg-gray-800', @@ -15,21 +15,13 @@ const FILTER_STYLES = { }, }; -type IconComponent = React.ComponentType>; - export interface FilterProps { label: string; pressed: boolean; onPress: () => void; - icon?: IconComponent; } -export const Filter = ({ - label, - pressed, - onPress, - icon: Icon, -}: FilterProps) => { +export const Filter = ({ label, pressed, onPress }: FilterProps) => { const { bg, text, border } = FILTER_STYLES[pressed ? 'pressed' : 'default']; return ( @@ -38,13 +30,12 @@ export const Filter = ({ onClick={onPress} aria-pressed={pressed} className={cn( - 'inline-flex shrink-0 items-center gap-1.5 rounded-[30px] py-2.5 pr-4 pl-3', + 'inline-flex shrink-0 items-center rounded-[30px] px-4 py-2', bg, border, )} > - {Icon &&