Combine simple dropdown filter and multiselect dropdown filter with checkbox - first filter overwritten

[kim5x5]

Hi, I've been doing trial and error for isotope filtering and I'm running out of options that leads me writing here. I'm new to coding so please bear with me.

I'm trying to create filters using isotope. I had the filter working for both list and multiselect with checkbox options separately. But I'm stuck with combining the two different filters.

The list filter is triggered on click while the multiselect with checkbox filter is triggered on change. I tried using both events at once. Though I'm not sure what's the right way.

Now, here's my problem. The first filter would work at first but after using the multiselect checkbox, the previous filters were overwritten. Therefore, they are not combined.

I temporarily changed the list to select for the first filter because it's easier to setup than the list. But the logic should remain the same of what I'm trying to achieve.

This is what I recreated https://codepen.io/kim5x5/pen/ZERgLJd if you could take a a look ang give some enlightenment I would really appreciate it.