Groups ui team ui
This commit is contained in:
parent
fa7711e6a7
commit
52c720d520
@ -490,7 +490,7 @@ export default function EquipePage() {
|
|||||||
</DialogTrigger>
|
</DialogTrigger>
|
||||||
<DialogContent className="sm:max-w-[500px] bg-white">
|
<DialogContent className="sm:max-w-[500px] bg-white">
|
||||||
<DialogHeader>
|
<DialogHeader>
|
||||||
<DialogTitle>Nouvel utilisateur</DialogTitle>
|
<DialogTitle className="text-gray-900">Nouvel utilisateur</DialogTitle>
|
||||||
</DialogHeader>
|
</DialogHeader>
|
||||||
<div className="space-y-4 py-4">
|
<div className="space-y-4 py-4">
|
||||||
<div>
|
<div>
|
||||||
@ -574,13 +574,14 @@ export default function EquipePage() {
|
|||||||
<Button
|
<Button
|
||||||
variant="outline"
|
variant="outline"
|
||||||
onClick={() => setNewUserDialogOpen(false)}
|
onClick={() => setNewUserDialogOpen(false)}
|
||||||
|
className="border-gray-300 text-gray-700 hover:bg-gray-50"
|
||||||
>
|
>
|
||||||
Annuler
|
Annuler
|
||||||
</Button>
|
</Button>
|
||||||
<Button
|
<Button
|
||||||
onClick={createUser}
|
onClick={createUser}
|
||||||
disabled={actionLoading === "new-user" || !newUserData.username || !newUserData.email || !newUserData.password}
|
disabled={actionLoading === "new-user" || !newUserData.username || !newUserData.email || !newUserData.password}
|
||||||
className="bg-blue-600 hover:bg-blue-700"
|
className="bg-blue-600 hover:bg-blue-700 text-white"
|
||||||
>
|
>
|
||||||
{actionLoading === "new-user" ? (
|
{actionLoading === "new-user" ? (
|
||||||
<Loader2 className="h-4 w-4 animate-spin mr-2" />
|
<Loader2 className="h-4 w-4 animate-spin mr-2" />
|
||||||
@ -949,16 +950,16 @@ export default function EquipePage() {
|
|||||||
<div className="space-y-4">
|
<div className="space-y-4">
|
||||||
{/* Current Groups */}
|
{/* Current Groups */}
|
||||||
<div>
|
<div>
|
||||||
<label className="text-xs font-medium text-gray-600 mb-2 block">
|
<label className="text-xs font-medium text-gray-900 mb-2 block">
|
||||||
Groupes actuels ({userGroups.length})
|
Groupes actuels ({userGroups.length})
|
||||||
</label>
|
</label>
|
||||||
<div className="max-h-40 overflow-y-auto space-y-1">
|
<div className="max-h-40 overflow-y-auto space-y-1 border rounded-md p-2 bg-white">
|
||||||
{userGroups.length === 0 ? (
|
{userGroups.length === 0 ? (
|
||||||
<p className="text-xs text-gray-400 py-2">Aucun groupe</p>
|
<p className="text-xs text-gray-500 py-2 text-center">Aucun groupe</p>
|
||||||
) : (
|
) : (
|
||||||
userGroups.map(group => (
|
userGroups.map(group => (
|
||||||
<div key={group.id} className="flex items-center justify-between p-2 bg-gray-50 rounded-md">
|
<div key={group.id} className="flex items-center justify-between p-2 bg-gray-50 rounded-md hover:bg-gray-100 transition-colors">
|
||||||
<span className="text-sm text-gray-700 truncate">
|
<span className="text-sm text-gray-900 font-medium truncate flex-1">
|
||||||
{group.name}
|
{group.name}
|
||||||
</span>
|
</span>
|
||||||
<Button
|
<Button
|
||||||
@ -966,12 +967,13 @@ export default function EquipePage() {
|
|||||||
size="sm"
|
size="sm"
|
||||||
onClick={() => removeUserFromGroup(group.id)}
|
onClick={() => removeUserFromGroup(group.id)}
|
||||||
disabled={actionLoading === group.id}
|
disabled={actionLoading === group.id}
|
||||||
className="h-6 w-6 p-0 hover:text-red-600"
|
className="h-7 w-7 p-0 hover:bg-red-50 hover:text-red-600 text-gray-500"
|
||||||
|
title="Retirer du groupe"
|
||||||
>
|
>
|
||||||
{actionLoading === group.id ? (
|
{actionLoading === group.id ? (
|
||||||
<Loader2 className="h-3 w-3 animate-spin" />
|
<Loader2 className="h-4 w-4 animate-spin" />
|
||||||
) : (
|
) : (
|
||||||
<X className="h-3 w-3" />
|
<X className="h-4 w-4" />
|
||||||
)}
|
)}
|
||||||
</Button>
|
</Button>
|
||||||
</div>
|
</div>
|
||||||
@ -982,16 +984,16 @@ export default function EquipePage() {
|
|||||||
|
|
||||||
{/* Available Groups */}
|
{/* Available Groups */}
|
||||||
<div>
|
<div>
|
||||||
<label className="text-xs font-medium text-gray-600 mb-2 block">
|
<label className="text-xs font-medium text-gray-900 mb-2 block">
|
||||||
Ajouter à des groupes
|
Ajouter à des groupes
|
||||||
</label>
|
</label>
|
||||||
<div className="max-h-40 overflow-y-auto space-y-1">
|
<div className="max-h-40 overflow-y-auto space-y-1 border rounded-md p-2 bg-white">
|
||||||
{availableGroups.length === 0 ? (
|
{availableGroups.length === 0 ? (
|
||||||
<p className="text-xs text-gray-400 py-2">L'utilisateur est dans tous les groupes</p>
|
<p className="text-xs text-gray-500 py-2 text-center">L'utilisateur est dans tous les groupes</p>
|
||||||
) : (
|
) : (
|
||||||
availableGroups.map(group => (
|
availableGroups.map(group => (
|
||||||
<div key={group.id} className="flex items-center justify-between p-2 bg-gray-50 rounded-md">
|
<div key={group.id} className="flex items-center justify-between p-2 bg-gray-50 rounded-md hover:bg-gray-100 transition-colors">
|
||||||
<span className="text-sm text-gray-700 truncate">
|
<span className="text-sm text-gray-900 font-medium truncate flex-1">
|
||||||
{group.name}
|
{group.name}
|
||||||
</span>
|
</span>
|
||||||
<Button
|
<Button
|
||||||
@ -999,12 +1001,13 @@ export default function EquipePage() {
|
|||||||
size="sm"
|
size="sm"
|
||||||
onClick={() => addUserToGroup(group.id)}
|
onClick={() => addUserToGroup(group.id)}
|
||||||
disabled={actionLoading === group.id}
|
disabled={actionLoading === group.id}
|
||||||
className="h-6 w-6 p-0 hover:text-green-600"
|
className="h-7 w-7 p-0 hover:bg-green-50 hover:text-green-600 text-gray-500"
|
||||||
|
title="Ajouter au groupe"
|
||||||
>
|
>
|
||||||
{actionLoading === group.id ? (
|
{actionLoading === group.id ? (
|
||||||
<Loader2 className="h-3 w-3 animate-spin" />
|
<Loader2 className="h-4 w-4 animate-spin" />
|
||||||
) : (
|
) : (
|
||||||
<Plus className="h-3 w-3" />
|
<Plus className="h-4 w-4" />
|
||||||
)}
|
)}
|
||||||
</Button>
|
</Button>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user