@firecms/user_management 3.0.0-canary.144 → 3.0.0-canary.146

package/dist/index.umd.js

@@ -155,6 +155,7 @@
     return `rgba(${r}, ${g}, ${b}, ${alpha})`;
   }
   function useBuildUserManagement({
+    authController,
     dataSourceDelegate,
     usersPath = "__FIRECMS/config/users",
     rolesPath = "__FIRECMS/config/roles",
@@ -163,6 +164,9 @@
     allowDefaultRolesCreation,
     includeCollectionConfigPermissions
   }) {
+    if (!authController) {
+      throw Error("useBuildUserManagement: You need to provide an authController since version 3.0.0-beta.11. Check https://firecms.co/docs/pro/migrating_from_v3_beta");
+    }
     const [rolesLoading, setRolesLoading] = React.useState(true);
     const [usersLoading, setUsersLoading] = React.useState(true);
     const [roles, setRoles] = React.useState([]);
@@ -173,14 +177,13 @@
     }));
     const [rolesError, setRolesError] = React.useState();
     const [usersError, setUsersError] = React.useState();
-    const loading = rolesLoading || usersLoading;
+    const _usersLoading = usersLoading;
+    const _rolesLoading = rolesLoading;
+    const loading = _rolesLoading || _usersLoading;
     React.useEffect(() => {
       if (!dataSourceDelegate || !rolesPath) return;
       if (dataSourceDelegate.initialised !== void 0 && !dataSourceDelegate.initialised) return;
-      if (dataSourceDelegate.authenticated !== void 0 && !dataSourceDelegate.authenticated) {
-        setRolesLoading(false);
-        return;
-      }
+      if (authController?.initialLoading) return;
       setRolesLoading(true);
       return dataSourceDelegate.listenCollection?.({
         path: rolesPath,
@@ -188,8 +191,9 @@
           setRolesError(void 0);
           try {
             const newRoles = entityToRoles(entities);
-            if (!equal(newRoles, roles))
+            if (!equal(newRoles, roles)) {
               setRoles(newRoles);
+            }
           } catch (e) {
             setRoles([]);
             console.error("Error loading roles", e);
@@ -204,23 +208,24 @@
           setRolesLoading(false);
         }
       });
-    }, [dataSourceDelegate?.initialised, dataSourceDelegate?.authenticated, rolesPath]);
+    }, [dataSourceDelegate?.initialised, authController?.initialLoading, authController?.user?.uid, rolesPath]);
     React.useEffect(() => {
       if (!dataSourceDelegate || !usersPath) return;
-      if (dataSourceDelegate.initialised !== void 0 && !dataSourceDelegate.initialised) return;
-      if (dataSourceDelegate.authenticated !== void 0 && !dataSourceDelegate.authenticated) {
-        setUsersLoading(false);
+      if (dataSourceDelegate.initialised !== void 0 && !dataSourceDelegate.initialised) {
+        return;
+      }
+      if (authController?.initialLoading) {
         return;
       }
       setUsersLoading(true);
       return dataSourceDelegate.listenCollection?.({
         path: usersPath,
         onUpdate(entities) {
+          console.debug("Updating users", entities);
           setUsersError(void 0);
           try {
             const newUsers = entitiesToUsers(entities);
-            if (!equal(newUsers, usersWithRoleIds))
-              setUsersWithRoleIds(newUsers);
+            setUsersWithRoleIds(newUsers);
           } catch (e) {
             setUsersWithRoleIds([]);
             console.error("Error loading users", e);
@@ -229,13 +234,13 @@
           setUsersLoading(false);
         },
         onError(e) {
-          setUsersWithRoleIds([]);
           console.error("Error loading users", e);
+          setUsersWithRoleIds([]);
           setUsersError(e);
           setUsersLoading(false);
         }
       });
-    }, [dataSourceDelegate?.initialised, dataSourceDelegate?.authenticated, usersPath]);
+    }, [dataSourceDelegate?.initialised, authController?.initialLoading, authController?.user?.uid, usersPath]);
     const saveUser = React.useCallback(async (user) => {
       if (!dataSourceDelegate) throw Error("useBuildUserManagement Firebase not initialised");
       if (!usersPath) throw Error("useBuildUserManagement Firestore not initialised");
@@ -307,26 +312,31 @@
       user
     }), []);
     const defineRolesFor = React.useCallback((user) => {
-      if (!users) throw Error("Users not loaded");
-      const mgmtUser = users.find((u) => u.email?.toLowerCase() === user?.email?.toLowerCase());
+      if (!usersWithRoleIds) throw Error("Users not loaded");
+      const users2 = usersWithRoleIds.map((u) => ({
+        ...u,
+        roles: roles.filter((r) => u.roles?.includes(r.id))
+      }));
+      const mgmtUser = users2.find((u) => u.email?.toLowerCase() === user?.email?.toLowerCase());
       return mgmtUser?.roles;
-    }, [users]);
+    }, [roles, usersWithRoleIds]);
     const authenticator = React.useCallback(({ user }) => {
-      console.debug("Authenticating user", user);
       if (loading) {
-        console.warn("User management is still loading");
         return false;
       }
       if (users.length === 0) {
+        console.warn("No users created yet");
         return true;
       }
       const mgmtUser = users.find((u) => u.email?.toLowerCase() === user?.email?.toLowerCase());
       if (mgmtUser) {
+        console.debug("User found in user management system", mgmtUser);
         return true;
       }
       throw Error("Could not find a user with the provided email in the user management system.");
-    }, [loading, users, usersError, rolesError]);
-    const isAdmin = roles.some((r) => r.id === "admin");
+    }, [loading, users]);
+    const userRoles = authController.user ? defineRolesFor(authController.user) : void 0;
+    const isAdmin = (userRoles ?? []).some((r) => r.id === "admin");
     return {
       loading,
       roles,
@@ -344,7 +354,14 @@
       includeCollectionConfigPermissions: Boolean(includeCollectionConfigPermissions),
       collectionPermissions,
       defineRolesFor,
-      authenticator
+      authenticator,
+      ...authController,
+      initialLoading: authController.initialLoading || loading,
+      userRoles,
+      user: authController.user ? {
+        ...authController.user,
+        roles: userRoles
+      } : null
     };
   }
   const entitiesToUsers = (docs) => {
@@ -399,6 +416,7 @@
   });
   function canRoleBeEdited(loggedUser) {
     const loggedUserIsAdmin = loggedUser.roles?.map((r) => r.id).includes("admin");
+    console.log("loggedUserIsAdmin", loggedUser);
     if (!loggedUserIsAdmin) {
       throw new Error("Only admins can edit roles");
     }
@@ -1341,7 +1359,6 @@
       /* @__PURE__ */ jsxRuntime.jsxs(ui.Table, { className: "w-full", children: [
         /* @__PURE__ */ jsxRuntime.jsxs(ui.TableHeader, { children: [
           /* @__PURE__ */ jsxRuntime.jsx(ui.TableCell, { className: "truncate w-16" }),
-          /* @__PURE__ */ jsxRuntime.jsx(ui.TableCell, { children: "ID" }),
           /* @__PURE__ */ jsxRuntime.jsx(ui.TableCell, { children: "Email" }),
           /* @__PURE__ */ jsxRuntime.jsx(ui.TableCell, { children: "Name" }),
           /* @__PURE__ */ jsxRuntime.jsx(ui.TableCell, { children: "Roles" }),
@@ -1376,7 +1393,6 @@
                       )
                     }
                   ) }),
-                  /* @__PURE__ */ jsxRuntime.jsx(ui.TableCell, { children: user.uid }),
                   /* @__PURE__ */ jsxRuntime.jsx(ui.TableCell, { children: user.email }),
                   /* @__PURE__ */ jsxRuntime.jsx(ui.TableCell, { className: "font-medium align-left", children: user.displayName }),
                   /* @__PURE__ */ jsxRuntime.jsx(ui.TableCell, { className: "align-left", children: userRoles ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-wrap gap-2", children: userRoles.map(
@@ -1544,7 +1560,7 @@
     return /* @__PURE__ */ jsxRuntime.jsxs(
       ui.Paper,
       {
-        className: "my-4 flex flex-col px-4 py-6 bg-white dark:bg-slate-800 gap-2",
+        className: "my-4 flex flex-col px-4 py-6 bg-white dark:bg-surface-accent-800 gap-2",
         children: [
           /* @__PURE__ */ jsxRuntime.jsx(ui.Typography, { variant: "subtitle2", className: "uppercase", children: "Create your users and roles" }),
           /* @__PURE__ */ jsxRuntime.jsx(ui.Typography, { children: "You have no users or roles defined. You can create default roles and add the current user as admin." }),