How to make two or more buttons active

I need to make user cards where on clicking the follow button it changes color and name and adds 1 to following. I receive such users from API , 12 users, and I need to be able to choose more than 1 user, how can I do it, I can’t figure it out.
thinking to try redux

but I can’t understand how to mark the button to record in the store
That my code where I make a request. then I record it in “user”, and through map, I render all the cards

export const UserList = () => {
  const [users, setUsers] = useState([]);
  const [userId, setUserId] = useState(null);
  const [page, setPage] = useState(2);


  const getUsersFromAPI = async () => {
    const user = await fetchUsers();
    setUsers(user);
  };

  const fetchNextPage = async () => {
    setPage(prevPage => prevPage + 1);
    const usersNext = await nextPageUsers(page, 3);
    setUsers(prevUser => [...prevUser, ...usersNext]);
    if (page === 4) {
      setPage(1);
      await nextPageUsers(page, 3);
      return;
    }

    return usersNext;
  };

  useEffect(() => {
    getUsersFromAPI();
  }, []);

  
# const followind = (id, e) => {
# 
# const userIdx = users.findIndex(user => user.id === id);
# 
# if (userId === id) {
# setUserId(null);
# users[userIdx].followers--;
# 
# return;
#     }
# 
# setUserId(id);
# users[userIdx].followers++;
#   };

  return (
    <div>
      {users && (
        <ul className={css.list}>
          {users.map(user => {
            return (
              <li key={user.id} className={css.containerItem}>
                <div className={css.space}>
                  <button type="button" className={css.imageLogo}></button>
                  <div className={css.upperPart}></div>
                  <div className={css.middleLine}>
                    <img
                      className={css.userFoto}
                      src={user.avatar}
                      alt={user.name}
                    ></img>
                  </div>
                  <div className={css.lowerPart}>
                    <p className={css.ps}> {user.tweets} Tweets</p>

                    <p className={css.ps}>
                      {' '}
                      {user.followers.toLocaleString('en-US')}
                      Followers
                    </p>

                    ***<button
                      id={user.id}
                      className={
                        userId === user.id ? css.btnPress : css.btnFollow
                      }
                      type="button"
                      onClick={e => followind(user.id, e)}
                    >
                      {userId === user.id ? 'Following' : 'Follow'}
                    </button>***
                  </div>
                </div>
              </li>
            );
          })}
        </ul>
      )}
      {page <= 4 && (
        <button type="button" onClick={fetchNextPage}>
          Next
        </button>
      )}
    </div>
  );
};```