포토 카드의 필터링 & 정렬에 사용

DefaultDropDown(텍스트 형태)

• 위치 : components/ui/drop-down/DefaultDropDown.jsx
• 용도: 등급, 장르 등 일반적인 필터링

props

/** 
	/items(Array타입) : 드롭다운에 표시될 옵션 리스트
----- ['COMMON','RARE']
	placeholder(string타입): 선택된 값이 없을 때 표시되는 기본 텍스트
----- 등급, 장르
	filterKey(String타입): filter Context에서  업데이트할 상태 키 값
	--- "grade","genre"
*/

사용 예시

import DefaultDropDown from '@/components/ui/drop-down/DefaultDropDown';

<DefaultDropDown 
	items={['COMMON', 'RARE', 'SUPER RARE', 'LEGENDARY']}
	placeholder='등급' // 시안과 맞지않는다면 일반 테일윈드로 글자를 표현하는것도 방법
	filterKey="grade"
/>

BoxDropDown(박스 형태)

• 위치 : components/ui/drop-down/BoxDropDown.jsx
• 용도: 정렬 순서(가격순, 최신순) 필터링을 위한 박스 형태의 UI가 필요할 때

Props

/** @prop   type      desciprtion */
items     array    옵션리스트
filterKey string   필터 Context 키 값(ex: "price)

사용 예시