fix(listview): match Explore Select dropdown height + fix clear-all after refresh

CompactSelectPanel: remove overflow:hidden from panel (was clipping search
input); remove min-height from OptionItem (5px padding alone gives the
correct 24px height matching AntD Select optionPadding, not 42px).

index.tsx: clearFilters/clearFilterById now call updateFilterValue directly
as a safety net so URL always updates even when filter refs are stale
(e.g. after page refresh where internalFilters is URL-hydrated).

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
kasiazjc
2026-05-20 14:35:16 +00:00
committed by Amin Ghadersohi
parent 541cfd989c
commit 96234d2cfe
2 changed files with 9 additions and 4 deletions

View File

@@ -57,7 +57,6 @@ const PanelContainer = styled.div`
display: flex;
flex-direction: column;
border-radius: ${theme.borderRadiusLG}px;
overflow: hidden;
background: ${theme.colorBgElevated};
box-shadow: ${theme.boxShadowSecondary};
padding: ${theme.paddingXXS}px 0;
@@ -84,7 +83,6 @@ const OptionItem = styled.li<{ $active: boolean }>`
align-items: center;
justify-content: space-between;
padding: 5px ${theme.sizeUnit * 3}px;
min-height: ${theme.controlHeight}px;
cursor: pointer;
font-size: ${theme.fontSize}px;
color: ${theme.colorText};

View File

@@ -49,7 +49,10 @@ interface UIFiltersProps {
function UIFilters(
{ filters, internalFilters = [], updateFilterValue }: UIFiltersProps,
ref: RefObject<{ clearFilters: () => void; clearFilterById: (id: string) => void }>,
ref: RefObject<{
clearFilters: () => void;
clearFilterById: (id: string) => void;
}>,
) {
const filterRefs = useMemo(
() =>
@@ -65,8 +68,11 @@ function UIFilters(
useImperativeHandle(ref, () => ({
clearFilters: () => {
filterRefs.forEach(filter => {
filterRefs.forEach((filter, index) => {
filter.current?.clearFilter?.();
// Direct reset as safety net — ensures URL updates even if the ref
// is stale (e.g. filter value was hydrated from URL after page refresh).
updateFilterValue(index, undefined);
});
setTooltipLabels({});
},
@@ -74,6 +80,7 @@ function UIFilters(
const index = filters.findIndex(f => f.id === id);
if (index >= 0) {
filterRefs[index]?.current?.clearFilter?.();
updateFilterValue(index, undefined);
setTooltipLabels(prev => {
const next = { ...prev };
delete next[index];