For each user in the table, I aim to create a checkbox. Here is my tableBody
:
<TableBody>
{users.map((user) => {
return (
<TableRow key={user.id}>
<TableCell padding="checkbox">
<Checkbox
checked={selectedUserIds.indexOf(user.id) !== -1} // checking if user id is in selectedUserIds
onChange={() => handleSelectUser(user.id)} // struggling to understand the logic for this function
value="true"
/>
</TableCell>
<TableCell>{user.email}</TableCell>
<TableCell>{user.roles}</TableCell>
<TableCell>{user.status}</TableCell>
</TableRow>
);
})}
</TableBody>;
In order to store the selected ids, I have implemented this hook
like in the example above:
const [selectedUserIds, setSelectedUserIds] = useState([]);
The main issue lies in finding the correct logic for the handleSelectUser
function, which should add or remove the user from the selectedUserIds
. I have attempted numerous times but without success.
If anyone could assist me with this, I would greatly appreciate it.