feat-fe: 평가 필터 팝오버 컴포넌트 구현 #804
Conversation
![github-actions[bot]](https://avatars.githubusercontent.com/in/15368?s=60&v=4){kind=small}
|
1728972223.636189 |
|
1728972224.071979 |
|
1728972224.040259 |
|
1728972234.523699 |
| appearance: none; | ||
|
|
||
| &::-moz-range-thumb { | ||
| width: 1.6rem; |
There was a problem hiding this comment.
Firefox에서 시험해보면 아래 이미지와 같이 SliderThumb 요소가 찌그러집니다.
요 부분에 한해서 width를 1rem으로 맞춰주면 정상적으로 출력되네요 :)
| width: 1.6rem; | |
| width: 1rem; |
There was a problem hiding this comment.
와 ㅋㅋ 환경별로 코드가 달라진다는게 진짜 이상하네용..
| <Slider | ||
| {...sliderProps} | ||
| onRangeChange={handleRangeChange} | ||
| /> |
There was a problem hiding this comment.
현재는 RatingFilter에서 "평가 상태"를 "평가 없음"으로 체크하더라도 평점 범위를 그대로 선택 가능해요. 다만 이 경우엔 평점을 드래그해서 선택하는 일이 무의미하기 때문에, UI 상에서 '평점'을 선택할 수 없다는 것을 명시적으로 드러내도록 Slider 요소를 회색 처리하는 것은 어떨지 제안드려 봅니다. 시급도가 높은 작업은 아니기 때문에 이에 대한 적용 여부는 같이 논의 후 결정하면 좋을 것 같아요 🙏
There was a problem hiding this comment.
아이고 이부분은 그냥 빠뜨린것 같습니다! 수정하도록 할게요
| if (!isDisabled) { | ||
| const newMinValue = Math.min(Number(e.target.value), Number(maxValue - step)); | ||
| setMinValue(newMinValue); | ||
| onRangeChange(newMinValue, maxValue); |
There was a problem hiding this comment.
새로운 값이 이전 값과 다른 경우에만 핸들러를 실행시켜서 최적화시켜줄 수도 있을 것 같아요~
| onRangeChange(newMinValue, maxValue); | |
| if (newMinValue !== minValue) onRangeChange(newMinValue, maxValue); |
There was a problem hiding this comment.
포매팅을 해주는 input에서는 이게 필수군요.. 한 수 배웠슴당 👍
Original issue description
목적
작업 세부사항
참고 사항
RATING_FILTER_POPOVER
closes #803
다음과 같은 부분을 봐주시면 좋을 것 같아요!
PopoverProvider를 Popover 컴포넌트에서만 사용하도록 구현하기 위해서 Popove 내부에 Provider를 사용하신 걸 보실 수 있습니다. 사용자 입장에서 isOpen state를 자유롭게 사용하면서도 Provider를 사용하지 않으면서도 내부 children에는 Prop을 주입하지 않아도 되는 형태를 생각해봤어요!