openclimatefix / website

Source of the Open Climate Fix website.
https://openclimatefix.org
MIT License
15 stars 11 forks source link

Add blog post filter by category #62

Closed flowirtz closed 3 years ago

flowirtz commented 4 years ago

On the /blog page we are currently displaying all blog posts that exist. Luckily the number of them is growing fairly quickly. That makes going through them a bit hard though.

We should expect that some visitors are only interested in certain topics, not all of them. That's why it would be good to be able to filter blog posts by project.

image

It would be good to have a row that says "Filter by Project:" and then all the projects as buttons next to it, similarly to the above (hacky) screenshot. When a user clicks on one of these buttons the blog posts should be filtered by project. There should also be a reset button to remove the filter.

We already have a project: 'open-energy' metadata field on every blog post that should be queryable via GraphQL.

melnyczuk commented 3 years ago

Hi, I'm happy to pick this up!

I have a question about the desired filtering UX: would you like the filters to be mutually exclusive (ie, radio button type interaction) or would you like the filters to be opt-in/opt-out (ie, check-box type interaction)

I've got the filtering working fine, and figure that a row of buttons across the top of the blog posts as the image above suggests:

Screenshot 2021-05-20 at 18 16 26

note: work in progress (needs padding and correct colours & sizing)

(ps, hi 👋 not sure if I should introduce myself somewhere?)

flowirtz commented 3 years ago

Hey Howard,

first off: I'm really sorry it took me so long to get back to you. I promise I'm usually faster than that.

Thanks so much for picking this up! I already looked at your PR as well. I think radio-style is best, like you already did anyways.

Thanks!

flowirtz commented 3 years ago

Resolved via #88