title: React Hooks. How to make other items(beside current one) deactivate when i click
body: <p>I have list of items.
  What best practice to synchronize items,  when i click on one, other become deactivate?
  So  active item can be only one of them at the same time?</p>
  
  <p>My code:
  <a href="https://codesandbox.io/s/deezer-music-widget-s4dli" rel="nofollow noreferrer">https://codesandbox.io/s/deezer-music-widget-s4dli</a></p>
  
  <p>Visual example of wrong case(2 active items)
  <a href="https://i.stack.imgur.com/wbFHR.png" rel="nofollow noreferrer">screenshot</a></p>