Rols visibles a Usuaris

imports/ui/Usuaris.jsx

@@ -38,6 +38,30 @@ import { useNavigate, Link } from 'react-router-dom';
 
 const U = ({u, esAdministrador}) => {
 
+     const [adm, setAdm] = useState(false);
+     const [mon, setMon] = useState(false);
+     const [enc, setEnc] = useState(false);
+     const [vol, setVol] = useState(false);
+
+     (async () => {
+        const esAdmin = await Roles.userIsInRoleAsync(u._id, ["admin"]);
+        setAdm(esAdmin);
+        const esMonit = await Roles.userIsInRoleAsync(u._id, ["monitor_de_poble"], {anyScope: true});
+        setMon(esMonit);
+        const esEncar = await Roles.userIsInRoleAsync(u._id, ["encarregat_de_tasques"], {anyScope: true});
+        setEnc(esEncar);
+        const esVolun = await Roles.userIsInRoleAsync(u._id, ["voluntari_de_poble"], {anyScope: true});
+        setVol(esVolun);
+     //    setEsAdministrador(comprovaAdmin);
+     })();
+
+
+     // console.log("adm: ", adm);
+     // console.log("mon: ", mon);
+     // console.log("enc: ", enc);
+     // console.log("vol: ", vol);
+
+
   // const [esAdministrador, setEsAdministrador] = useState(false);
 
 //   const u = useTracker("user", async () => await Meteor.userAsync());
@@ -109,11 +133,30 @@ const U = ({u, esAdministrador}) => {
 
       }}
     >
-      { (u && esAdministrador) && <div style={{
+     <div style={{
+          position: `absolute`
+     }}>
+          { (u && adm) && <div style={{
                color: `red`,
                fontSize: `xx-small`,
                // textAlign: `right`
           }}>ADMIN</div> }
+          { (u && mon) && <div style={{
+               color: `red`,
+               fontSize: `xx-small`,
+               // textAlign: `right`
+          }}>mon</div> }
+          { (u && enc) && <div style={{
+               color: `red`,
+               fontSize: `xx-small`,
+               // textAlign: `right`
+          }}>enc</div> }
+          { (u && vol) && <div style={{
+               color: `red`,
+               fontSize: `xx-small`,
+               // textAlign: `right`
+          }}>vol</div> }
+      </div>
       <img
         style={{
           width: `3em`,
@@ -227,6 +270,43 @@ export const Usuaris = () => {
           }, []);
      // })();
 
+     // const [monitors, setMonitors] = useState(false);
+     // const [encarregats, setEncarregats] = useState(false);
+     // const [voluntaris, setVoluntaris] = useState(false);
+     // const [administradors, setAdministradors] = useState(false);
+
+     // let mon, mons, enc, encs, vol, vols;
+     // let
+     //      administradors,
+     //      monitors,
+     //      encarregats,
+     //      voluntaris
+     // ;
+          
+
+     // (async () => {
+     //      const admins = await Roles.getUsersInRoleAsync("administrador");
+     //      // console.log("admins: ", admins);
+     //      administradors = await admins?.fetchAsync();
+     //      console.log("administradors: ", administradors);
+          
+     //      const mons = await Roles.getUsersInRoleAsync("monitor_de_poble");
+     //      // console.log("mons: ", mons);
+     //      monitors = await mons?.fetchAsync();
+     //      console.log("monitors: ", monitors);
+
+     //      const encs = await Roles.getUsersInRoleAsync("encarregat_de_tasques");
+     //      // console.log("encs: ", encs);
+     //      encarregats = await encs?.fetchAsync();
+     //      console.log("encarregats: ", encarregats);
+
+     //      const vols = await Roles.getUsersInRoleAsync("voluntari_de_poble");
+     //      // console.log("vols: ", vols);
+     //      voluntaris = await vols?.fetchAsync();
+     //      console.log("voluntaris: ", voluntaris);
+     // })();
+
+
      const QuadreInfo_Usuari = () => {
           
           return <div style={{
@@ -298,7 +378,7 @@ export const Usuaris = () => {
                     }}
                >
                          {/* {usr.username}{esEditor && <button onClick={() => {setUsrSeleccionat(usr)}}>Edita</button>} */}
-                         <U u={usr} esAdministrador={esEditor} />
+                         <U u={usr} esAdministrador={usr._id === Meteor.userId() && esEditor} />
                </li>)
           }</ul>
      </Suspense>;