From cefc9fd072e1574fd575d51da09bcf0805bb436b Mon Sep 17 00:00:00 2001
From: alma <alma@governance-labs.org>
Date: Mon, 5 May 2025 10:33:28 +0200
Subject: [PATCH] missions

---
 components/missions/missions-admin-panel.tsx | 74 +++++++++++---------
 1 file changed, 42 insertions(+), 32 deletions(-)

diff --git a/components/missions/missions-admin-panel.tsx b/components/missions/missions-admin-panel.tsx
index f836c534..30b82881 100644
--- a/components/missions/missions-admin-panel.tsx
+++ b/components/missions/missions-admin-panel.tsx
@@ -511,7 +511,7 @@ export function MissionsAdminPanel() {
             <TabsContent value="membres" className="space-y-6">
               <div>
                 <div className="mb-6">
-                  <h3 className="text-lg font-medium text-gray-700 mb-4">Rôles clés pour la mission</h3>
+                  <h3 className="text-lg font-medium text-gray-700 mb-4">Les Gardiens de l'Intention</h3>
                   
                   <div className="space-y-4">
                     {/* Gardien du Temps */}
@@ -548,8 +548,11 @@ export function MissionsAdminPanel() {
                           })()}
                         </div>
                       ) : (
-                        <div className="bg-gray-50 border border-gray-200 rounded-md p-3 text-gray-500 text-center">
-                          Aucun utilisateur sélectionné
+                        <div className="flex items-center text-gray-500 bg-gray-50 border border-gray-200 rounded-md py-2 px-3">
+                          <div className="h-8 w-8 rounded-full bg-gray-200 flex items-center justify-center mr-3">
+                            <Users size={14} className="text-gray-400" />
+                          </div>
+                          <span className="text-sm">Aucun utilisateur sélectionné</span>
                         </div>
                       )}
                     </div>
@@ -588,8 +591,11 @@ export function MissionsAdminPanel() {
                           })()}
                         </div>
                       ) : (
-                        <div className="bg-gray-50 border border-gray-200 rounded-md p-3 text-gray-500 text-center">
-                          Aucun utilisateur sélectionné
+                        <div className="flex items-center text-gray-500 bg-gray-50 border border-gray-200 rounded-md py-2 px-3">
+                          <div className="h-8 w-8 rounded-full bg-gray-200 flex items-center justify-center mr-3">
+                            <Users size={14} className="text-gray-400" />
+                          </div>
+                          <span className="text-sm">Aucun utilisateur sélectionné</span>
                         </div>
                       )}
                     </div>
@@ -628,8 +634,11 @@ export function MissionsAdminPanel() {
                           })()}
                         </div>
                       ) : (
-                        <div className="bg-gray-50 border border-gray-200 rounded-md p-3 text-gray-500 text-center">
-                          Aucun utilisateur sélectionné
+                        <div className="flex items-center text-gray-500 bg-gray-50 border border-gray-200 rounded-md py-2 px-3">
+                          <div className="h-8 w-8 rounded-full bg-gray-200 flex items-center justify-center mr-3">
+                            <Users size={14} className="text-gray-400" />
+                          </div>
+                          <span className="text-sm">Aucun utilisateur sélectionné</span>
                         </div>
                       )}
                     </div>
@@ -689,37 +698,38 @@ export function MissionsAdminPanel() {
                                   </div>
                                 </div>
                                 {isUserAssigned(user.id) ? (
-                                  <Badge className="bg-blue-100 text-blue-800 hover:bg-blue-200 px-2 py-1">
-                                    {getUserRole(user.id)}
-                                  </Badge>
+                                  <div className="flex items-center">
+                                    <Badge className="bg-blue-100 text-blue-800 hover:bg-blue-200 px-2 py-1 mr-2">
+                                      {getUserRole(user.id)}
+                                    </Badge>
+                                    <Button 
+                                      variant="outline" 
+                                      size="sm" 
+                                      onClick={() => {
+                                        if (gardienDuTemps === user.id) removeUserRole('temps');
+                                        if (gardienDeLaParole === user.id) removeUserRole('parole');
+                                        if (gardienDeLaMemoire === user.id) removeUserRole('memoire');
+                                      }}
+                                      className="text-red-600 hover:bg-red-50 border-red-200 h-7 px-2"
+                                    >
+                                      <X size={14} />
+                                    </Button>
+                                  </div>
                                 ) : (
                                   <div className="flex space-x-1">
                                     <Button 
                                       variant="outline" 
                                       size="sm" 
-                                      onClick={() => assignUserRole(user.id, 'temps')}
-                                      disabled={gardienDuTemps !== null}
+                                      onClick={() => {
+                                        if (!gardienDuTemps) assignUserRole(user.id, 'temps');
+                                        else if (!gardienDeLaParole) assignUserRole(user.id, 'parole');
+                                        else if (!gardienDeLaMemoire) assignUserRole(user.id, 'memoire');
+                                      }}
+                                      disabled={gardienDuTemps !== null && gardienDeLaParole !== null && gardienDeLaMemoire !== null}
                                       className="text-blue-600 hover:bg-blue-50 border-blue-200 h-8"
                                     >
-                                      Temps
-                                    </Button>
-                                    <Button 
-                                      variant="outline" 
-                                      size="sm" 
-                                      onClick={() => assignUserRole(user.id, 'parole')}
-                                      disabled={gardienDeLaParole !== null}
-                                      className="text-blue-600 hover:bg-blue-50 border-blue-200 h-8"
-                                    >
-                                      Parole
-                                    </Button>
-                                    <Button 
-                                      variant="outline" 
-                                      size="sm" 
-                                      onClick={() => assignUserRole(user.id, 'memoire')}
-                                      disabled={gardienDeLaMemoire !== null}
-                                      className="text-blue-600 hover:bg-blue-50 border-blue-200 h-8"
-                                    >
-                                      Mémoire
+                                      <UserPlus size={16} className="mr-1" />
+                                      Assigner
                                     </Button>
                                   </div>
                                 )}
@@ -750,7 +760,7 @@ export function MissionsAdminPanel() {
                                   size="sm"
                                   className="text-blue-600 hover:bg-blue-50 border-blue-200 h-8"
                                 >
-                                  <UserPlus size={16} className="mr-1" />
+                                  <Users size={16} className="mr-1" />
                                   Voir membres
                                 </Button>
                               </div>