54 lines
2.0 KiB
JavaScript
54 lines
2.0 KiB
JavaScript
// assets/js/components/UserRow.js
|
|
const UserRow = ({ user, onEdit, onBlock, onUnblock }) => (
|
|
<tr className="hover:bg-slate-700/50 transition">
|
|
<td className="px-6 py-4 whitespace-nowrap">
|
|
<div className="font-medium text-white">{user.name}</div>
|
|
</td>
|
|
<td className="px-6 py-4 whitespace-nowrap text-slate-300">{user.email}</td>
|
|
<td className="px-6 py-4 whitespace-nowrap text-slate-300">{user.nrp}</td>
|
|
<td className="px-6 py-4 whitespace-nowrap">
|
|
<span
|
|
className={`px-3 py-1 rounded-full text-xs font-semibold ${Helpers.getRoleBadgeClass(
|
|
user.role
|
|
)}`}
|
|
>
|
|
{user.role}
|
|
</span>
|
|
</td>
|
|
<td className="px-6 py-4 whitespace-nowrap">
|
|
<span
|
|
className={`px-3 py-1 rounded-full text-xs font-semibold ${Helpers.getStatusBadgeClass(
|
|
user.status || "active"
|
|
)}`}
|
|
>
|
|
{user.status || "active"}
|
|
</span>
|
|
</td>
|
|
<td className="px-6 py-4 whitespace-nowrap">
|
|
<div className="flex gap-2">
|
|
<button
|
|
onClick={() => onEdit(user)}
|
|
className="px-3 py-1 bg-gradient-to-r from-yellow-600 to-yellow-700 text-white text-sm rounded hover:from-yellow-700 hover:to-yellow-800 transition shadow-lg"
|
|
>
|
|
Edit
|
|
</button>
|
|
{user.status === "active" || !user.status ? (
|
|
<button
|
|
onClick={() => onBlock(user.id)}
|
|
className="px-3 py-1 bg-gradient-to-r from-red-600 to-red-700 text-white text-sm rounded hover:from-red-700 hover:to-red-800 transition shadow-lg"
|
|
>
|
|
Block
|
|
</button>
|
|
) : (
|
|
<button
|
|
onClick={() => onUnblock(user.id)}
|
|
className="px-3 py-1 bg-gradient-to-r from-green-600 to-green-700 text-white text-sm rounded hover:from-green-700 hover:to-green-800 transition shadow-lg"
|
|
>
|
|
Unblock
|
|
</button>
|
|
)}
|
|
</div>
|
|
</td>
|
|
</tr>
|
|
);
|