peter/siftlode
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

feat(filters): sort facet chips by count, then name

Browse source 
Order topic/language chips by their (contextual) count descending, name as the
tiebreaker, so the most-populated tags sit at the top and the smallest counts
fall to the bottom as you scan down.
This commit is contained in:
npeter83 2026-06-15 12:10:09 +02:00
parent d910bca5cf
commit 6e42e010dd
1 changed files with 8 additions and 3 deletions
Download patch file Download diff file Expand all files Collapse all files

11
frontend/src/components/Sidebar.tsx
View file

@ -135,11 +135,16 @@ export default function Sidebar({
const chipCount = (tag: Tag): number => const chipCount = (tag: Tag): number =>
facetsReady ? facetCounts[String(tag.id)] ?? 0 : tag.channel_count; facetsReady ? facetCounts[String(tag.id)] ?? 0 : tag.channel_count;
// Visible chips: hide zero-count ones once facets are in, but always keep selected ones // Visible chips: hide zero-count ones once facets are in, but always keep selected ones
// so an active filter can still be cleared. // so an active filter can still be cleared. Sorted by count (largest first), then name —
const visibleChips = (list: Tag[]): Tag[] => // so scanning top→bottom the smallest counts end up at the very bottom.
facetsReady const visibleChips = (list: Tag[]): Tag[] => {
const shown = facetsReady
? list.filter((tg) => chipCount(tg) > 0 || filters.tags.includes(tg.id)) ? list.filter((tg) => chipCount(tg) > 0 || filters.tags.includes(tg.id))
: list; : list;
return [...shown].sort(
(a, b) => chipCount(b) - chipCount(a) || a.name.localeCompare(b.name)
);
};
// After a page refresh the channel name isn't in the URL (only the id is), so // After a page refresh the channel name isn't in the URL (only the id is), so
// filters.channelName is undefined and the chip would fall back to "This channel". // filters.channelName is undefined and the chip would fall back to "This channel".