@firecms/user_management 3.0.0-3.0.0-canary.44.0 → 3.0.0-beta.11

package/dist/index.es.js

@@ -1,1350 +1,2302 @@
-import F, { useEffect as ce, useCallback as k, useContext as Ie, useState as P } from "react";
-import { getFirestore as Y, onSnapshot as ue, collection as ee, setDoc as me, doc as H, addDoc as Fe, deleteDoc as he } from "firebase/firestore";
-import { jsx as e, jsxs as s, Fragment as K } from "react/jsx-runtime";
-import { getColorSchemeForSeed as Pe, Chip as Ae, Dialog as fe, DialogContent as ge, Typography as A, TextField as Q, Paper as pe, Table as re, TableHeader as ie, TableCell as d, TableBody as oe, TableRow as W, Tooltip as V, Checkbox as I, Select as ne, SelectItem as L, DialogActions as Ce, Button as O, LoadingButton as ve, DoneIcon as we, IconButton as ye, DeleteIcon as be, CenteredView as Ne, Container as Ue, AddIcon as le, MultiSelect as Te, MultiSelectItem as Le } from "@firecms/ui";
-import * as M from "yup";
-import { toSnakeCase as Be, FieldCaption as B, DeleteConfirmationDialog as xe, useNavigationController as _e, useSnackbarController as se, useAuthController as ae, useCustomizationController as Ve, defaultDateFormat as Me } from "@firecms/core";
-import { useCreateFormex as Re, getIn as J, Formex as De } from "@firecms/formex";
-import { format as Oe } from "date-fns";
-import * as $e from "date-fns/locale";
-const fn = ["Admin"], qe = {
-  read: !1,
-  edit: !1,
-  create: !1,
-  delete: !1
+import React, { useEffect, useCallback, useContext, useState } from "react";
+import equal from "react-fast-compare";
+import { removeUndefined, useAuthController, toSnakeCase, FieldCaption, ConfirmationDialog, useNavigationController, useSnackbarController, useCustomizationController, defaultDateFormat } from "@firecms/core";
+import { jsx, jsxs, Fragment } from "react/jsx-runtime";
+import { c } from "react-compiler-runtime";
+import { getColorSchemeForSeed, Chip, TextField, TableRow, TableCell, Checkbox, Tooltip, Button, Typography, DialogTitle, TableHeader, Paper, Table, TableBody, SelectItem, Select, DialogContent, CheckIcon, LoadingButton, DialogActions, Dialog, IconButton, DeleteIcon, CenteredView, AddIcon, Container, MultiSelectItem, MultiSelect } from "@firecms/ui";
+import * as Yup from "yup";
+import { useCreateFormex, getIn, Formex } from "@firecms/formex";
+import { format } from "date-fns";
+import * as locales from "date-fns/locale";
+const RESERVED_GROUPS = ["Admin"];
+const DEFAULT_PERMISSIONS = {
+  read: false,
+  edit: false,
+  create: false,
+  delete: false
 };
-function Ye({
-  collection: t,
-  user: r
+function resolveUserRolePermissions({
+  collection,
+  user
 }) {
-  const n = r?.roles;
-  if (n) {
-    if (t.ownerId === r?.uid)
-      return {
-        read: !0,
-        create: !0,
-        edit: !0,
-        delete: !0
-      };
-    {
-      const l = {
-        read: !1,
-        create: !1,
-        edit: !1,
-        delete: !1
-      };
-      return n.map((i) => We(i, t.id)).reduce(te, l);
-    }
-  } else
-    return qe;
+  const roles = user?.roles;
+  if (!roles) {
+    return DEFAULT_PERMISSIONS;
+  } else if (collection.ownerId === user?.uid) {
+    return {
+      read: true,
+      create: true,
+      edit: true,
+      delete: true
+    };
+  } else {
+    const basePermissions = {
+      read: false,
+      create: false,
+      edit: false,
+      delete: false
+    };
+    return roles.map((role) => resolveCollectionRole(role, collection.id)).reduce(mergePermissions, basePermissions);
+  }
 }
-function We(t, r) {
-  const n = {
-    read: t.isAdmin || t.defaultPermissions?.read,
-    create: t.isAdmin || t.defaultPermissions?.create,
-    edit: t.isAdmin || t.defaultPermissions?.edit,
-    delete: t.isAdmin || t.defaultPermissions?.delete
+function resolveCollectionRole(role, id) {
+  const basePermissions = {
+    read: (role.isAdmin || role.defaultPermissions?.read) ?? false,
+    create: (role.isAdmin || role.defaultPermissions?.create) ?? false,
+    edit: (role.isAdmin || role.defaultPermissions?.edit) ?? false,
+    delete: (role.isAdmin || role.defaultPermissions?.delete) ?? false
   };
-  return t.collectionPermissions && t.collectionPermissions[r] ? te(t.collectionPermissions[r], n) : t.defaultPermissions ? te(t.defaultPermissions, n) : n;
+  const thisCollectionPermissions = role.collectionPermissions?.[id];
+  if (thisCollectionPermissions) {
+    return mergePermissions(thisCollectionPermissions, basePermissions);
+  } else if (role.defaultPermissions) {
+    return mergePermissions(role.defaultPermissions, basePermissions);
+  } else {
+    return basePermissions;
+  }
 }
-const te = (t, r) => ({
-  read: t.read || r.read,
-  create: t.create || r.create,
-  edit: t.edit || r.edit,
-  delete: t.delete || r.delete
-});
-function gn(t, r) {
-  return t ? r.roles ? r.roles.map((n) => t.find((l) => l.id === n.id)).filter(Boolean) : [] : void 0;
+const mergePermissions = (permA, permB) => {
+  return {
+    read: permA.read || permB.read,
+    create: permA.create || permB.create,
+    edit: permA.edit || permB.edit,
+    delete: permA.delete || permB.delete
+  };
+};
+function getUserRoles(roles, fireCMSUser) {
+  return !roles ? void 0 : fireCMSUser.roles ? fireCMSUser.roles.map((role) => roles.find((r) => r.id === role.id)).filter(Boolean) : [];
 }
-const je = (t, r) => {
-  const n = t.map((i) => i.id), l = r.map((i) => i.id);
-  return n.length === r.length && n.every((i) => l.includes(i));
+const areRolesEqual = (rolesA, rolesB) => {
+  const rolesAIds = rolesA.map((r) => r.id);
+  const rolesBIds = rolesB.map((r) => r.id);
+  return rolesAIds.length === rolesB.length && rolesAIds.every((role) => rolesBIds.includes(role));
 };
-function pn(t, r) {
-  if (!r)
+function cacheDelegatedLoginToken(projectId, delegatedToken) {
+  if (!delegatedToken) {
     return;
-  const n = ze(r), l = new Date(n.exp * 1e3);
-  localStorage.setItem(`auth_token::${t}`, JSON.stringify({
-    token: r,
-    expiry: l
+  }
+  const data = parseJwt(delegatedToken);
+  const expiry = new Date(data.exp * 1e3);
+  localStorage.setItem(`auth_token::${projectId}`, JSON.stringify({
+    token: delegatedToken,
+    expiry
   }));
 }
-function Cn(t) {
-  const r = localStorage.getItem(`auth_token::${t}`);
-  if (r) {
-    const n = JSON.parse(r);
-    if (n.expiry = new Date(n.expiry), n.expiry > /* @__PURE__ */ new Date())
-      return n.token;
+function getDelegatedLoginTokenFromCache(projectId) {
+  const entry = localStorage.getItem(`auth_token::${projectId}`);
+  if (entry) {
+    const data = JSON.parse(entry);
+    data.expiry = new Date(data.expiry);
+    if (data.expiry > /* @__PURE__ */ new Date()) {
+      return data.token;
+    }
   }
+  return void 0;
 }
-function vn() {
-  for (let t = 0; t < localStorage.length; t++) {
-    const r = localStorage.key(t);
-    r?.startsWith("auth_token::") && localStorage.removeItem(r);
+function clearDelegatedLoginTokensCache() {
+  for (let i = 0; i < localStorage.length; i++) {
+    const key = localStorage.key(i);
+    if (key?.startsWith("auth_token::")) {
+      localStorage.removeItem(key);
+    }
   }
 }
-function ze(t) {
-  if (!t)
+function parseJwt(token) {
+  if (!token) {
     throw new Error("No JWT token");
-  const n = t.split(".")[1].replace(/-/g, "+").replace(/_/g, "/"), l = decodeURIComponent(window.atob(n).split("").map(function(i) {
-    return "%" + ("00" + i.charCodeAt(0).toString(16)).slice(-2);
+  }
+  const base64Url = token.split(".")[1];
+  const base64 = base64Url.replace(/-/g, "+").replace(/_/g, "/");
+  const jsonPayload = decodeURIComponent(window.atob(base64).split("").map(function(c2) {
+    return "%" + ("00" + c2.charCodeAt(0).toString(16)).slice(-2);
   }).join(""));
-  return JSON.parse(l);
+  return JSON.parse(jsonPayload);
 }
-function wn(t, r = 10) {
-  if (!/^#([0-9A-Fa-f]{3}){1,2}$/.test(t))
+function darkenColor(hexColor, darkenBy = 10) {
+  if (!/^#([0-9A-Fa-f]{3}){1,2}$/.test(hexColor)) {
     throw new Error("Invalid color format");
-  let n = t.substring(1).split("");
-  n.length === 3 && (n = [n[0], n[0], n[1], n[1], n[2], n[2]]);
-  let l = parseInt(n[0] + n[1], 16), i = parseInt(n[2] + n[3], 16), m = parseInt(n[4] + n[5], 16);
-  return l = Math.floor(l * (1 - r / 100)), i = Math.floor(i * (1 - r / 100)), m = Math.floor(m * (1 - r / 100)), "#" + (l < 16 ? "0" : "") + l.toString(16) + (i < 16 ? "0" : "") + i.toString(16) + (m < 16 ? "0" : "") + m.toString(16);
+  }
+  let color = hexColor.substring(1).split("");
+  if (color.length === 3) {
+    color = [color[0], color[0], color[1], color[1], color[2], color[2]];
+  }
+  let r = parseInt(color[0] + color[1], 16);
+  let g = parseInt(color[2] + color[3], 16);
+  let b = parseInt(color[4] + color[5], 16);
+  r = Math.floor(r * (1 - darkenBy / 100));
+  g = Math.floor(g * (1 - darkenBy / 100));
+  b = Math.floor(b * (1 - darkenBy / 100));
+  return "#" + (r < 16 ? "0" : "") + r.toString(16) + (g < 16 ? "0" : "") + g.toString(16) + (b < 16 ? "0" : "") + b.toString(16);
 }
-function yn(t, r = 10) {
-  if (!/^#([0-9A-Fa-f]{3}){1,2}$/.test(t))
+function hexToRgbaWithOpacity(hexColor, opacity = 10) {
+  if (!/^#([0-9A-Fa-f]{3}){1,2}$/.test(hexColor)) {
     throw new Error("Invalid color format");
-  let n = t.substring(1).split("");
-  n.length === 3 && (n = [n[0], n[0], n[1], n[1], n[2], n[2]]);
-  const l = parseInt(n[0] + n[1], 16), i = parseInt(n[2] + n[3], 16), m = parseInt(n[4] + n[5], 16), f = r / 100;
-  return `rgba(${l}, ${i}, ${m}, ${f})`;
+  }
+  let color = hexColor.substring(1).split("");
+  if (color.length === 3) {
+    color = [color[0], color[0], color[1], color[1], color[2], color[2]];
+  }
+  const r = parseInt(color[0] + color[1], 16);
+  const g = parseInt(color[2] + color[3], 16);
+  const b = parseInt(color[4] + color[5], 16);
+  const alpha = opacity / 100;
+  return `rgba(${r}, ${g}, ${b}, ${alpha})`;
 }
-function bn({
-  firebaseApp: t,
-  usersPath: r = "__FIRECMS/config/users",
-  rolesPath: n = "__FIRECMS/config/roles",
-  usersLimit: l,
-  canEditRoles: i = !0,
-  allowDefaultRolesCreation: m,
-  includeCollectionConfigPermissions: f
+function useBuildUserManagement({
+  authController,
+  dataSourceDelegate,
+  usersPath = "__FIRECMS/config/users",
+  rolesPath = "__FIRECMS/config/roles",
+  usersLimit,
+  canEditRoles = true,
+  allowDefaultRolesCreation,
+  includeCollectionConfigPermissions
 }) {
-  const [v, R] = F.useState(!0), [w, c] = F.useState(!0), [S, U] = F.useState([]), [a, C] = F.useState([]), y = a.map((g) => ({
-    ...g,
-    roles: S.filter((p) => g.roles?.includes(p.id))
-  })), [b, _] = F.useState(), [z, u] = F.useState(), h = v || w;
-  ce(() => {
-    if (!t || !n)
-      return;
-    const g = Y(t);
-    return ue(
-      ee(g, n),
-      {
-        next: (p) => {
-          _(void 0);
-          try {
-            const N = Ge(p.docs);
-            U(N);
-          } catch (N) {
-            console.error("Error loading roles", N), _(N);
+  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([]);
+  const [usersWithRoleIds, setUsersWithRoleIds] = React.useState([]);
+  const users = usersWithRoleIds.map((u) => ({
+    ...u,
+    roles: roles.filter((r) => u.roles?.includes(r.id))
+  }));
+  const [rolesError, setRolesError] = React.useState();
+  const [usersError, setUsersError] = React.useState();
+  const _usersLoading = usersLoading;
+  const _rolesLoading = rolesLoading;
+  const loading = _rolesLoading || _usersLoading;
+  useEffect(() => {
+    if (!dataSourceDelegate || !rolesPath) return;
+    if (dataSourceDelegate.initialised !== void 0 && !dataSourceDelegate.initialised) return;
+    if (authController?.initialLoading) return;
+    setRolesLoading(true);
+    return dataSourceDelegate.listenCollection?.({
+      path: rolesPath,
+      onUpdate(entities) {
+        setRolesError(void 0);
+        try {
+          const newRoles = entityToRoles(entities);
+          if (!equal(newRoles, roles)) {
+            setRoles(newRoles);
           }
-          R(!1);
-        },
-        error: (p) => {
-          console.error("Error loading roles", p), _(p), R(!1);
+        } catch (e) {
+          setRoles([]);
+          console.error("Error loading roles", e);
+          setRolesError(e);
         }
+        setRolesLoading(false);
+      },
+      onError(e_0) {
+        setRoles([]);
+        console.error("Error loading roles", e_0);
+        setRolesError(e_0);
+        setRolesLoading(false);
       }
-    );
-  }, [t, n]), ce(() => {
-    if (!t || !r)
+    });
+  }, [dataSourceDelegate?.initialised, authController?.initialLoading, authController?.user?.uid, rolesPath]);
+  useEffect(() => {
+    if (!dataSourceDelegate || !usersPath) return;
+    if (dataSourceDelegate.initialised !== void 0 && !dataSourceDelegate.initialised) {
       return;
-    const g = Y(t);
-    return ue(
-      ee(g, r),
-      {
-        next: (p) => {
-          u(void 0);
-          try {
-            const N = Je(p.docs);
-            C(N);
-          } catch (N) {
-            console.error("Error loading users", N), u(N);
-          }
-          c(!1);
-        },
-        error: (p) => {
-          console.error("Error loading users", p), u(p), c(!1);
+    }
+    if (authController?.initialLoading) {
+      return;
+    }
+    setUsersLoading(true);
+    return dataSourceDelegate.listenCollection?.({
+      path: usersPath,
+      onUpdate(entities_0) {
+        console.debug("Updating users", entities_0);
+        setUsersError(void 0);
+        try {
+          const newUsers = entitiesToUsers(entities_0);
+          setUsersWithRoleIds(newUsers);
+        } catch (e_1) {
+          setUsersWithRoleIds([]);
+          console.error("Error loading users", e_1);
+          setUsersError(e_1);
         }
+        setUsersLoading(false);
+      },
+      onError(e_2) {
+        console.error("Error loading users", e_2);
+        setUsersWithRoleIds([]);
+        setUsersError(e_2);
+        setUsersLoading(false);
       }
-    );
-  }, [t, r]);
-  const x = k(async (g) => {
-    if (!t)
-      throw Error("useFirestoreUserManagement Firebase not initialised");
-    const p = Y(t);
-    if (!p || !r)
-      throw Error("useFirestoreUserManagement Firestore not initialised");
-    console.debug("Persisting user", g);
-    const N = g.roles?.map((ke) => ke.id), {
-      uid: q,
-      ...Z
-    } = g, de = {
-      ...Z,
-      roles: N
+    });
+  }, [dataSourceDelegate?.initialised, authController?.initialLoading, authController?.user?.uid, usersPath]);
+  const saveUser = useCallback(async (user) => {
+    if (!dataSourceDelegate) throw Error("useBuildUserManagement Firebase not initialised");
+    if (!usersPath) throw Error("useBuildUserManagement Firestore not initialised");
+    console.debug("Persisting user", user);
+    const roleIds = user.roles?.map((r_0) => r_0.id);
+    const email = user.email?.toLowerCase().trim();
+    if (!email) throw Error("Email is required");
+    const userExists = users.find((u_0) => u_0.email?.toLowerCase() === email);
+    const data = {
+      ...user,
+      roles: roleIds ?? []
     };
-    return q ? me(H(p, r, q), de, { merge: !0 }).then(() => g) : Fe(ee(p, r), de).then(() => g);
-  }, [r, t]), D = k((g) => {
-    if (!t)
-      throw Error("useFirestoreUserManagement Firebase not initialised");
-    const p = Y(t);
-    if (!p || !n)
-      throw Error("useFirestoreUserManagement Firestore not initialised");
-    console.debug("Persisting role", g);
+    if (!userExists) {
+      data.created_on = /* @__PURE__ */ new Date();
+    }
+    return dataSourceDelegate.saveEntity({
+      status: "existing",
+      path: usersPath,
+      entityId: email,
+      values: removeUndefined(data)
+    }).then(() => user);
+  }, [usersPath, dataSourceDelegate?.initialised]);
+  const saveRole = useCallback((role) => {
+    if (!dataSourceDelegate) throw Error("useBuildUserManagement Firebase not initialised");
+    if (!rolesPath) throw Error("useBuildUserManagement Firestore not initialised");
+    console.debug("Persisting role", role);
+    const {
+      id,
+      ...roleData
+    } = role;
+    return dataSourceDelegate.saveEntity({
+      status: "existing",
+      path: rolesPath,
+      entityId: id,
+      values: removeUndefined(roleData)
+    }).then(() => {
+      return;
+    });
+  }, [rolesPath, dataSourceDelegate?.initialised]);
+  const deleteUser = useCallback(async (user_0) => {
+    if (!dataSourceDelegate) throw Error("useBuildUserManagement Firebase not initialised");
+    if (!usersPath) throw Error("useBuildUserManagement Firestore not initialised");
+    console.debug("Deleting", user_0);
     const {
-      id: N,
-      ...q
-    } = g, Z = H(p, n, N);
-    return me(Z, q, { merge: !0 });
-  }, [n, t]), T = k(async (g) => {
-    if (!t)
-      throw Error("useFirestoreUserManagement Firebase not initialised");
-    const p = Y(t);
-    if (!p || !r)
-      throw Error("useFirestoreUserManagement Firestore not initialised");
-    console.debug("Deleting", g);
-    const { uid: N } = g;
-    return he(H(p, r, N));
-  }, [r, t]), o = k((g) => {
-    if (!t)
-      throw Error("useFirestoreUserManagement Firebase not initialised");
-    const p = Y(t);
-    if (!p || !n)
-      throw Error("useFirestoreUserManagement Firestore not initialised");
-    console.debug("Deleting", g);
-    const { id: N } = g, q = H(p, n, N);
-    return he(q);
-  }, [n, t]), E = k(({
-    collection: g,
-    user: p
-  }) => Ye({
-    collection: g,
-    user: p
-  }), []), $ = k((g) => {
-    if (!y)
-      throw Error("Users not loaded");
-    return y.find((N) => N.email?.toLowerCase() === g?.email?.toLowerCase())?.roles;
-  }, [y]), G = k(({ user: g }) => {
-    if (console.debug("Authenticating user", g), h)
-      return console.warn("User management is still loading"), !1;
-    if (y.length === 0 || y.find((N) => N.email?.toLowerCase() === g?.email?.toLowerCase()))
-      return !0;
+      uid
+    } = user_0;
+    const entity = {
+      path: usersPath,
+      id: uid,
+      values: {}
+    };
+    await dataSourceDelegate.deleteEntity({
+      entity
+    });
+  }, [usersPath, dataSourceDelegate?.initialised]);
+  const deleteRole = useCallback(async (role_0) => {
+    if (!dataSourceDelegate) throw Error("useBuildUserManagement Firebase not initialised");
+    if (!rolesPath) throw Error("useBuildUserManagement Firestore not initialised");
+    console.debug("Deleting", role_0);
+    const {
+      id: id_0
+    } = role_0;
+    const entity_0 = {
+      path: rolesPath,
+      id: id_0,
+      values: {}
+    };
+    await dataSourceDelegate.deleteEntity({
+      entity: entity_0
+    });
+  }, [rolesPath, dataSourceDelegate?.initialised]);
+  const collectionPermissions = useCallback(({
+    collection,
+    user: user_1
+  }) => resolveUserRolePermissions({
+    collection,
+    user: user_1
+  }), []);
+  const defineRolesFor = useCallback((user_2) => {
+    if (!usersWithRoleIds) throw Error("Users not loaded");
+    const users_0 = usersWithRoleIds.map((u_1) => ({
+      ...u_1,
+      roles: roles.filter((r_1) => u_1.roles?.includes(r_1.id))
+    }));
+    const mgmtUser = users_0.find((u_2) => u_2.email?.toLowerCase() === user_2?.email?.toLowerCase());
+    return mgmtUser?.roles;
+  }, [roles, usersWithRoleIds]);
+  const authenticator = useCallback(({
+    user: user_3
+  }) => {
+    if (loading) {
+      return false;
+    }
+    if (users.length === 0) {
+      console.warn("No users created yet");
+      return true;
+    }
+    const mgmtUser_0 = users.find((u_3) => u_3.email?.toLowerCase() === user_3?.email?.toLowerCase());
+    if (mgmtUser_0) {
+      console.debug("User found in user management system", mgmtUser_0);
+      return true;
+    }
     throw Error("Could not find a user with the provided email in the user management system.");
-  }, [h, y]);
+  }, [loading, users]);
+  const userRoles = authController.user ? defineRolesFor(authController.user) : void 0;
+  const isAdmin = (userRoles ?? []).some((r_2) => r_2.id === "admin");
+  const userRoleIds = userRoles?.map((r_3) => r_3.id);
+  useEffect(() => {
+    console.debug("Setting roles", userRoles);
+    authController.setUserRoles?.(userRoles ?? []);
+  }, [userRoleIds]);
   return {
-    loading: h,
-    roles: S,
-    users: y,
-    saveUser: x,
-    saveRole: D,
-    rolesError: b,
-    deleteUser: T,
-    deleteRole: o,
-    usersLimit: l,
-    usersError: z,
-    canEditRoles: i === void 0 ? !0 : i,
-    allowDefaultRolesCreation: m === void 0 ? !0 : m,
-    includeCollectionConfigPermissions: !!f,
-    collectionPermissions: E,
-    defineRolesFor: $,
-    authenticator: G
+    loading,
+    roles,
+    users,
+    saveUser,
+    saveRole,
+    rolesError,
+    deleteUser,
+    deleteRole,
+    usersLimit,
+    usersError,
+    isAdmin,
+    canEditRoles: canEditRoles === void 0 ? true : canEditRoles,
+    allowDefaultRolesCreation: allowDefaultRolesCreation === void 0 ? true : allowDefaultRolesCreation,
+    includeCollectionConfigPermissions: Boolean(includeCollectionConfigPermissions),
+    collectionPermissions,
+    defineRolesFor,
+    authenticator,
+    ...authController,
+    initialLoading: authController.initialLoading || loading,
+    userRoles,
+    user: authController.user ? {
+      ...authController.user,
+      roles: userRoles
+    } : null
   };
 }
-const Je = (t) => t.map((r) => {
-  const n = r.data();
-  return {
-    uid: r.id,
-    ...n,
-    created_on: n?.created_on?.toDate(),
-    updated_on: n?.updated_on?.toDate()
-  };
-}), Ge = (t) => t.map((r) => ({
-  id: r.id,
-  ...r.data()
-})), Ee = F.createContext({});
-function He({
-  children: t,
-  userManagement: r
-}) {
-  return /* @__PURE__ */ e(Ee.Provider, { value: r, children: t });
+const entitiesToUsers = (docs) => {
+  return docs.map((doc) => {
+    const data = doc.values;
+    const newVar = {
+      uid: doc.id,
+      ...data,
+      created_on: data?.created_on,
+      updated_on: data?.updated_on
+    };
+    return newVar;
+  });
+};
+const entityToRoles = (entities) => {
+  return entities.map((doc) => ({
+    id: doc.id,
+    ...doc.values
+  }));
+};
+const UserManagementContext = React.createContext({});
+function UserManagementProvider(t0) {
+  const $ = c(3);
+  const {
+    children,
+    userManagement
+  } = t0;
+  let t1;
+  if ($[0] !== children || $[1] !== userManagement) {
+    t1 = /* @__PURE__ */ jsx(UserManagementContext.Provider, { value: userManagement, children });
+    $[0] = children;
+    $[1] = userManagement;
+    $[2] = t1;
+  } else {
+    t1 = $[2];
+  }
+  return t1;
 }
-const j = () => Ie(Ee);
-function X({ role: t }) {
-  let r;
-  return t.isAdmin ? r = "blueDarker" : t.id === "editor" ? r = "yellowLight" : t.id === "viewer" ? r = "grayLight" : r = Pe(t.id), /* @__PURE__ */ e(
-    Ae,
-    {
-      colorScheme: r,
-      children: t.name
-    },
-    t.id
-  );
+const useUserManagement = () => {
+  return useContext(UserManagementContext);
+};
+function RoleChip(t0) {
+  const $ = c(6);
+  const {
+    role
+  } = t0;
+  let colorScheme;
+  if (role.isAdmin) {
+    colorScheme = "blueDarker";
+  } else {
+    if (role.id === "editor") {
+      colorScheme = "yellowLight";
+    } else {
+      if (role.id === "viewer") {
+        colorScheme = "grayLight";
+      } else {
+        let t12;
+        if ($[0] !== role.id) {
+          t12 = getColorSchemeForSeed(role.id);
+          $[0] = role.id;
+          $[1] = t12;
+        } else {
+          t12 = $[1];
+        }
+        colorScheme = t12;
+      }
+    }
+  }
+  let t1;
+  if ($[2] !== colorScheme || $[3] !== role.id || $[4] !== role.name) {
+    t1 = /* @__PURE__ */ jsx(Chip, { colorScheme, children: role.name }, role.id);
+    $[2] = colorScheme;
+    $[3] = role.id;
+    $[4] = role.name;
+    $[5] = t1;
+  } else {
+    t1 = $[5];
+  }
+  return t1;
 }
-const Ke = M.object().shape({
-  id: M.string().required("Required"),
-  name: M.string().required("Required")
+const RoleYupSchema = Yup.object().shape({
+  id: Yup.string().required("Required"),
+  name: Yup.string().required("Required")
 });
-function Qe({
-  open: t,
-  role: r,
-  editable: n,
-  handleClose: l,
-  collections: i
-}) {
-  const { saveRole: m } = j(), f = !r, [v, R] = P(), w = k((o) => (R(void 0), m(o)), [m]), c = Re({
-    initialValues: r ?? {
+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");
+  }
+  return true;
+}
+function RolesDetailsForm(t0) {
+  const $ = c(165);
+  const {
+    open,
+    role,
+    editable,
+    handleClose,
+    collections
+  } = t0;
+  const {
+    saveRole
+  } = useUserManagement();
+  const isNewRole = !role;
+  const {
+    user: loggedInUser
+  } = useAuthController();
+  const [savingError, setSavingError] = useState();
+  let t1;
+  if ($[0] !== loggedInUser || $[1] !== saveRole) {
+    t1 = (role_0) => {
+      setSavingError(void 0);
+      if (!loggedInUser) {
+        throw new Error("User not found");
+      }
+      canRoleBeEdited(loggedInUser);
+      return saveRole(role_0);
+    };
+    $[0] = loggedInUser;
+    $[1] = saveRole;
+    $[2] = t1;
+  } else {
+    t1 = $[2];
+  }
+  const onRoleUpdated = t1;
+  let t2;
+  if ($[3] !== role) {
+    t2 = role ?? {
       name: ""
-    },
-    onSubmit: (o, E) => w(o).then(() => {
-      E.resetForm({
-        values: o
-      }), l();
-    }).catch(($) => R($)),
-    validation: (o) => Ke.validate(o, { abortEarly: !1 }).then(() => ({})).catch((E) => {
-      const $ = {};
-      return E.inner.forEach((G) => {
-        $[G.path] = G.message;
-      }), $;
-    })
-  }), {
-    isSubmitting: S,
-    touched: U,
-    values: a,
-    errors: C,
-    handleChange: y,
-    setFieldValue: b,
-    dirty: _,
-    setFieldTouched: z
-  } = c, u = a.isAdmin ?? !1, h = a.defaultPermissions?.create ?? !1, x = a.defaultPermissions?.read ?? !1, D = a.defaultPermissions?.edit ?? !1, T = a.defaultPermissions?.delete ?? !1;
-  return F.useEffect(() => {
-    !J(U, "id") && a.name && b("id", Be(a.name));
-  }, [U, a.name]), /* @__PURE__ */ e(
-    fe,
-    {
-      open: t,
-      maxWidth: "4xl",
-      children: /* @__PURE__ */ e(De, { value: c, children: /* @__PURE__ */ s(
-        "form",
-        {
-          noValidate: !0,
-          autoComplete: "off",
-          onSubmit: c.handleSubmit,
-          style: {
-            display: "flex",
-            flexDirection: "column",
-            position: "relative",
-            height: "100%"
-          },
-          children: [
-            /* @__PURE__ */ s(ge, { className: "flex-grow", children: [
-              /* @__PURE__ */ e(
-                "div",
-                {
-                  className: "flex flex-row pt-12 pb-8",
-                  children: /* @__PURE__ */ e(
-                    A,
-                    {
-                      variant: "h4",
-                      className: "flex-grow",
-                      children: "Role"
-                    }
-                  )
-                }
-              ),
-              /* @__PURE__ */ s("div", { className: "grid grid-cols-12 gap-8", children: [
-                /* @__PURE__ */ s("div", { className: "col-span-12 md:col-span-8", children: [
-                  /* @__PURE__ */ e(
-                    Q,
-                    {
-                      name: "name",
-                      required: !0,
-                      error: U.name && !!C.name,
-                      value: a.name,
-                      disabled: u || !n,
-                      onChange: y,
-                      "aria-describedby": "name-helper-text",
-                      label: "Name"
-                    }
-                  ),
-                  /* @__PURE__ */ e(B, { children: U.name && C.name ? C.name : "Name of this role" })
-                ] }),
-                /* @__PURE__ */ s("div", { className: "col-span-12 md:col-span-4", children: [
-                  /* @__PURE__ */ e(
-                    Q,
-                    {
-                      name: "id",
-                      required: !0,
-                      error: U.id && !!C.id,
-                      value: a.id,
-                      disabled: !f || !n,
-                      onChange: (o) => {
-                        y(o), z("id", !0);
-                      },
-                      "aria-describedby": "id-helper-text",
-                      label: "ID"
-                    }
-                  ),
-                  /* @__PURE__ */ e(B, { children: U.id && C.id ? C.id : "ID of this role" })
-                ] }),
-                /* @__PURE__ */ s("div", { className: "col-span-12", children: [
-                  /* @__PURE__ */ e(
-                    pe,
-                    {
-                      className: "bg-inherit",
-                      children: /* @__PURE__ */ s(re, { children: [
-                        /* @__PURE__ */ s(ie, { children: [
-                          /* @__PURE__ */ e(d, {}),
-                          /* @__PURE__ */ e(
-                            d,
-                            {
-                              align: "center",
-                              children: "Create entities"
-                            }
-                          ),
-                          /* @__PURE__ */ e(
-                            d,
-                            {
-                              align: "center",
-                              children: "Read entities"
-                            }
-                          ),
-                          /* @__PURE__ */ e(
-                            d,
-                            {
-                              align: "center",
-                              children: "Update entities"
-                            }
-                          ),
-                          /* @__PURE__ */ e(
-                            d,
-                            {
-                              align: "center",
-                              children: "Delete entities"
-                            }
-                          )
-                        ] }),
-                        /* @__PURE__ */ s(oe, { children: [
-                          /* @__PURE__ */ s(W, { children: [
-                            /* @__PURE__ */ e(
-                              d,
-                              {
-                                scope: "row",
-                                children: /* @__PURE__ */ e("strong", { children: "All collections" })
-                              }
-                            ),
-                            /* @__PURE__ */ e(
-                              d,
-                              {
-                                align: "center",
-                                children: /* @__PURE__ */ e(
-                                  V,
-                                  {
-                                    title: "Create entities in collections",
-                                    children: /* @__PURE__ */ e(
-                                      I,
-                                      {
-                                        disabled: u || !n,
-                                        checked: (u || h) ?? !1,
-                                        onCheckedChange: (o) => b("defaultPermissions.create", o)
-                                      }
-                                    )
-                                  }
-                                )
-                              }
-                            ),
-                            /* @__PURE__ */ e(
-                              d,
-                              {
-                                align: "center",
-                                children: /* @__PURE__ */ e(
-                                  V,
-                                  {
-                                    title: "Access all data in every collection",
-                                    children: /* @__PURE__ */ e(
-                                      I,
-                                      {
-                                        disabled: u || !n,
-                                        checked: (u || x) ?? !1,
-                                        onCheckedChange: (o) => b("defaultPermissions.read", o)
-                                      }
-                                    )
-                                  }
-                                )
-                              }
-                            ),
-                            /* @__PURE__ */ e(
-                              d,
-                              {
-                                align: "center",
-                                children: /* @__PURE__ */ e(
-                                  V,
-                                  {
-                                    title: "Update data in any collection",
-                                    children: /* @__PURE__ */ e(
-                                      I,
-                                      {
-                                        disabled: u || !n,
-                                        checked: (u || D) ?? !1,
-                                        onCheckedChange: (o) => b("defaultPermissions.edit", o)
-                                      }
-                                    )
-                                  }
-                                )
-                              }
-                            ),
-                            /* @__PURE__ */ e(
-                              d,
-                              {
-                                align: "center",
-                                children: /* @__PURE__ */ e(
-                                  V,
-                                  {
-                                    title: "Delete data in any collection",
-                                    children: /* @__PURE__ */ e(
-                                      I,
-                                      {
-                                        disabled: u || !n,
-                                        checked: (u || T) ?? !1,
-                                        onCheckedChange: (o) => b("defaultPermissions.delete", o)
-                                      }
-                                    )
-                                  }
-                                )
-                              }
-                            )
-                          ] }),
-                          i && i.map((o) => /* @__PURE__ */ s(W, { children: [
-                            /* @__PURE__ */ e(
-                              d,
-                              {
-                                scope: "row",
-                                children: o.name
-                              }
-                            ),
-                            /* @__PURE__ */ e(
-                              d,
-                              {
-                                align: "center",
-                                children: /* @__PURE__ */ e(
-                                  I,
-                                  {
-                                    disabled: u || h || !n,
-                                    checked: (u || h || J(a, `collectionPermissions.${o.path}.create`)) ?? !1,
-                                    onCheckedChange: (E) => b(`collectionPermissions.${o.path}.create`, E)
-                                  }
-                                )
-                              }
-                            ),
-                            /* @__PURE__ */ e(
-                              d,
-                              {
-                                align: "center",
-                                children: /* @__PURE__ */ e(
-                                  I,
-                                  {
-                                    disabled: u || x || !n,
-                                    checked: (u || x || J(a, `collectionPermissions.${o.path}.read`)) ?? !1,
-                                    onCheckedChange: (E) => b(`collectionPermissions.${o.path}.read`, E)
-                                  }
-                                )
-                              }
-                            ),
-                            /* @__PURE__ */ e(
-                              d,
-                              {
-                                align: "center",
-                                children: /* @__PURE__ */ e(
-                                  I,
-                                  {
-                                    disabled: u || D || !n,
-                                    checked: (u || D || J(a, `collectionPermissions.${o.path}.edit`)) ?? !1,
-                                    onCheckedChange: (E) => b(`collectionPermissions.${o.path}.edit`, E)
-                                  }
-                                )
-                              }
-                            ),
-                            /* @__PURE__ */ e(
-                              d,
-                              {
-                                align: "center",
-                                children: /* @__PURE__ */ e(
-                                  I,
-                                  {
-                                    disabled: u || T || !n,
-                                    checked: (u || T || J(a, `collectionPermissions.${o.path}.delete`)) ?? !1,
-                                    onCheckedChange: (E) => b(`collectionPermissions.${o.path}.delete`, E)
-                                  }
-                                )
-                              }
-                            )
-                          ] }, o.name))
-                        ] })
-                      ] })
-                    }
-                  ),
-                  /* @__PURE__ */ e(B, { children: "You can customise the permissions that the users related to this role can perform in the entities of each collection" })
-                ] }),
-                /* @__PURE__ */ s("div", { className: "col-span-12 md:col-span-4", children: [
-                  /* @__PURE__ */ s(
-                    ne,
-                    {
-                      error: U.config && !!C.config,
-                      id: "createCollections",
-                      name: "createCollections",
-                      label: "Create collections",
-                      position: "item-aligned",
-                      disabled: u || !n,
-                      onChange: (o) => b("config.createCollections", o.target.value === "true"),
-                      value: u || a.config?.createCollections ? "true" : "false",
-                      renderValue: (o) => o === "true" ? "Yes" : "No",
-                      children: [
-                        /* @__PURE__ */ e(
-                          L,
-                          {
-                            value: "true",
-                            children: " Yes "
-                          }
-                        ),
-                        /* @__PURE__ */ e(
-                          L,
-                          {
-                            value: "false",
-                            children: " No "
-                          }
-                        )
-                      ]
-                    }
-                  ),
-                  /* @__PURE__ */ e(B, { children: U.config && C.config ? C.config : "Can the user create collections" })
-                ] }),
-                /* @__PURE__ */ s("div", { className: "col-span-12 md:col-span-4", children: [
-                  /* @__PURE__ */ s(
-                    ne,
-                    {
-                      error: U.config && !!C.config,
-                      id: "editCollections",
-                      name: "editCollections",
-                      label: "Edit collections",
-                      disabled: u || !n,
-                      position: "item-aligned",
-                      onChange: (o) => b("config.editCollections", o.target.value === "own" ? "own" : o.target.value === "true"),
-                      value: u ? "true" : a.config?.editCollections === "own" ? "own" : a.config?.editCollections ? "true" : "false",
-                      renderValue: (o) => o === "own" ? "Own" : o === "true" ? "Yes" : "No",
-                      children: [
-                        /* @__PURE__ */ e(
-                          L,
-                          {
-                            value: "true",
-                            children: " Yes "
-                          }
-                        ),
-                        /* @__PURE__ */ e(
-                          L,
-                          {
-                            value: "false",
-                            children: " No "
-                          }
-                        ),
-                        /* @__PURE__ */ e(
-                          L,
-                          {
-                            value: "own",
-                            children: " Only his/her own "
-                          }
-                        )
-                      ]
-                    }
-                  ),
-                  /* @__PURE__ */ e(B, { children: U.config && C.config ? C.config : "Can the user edit collections" })
-                ] }),
-                /* @__PURE__ */ s("div", { className: "col-span-12 md:col-span-4", children: [
-                  /* @__PURE__ */ s(
-                    ne,
-                    {
-                      error: U.config && !!C.config,
-                      id: "deleteCollections",
-                      name: "deleteCollections",
-                      label: "Delete collections",
-                      disabled: u || !n,
-                      position: "item-aligned",
-                      onChange: (o) => b("config.deleteCollections", o.target.value === "own" ? "own" : o.target.value === "true"),
-                      value: u ? "true" : a.config?.deleteCollections === "own" ? "own" : a.config?.deleteCollections ? "true" : "false",
-                      renderValue: (o) => o === "own" ? "Own" : o === "true" ? "Yes" : "No",
-                      children: [
-                        /* @__PURE__ */ e(
-                          L,
-                          {
-                            value: "true",
-                            children: " Yes "
-                          }
-                        ),
-                        /* @__PURE__ */ e(
-                          L,
-                          {
-                            value: "false",
-                            children: " No "
-                          }
-                        ),
-                        /* @__PURE__ */ e(
-                          L,
-                          {
-                            value: "own",
-                            children: " Only his/her own "
-                          }
-                        )
-                      ]
-                    }
-                  ),
-                  /* @__PURE__ */ e(B, { children: U.config && C.config ? C.config : "Can the user delete collections" })
-                ] })
-              ] })
-            ] }),
-            /* @__PURE__ */ s(Ce, { position: "sticky", children: [
-              v && /* @__PURE__ */ e(A, { className: "text-red-500", children: "There was an error saving this role" }),
-              /* @__PURE__ */ e(
-                O,
-                {
-                  variant: "text",
-                  onClick: () => {
-                    l();
-                  },
-                  children: "Cancel"
-                }
-              ),
-              /* @__PURE__ */ e(
-                ve,
-                {
-                  variant: "filled",
-                  color: "primary",
-                  type: "submit",
-                  disabled: !_,
-                  loading: S,
-                  startIcon: /* @__PURE__ */ e(we, {}),
-                  children: f ? "Create role" : "Update"
-                }
-              )
-            ] })
-          ]
-        }
-      ) })
-    }
-  );
+    };
+    $[3] = role;
+    $[4] = t2;
+  } else {
+    t2 = $[4];
+  }
+  let t3;
+  if ($[5] !== handleClose || $[6] !== onRoleUpdated) {
+    t3 = (role_1, formexController) => {
+      try {
+        return onRoleUpdated(role_1).then(() => {
+          formexController.resetForm({
+            values: role_1
+          });
+          handleClose();
+        }).catch((e_0) => {
+          setSavingError(e_0);
+        });
+      } catch (t410) {
+        const e = t410;
+        setSavingError(e);
+        return Promise.resolve();
+      }
+    };
+    $[5] = handleClose;
+    $[6] = onRoleUpdated;
+    $[7] = t3;
+  } else {
+    t3 = $[7];
+  }
+  let t4;
+  if ($[8] !== t2 || $[9] !== t3) {
+    t4 = {
+      initialValues: t2,
+      onSubmit: t3,
+      validation: _temp3$1
+    };
+    $[8] = t2;
+    $[9] = t3;
+    $[10] = t4;
+  } else {
+    t4 = $[10];
+  }
+  const formex = useCreateFormex(t4);
+  const {
+    isSubmitting,
+    touched,
+    values: values_0,
+    errors: errors_0,
+    handleChange,
+    setFieldValue,
+    dirty,
+    setFieldTouched
+  } = formex;
+  const isAdmin = values_0.isAdmin ?? false;
+  const defaultCreate = values_0.defaultPermissions?.create ?? false;
+  const defaultRead = values_0.defaultPermissions?.read ?? false;
+  const defaultEdit = values_0.defaultPermissions?.edit ?? false;
+  const defaultDelete = values_0.defaultPermissions?.delete ?? false;
+  let t5;
+  if ($[11] !== setFieldValue || $[12] !== touched || $[13] !== values_0.name) {
+    t5 = () => {
+      const idTouched = getIn(touched, "id");
+      if (!idTouched && values_0.name) {
+        setFieldValue("id", toSnakeCase(values_0.name));
+      }
+    };
+    $[11] = setFieldValue;
+    $[12] = touched;
+    $[13] = values_0.name;
+    $[14] = t5;
+  } else {
+    t5 = $[14];
+  }
+  let t6;
+  if ($[15] !== touched || $[16] !== values_0.name) {
+    t6 = [touched, values_0.name];
+    $[15] = touched;
+    $[16] = values_0.name;
+    $[17] = t6;
+  } else {
+    t6 = $[17];
+  }
+  React.useEffect(t5, t6);
+  let t7;
+  let t8;
+  if ($[18] === Symbol.for("react.memo_cache_sentinel")) {
+    t7 = {
+      display: "flex",
+      flexDirection: "column",
+      position: "relative",
+      height: "100%"
+    };
+    t8 = /* @__PURE__ */ jsx(DialogTitle, { variant: "h4", gutterBottom: false, children: "Role" });
+    $[18] = t7;
+    $[19] = t8;
+  } else {
+    t7 = $[18];
+    t8 = $[19];
+  }
+  const t9 = touched.name && Boolean(errors_0.name);
+  const t10 = isAdmin || !editable;
+  let t11;
+  if ($[20] !== handleChange || $[21] !== t10 || $[22] !== t9 || $[23] !== values_0.name) {
+    t11 = /* @__PURE__ */ jsx(TextField, { name: "name", required: true, error: t9, value: values_0.name, disabled: t10, onChange: handleChange, "aria-describedby": "name-helper-text", label: "Name" });
+    $[20] = handleChange;
+    $[21] = t10;
+    $[22] = t9;
+    $[23] = values_0.name;
+    $[24] = t11;
+  } else {
+    t11 = $[24];
+  }
+  const t12 = touched.name && Boolean(errors_0.name) ? errors_0.name : "Name of this role";
+  let t13;
+  if ($[25] !== t12) {
+    t13 = /* @__PURE__ */ jsx(FieldCaption, { children: t12 });
+    $[25] = t12;
+    $[26] = t13;
+  } else {
+    t13 = $[26];
+  }
+  let t14;
+  if ($[27] !== t11 || $[28] !== t13) {
+    t14 = /* @__PURE__ */ jsxs("div", { className: "col-span-12 md:col-span-8", children: [
+      t11,
+      t13
+    ] });
+    $[27] = t11;
+    $[28] = t13;
+    $[29] = t14;
+  } else {
+    t14 = $[29];
+  }
+  const t15 = touched.id && Boolean(errors_0.id);
+  const t16 = !isNewRole || !editable;
+  let t17;
+  if ($[30] !== handleChange || $[31] !== setFieldTouched) {
+    t17 = (e_2) => {
+      handleChange(e_2);
+      setFieldTouched("id", true);
+    };
+    $[30] = handleChange;
+    $[31] = setFieldTouched;
+    $[32] = t17;
+  } else {
+    t17 = $[32];
+  }
+  let t18;
+  if ($[33] !== t15 || $[34] !== t16 || $[35] !== t17 || $[36] !== values_0.id) {
+    t18 = /* @__PURE__ */ jsx(TextField, { name: "id", required: true, error: t15, value: values_0.id, disabled: t16, onChange: t17, "aria-describedby": "id-helper-text", label: "ID" });
+    $[33] = t15;
+    $[34] = t16;
+    $[35] = t17;
+    $[36] = values_0.id;
+    $[37] = t18;
+  } else {
+    t18 = $[37];
+  }
+  const t19 = touched.id && Boolean(errors_0.id) ? errors_0.id : "ID of this role";
+  let t20;
+  if ($[38] !== t19) {
+    t20 = /* @__PURE__ */ jsx(FieldCaption, { children: t19 });
+    $[38] = t19;
+    $[39] = t20;
+  } else {
+    t20 = $[39];
+  }
+  let t21;
+  if ($[40] !== t18 || $[41] !== t20) {
+    t21 = /* @__PURE__ */ jsxs("div", { className: "col-span-12 md:col-span-4", children: [
+      t18,
+      t20
+    ] });
+    $[40] = t18;
+    $[41] = t20;
+    $[42] = t21;
+  } else {
+    t21 = $[42];
+  }
+  let t22;
+  if ($[43] === Symbol.for("react.memo_cache_sentinel")) {
+    t22 = /* @__PURE__ */ jsxs(TableHeader, { className: "rounded-md", children: [
+      /* @__PURE__ */ jsx(TableCell, {}),
+      /* @__PURE__ */ jsx(TableCell, { align: "center", children: "Create entities" }),
+      /* @__PURE__ */ jsx(TableCell, { align: "center", children: "Read entities" }),
+      /* @__PURE__ */ jsx(TableCell, { align: "center", children: "Update entities" }),
+      /* @__PURE__ */ jsx(TableCell, { align: "center", children: "Delete entities" }),
+      /* @__PURE__ */ jsx(TableCell, { align: "center" })
+    ] });
+    $[43] = t22;
+  } else {
+    t22 = $[43];
+  }
+  let t23;
+  if ($[44] === Symbol.for("react.memo_cache_sentinel")) {
+    t23 = /* @__PURE__ */ jsx(TableCell, { scope: "row", children: /* @__PURE__ */ jsx("strong", { children: "All collections" }) });
+    $[44] = t23;
+  } else {
+    t23 = $[44];
+  }
+  const t24 = isAdmin || !editable;
+  const t25 = (isAdmin || defaultCreate) ?? false;
+  let t26;
+  if ($[45] !== setFieldValue) {
+    t26 = (checked) => setFieldValue("defaultPermissions.create", checked);
+    $[45] = setFieldValue;
+    $[46] = t26;
+  } else {
+    t26 = $[46];
+  }
+  let t27;
+  if ($[47] !== t24 || $[48] !== t25 || $[49] !== t26) {
+    t27 = /* @__PURE__ */ jsx(TableCell, { align: "center", children: /* @__PURE__ */ jsx(Tooltip, { title: "Create entities in collections", children: /* @__PURE__ */ jsx(Checkbox, { disabled: t24, checked: t25, onCheckedChange: t26 }) }) });
+    $[47] = t24;
+    $[48] = t25;
+    $[49] = t26;
+    $[50] = t27;
+  } else {
+    t27 = $[50];
+  }
+  const t28 = isAdmin || !editable;
+  const t29 = (isAdmin || defaultRead) ?? false;
+  let t30;
+  if ($[51] !== setFieldValue) {
+    t30 = (checked_0) => setFieldValue("defaultPermissions.read", checked_0);
+    $[51] = setFieldValue;
+    $[52] = t30;
+  } else {
+    t30 = $[52];
+  }
+  let t31;
+  if ($[53] !== t28 || $[54] !== t29 || $[55] !== t30) {
+    t31 = /* @__PURE__ */ jsx(TableCell, { align: "center", children: /* @__PURE__ */ jsx(Tooltip, { title: "Access all data in every collection", children: /* @__PURE__ */ jsx(Checkbox, { disabled: t28, checked: t29, onCheckedChange: t30 }) }) });
+    $[53] = t28;
+    $[54] = t29;
+    $[55] = t30;
+    $[56] = t31;
+  } else {
+    t31 = $[56];
+  }
+  const t32 = isAdmin || !editable;
+  const t33 = (isAdmin || defaultEdit) ?? false;
+  let t34;
+  if ($[57] !== setFieldValue) {
+    t34 = (checked_1) => setFieldValue("defaultPermissions.edit", checked_1);
+    $[57] = setFieldValue;
+    $[58] = t34;
+  } else {
+    t34 = $[58];
+  }
+  let t35;
+  if ($[59] !== t32 || $[60] !== t33 || $[61] !== t34) {
+    t35 = /* @__PURE__ */ jsx(TableCell, { align: "center", children: /* @__PURE__ */ jsx(Tooltip, { title: "Update data in any collection", children: /* @__PURE__ */ jsx(Checkbox, { disabled: t32, checked: t33, onCheckedChange: t34 }) }) });
+    $[59] = t32;
+    $[60] = t33;
+    $[61] = t34;
+    $[62] = t35;
+  } else {
+    t35 = $[62];
+  }
+  const t36 = isAdmin || !editable;
+  const t37 = (isAdmin || defaultDelete) ?? false;
+  let t38;
+  if ($[63] !== setFieldValue) {
+    t38 = (checked_2) => setFieldValue("defaultPermissions.delete", checked_2);
+    $[63] = setFieldValue;
+    $[64] = t38;
+  } else {
+    t38 = $[64];
+  }
+  let t39;
+  if ($[65] !== t36 || $[66] !== t37 || $[67] !== t38) {
+    t39 = /* @__PURE__ */ jsx(TableCell, { align: "center", children: /* @__PURE__ */ jsx(Tooltip, { title: "Delete data in any collection", children: /* @__PURE__ */ jsx(Checkbox, { disabled: t36, checked: t37, onCheckedChange: t38 }) }) });
+    $[65] = t36;
+    $[66] = t37;
+    $[67] = t38;
+    $[68] = t39;
+  } else {
+    t39 = $[68];
+  }
+  let t40;
+  if ($[69] === Symbol.for("react.memo_cache_sentinel")) {
+    t40 = /* @__PURE__ */ jsx(TableCell, { align: "center" });
+    $[69] = t40;
+  } else {
+    t40 = $[69];
+  }
+  let t41;
+  if ($[70] !== t27 || $[71] !== t31 || $[72] !== t35 || $[73] !== t39) {
+    t41 = /* @__PURE__ */ jsxs(TableRow, { children: [
+      t23,
+      t27,
+      t31,
+      t35,
+      t39,
+      t40
+    ] });
+    $[70] = t27;
+    $[71] = t31;
+    $[72] = t35;
+    $[73] = t39;
+    $[74] = t41;
+  } else {
+    t41 = $[74];
+  }
+  let t42;
+  if ($[75] !== collections || $[76] !== defaultCreate || $[77] !== defaultDelete || $[78] !== defaultEdit || $[79] !== defaultRead || $[80] !== editable || $[81] !== isAdmin || $[82] !== setFieldValue || $[83] !== values_0) {
+    t42 = collections && collections.map((col) => /* @__PURE__ */ jsxs(TableRow, { children: [
+      /* @__PURE__ */ jsx(TableCell, { scope: "row", children: col.name }),
+      /* @__PURE__ */ jsx(TableCell, { align: "center", children: /* @__PURE__ */ jsx(Checkbox, { disabled: isAdmin || defaultCreate || !editable, checked: (isAdmin || defaultCreate || getIn(values_0, `collectionPermissions.${col.id}.create`)) ?? false, onCheckedChange: (checked_3) => setFieldValue(`collectionPermissions.${col.id}.create`, checked_3) }) }),
+      /* @__PURE__ */ jsx(TableCell, { align: "center", children: /* @__PURE__ */ jsx(Checkbox, { disabled: isAdmin || defaultRead || !editable, checked: (isAdmin || defaultRead || getIn(values_0, `collectionPermissions.${col.id}.read`)) ?? false, onCheckedChange: (checked_4) => setFieldValue(`collectionPermissions.${col.id}.read`, checked_4) }) }),
+      /* @__PURE__ */ jsx(TableCell, { align: "center", children: /* @__PURE__ */ jsx(Checkbox, { disabled: isAdmin || defaultEdit || !editable, checked: (isAdmin || defaultEdit || getIn(values_0, `collectionPermissions.${col.id}.edit`)) ?? false, onCheckedChange: (checked_5) => setFieldValue(`collectionPermissions.${col.id}.edit`, checked_5) }) }),
+      /* @__PURE__ */ jsx(TableCell, { align: "center", children: /* @__PURE__ */ jsx(Checkbox, { disabled: isAdmin || defaultDelete || !editable, checked: (isAdmin || defaultDelete || getIn(values_0, `collectionPermissions.${col.id}.delete`)) ?? false, onCheckedChange: (checked_6) => setFieldValue(`collectionPermissions.${col.id}.delete`, checked_6) }) }),
+      /* @__PURE__ */ jsx(TableCell, { align: "center", children: /* @__PURE__ */ jsx(Tooltip, { title: "Allow all permissions in this collections", children: /* @__PURE__ */ jsx(Button, { className: "color-inherit", onClick: () => {
+        setFieldValue(`collectionPermissions.${col.id}.create`, true);
+        setFieldValue(`collectionPermissions.${col.id}.read`, true);
+        setFieldValue(`collectionPermissions.${col.id}.edit`, true);
+        setFieldValue(`collectionPermissions.${col.id}.delete`, true);
+      }, disabled: isAdmin || !editable, variant: "text", children: "All" }) }) })
+    ] }, col.name));
+    $[75] = collections;
+    $[76] = defaultCreate;
+    $[77] = defaultDelete;
+    $[78] = defaultEdit;
+    $[79] = defaultRead;
+    $[80] = editable;
+    $[81] = isAdmin;
+    $[82] = setFieldValue;
+    $[83] = values_0;
+    $[84] = t42;
+  } else {
+    t42 = $[84];
+  }
+  let t43;
+  if ($[85] !== t41 || $[86] !== t42) {
+    t43 = /* @__PURE__ */ jsx(Paper, { className: "bg-inherit overflow-hidden", children: /* @__PURE__ */ jsxs(Table, { className: "w-full rounded-md", children: [
+      t22,
+      /* @__PURE__ */ jsxs(TableBody, { children: [
+        t41,
+        t42
+      ] })
+    ] }) });
+    $[85] = t41;
+    $[86] = t42;
+    $[87] = t43;
+  } else {
+    t43 = $[87];
+  }
+  let t44;
+  if ($[88] === Symbol.for("react.memo_cache_sentinel")) {
+    t44 = /* @__PURE__ */ jsx(FieldCaption, { children: "You can customise the permissions that the users related to this role can perform in the entities of each collection" });
+    $[88] = t44;
+  } else {
+    t44 = $[88];
+  }
+  let t45;
+  if ($[89] !== t43) {
+    t45 = /* @__PURE__ */ jsxs("div", { className: "col-span-12", children: [
+      t43,
+      t44
+    ] });
+    $[89] = t43;
+    $[90] = t45;
+  } else {
+    t45 = $[90];
+  }
+  const t46 = touched.config && Boolean(errors_0.config);
+  const t47 = isAdmin || !editable;
+  let t48;
+  if ($[91] !== setFieldValue) {
+    t48 = (event) => setFieldValue("config.createCollections", event.target.value === "true");
+    $[91] = setFieldValue;
+    $[92] = t48;
+  } else {
+    t48 = $[92];
+  }
+  const t49 = isAdmin || values_0.config?.createCollections ? "true" : "false";
+  let t50;
+  let t51;
+  if ($[93] === Symbol.for("react.memo_cache_sentinel")) {
+    t50 = /* @__PURE__ */ jsx(SelectItem, { value: "true", children: " Yes " });
+    t51 = /* @__PURE__ */ jsx(SelectItem, { value: "false", children: " No " });
+    $[93] = t50;
+    $[94] = t51;
+  } else {
+    t50 = $[93];
+    t51 = $[94];
+  }
+  let t52;
+  if ($[95] !== t46 || $[96] !== t47 || $[97] !== t48 || $[98] !== t49) {
+    t52 = /* @__PURE__ */ jsxs(Select, { error: t46, size: "large", fullWidth: true, id: "createCollections", name: "createCollections", label: "Create collections", position: "item-aligned", disabled: t47, onChange: t48, value: t49, renderValue: _temp4$1, children: [
+      t50,
+      t51
+    ] });
+    $[95] = t46;
+    $[96] = t47;
+    $[97] = t48;
+    $[98] = t49;
+    $[99] = t52;
+  } else {
+    t52 = $[99];
+  }
+  const t53 = touched.config && Boolean(errors_0.config) ? errors_0.config : "Can the user create collections";
+  let t54;
+  if ($[100] !== t53) {
+    t54 = /* @__PURE__ */ jsx(FieldCaption, { children: t53 });
+    $[100] = t53;
+    $[101] = t54;
+  } else {
+    t54 = $[101];
+  }
+  let t55;
+  if ($[102] !== t52 || $[103] !== t54) {
+    t55 = /* @__PURE__ */ jsxs("div", { className: "col-span-12 md:col-span-4", children: [
+      t52,
+      t54
+    ] });
+    $[102] = t52;
+    $[103] = t54;
+    $[104] = t55;
+  } else {
+    t55 = $[104];
+  }
+  const t56 = touched.config && Boolean(errors_0.config);
+  const t57 = isAdmin || !editable;
+  let t58;
+  if ($[105] !== setFieldValue) {
+    t58 = (event_0) => setFieldValue("config.editCollections", event_0.target.value === "own" ? "own" : event_0.target.value === "true");
+    $[105] = setFieldValue;
+    $[106] = t58;
+  } else {
+    t58 = $[106];
+  }
+  const t59 = isAdmin ? "true" : values_0.config?.editCollections === "own" ? "own" : values_0.config?.editCollections ? "true" : "false";
+  let t60;
+  let t61;
+  let t62;
+  if ($[107] === Symbol.for("react.memo_cache_sentinel")) {
+    t60 = /* @__PURE__ */ jsx(SelectItem, { value: "true", children: " Yes " });
+    t61 = /* @__PURE__ */ jsx(SelectItem, { value: "false", children: " No " });
+    t62 = /* @__PURE__ */ jsx(SelectItem, { value: "own", children: " Only his/her own " });
+    $[107] = t60;
+    $[108] = t61;
+    $[109] = t62;
+  } else {
+    t60 = $[107];
+    t61 = $[108];
+    t62 = $[109];
+  }
+  let t63;
+  if ($[110] !== t56 || $[111] !== t57 || $[112] !== t58 || $[113] !== t59) {
+    t63 = /* @__PURE__ */ jsxs(Select, { size: "large", fullWidth: true, error: t56, id: "editCollections", name: "editCollections", label: "Edit collections", disabled: t57, position: "item-aligned", onChange: t58, value: t59, renderValue: _temp5$1, children: [
+      t60,
+      t61,
+      t62
+    ] });
+    $[110] = t56;
+    $[111] = t57;
+    $[112] = t58;
+    $[113] = t59;
+    $[114] = t63;
+  } else {
+    t63 = $[114];
+  }
+  const t64 = touched.config && Boolean(errors_0.config) ? errors_0.config : "Can the user edit collections";
+  let t65;
+  if ($[115] !== t64) {
+    t65 = /* @__PURE__ */ jsx(FieldCaption, { children: t64 });
+    $[115] = t64;
+    $[116] = t65;
+  } else {
+    t65 = $[116];
+  }
+  let t66;
+  if ($[117] !== t63 || $[118] !== t65) {
+    t66 = /* @__PURE__ */ jsxs("div", { className: "col-span-12 md:col-span-4", children: [
+      t63,
+      t65
+    ] });
+    $[117] = t63;
+    $[118] = t65;
+    $[119] = t66;
+  } else {
+    t66 = $[119];
+  }
+  const t67 = touched.config && Boolean(errors_0.config);
+  const t68 = isAdmin || !editable;
+  let t69;
+  if ($[120] !== setFieldValue) {
+    t69 = (event_1) => setFieldValue("config.deleteCollections", event_1.target.value === "own" ? "own" : event_1.target.value === "true");
+    $[120] = setFieldValue;
+    $[121] = t69;
+  } else {
+    t69 = $[121];
+  }
+  const t70 = isAdmin ? "true" : values_0.config?.deleteCollections === "own" ? "own" : values_0.config?.deleteCollections ? "true" : "false";
+  let t71;
+  let t72;
+  let t73;
+  if ($[122] === Symbol.for("react.memo_cache_sentinel")) {
+    t71 = /* @__PURE__ */ jsx(SelectItem, { value: "true", children: " Yes " });
+    t72 = /* @__PURE__ */ jsx(SelectItem, { value: "false", children: " No " });
+    t73 = /* @__PURE__ */ jsx(SelectItem, { value: "own", children: " Only his/her own " });
+    $[122] = t71;
+    $[123] = t72;
+    $[124] = t73;
+  } else {
+    t71 = $[122];
+    t72 = $[123];
+    t73 = $[124];
+  }
+  let t74;
+  if ($[125] !== t67 || $[126] !== t68 || $[127] !== t69 || $[128] !== t70) {
+    t74 = /* @__PURE__ */ jsxs(Select, { size: "large", fullWidth: true, error: t67, id: "deleteCollections", name: "deleteCollections", label: "Delete collections", disabled: t68, position: "item-aligned", onChange: t69, value: t70, renderValue: _temp6$1, children: [
+      t71,
+      t72,
+      t73
+    ] });
+    $[125] = t67;
+    $[126] = t68;
+    $[127] = t69;
+    $[128] = t70;
+    $[129] = t74;
+  } else {
+    t74 = $[129];
+  }
+  const t75 = touched.config && Boolean(errors_0.config) ? errors_0.config : "Can the user delete collections";
+  let t76;
+  if ($[130] !== t75) {
+    t76 = /* @__PURE__ */ jsx(FieldCaption, { children: t75 });
+    $[130] = t75;
+    $[131] = t76;
+  } else {
+    t76 = $[131];
+  }
+  let t77;
+  if ($[132] !== t74 || $[133] !== t76) {
+    t77 = /* @__PURE__ */ jsxs("div", { className: "col-span-12 md:col-span-4", children: [
+      t74,
+      t76
+    ] });
+    $[132] = t74;
+    $[133] = t76;
+    $[134] = t77;
+  } else {
+    t77 = $[134];
+  }
+  let t78;
+  if ($[135] !== t14 || $[136] !== t21 || $[137] !== t45 || $[138] !== t55 || $[139] !== t66 || $[140] !== t77) {
+    t78 = /* @__PURE__ */ jsx(DialogContent, { className: "flex-grow", children: /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-12 gap-8", children: [
+      t14,
+      t21,
+      t45,
+      t55,
+      t66,
+      t77
+    ] }) });
+    $[135] = t14;
+    $[136] = t21;
+    $[137] = t45;
+    $[138] = t55;
+    $[139] = t66;
+    $[140] = t77;
+    $[141] = t78;
+  } else {
+    t78 = $[141];
+  }
+  let t79;
+  if ($[142] !== savingError) {
+    t79 = savingError && /* @__PURE__ */ jsx(Typography, { className: "text-red-500 dark:text-red-500", children: savingError.message ?? "There was an error saving this role" });
+    $[142] = savingError;
+    $[143] = t79;
+  } else {
+    t79 = $[143];
+  }
+  let t80;
+  if ($[144] !== handleClose) {
+    t80 = /* @__PURE__ */ jsx(Button, { variant: "text", onClick: () => {
+      handleClose();
+    }, children: "Cancel" });
+    $[144] = handleClose;
+    $[145] = t80;
+  } else {
+    t80 = $[145];
+  }
+  const t81 = !dirty;
+  let t82;
+  if ($[146] === Symbol.for("react.memo_cache_sentinel")) {
+    t82 = /* @__PURE__ */ jsx(CheckIcon, {});
+    $[146] = t82;
+  } else {
+    t82 = $[146];
+  }
+  const t83 = isNewRole ? "Create role" : "Update";
+  let t84;
+  if ($[147] !== isSubmitting || $[148] !== t81 || $[149] !== t83) {
+    t84 = /* @__PURE__ */ jsx(LoadingButton, { variant: "filled", color: "primary", type: "submit", disabled: t81, loading: isSubmitting, startIcon: t82, children: t83 });
+    $[147] = isSubmitting;
+    $[148] = t81;
+    $[149] = t83;
+    $[150] = t84;
+  } else {
+    t84 = $[150];
+  }
+  let t85;
+  if ($[151] !== t79 || $[152] !== t80 || $[153] !== t84) {
+    t85 = /* @__PURE__ */ jsxs(DialogActions, { position: "sticky", children: [
+      t79,
+      t80,
+      t84
+    ] });
+    $[151] = t79;
+    $[152] = t80;
+    $[153] = t84;
+    $[154] = t85;
+  } else {
+    t85 = $[154];
+  }
+  let t86;
+  if ($[155] !== formex.handleSubmit || $[156] !== t78 || $[157] !== t85) {
+    t86 = /* @__PURE__ */ jsxs("form", { noValidate: true, autoComplete: "off", onSubmit: formex.handleSubmit, style: t7, children: [
+      t8,
+      t78,
+      t85
+    ] });
+    $[155] = formex.handleSubmit;
+    $[156] = t78;
+    $[157] = t85;
+    $[158] = t86;
+  } else {
+    t86 = $[158];
+  }
+  let t87;
+  if ($[159] !== formex || $[160] !== t86) {
+    t87 = /* @__PURE__ */ jsx(Formex, { value: formex, children: t86 });
+    $[159] = formex;
+    $[160] = t86;
+    $[161] = t87;
+  } else {
+    t87 = $[161];
+  }
+  let t88;
+  if ($[162] !== open || $[163] !== t87) {
+    t88 = /* @__PURE__ */ jsx(Dialog, { open, maxWidth: "4xl", children: t87 });
+    $[162] = open;
+    $[163] = t87;
+    $[164] = t88;
+  } else {
+    t88 = $[164];
+  }
+  return t88;
 }
-const Se = [
-  {
-    id: "admin",
-    name: "Admin",
-    isAdmin: !0
-  },
-  {
-    id: "editor",
-    name: "Editor",
-    isAdmin: !1,
-    defaultPermissions: {
-      read: !0,
-      create: !0,
-      edit: !0,
-      delete: !0
-    },
-    config: {
-      createCollections: !0,
-      editCollections: "own",
-      deleteCollections: "own"
-    }
+function _temp6$1(value_1) {
+  return value_1 === "own" ? "Own" : value_1 === "true" ? "Yes" : "No";
+}
+function _temp5$1(value_0) {
+  return value_0 === "own" ? "Own" : value_0 === "true" ? "Yes" : "No";
+}
+function _temp4$1(value) {
+  return value === "true" ? "Yes" : "No";
+}
+function _temp3$1(values) {
+  return RoleYupSchema.validate(values, {
+    abortEarly: false
+  }).then(_temp$2).catch(_temp2$1);
+}
+function _temp2$1(e_1) {
+  const errors = {};
+  e_1.inner.forEach((error) => {
+    errors[error.path] = error.message;
+  });
+  return errors;
+}
+function _temp$2() {
+  return {};
+}
+const DEFAULT_ROLES = [{
+  id: "admin",
+  name: "Admin",
+  isAdmin: true
+}, {
+  id: "editor",
+  name: "Editor",
+  isAdmin: false,
+  defaultPermissions: {
+    read: true,
+    create: true,
+    edit: true,
+    delete: true
   },
-  {
-    id: "viewer",
-    name: "Viewer",
-    isAdmin: !1,
-    defaultPermissions: {
-      read: !0,
-      create: !1,
-      edit: !1,
-      delete: !1
-    }
+  config: {
+    createCollections: true,
+    editCollections: "own",
+    deleteCollections: "own"
   }
-];
-function Xe({
-  onRoleClicked: t,
-  editable: r
-}) {
+}, {
+  id: "viewer",
+  name: "Viewer",
+  isAdmin: false,
+  defaultPermissions: {
+    read: true,
+    create: false,
+    edit: false,
+    delete: false
+  }
+}];
+function RolesTable(t0) {
+  const $ = c(25);
   const {
-    roles: n,
-    saveRole: l,
-    deleteRole: i,
-    allowDefaultRolesCreation: m
-  } = j(), [f, v] = P(void 0), [R, w] = P(!1);
-  return /* @__PURE__ */ s(
-    "div",
-    {
-      className: "w-full overflow-auto",
-      children: [
-        /* @__PURE__ */ s(re, { children: [
-          /* @__PURE__ */ s(ie, { children: [
-            /* @__PURE__ */ e(d, { header: !0, className: "w-16" }),
-            /* @__PURE__ */ e(d, { header: !0, children: "Role" }),
-            /* @__PURE__ */ e(d, { header: !0, className: "items-center", children: "Is Admin" }),
-            /* @__PURE__ */ e(d, { header: !0, children: "Default permissions" })
-          ] }),
-          /* @__PURE__ */ s(oe, { children: [
-            n && n.map((c) => {
-              const S = c.isAdmin || c.defaultPermissions?.create, U = c.isAdmin || c.defaultPermissions?.read, a = c.isAdmin || c.defaultPermissions?.edit, C = c.isAdmin || c.defaultPermissions?.delete;
-              return /* @__PURE__ */ s(
-                W,
-                {
-                  onClick: () => {
-                    t(c);
-                  },
-                  children: [
-                    /* @__PURE__ */ e(d, { style: { width: "64px" }, children: !c.isAdmin && /* @__PURE__ */ e(V, { title: "Delete this role", children: /* @__PURE__ */ e(
-                      ye,
-                      {
-                        size: "small",
-                        disabled: !r,
-                        onClick: (y) => (y.stopPropagation(), v(c)),
-                        children: /* @__PURE__ */ e(be, {})
-                      }
-                    ) }) }),
-                    /* @__PURE__ */ e(d, { children: /* @__PURE__ */ e(X, { role: c }) }),
-                    /* @__PURE__ */ e(d, { className: "items-center", children: /* @__PURE__ */ e(I, { checked: c.isAdmin ?? !1 }) }),
-                    /* @__PURE__ */ e(d, { children: /* @__PURE__ */ s("ul", { children: [
-                      S && /* @__PURE__ */ e("li", { children: "Create" }),
-                      U && /* @__PURE__ */ e("li", { children: "Read" }),
-                      a && /* @__PURE__ */ e("li", { children: "Update" }),
-                      C && /* @__PURE__ */ e("li", { children: "Delete" })
-                    ] }) })
-                  ]
-                },
-                c.name
-              );
-            }),
-            (!n || n.length === 0) && /* @__PURE__ */ e(W, { children: /* @__PURE__ */ e(d, { colspan: 4, children: /* @__PURE__ */ s(Ne, { className: "flex flex-col gap-4 my-8 items-center", children: [
-              /* @__PURE__ */ e(A, { variant: "label", children: "You don't have any roles yet." }),
-              m && /* @__PURE__ */ e(
-                O,
-                {
-                  variant: "outlined",
-                  onClick: () => {
-                    Se.forEach((c) => {
-                      l(c);
-                    });
-                  },
-                  children: "Create default roles"
-                }
-              )
-            ] }) }) })
-          ] })
-        ] }),
-        /* @__PURE__ */ e(
-          xe,
-          {
-            open: !!f,
-            loading: R,
-            onAccept: () => {
-              f && (w(!0), i(f).then(() => {
-                v(void 0);
-              }).finally(() => {
-                w(!1);
-              }));
-            },
-            onCancel: () => {
-              v(void 0);
-            },
-            title: /* @__PURE__ */ e(K, { children: "Delete?" }),
-            body: /* @__PURE__ */ e(K, { children: "Are you sure you want to delete this role?" })
-          }
-        )
-      ]
-    }
-  );
+    onRoleClicked,
+    editable
+  } = t0;
+  const {
+    roles,
+    saveRole,
+    deleteRole,
+    allowDefaultRolesCreation
+  } = useUserManagement();
+  const [roleToBeDeleted, setRoleToBeDeleted] = useState(void 0);
+  const [deleteInProgress, setDeleteInProgress] = useState(false);
+  let t1;
+  if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
+    t1 = /* @__PURE__ */ jsxs(TableHeader, { children: [
+      /* @__PURE__ */ jsx(TableCell, { header: true, className: "w-16" }),
+      /* @__PURE__ */ jsx(TableCell, { header: true, children: "Role" }),
+      /* @__PURE__ */ jsx(TableCell, { header: true, className: "items-center", children: "Is Admin" }),
+      /* @__PURE__ */ jsx(TableCell, { header: true, children: "Default permissions" })
+    ] });
+    $[0] = t1;
+  } else {
+    t1 = $[0];
+  }
+  let t2;
+  if ($[1] !== editable || $[2] !== onRoleClicked || $[3] !== roles) {
+    t2 = roles && roles.map((role) => {
+      const canCreateAll = role.isAdmin || role.defaultPermissions?.create;
+      const canReadAll = role.isAdmin || role.defaultPermissions?.read;
+      const canUpdateAll = role.isAdmin || role.defaultPermissions?.edit;
+      const canDeleteAll = role.isAdmin || role.defaultPermissions?.delete;
+      return /* @__PURE__ */ jsxs(TableRow, { onClick: () => {
+        onRoleClicked(role);
+      }, children: [
+        /* @__PURE__ */ jsx(TableCell, { style: {
+          width: "64px"
+        }, children: !role.isAdmin && /* @__PURE__ */ jsx(Tooltip, { asChild: true, title: "Delete this role", children: /* @__PURE__ */ jsx(IconButton, { size: "small", disabled: !editable, onClick: (event) => {
+          event.stopPropagation();
+          return setRoleToBeDeleted(role);
+        }, children: /* @__PURE__ */ jsx(DeleteIcon, {}) }) }) }),
+        /* @__PURE__ */ jsx(TableCell, { children: /* @__PURE__ */ jsx(RoleChip, { role }) }),
+        /* @__PURE__ */ jsx(TableCell, { className: "items-center", children: /* @__PURE__ */ jsx(Checkbox, { checked: role.isAdmin ?? false }) }),
+        /* @__PURE__ */ jsx(TableCell, { children: /* @__PURE__ */ jsxs("ul", { children: [
+          canCreateAll && /* @__PURE__ */ jsx("li", { children: "Create" }),
+          canReadAll && /* @__PURE__ */ jsx("li", { children: "Read" }),
+          canUpdateAll && /* @__PURE__ */ jsx("li", { children: "Update" }),
+          canDeleteAll && /* @__PURE__ */ jsx("li", { children: "Delete" })
+        ] }) })
+      ] }, role.name);
+    });
+    $[1] = editable;
+    $[2] = onRoleClicked;
+    $[3] = roles;
+    $[4] = t2;
+  } else {
+    t2 = $[4];
+  }
+  let t3;
+  if ($[5] !== allowDefaultRolesCreation || $[6] !== roles || $[7] !== saveRole) {
+    t3 = (!roles || roles.length === 0) && /* @__PURE__ */ jsx(TableRow, { children: /* @__PURE__ */ jsx(TableCell, { colspan: 4, children: /* @__PURE__ */ jsxs(CenteredView, { className: "flex flex-col gap-4 my-8 items-center", children: [
+      /* @__PURE__ */ jsx(Typography, { variant: "label", children: "You don't have any roles yet." }),
+      allowDefaultRolesCreation && /* @__PURE__ */ jsx(Button, { variant: "outlined", onClick: () => {
+        DEFAULT_ROLES.forEach((role_0) => {
+          saveRole(role_0);
+        });
+      }, children: "Create default roles" })
+    ] }) }) });
+    $[5] = allowDefaultRolesCreation;
+    $[6] = roles;
+    $[7] = saveRole;
+    $[8] = t3;
+  } else {
+    t3 = $[8];
+  }
+  let t4;
+  if ($[9] !== t2 || $[10] !== t3) {
+    t4 = /* @__PURE__ */ jsxs(Table, { className: "w-full", children: [
+      t1,
+      /* @__PURE__ */ jsxs(TableBody, { children: [
+        t2,
+        t3
+      ] })
+    ] });
+    $[9] = t2;
+    $[10] = t3;
+    $[11] = t4;
+  } else {
+    t4 = $[11];
+  }
+  const t5 = Boolean(roleToBeDeleted);
+  let t6;
+  if ($[12] !== deleteRole || $[13] !== roleToBeDeleted) {
+    t6 = () => {
+      if (roleToBeDeleted) {
+        setDeleteInProgress(true);
+        deleteRole(roleToBeDeleted).then(() => {
+          setRoleToBeDeleted(void 0);
+        }).finally(() => {
+          setDeleteInProgress(false);
+        });
+      }
+    };
+    $[12] = deleteRole;
+    $[13] = roleToBeDeleted;
+    $[14] = t6;
+  } else {
+    t6 = $[14];
+  }
+  let t7;
+  let t8;
+  let t9;
+  if ($[15] === Symbol.for("react.memo_cache_sentinel")) {
+    t7 = () => {
+      setRoleToBeDeleted(void 0);
+    };
+    t8 = /* @__PURE__ */ jsx(Fragment, { children: "Delete?" });
+    t9 = /* @__PURE__ */ jsx(Fragment, { children: "Are you sure you want to delete this role?" });
+    $[15] = t7;
+    $[16] = t8;
+    $[17] = t9;
+  } else {
+    t7 = $[15];
+    t8 = $[16];
+    t9 = $[17];
+  }
+  let t10;
+  if ($[18] !== deleteInProgress || $[19] !== t5 || $[20] !== t6) {
+    t10 = /* @__PURE__ */ jsx(ConfirmationDialog, { open: t5, loading: deleteInProgress, onAccept: t6, onCancel: t7, title: t8, body: t9 });
+    $[18] = deleteInProgress;
+    $[19] = t5;
+    $[20] = t6;
+    $[21] = t10;
+  } else {
+    t10 = $[21];
+  }
+  let t11;
+  if ($[22] !== t10 || $[23] !== t4) {
+    t11 = /* @__PURE__ */ jsxs("div", { className: "w-full overflow-auto", children: [
+      t4,
+      t10
+    ] });
+    $[22] = t10;
+    $[23] = t4;
+    $[24] = t11;
+  } else {
+    t11 = $[24];
+  }
+  return t11;
 }
-const Ze = F.memo(
-  function({ children: r }) {
-    const { collections: n } = _e(), [l, i] = P(!1), [m, f] = P(), { canEditRoles: v } = j(), R = k((c) => {
-      i(!0), f(c);
-    }, []);
-    return /* @__PURE__ */ s(Ue, { className: "w-full flex flex-col py-4 gap-4", maxWidth: "6xl", children: [
-      r,
-      /* @__PURE__ */ s("div", { className: "flex items-center mt-12", children: [
-        /* @__PURE__ */ e(
-          A,
-          {
-            gutterBottom: !0,
-            variant: "h4",
-            className: "flex-grow",
-            component: "h4",
-            children: "Roles"
-          }
-        ),
-        /* @__PURE__ */ e(V, { title: v ? void 0 : "Update plans to customise roles", children: /* @__PURE__ */ e(
-          O,
-          {
-            size: "large",
-            disabled: !v,
-            startIcon: /* @__PURE__ */ e(le, {}),
-            onClick: () => i(!0),
-            children: "Add role"
-          }
-        ) })
-      ] }),
-      /* @__PURE__ */ e(Xe, { onRoleClicked: R, editable: !!v }),
-      /* @__PURE__ */ e(
-        Qe,
-        {
-          open: l,
-          role: m,
-          editable: v,
-          collections: n,
-          handleClose: () => {
-            f(void 0), i(!1);
-          }
-        },
-        m?.id ?? "new"
-      )
+const RolesView = React.memo(function RolesView2(t0) {
+  const $ = c(23);
+  const {
+    children
+  } = t0;
+  const {
+    collections
+  } = useNavigationController();
+  const [dialogOpen, setDialogOpen] = useState(false);
+  const [selectedRole, setSelectedRole] = useState();
+  const {
+    canEditRoles
+  } = useUserManagement();
+  let t1;
+  if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
+    t1 = (user) => {
+      setDialogOpen(true);
+      setSelectedRole(user);
+    };
+    $[0] = t1;
+  } else {
+    t1 = $[0];
+  }
+  const onRoleClicked = t1;
+  let t2;
+  if ($[1] === Symbol.for("react.memo_cache_sentinel")) {
+    t2 = () => {
+      setSelectedRole(void 0);
+      setDialogOpen(false);
+    };
+    $[1] = t2;
+  } else {
+    t2 = $[1];
+  }
+  const handleClose = t2;
+  let t3;
+  if ($[2] === Symbol.for("react.memo_cache_sentinel")) {
+    t3 = /* @__PURE__ */ jsx(Typography, { gutterBottom: true, variant: "h4", className: "flex-grow", component: "h4", children: "Roles" });
+    $[2] = t3;
+  } else {
+    t3 = $[2];
+  }
+  const t4 = !canEditRoles ? "Update plans to customise roles" : void 0;
+  const t5 = !canEditRoles;
+  let t6;
+  let t7;
+  if ($[3] === Symbol.for("react.memo_cache_sentinel")) {
+    t6 = /* @__PURE__ */ jsx(AddIcon, {});
+    t7 = () => setDialogOpen(true);
+    $[3] = t6;
+    $[4] = t7;
+  } else {
+    t6 = $[3];
+    t7 = $[4];
+  }
+  let t8;
+  if ($[5] !== t5) {
+    t8 = /* @__PURE__ */ jsx(Button, { size: "large", disabled: t5, startIcon: t6, onClick: t7, children: "Add role" });
+    $[5] = t5;
+    $[6] = t8;
+  } else {
+    t8 = $[6];
+  }
+  let t9;
+  if ($[7] !== t4 || $[8] !== t8) {
+    t9 = /* @__PURE__ */ jsxs("div", { className: "flex items-center mt-12", children: [
+      t3,
+      /* @__PURE__ */ jsx(Tooltip, { asChild: true, title: t4, children: t8 })
     ] });
+    $[7] = t4;
+    $[8] = t8;
+    $[9] = t9;
+  } else {
+    t9 = $[9];
+  }
+  const t10 = Boolean(canEditRoles);
+  let t11;
+  if ($[10] !== t10) {
+    t11 = /* @__PURE__ */ jsx(RolesTable, { onRoleClicked, editable: t10 });
+    $[10] = t10;
+    $[11] = t11;
+  } else {
+    t11 = $[11];
   }
-), en = M.object().shape({
-  displayName: M.string().required("Required"),
-  email: M.string().email().required("Required"),
-  roles: M.array().min(1)
+  const t12 = selectedRole?.id ?? "new";
+  let t13;
+  if ($[12] !== canEditRoles || $[13] !== collections || $[14] !== dialogOpen || $[15] !== selectedRole || $[16] !== t12) {
+    t13 = /* @__PURE__ */ jsx(RolesDetailsForm, { open: dialogOpen, role: selectedRole, editable: canEditRoles, collections, handleClose }, t12);
+    $[12] = canEditRoles;
+    $[13] = collections;
+    $[14] = dialogOpen;
+    $[15] = selectedRole;
+    $[16] = t12;
+    $[17] = t13;
+  } else {
+    t13 = $[17];
+  }
+  let t14;
+  if ($[18] !== children || $[19] !== t11 || $[20] !== t13 || $[21] !== t9) {
+    t14 = /* @__PURE__ */ jsxs(Container, { className: "w-full flex flex-col py-4 gap-4", maxWidth: "6xl", children: [
+      children,
+      t9,
+      t11,
+      t13
+    ] });
+    $[18] = children;
+    $[19] = t11;
+    $[20] = t13;
+    $[21] = t9;
+    $[22] = t14;
+  } else {
+    t14 = $[22];
+  }
+  return t14;
+});
+const UserYupSchema = Yup.object().shape({
+  displayName: Yup.string().required("Required"),
+  email: Yup.string().email().required("Required"),
+  roles: Yup.array().min(1)
 });
-function nn(t, r, n, l, i) {
-  const m = n.filter((w) => w.roles?.map((c) => c.id).includes("admin")), f = t.roles?.map((w) => w.id).includes("admin");
-  if ((!i || !je(i.roles ?? [], r.roles ?? [])) && !f)
+function canUserBeEdited(loggedUser, user, users, roles, prevUser) {
+  const admins = users.filter((u) => u.roles?.map((r) => r.id).includes("admin"));
+  const loggedUserIsAdmin = loggedUser.roles?.map((r) => r.id).includes("admin");
+  const didRolesChange = !prevUser || !areRolesEqual(prevUser.roles ?? [], user.roles ?? []);
+  if (didRolesChange && !loggedUserIsAdmin) {
     throw new Error("Only admins can change roles");
-  if (i && i.roles?.map((w) => w.id).includes("admin") && !r.roles?.map((w) => w.id).includes("admin") && m.length === 1)
+  }
+  const adminRoleRemoved = prevUser && prevUser.roles?.map((r) => r.id).includes("admin") && !user.roles?.map((r) => r.id).includes("admin");
+  if (adminRoleRemoved && admins.length === 1) {
     throw new Error("There must be at least one admin");
-  return !0;
+  }
+  return true;
 }
-function tn({
-  open: t,
-  user: r,
-  handleClose: n
-}) {
-  const l = se(), {
-    user: i
-  } = ae(), {
-    saveUser: m,
-    users: f,
-    roles: v
-  } = j(), R = !r, w = k((h) => {
-    if (!i)
-      throw new Error("Logged user not found");
-    try {
-      return nn(i, h, f, v, r), m(h);
-    } catch (x) {
-      return Promise.reject(x);
-    }
-  }, [v, m, r, f, i]), c = Re({
-    initialValues: r ?? {
+function UserDetailsForm(t0) {
+  const $ = c(74);
+  const {
+    open,
+    user: userProp,
+    handleClose
+  } = t0;
+  const snackbarController = useSnackbarController();
+  const {
+    user: loggedInUser
+  } = useAuthController();
+  const {
+    saveUser,
+    users,
+    roles
+  } = useUserManagement();
+  const isNewUser = !userProp;
+  let t1;
+  if ($[0] !== loggedInUser || $[1] !== roles || $[2] !== saveUser || $[3] !== userProp || $[4] !== users) {
+    t1 = (savedUser) => {
+      if (!loggedInUser) {
+        throw new Error("Logged user not found");
+      }
+      try {
+        canUserBeEdited(loggedInUser, savedUser, users, roles, userProp);
+        return saveUser(savedUser);
+      } catch (t210) {
+        const e = t210;
+        return Promise.reject(e);
+      }
+    };
+    $[0] = loggedInUser;
+    $[1] = roles;
+    $[2] = saveUser;
+    $[3] = userProp;
+    $[4] = users;
+    $[5] = t1;
+  } else {
+    t1 = $[5];
+  }
+  const onUserUpdated = t1;
+  let t2;
+  if ($[6] !== roles || $[7] !== userProp) {
+    t2 = userProp ?? {
       displayName: "",
       email: "",
-      roles: v.filter((h) => h.id === "editor")
-    },
-    validation: (h) => en.validate(h, { abortEarly: !1 }).then(() => ({})).catch((x) => x.inner.reduce((D, T) => (D[T.path] = T.message, D), {})),
-    onSubmit: (h, x) => w(h).then(() => {
-      n(), x.resetForm({
-        values: h
+      roles: roles.filter(_temp$1)
+    };
+    $[6] = roles;
+    $[7] = userProp;
+    $[8] = t2;
+  } else {
+    t2 = $[8];
+  }
+  let t3;
+  if ($[9] !== handleClose || $[10] !== onUserUpdated || $[11] !== snackbarController) {
+    t3 = (user, formexController) => onUserUpdated(user).then(() => {
+      handleClose();
+      formexController.resetForm({
+        values: user
       });
-    }).catch((D) => {
-      l.open({
+    }).catch((e_1) => {
+      snackbarController.open({
         type: "error",
-        message: D.message
+        message: e_1.message
       });
-    })
-  }), {
-    isSubmitting: S,
-    touched: U,
-    handleChange: a,
-    values: C,
-    errors: y,
-    setFieldValue: b,
-    dirty: _,
-    handleSubmit: z,
-    submitCount: u
-  } = c;
-  return /* @__PURE__ */ e(
-    fe,
-    {
-      open: t,
-      onOpenChange: (h) => h ? void 0 : n(),
-      maxWidth: "4xl",
-      children: /* @__PURE__ */ e(De, { value: c, children: /* @__PURE__ */ s(
-        "form",
-        {
-          onSubmit: z,
-          autoComplete: "off",
-          noValidate: !0,
-          style: {
-            display: "flex",
-            flexDirection: "column",
-            position: "relative",
-            height: "100%"
-          },
-          children: [
-            /* @__PURE__ */ s(ge, { className: "h-full flex-grow", children: [
-              /* @__PURE__ */ e(
-                "div",
-                {
-                  className: "flex flex-row pt-4 pb-4",
-                  children: /* @__PURE__ */ e(
-                    A,
-                    {
-                      variant: "h4",
-                      className: "flex-grow",
-                      children: "User"
-                    }
-                  )
-                }
-              ),
-              /* @__PURE__ */ s("div", { className: "grid grid-cols-12 gap-8", children: [
-                /* @__PURE__ */ s("div", { className: "col-span-12", children: [
-                  /* @__PURE__ */ e(
-                    Q,
-                    {
-                      name: "displayName",
-                      required: !0,
-                      error: u > 0 && !!y.displayName,
-                      value: C.displayName ?? "",
-                      onChange: a,
-                      "aria-describedby": "name-helper-text",
-                      label: "Name"
-                    }
-                  ),
-                  /* @__PURE__ */ e(B, { children: u > 0 && y.displayName ? y.displayName : "Name of this user" })
-                ] }),
-                /* @__PURE__ */ s("div", { className: "col-span-12", children: [
-                  /* @__PURE__ */ e(
-                    Q,
-                    {
-                      required: !0,
-                      error: u > 0 && !!y.email,
-                      name: "email",
-                      value: C.email ?? "",
-                      onChange: a,
-                      "aria-describedby": "email-helper-text",
-                      label: "Email"
-                    }
-                  ),
-                  /* @__PURE__ */ e(B, { children: u > 0 && y.email ? y.email : "Email of this user" })
-                ] }),
-                /* @__PURE__ */ e("div", { className: "col-span-12", children: /* @__PURE__ */ e(
-                  Te,
-                  {
-                    label: "Roles",
-                    value: C.roles?.map((h) => h.id) ?? [],
-                    onMultiValueChange: (h) => b("roles", h.map((x) => v.find((D) => D.id === x))),
-                    renderValue: (h) => {
-                      const x = v.find((D) => D.id === h);
-                      return x ? /* @__PURE__ */ e("div", { className: "flex flex-wrap space-x-2 space-y-2", children: /* @__PURE__ */ e(X, { role: x }, x?.id) }) : null;
-                    },
-                    children: v.map((h) => /* @__PURE__ */ e(
-                      Le,
-                      {
-                        value: h.id,
-                        children: /* @__PURE__ */ e(X, { role: h }, h?.id)
-                      },
-                      h.id
-                    ))
-                  }
-                ) })
-              ] })
-            ] }),
-            /* @__PURE__ */ s(Ce, { children: [
-              /* @__PURE__ */ e(
-                O,
-                {
-                  variant: "text",
-                  onClick: () => {
-                    n();
-                  },
-                  children: "Cancel"
-                }
-              ),
-              /* @__PURE__ */ e(
-                ve,
-                {
-                  variant: "filled",
-                  color: "primary",
-                  type: "submit",
-                  disabled: !_,
-                  loading: S,
-                  startIcon: /* @__PURE__ */ e(we, {}),
-                  children: R ? "Create user" : "Update"
-                }
-              )
-            ] })
-          ]
-        }
-      ) })
-    }
-  );
+    });
+    $[9] = handleClose;
+    $[10] = onUserUpdated;
+    $[11] = snackbarController;
+    $[12] = t3;
+  } else {
+    t3 = $[12];
+  }
+  let t4;
+  if ($[13] !== t2 || $[14] !== t3) {
+    t4 = {
+      initialValues: t2,
+      validation: _temp5,
+      onSubmit: t3
+    };
+    $[13] = t2;
+    $[14] = t3;
+    $[15] = t4;
+  } else {
+    t4 = $[15];
+  }
+  const formex = useCreateFormex(t4);
+  const {
+    isSubmitting,
+    handleChange,
+    values: values_0,
+    errors,
+    setFieldValue,
+    dirty,
+    handleSubmit,
+    submitCount
+  } = formex;
+  let t5;
+  if ($[16] !== handleClose) {
+    t5 = (open_0) => !open_0 ? handleClose() : void 0;
+    $[16] = handleClose;
+    $[17] = t5;
+  } else {
+    t5 = $[17];
+  }
+  let t6;
+  let t7;
+  if ($[18] === Symbol.for("react.memo_cache_sentinel")) {
+    t6 = {
+      display: "flex",
+      flexDirection: "column",
+      position: "relative",
+      height: "100%"
+    };
+    t7 = /* @__PURE__ */ jsx(DialogTitle, { variant: "h4", gutterBottom: false, children: "User" });
+    $[18] = t6;
+    $[19] = t7;
+  } else {
+    t6 = $[18];
+    t7 = $[19];
+  }
+  const t8 = submitCount > 0 && Boolean(errors.displayName);
+  const t9 = values_0.displayName ?? "";
+  let t10;
+  if ($[20] !== handleChange || $[21] !== t8 || $[22] !== t9) {
+    t10 = /* @__PURE__ */ jsx(TextField, { name: "displayName", required: true, error: t8, value: t9, onChange: handleChange, "aria-describedby": "name-helper-text", label: "Name" });
+    $[20] = handleChange;
+    $[21] = t8;
+    $[22] = t9;
+    $[23] = t10;
+  } else {
+    t10 = $[23];
+  }
+  const t11 = submitCount > 0 && Boolean(errors.displayName) ? errors.displayName : "Name of this user";
+  let t12;
+  if ($[24] !== t11) {
+    t12 = /* @__PURE__ */ jsx(FieldCaption, { children: t11 });
+    $[24] = t11;
+    $[25] = t12;
+  } else {
+    t12 = $[25];
+  }
+  let t13;
+  if ($[26] !== t10 || $[27] !== t12) {
+    t13 = /* @__PURE__ */ jsxs("div", { className: "col-span-12", children: [
+      t10,
+      t12
+    ] });
+    $[26] = t10;
+    $[27] = t12;
+    $[28] = t13;
+  } else {
+    t13 = $[28];
+  }
+  const t14 = submitCount > 0 && Boolean(errors.email);
+  const t15 = values_0.email ?? "";
+  let t16;
+  if ($[29] !== handleChange || $[30] !== t14 || $[31] !== t15) {
+    t16 = /* @__PURE__ */ jsx(TextField, { required: true, error: t14, name: "email", value: t15, onChange: handleChange, "aria-describedby": "email-helper-text", label: "Email" });
+    $[29] = handleChange;
+    $[30] = t14;
+    $[31] = t15;
+    $[32] = t16;
+  } else {
+    t16 = $[32];
+  }
+  const t17 = submitCount > 0 && Boolean(errors.email) ? errors.email : "Email of this user";
+  let t18;
+  if ($[33] !== t17) {
+    t18 = /* @__PURE__ */ jsx(FieldCaption, { children: t17 });
+    $[33] = t17;
+    $[34] = t18;
+  } else {
+    t18 = $[34];
+  }
+  let t19;
+  if ($[35] !== t16 || $[36] !== t18) {
+    t19 = /* @__PURE__ */ jsxs("div", { className: "col-span-12", children: [
+      t16,
+      t18
+    ] });
+    $[35] = t16;
+    $[36] = t18;
+    $[37] = t19;
+  } else {
+    t19 = $[37];
+  }
+  let t20;
+  if ($[38] !== values_0.roles) {
+    t20 = values_0.roles?.map(_temp6) ?? [];
+    $[38] = values_0.roles;
+    $[39] = t20;
+  } else {
+    t20 = $[39];
+  }
+  let t21;
+  if ($[40] !== roles || $[41] !== setFieldValue) {
+    t21 = (value) => setFieldValue("roles", value.map((id) => roles.find((r_1) => r_1.id === id)));
+    $[40] = roles;
+    $[41] = setFieldValue;
+    $[42] = t21;
+  } else {
+    t21 = $[42];
+  }
+  let t22;
+  if ($[43] !== roles) {
+    t22 = roles.map(_temp7);
+    $[43] = roles;
+    $[44] = t22;
+  } else {
+    t22 = $[44];
+  }
+  let t23;
+  if ($[45] !== t20 || $[46] !== t21 || $[47] !== t22) {
+    t23 = /* @__PURE__ */ jsx("div", { className: "col-span-12", children: /* @__PURE__ */ jsx(MultiSelect, { className: "w-full", label: "Roles", value: t20, onValueChange: t21, children: t22 }) });
+    $[45] = t20;
+    $[46] = t21;
+    $[47] = t22;
+    $[48] = t23;
+  } else {
+    t23 = $[48];
+  }
+  let t24;
+  if ($[49] !== t13 || $[50] !== t19 || $[51] !== t23) {
+    t24 = /* @__PURE__ */ jsx(DialogContent, { className: "h-full flex-grow", children: /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-12 gap-8", children: [
+      t13,
+      t19,
+      t23
+    ] }) });
+    $[49] = t13;
+    $[50] = t19;
+    $[51] = t23;
+    $[52] = t24;
+  } else {
+    t24 = $[52];
+  }
+  let t25;
+  if ($[53] !== handleClose) {
+    t25 = /* @__PURE__ */ jsx(Button, { variant: "text", onClick: () => {
+      handleClose();
+    }, children: "Cancel" });
+    $[53] = handleClose;
+    $[54] = t25;
+  } else {
+    t25 = $[54];
+  }
+  const t26 = !dirty;
+  let t27;
+  if ($[55] === Symbol.for("react.memo_cache_sentinel")) {
+    t27 = /* @__PURE__ */ jsx(CheckIcon, {});
+    $[55] = t27;
+  } else {
+    t27 = $[55];
+  }
+  const t28 = isNewUser ? "Create user" : "Update";
+  let t29;
+  if ($[56] !== isSubmitting || $[57] !== t26 || $[58] !== t28) {
+    t29 = /* @__PURE__ */ jsx(LoadingButton, { variant: "filled", color: "primary", type: "submit", disabled: t26, loading: isSubmitting, startIcon: t27, children: t28 });
+    $[56] = isSubmitting;
+    $[57] = t26;
+    $[58] = t28;
+    $[59] = t29;
+  } else {
+    t29 = $[59];
+  }
+  let t30;
+  if ($[60] !== t25 || $[61] !== t29) {
+    t30 = /* @__PURE__ */ jsxs(DialogActions, { children: [
+      t25,
+      t29
+    ] });
+    $[60] = t25;
+    $[61] = t29;
+    $[62] = t30;
+  } else {
+    t30 = $[62];
+  }
+  let t31;
+  if ($[63] !== handleSubmit || $[64] !== t24 || $[65] !== t30) {
+    t31 = /* @__PURE__ */ jsxs("form", { onSubmit: handleSubmit, autoComplete: "off", noValidate: true, style: t6, children: [
+      t7,
+      t24,
+      t30
+    ] });
+    $[63] = handleSubmit;
+    $[64] = t24;
+    $[65] = t30;
+    $[66] = t31;
+  } else {
+    t31 = $[66];
+  }
+  let t32;
+  if ($[67] !== formex || $[68] !== t31) {
+    t32 = /* @__PURE__ */ jsx(Formex, { value: formex, children: t31 });
+    $[67] = formex;
+    $[68] = t31;
+    $[69] = t32;
+  } else {
+    t32 = $[69];
+  }
+  let t33;
+  if ($[70] !== open || $[71] !== t32 || $[72] !== t5) {
+    t33 = /* @__PURE__ */ jsx(Dialog, { open, onOpenChange: t5, maxWidth: "4xl", children: t32 });
+    $[70] = open;
+    $[71] = t32;
+    $[72] = t5;
+    $[73] = t33;
+  } else {
+    t33 = $[73];
+  }
+  return t33;
+}
+function _temp7(userRole) {
+  return /* @__PURE__ */ jsx(MultiSelectItem, { value: userRole.id, children: /* @__PURE__ */ jsx(RoleChip, { role: userRole }, userRole?.id) }, userRole.id);
+}
+function _temp6(r_0) {
+  return r_0.id;
+}
+function _temp5(values) {
+  return UserYupSchema.validate(values, {
+    abortEarly: false
+  }).then(_temp2).catch(_temp4);
+}
+function _temp4(e_0) {
+  return e_0.inner.reduce(_temp3, {});
+}
+function _temp3(acc, error) {
+  acc[error.path] = error.message;
+  return acc;
 }
-function rn({ onUserClicked: t }) {
+function _temp2() {
+  return {};
+}
+function _temp$1(r) {
+  return r.id === "editor";
+}
+function UsersTable(t0) {
+  const $ = c(28);
+  const {
+    onUserClicked
+  } = t0;
   const {
-    users: r,
-    saveUser: n,
-    deleteUser: l
-  } = j(), i = ae(), m = se(), f = Ve(), v = f?.locale ? $e[f?.locale] : void 0, R = f?.dateTimeFormat ?? Me, [w, c] = P(void 0), [S, U] = P(!1);
-  return /* @__PURE__ */ s("div", { className: "overflow-auto", children: [
-    /* @__PURE__ */ s(re, { children: [
-      /* @__PURE__ */ s(ie, { children: [
-        /* @__PURE__ */ e(d, { className: "truncate w-16" }),
-        /* @__PURE__ */ e(d, { children: "ID" }),
-        /* @__PURE__ */ e(d, { children: "Email" }),
-        /* @__PURE__ */ e(d, { children: "Name" }),
-        /* @__PURE__ */ e(d, { children: "Roles" }),
-        /* @__PURE__ */ e(d, { children: "Created on" })
-      ] }),
-      /* @__PURE__ */ s(oe, { children: [
-        r && r.map((a) => {
-          const C = a.roles, y = a.created_on ? Oe(a.created_on, R, { locale: v }) : "";
-          return /* @__PURE__ */ s(
-            W,
-            {
-              onClick: () => {
-                t(a);
-              },
-              children: [
-                /* @__PURE__ */ e(d, { className: "w-10", children: /* @__PURE__ */ e(V, { title: "Delete this user", children: /* @__PURE__ */ e(
-                  ye,
-                  {
-                    size: "small",
-                    onClick: (b) => (b.stopPropagation(), c(a)),
-                    children: /* @__PURE__ */ e(be, {})
-                  }
-                ) }) }),
-                /* @__PURE__ */ e(d, { children: a.uid }),
-                /* @__PURE__ */ e(d, { children: a.email }),
-                /* @__PURE__ */ e(d, { className: "font-medium align-left", children: a.displayName }),
-                /* @__PURE__ */ e(d, { className: "align-left", children: C ? /* @__PURE__ */ e("div", { className: "flex flex-wrap gap-2", children: C.map(
-                  (b) => /* @__PURE__ */ e(X, { role: b }, b?.id)
-                ) }) : null }),
-                /* @__PURE__ */ e(d, { children: y })
-              ]
-            },
-            "row_" + a.uid
-          );
-        }),
-        (!r || r.length === 0) && /* @__PURE__ */ e(W, { children: /* @__PURE__ */ e(d, { colspan: 6, children: /* @__PURE__ */ s(Ne, { className: "flex flex-col gap-4 my-8 items-center", children: [
-          /* @__PURE__ */ e(A, { variant: "label", children: "There are no users yet" }),
-          /* @__PURE__ */ e(
-            O,
-            {
-              variant: "outlined",
-              onClick: () => {
-                if (!i.user?.uid)
-                  throw Error("UsersTable, authController misconfiguration");
-                n({
-                  uid: i.user?.uid,
-                  email: i.user?.email,
-                  displayName: i.user?.displayName,
-                  photoURL: i.user?.photoURL,
-                  providerId: i.user?.providerId,
-                  isAnonymous: i.user?.isAnonymous,
-                  roles: [{ id: "admin", name: "Admin" }],
-                  created_on: /* @__PURE__ */ new Date()
-                }).then(() => {
-                  m.open({
-                    type: "success",
-                    message: "User added successfully"
-                  });
-                }).catch((a) => {
-                  m.open({
-                    type: "error",
-                    message: "Error adding user: " + a.message
-                  });
-                });
-              },
-              children: "Add the logged user as an admin"
-            }
-          )
-        ] }) }) })
+    users,
+    saveUser,
+    deleteUser
+  } = useUserManagement();
+  const authController = useAuthController();
+  const snackbarController = useSnackbarController();
+  const customizationController = useCustomizationController();
+  const dateUtilsLocale = customizationController?.locale ? locales[customizationController?.locale] : void 0;
+  const dateFormat = customizationController?.dateTimeFormat ?? defaultDateFormat;
+  const [userToBeDeleted, setUserToBeDeleted] = useState(void 0);
+  const [deleteInProgress, setDeleteInProgress] = useState(false);
+  let t1;
+  if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
+    t1 = /* @__PURE__ */ jsxs(TableHeader, { children: [
+      /* @__PURE__ */ jsx(TableCell, { className: "truncate w-16" }),
+      /* @__PURE__ */ jsx(TableCell, { children: "Email" }),
+      /* @__PURE__ */ jsx(TableCell, { children: "Name" }),
+      /* @__PURE__ */ jsx(TableCell, { children: "Roles" }),
+      /* @__PURE__ */ jsx(TableCell, { children: "Created on" })
+    ] });
+    $[0] = t1;
+  } else {
+    t1 = $[0];
+  }
+  let t2;
+  if ($[1] !== dateFormat || $[2] !== dateUtilsLocale || $[3] !== onUserClicked || $[4] !== users) {
+    t2 = users && users.map((user) => {
+      const userRoles = user.roles;
+      const formattedDate = user.created_on ? format(user.created_on, dateFormat, {
+        locale: dateUtilsLocale
+      }) : "";
+      return /* @__PURE__ */ jsxs(TableRow, { onClick: () => {
+        onUserClicked(user);
+      }, children: [
+        /* @__PURE__ */ jsx(TableCell, { className: "w-10", children: /* @__PURE__ */ jsx(Tooltip, { asChild: true, title: "Delete this user", children: /* @__PURE__ */ jsx(IconButton, { size: "small", onClick: (event) => {
+          event.stopPropagation();
+          return setUserToBeDeleted(user);
+        }, children: /* @__PURE__ */ jsx(DeleteIcon, {}) }) }) }),
+        /* @__PURE__ */ jsx(TableCell, { children: user.email }),
+        /* @__PURE__ */ jsx(TableCell, { className: "font-medium align-left", children: user.displayName }),
+        /* @__PURE__ */ jsx(TableCell, { className: "align-left", children: userRoles ? /* @__PURE__ */ jsx("div", { className: "flex flex-wrap gap-2", children: userRoles.map(_temp) }) : null }),
+        /* @__PURE__ */ jsx(TableCell, { children: formattedDate })
+      ] }, "row_" + user.uid);
+    });
+    $[1] = dateFormat;
+    $[2] = dateUtilsLocale;
+    $[3] = onUserClicked;
+    $[4] = users;
+    $[5] = t2;
+  } else {
+    t2 = $[5];
+  }
+  let t3;
+  if ($[6] !== authController || $[7] !== saveUser || $[8] !== snackbarController || $[9] !== users) {
+    t3 = (!users || users.length === 0) && /* @__PURE__ */ jsx(TableRow, { children: /* @__PURE__ */ jsx(TableCell, { colspan: 6, children: /* @__PURE__ */ jsxs(CenteredView, { className: "flex flex-col gap-4 my-8 items-center", children: [
+      /* @__PURE__ */ jsx(Typography, { variant: "label", children: "There are no users yet" }),
+      /* @__PURE__ */ jsx(Button, { variant: "outlined", onClick: () => {
+        if (!authController.user?.uid) {
+          throw Error("UsersTable, authController misconfiguration");
+        }
+        saveUser({
+          uid: authController.user?.uid,
+          email: authController.user?.email,
+          displayName: authController.user?.displayName,
+          photoURL: authController.user?.photoURL,
+          providerId: authController.user?.providerId,
+          isAnonymous: authController.user?.isAnonymous,
+          roles: [{
+            id: "admin",
+            name: "Admin"
+          }],
+          created_on: /* @__PURE__ */ new Date()
+        }).then(() => {
+          snackbarController.open({
+            type: "success",
+            message: "User added successfully"
+          });
+        }).catch((error) => {
+          snackbarController.open({
+            type: "error",
+            message: "Error adding user: " + error.message
+          });
+        });
+      }, children: "Add the logged user as an admin" })
+    ] }) }) });
+    $[6] = authController;
+    $[7] = saveUser;
+    $[8] = snackbarController;
+    $[9] = users;
+    $[10] = t3;
+  } else {
+    t3 = $[10];
+  }
+  let t4;
+  if ($[11] !== t2 || $[12] !== t3) {
+    t4 = /* @__PURE__ */ jsxs(Table, { className: "w-full", children: [
+      t1,
+      /* @__PURE__ */ jsxs(TableBody, { children: [
+        t2,
+        t3
       ] })
-    ] }),
-    /* @__PURE__ */ e(
-      xe,
-      {
-        open: !!w,
-        loading: S,
-        onAccept: () => {
-          w && (U(!0), l(w).then(() => {
-            c(void 0);
-          }).catch((a) => {
-            m.open({
-              type: "error",
-              message: "Error deleting user: " + a.message
-            });
-          }).finally(() => {
-            U(!1);
-          }));
-        },
-        onCancel: () => {
-          c(void 0);
-        },
-        title: /* @__PURE__ */ e(K, { children: "Delete?" }),
-        body: /* @__PURE__ */ e(K, { children: "Are you sure you want to delete this user?" })
+    ] });
+    $[11] = t2;
+    $[12] = t3;
+    $[13] = t4;
+  } else {
+    t4 = $[13];
+  }
+  const t5 = Boolean(userToBeDeleted);
+  let t6;
+  if ($[14] !== deleteUser || $[15] !== snackbarController || $[16] !== userToBeDeleted) {
+    t6 = () => {
+      if (userToBeDeleted) {
+        setDeleteInProgress(true);
+        deleteUser(userToBeDeleted).then(() => {
+          setUserToBeDeleted(void 0);
+        }).catch((error_0) => {
+          snackbarController.open({
+            type: "error",
+            message: "Error deleting user: " + error_0.message
+          });
+        }).finally(() => {
+          setDeleteInProgress(false);
+        });
       }
-    )
-  ] });
+    };
+    $[14] = deleteUser;
+    $[15] = snackbarController;
+    $[16] = userToBeDeleted;
+    $[17] = t6;
+  } else {
+    t6 = $[17];
+  }
+  let t7;
+  let t8;
+  let t9;
+  if ($[18] === Symbol.for("react.memo_cache_sentinel")) {
+    t7 = () => {
+      setUserToBeDeleted(void 0);
+    };
+    t8 = /* @__PURE__ */ jsx(Fragment, { children: "Delete?" });
+    t9 = /* @__PURE__ */ jsx(Fragment, { children: "Are you sure you want to delete this user?" });
+    $[18] = t7;
+    $[19] = t8;
+    $[20] = t9;
+  } else {
+    t7 = $[18];
+    t8 = $[19];
+    t9 = $[20];
+  }
+  let t10;
+  if ($[21] !== deleteInProgress || $[22] !== t5 || $[23] !== t6) {
+    t10 = /* @__PURE__ */ jsx(ConfirmationDialog, { open: t5, loading: deleteInProgress, onAccept: t6, onCancel: t7, title: t8, body: t9 });
+    $[21] = deleteInProgress;
+    $[22] = t5;
+    $[23] = t6;
+    $[24] = t10;
+  } else {
+    t10 = $[24];
+  }
+  let t11;
+  if ($[25] !== t10 || $[26] !== t4) {
+    t11 = /* @__PURE__ */ jsxs("div", { className: "overflow-auto", children: [
+      t4,
+      t10
+    ] });
+    $[25] = t10;
+    $[26] = t4;
+    $[27] = t11;
+  } else {
+    t11 = $[27];
+  }
+  return t11;
 }
-const on = function({ children: r }) {
-  const [n, l] = P(), [i, m] = P(), { users: f, usersLimit: v } = j(), R = v !== void 0 && f && f.length >= v, w = k((S) => {
-    m(S), l(!0);
-  }, []), c = k(() => {
-    l(!1), m(void 0);
-  }, []);
-  return /* @__PURE__ */ s(Ue, { className: "w-full flex flex-col py-4 gap-4", maxWidth: "6xl", children: [
-    r,
-    /* @__PURE__ */ s(
-      "div",
-      {
-        className: "flex items-center mt-12",
-        children: [
-          /* @__PURE__ */ e(
-            A,
-            {
-              gutterBottom: !0,
-              variant: "h4",
-              className: "flex-grow",
-              component: "h4",
-              children: "Users"
-            }
-          ),
-          /* @__PURE__ */ e(
-            O,
-            {
-              size: "large",
-              disabled: R,
-              startIcon: /* @__PURE__ */ e(le, {}),
-              onClick: () => l(!0),
-              children: "Add user"
-            }
-          )
-        ]
-      }
-    ),
-    /* @__PURE__ */ e(rn, { onUserClicked: w }),
-    /* @__PURE__ */ e(
-      tn,
-      {
-        open: n ?? !1,
-        user: i,
-        handleClose: c
-      },
-      i?.uid ?? "new"
-    )
-  ] });
+function _temp(userRole) {
+  return /* @__PURE__ */ jsx(RoleChip, { role: userRole }, userRole?.id);
+}
+const UsersView = function UsersView2(t0) {
+  const $ = c(16);
+  const {
+    children
+  } = t0;
+  const [dialogOpen, setDialogOpen] = useState();
+  const [selectedUser, setSelectedUser] = useState();
+  const {
+    users,
+    usersLimit
+  } = useUserManagement();
+  const reachedUsersLimit = usersLimit !== void 0 && users && users.length >= usersLimit;
+  let t1;
+  if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
+    t1 = (user) => {
+      setSelectedUser(user);
+      setDialogOpen(true);
+    };
+    $[0] = t1;
+  } else {
+    t1 = $[0];
+  }
+  const onUserClicked = t1;
+  let t2;
+  if ($[1] === Symbol.for("react.memo_cache_sentinel")) {
+    t2 = () => {
+      setDialogOpen(false);
+      setSelectedUser(void 0);
+    };
+    $[1] = t2;
+  } else {
+    t2 = $[1];
+  }
+  const handleClose = t2;
+  let t3;
+  if ($[2] === Symbol.for("react.memo_cache_sentinel")) {
+    t3 = /* @__PURE__ */ jsx(Typography, { gutterBottom: true, variant: "h4", className: "flex-grow", component: "h4", children: "Users" });
+    $[2] = t3;
+  } else {
+    t3 = $[2];
+  }
+  let t4;
+  let t5;
+  if ($[3] === Symbol.for("react.memo_cache_sentinel")) {
+    t4 = /* @__PURE__ */ jsx(AddIcon, {});
+    t5 = () => setDialogOpen(true);
+    $[3] = t4;
+    $[4] = t5;
+  } else {
+    t4 = $[3];
+    t5 = $[4];
+  }
+  let t6;
+  if ($[5] !== reachedUsersLimit) {
+    t6 = /* @__PURE__ */ jsxs("div", { className: "flex items-center mt-12", children: [
+      t3,
+      /* @__PURE__ */ jsx(Button, { size: "large", disabled: reachedUsersLimit, startIcon: t4, onClick: t5, children: "Add user" })
+    ] });
+    $[5] = reachedUsersLimit;
+    $[6] = t6;
+  } else {
+    t6 = $[6];
+  }
+  let t7;
+  if ($[7] === Symbol.for("react.memo_cache_sentinel")) {
+    t7 = /* @__PURE__ */ jsx(UsersTable, { onUserClicked });
+    $[7] = t7;
+  } else {
+    t7 = $[7];
+  }
+  const t8 = selectedUser?.uid ?? "new";
+  const t9 = dialogOpen ?? false;
+  let t10;
+  if ($[8] !== selectedUser || $[9] !== t8 || $[10] !== t9) {
+    t10 = /* @__PURE__ */ jsx(UserDetailsForm, { open: t9, user: selectedUser, handleClose }, t8);
+    $[8] = selectedUser;
+    $[9] = t8;
+    $[10] = t9;
+    $[11] = t10;
+  } else {
+    t10 = $[11];
+  }
+  let t11;
+  if ($[12] !== children || $[13] !== t10 || $[14] !== t6) {
+    t11 = /* @__PURE__ */ jsxs(Container, { className: "w-full flex flex-col py-4 gap-4", maxWidth: "6xl", children: [
+      children,
+      t6,
+      t7,
+      t10
+    ] });
+    $[12] = children;
+    $[13] = t10;
+    $[14] = t6;
+    $[15] = t11;
+  } else {
+    t11 = $[15];
+  }
+  return t11;
 };
-function Nn({ userManagement: t }) {
-  const r = t.users.length === 0, n = t.roles.length === 0;
-  return {
-    key: "user_management",
-    loading: t.loading,
-    homePage: {
-      additionalChildrenStart: r || n ? /* @__PURE__ */ e(
-        ln,
-        {
-          noUsers: r,
-          noRoles: n,
-          userManagement: t
-        }
-      ) : void 0
-    },
-    provider: {
-      Component: He,
+function useUserManagementPlugin(t0) {
+  const $ = c(12);
+  const {
+    userManagement
+  } = t0;
+  const noUsers = userManagement.users.length === 0;
+  const noRoles = userManagement.roles.length === 0;
+  let t1;
+  if ($[0] !== noRoles || $[1] !== noUsers || $[2] !== userManagement) {
+    t1 = noUsers || noRoles ? /* @__PURE__ */ jsx(IntroWidget, { noUsers, noRoles, userManagement }) : void 0;
+    $[0] = noRoles;
+    $[1] = noUsers;
+    $[2] = userManagement;
+    $[3] = t1;
+  } else {
+    t1 = $[3];
+  }
+  let t2;
+  if ($[4] !== t1) {
+    t2 = {
+      additionalChildrenStart: t1
+    };
+    $[4] = t1;
+    $[5] = t2;
+  } else {
+    t2 = $[5];
+  }
+  let t3;
+  if ($[6] !== userManagement) {
+    t3 = {
+      Component: UserManagementProvider,
       props: {
-        userManagement: t
+        userManagement
       }
-    }
-  };
+    };
+    $[6] = userManagement;
+    $[7] = t3;
+  } else {
+    t3 = $[7];
+  }
+  let t4;
+  if ($[8] !== t2 || $[9] !== t3 || $[10] !== userManagement.loading) {
+    t4 = {
+      key: "user_management",
+      loading: userManagement.loading,
+      homePage: t2,
+      provider: t3
+    };
+    $[8] = t2;
+    $[9] = t3;
+    $[10] = userManagement.loading;
+    $[11] = t4;
+  } else {
+    t4 = $[11];
+  }
+  return t4;
 }
-function ln({
-  noUsers: t,
-  noRoles: r,
-  userManagement: n
-}) {
-  const l = ae(), i = se();
-  return /* @__PURE__ */ s(
-    pe,
-    {
-      className: "my-4 flex flex-col px-4 py-6 bg-white dark:bg-slate-800 gap-2",
-      children: [
-        /* @__PURE__ */ e(A, { variant: "subtitle2", className: "uppercase", children: "Create your users and roles" }),
-        /* @__PURE__ */ e(A, { children: "You have no users or roles defined. You can create default roles and add the current user as admin." }),
-        /* @__PURE__ */ s(O, { onClick: () => {
-          if (!l.user?.uid)
-            throw Error("UsersTable, authController misconfiguration");
-          t && n.saveUser({
-            uid: l.user?.uid,
-            email: l.user?.email,
-            displayName: l.user?.displayName,
-            photoURL: l.user?.photoURL,
-            providerId: l.user?.providerId,
-            isAnonymous: l.user?.isAnonymous,
-            roles: [{
-              id: "admin",
-              name: "Admin"
-            }],
-            created_on: /* @__PURE__ */ new Date()
-          }).then(() => {
-            i.open({
-              type: "success",
-              message: "User added successfully"
-            });
-          }).catch((f) => {
-            i.open({
-              type: "error",
-              message: "Error adding user: " + f.message
-            });
-          }), r && Se.forEach((f) => {
-            n.saveRole(f);
+function IntroWidget(t0) {
+  const $ = c(17);
+  const {
+    noUsers,
+    noRoles,
+    userManagement
+  } = t0;
+  const authController = useAuthController();
+  const snackbarController = useSnackbarController();
+  const buttonLabel = noUsers && noRoles ? "Create default roles and add current user as admin" : noUsers ? "Add current user as admin" : noRoles ? "Create default roles" : void 0;
+  let t1;
+  let t2;
+  if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
+    t1 = /* @__PURE__ */ jsx(Typography, { variant: "subtitle2", className: "uppercase", children: "Create your users and roles" });
+    t2 = /* @__PURE__ */ jsx(Typography, { children: "You have no users or roles defined. You can create default roles and add the current user as admin." });
+    $[0] = t1;
+    $[1] = t2;
+  } else {
+    t1 = $[0];
+    t2 = $[1];
+  }
+  let t3;
+  if ($[2] !== authController.user?.displayName || $[3] !== authController.user?.email || $[4] !== authController.user?.isAnonymous || $[5] !== authController.user?.photoURL || $[6] !== authController.user?.providerId || $[7] !== authController.user?.uid || $[8] !== noRoles || $[9] !== noUsers || $[10] !== snackbarController || $[11] !== userManagement) {
+    t3 = () => {
+      if (!authController.user?.uid) {
+        throw Error("UsersTable, authController misconfiguration");
+      }
+      if (noUsers) {
+        userManagement.saveUser({
+          uid: authController.user?.uid,
+          email: authController.user?.email,
+          displayName: authController.user?.displayName,
+          photoURL: authController.user?.photoURL,
+          providerId: authController.user?.providerId,
+          isAnonymous: authController.user?.isAnonymous,
+          roles: [{
+            id: "admin",
+            name: "Admin"
+          }],
+          created_on: /* @__PURE__ */ new Date()
+        }).then(() => {
+          snackbarController.open({
+            type: "success",
+            message: "User added successfully"
           });
-        }, children: [
-          /* @__PURE__ */ e(le, {}),
-          t && r ? "Create default roles and add current user as admin" : t ? "Add current user as admin" : r ? "Create default roles" : void 0
-        ] })
-      ]
-    }
-  );
+        }).catch((error) => {
+          snackbarController.open({
+            type: "error",
+            message: "Error adding user: " + error.message
+          });
+        });
+      }
+      if (noRoles) {
+        DEFAULT_ROLES.forEach((role) => {
+          userManagement.saveRole(role);
+        });
+      }
+    };
+    $[2] = authController.user?.displayName;
+    $[3] = authController.user?.email;
+    $[4] = authController.user?.isAnonymous;
+    $[5] = authController.user?.photoURL;
+    $[6] = authController.user?.providerId;
+    $[7] = authController.user?.uid;
+    $[8] = noRoles;
+    $[9] = noUsers;
+    $[10] = snackbarController;
+    $[11] = userManagement;
+    $[12] = t3;
+  } else {
+    t3 = $[12];
+  }
+  let t4;
+  if ($[13] === Symbol.for("react.memo_cache_sentinel")) {
+    t4 = /* @__PURE__ */ jsx(AddIcon, {});
+    $[13] = t4;
+  } else {
+    t4 = $[13];
+  }
+  let t5;
+  if ($[14] !== buttonLabel || $[15] !== t3) {
+    t5 = /* @__PURE__ */ jsxs(Paper, { className: "my-4 flex flex-col px-4 py-6 bg-white dark:bg-surface-accent-800 gap-2", children: [
+      t1,
+      t2,
+      /* @__PURE__ */ jsxs(Button, { onClick: t3, children: [
+        t4,
+        buttonLabel
+      ] })
+    ] });
+    $[14] = buttonLabel;
+    $[15] = t3;
+    $[16] = t5;
+  } else {
+    t5 = $[16];
+  }
+  return t5;
 }
-const Un = [
-  {
-    path: "users",
-    name: "CMS Users",
-    group: "Admin",
-    icon: "face",
-    view: /* @__PURE__ */ e(on, {})
-  },
-  {
-    path: "roles",
-    name: "Roles",
-    group: "Admin",
-    icon: "gpp_good",
-    view: /* @__PURE__ */ e(Ze, {})
-  }
-];
+const userManagementAdminViews = [{
+  path: "users",
+  name: "CMS Users",
+  group: "Admin",
+  icon: "face",
+  view: /* @__PURE__ */ jsx(UsersView, {})
+}, {
+  path: "roles",
+  name: "Roles",
+  group: "Admin",
+  icon: "gpp_good",
+  view: /* @__PURE__ */ jsx(RolesView, {})
+}];
 export {
-  ln as IntroWidget,
-  fn as RESERVED_GROUPS,
-  X as RoleChip,
-  Ke as RoleYupSchema,
-  Qe as RolesDetailsForm,
-  Xe as RolesTable,
-  Ze as RolesView,
-  tn as UserDetailsForm,
-  Ee as UserManagementContext,
-  He as UserManagementProvider,
-  en as UserYupSchema,
-  rn as UsersTable,
-  on as UsersView,
-  je as areRolesEqual,
-  pn as cacheDelegatedLoginToken,
-  vn as clearDelegatedLoginTokensCache,
-  wn as darkenColor,
-  Cn as getDelegatedLoginTokenFromCache,
-  gn as getUserRoles,
-  yn as hexToRgbaWithOpacity,
-  Ye as resolveUserRolePermissions,
-  bn as useFirestoreUserManagement,
-  j as useUserManagement,
-  Nn as useUserManagementPlugin,
-  Un as userManagementAdminViews
+  IntroWidget,
+  RESERVED_GROUPS,
+  RoleChip,
+  RoleYupSchema,
+  RolesDetailsForm,
+  RolesTable,
+  RolesView,
+  UserDetailsForm,
+  UserManagementContext,
+  UserManagementProvider,
+  UserYupSchema,
+  UsersTable,
+  UsersView,
+  areRolesEqual,
+  cacheDelegatedLoginToken,
+  clearDelegatedLoginTokensCache,
+  darkenColor,
+  getDelegatedLoginTokenFromCache,
+  getUserRoles,
+  hexToRgbaWithOpacity,
+  resolveUserRolePermissions,
+  useBuildUserManagement,
+  useUserManagement,
+  useUserManagementPlugin,
+  userManagementAdminViews
 };
 //# sourceMappingURL=index.es.js.map