Create topic dropdown component

[andrewtavis]

Terms

• I have searched open and closed feature requests
• I agree to follow activist's Code of Conduct

Description

This issue is to crate a DropdownTopics.vue component in the frontend that will be used to select the topics that the user wants to filter by. We'll need this to be a multi selection dropdown that uses Headless UI for accessibility - for instance a combobox. The component would be made in the dropdown directory.

The general style for the component can be found on the designs on Figma, but personally I feel like we can improve this a bit. As far as props are concerned, we'll need to have two sections: one that's at the top that are the saved topics of the user, and one that's below a horizontal separator line that has the rest of the available topics. Each section could have a small header above such as My topics and Other topics.

This component would then replace the placeholder topics dropdown component on pages such as the home page.

Contribution

Happy to support someone on this! This can be a good first issue for someone, but note that it's a bit more difficult :)

[iagocarmona]

Hello, I would like to work on this!

[andrewtavis]

Thanks @iagocarmona! Assigning you now 😊 Please let me know if there are any ways I can support! Your feedback and ideas on this would also be very welcome :) Looming forward to this 🙌🙌

[andrewtavis]

Closed via #497, with 2437018 doing the refactor as discussed in the PR, @iagocarmona 😊 Thanks for the initial effort on this! Really great to get this done :)