Add memes options filter to Memes component#43
Conversation
Introduced a MemesOption component to enable filtering memes based on options like reposts. Updated the Memes component to integrate this feature with query updates, enabling real-time filtering and improved user interaction.
|
|
|
For now i only added the Repost filter. But i intend to add more functions like page size is_original ( see #42 ) etc... |
Added `resetMemesOptionState` to clear the form state when the overlay closes, improving component behavior and state management. Removed unnecessary comments and adjusted the Overlay component to include the `onOpenChange` callback.
|
I was planning on adding this to the end of the category options, to the left top bar - what do you think about adding the filters there and separate the filters (the whole filter container from the category container) by a horizontal separator? |
|
Yeah it is a fitting spot. But i would do it right bound as left bound would look like a little tooo far off and no one would see it |
Introduced the MemesOption component in the LeftColumn for better accessibility and removed it from the Memes page. Refactored query handling in MemesOption and Memes components to simplify state management and align with URL search parameters.
| : {} | ||
| ) | ||
| setLoading(true) | ||
| setPosts([]) |
There was a problem hiding this comment.
Without this it doesnt work.
|
I was picturing something like this
What do you think about having them explicit like this? (With better design of course, maybe not complete "Select Date" components but just a calendar icon with selected date next to it for instance so it is slimmer, or maybe with the existing component like this? With better padding, gaps etc. Also generally when possible can you use flex + gap instead of margins, especially within a component itself to arrange its children? I think that makes the code consistent. Or maybe we can have a design where we combine these two options? Instead of opening an Overlay, clicking a filter button toggles this ui directly? |
|
I would say lets go with the combined, as i personally think having that 24/7 is a bit obsessive and unnecessary. |
|
|
…ling Refactored MemesOption by replacing Overlay with Accordion for better UX. Updated query handling in Memes and MemesOption components to synchronize state with URL search parameters more efficiently.
…es component Introduced a `searchParamsToRecord` utility function to convert URL search parameters into a type-safe record. Refactored query handling in the Memes component to leverage the new utility for cleaner and more consistent state synchronization with URL parameters.
…ure/only-originals # Conflicts: # wsd-frontend/src/components/wsd/Memes/Memes.tsx
2 participants
Introduced a MemesOption component to enable filtering memes based on options like reposts. Updated the Memes component to integrate this feature with query updates, enabling real-time filtering and improved user interaction.