Filter Plants

Value Proposition

As a user

I want to filter plants based on their light needs,

so that I can quickly find plants that match the light conditions in my home or garden.

The plant list includes a section with filter options.
Users can filter plants by light needs.
Only one light need filter can be selected at a time.
Selecting a new light need filter automatically deselects the previously selected filter.
Users can clear all filters with a single click, returning the list to its unfiltered state.
The plant list updates in real-time as filters are applied or removed.
If no plants match the selected filter criteria, a message is displayed indicating that no plants were found.
The filter interface is intuitive and easy to use, ensuring that new users can easily understand how to apply and clear filters.
The filters are not reset after closing.
A number that counts the selected filter should be displayed within the button so that the user can see if any filter is active
The form and filter functions work independently of each other.
The form is displayed above the filter, both can be visible at the same time and can be opened or closed independently of each other
A heading is displayed to categorize the two sections (Create new Plant / Filter)

[x] Create feature branch feature/filter-plants
[x] Add a toggle button to open and close the filter section, ensuring that toggling does not reset the filter.
[x] Implement a component for the filter section that filters the list below in real-time based on the selected criteria.
[x] Ensure only one light requirement filter can be active at a time, and selecting a new filter automatically deselects the previous one.
[x] Reuse the light requirement options inside the filter section
[x] Add a reset button to clear all filters and show the unfiltered list.
[x] Display a message when no plants match the selected filter criteria.
[x] Display the selected filter count within the toggle button so users can easily see active filters.
[x] Ensure the filter state persists even when the section is closed and reopened.
[ ] Position the form above the filter section, allowing both to be opened or closed independently.
[ ] Add headings to categorize the two sections: "Create New Plant" and "Filter".