How do i animate a mapped array with React Spring (useTransition)?

[jamesfrancisrogers]

I am working on my portfolio and i just ran into an issue with React Springs useTransition.

So, I am mapping over an array of objects (single Projects) and i am filtering them with multiple checkboxes. What i am trying to achieve is to animate the process of filtering. So when a checkbox is checked, the not-matching items should fade out and collapse so that the remaining objects take their place.

Filtering all works fine, i just dont know where to setup the useTransition hook.

Here is a codesandbox: https://codesandbox.io/s/aged-frog-i2z2s?file=/src/Components/General.js

here is an example of what i want to achieve, maybe it helps to understand:
https://codesandbox.io/s/react-spring-demo-change-border-colour-on-click-forked-7fdkl

Please, can somebody help me with this, i am pretty new to javascript..