@firecms/user_management 3.2.0 → 3.3.0-canary.451aa49

package/dist/index.es.js

@@ -2099,7 +2099,7 @@ function canUserBeEdited(loggedUser, user, users, roles, t, prevUser) {
   return true;
 }
 function UserDetailsForm(t0) {
-  const $ = c(112);
+  const $ = c(114);
   const {
     open,
     user: userProp,
@@ -2241,7 +2241,7 @@ function UserDetailsForm(t0) {
   }
   let t9;
   if ($[25] !== t8) {
-    t9 = /* @__PURE__ */ jsx(DialogTitle, { variant: "h4", gutterBottom: false, children: t8 });
+    t9 = /* @__PURE__ */ jsx("div", { children: t8 });
     $[25] = t8;
     $[26] = t9;
   } else {
@@ -2249,17 +2249,16 @@ function UserDetailsForm(t0) {
   }
   let t10;
   if ($[27] !== isNewUser || $[28] !== snackbarController || $[29] !== t || $[30] !== userProp) {
-    t10 = !isNewUser && userProp?.uid && /* @__PURE__ */ jsx("div", { className: "col-span-12", children: /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
-      /* @__PURE__ */ jsx("span", { className: "text-sm text-surface-accent-600 dark:text-surface-accent-400", children: t("user_id") }),
-      /* @__PURE__ */ jsx(Chip, { size: "small", children: userProp.uid }),
-      /* @__PURE__ */ jsx(Tooltip, { title: t("copy"), children: /* @__PURE__ */ jsx(IconButton, { size: "small", onClick: () => {
+    t10 = !isNewUser && userProp?.uid && /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+      /* @__PURE__ */ jsx("span", { className: "text-xs font-mono text-surface-accent-500 dark:text-surface-accent-400 font-normal", children: userProp.uid }),
+      /* @__PURE__ */ jsx(Tooltip, { title: t("copy"), children: /* @__PURE__ */ jsx(IconButton, { size: "smallest", onClick: () => {
         navigator.clipboard.writeText(userProp.uid);
         snackbarController.open({
           type: "success",
           message: t("copied")
         });
-      }, children: /* @__PURE__ */ jsx(CopyIcon, { size: "small" }) }) })
-    ] }) });
+      }, children: /* @__PURE__ */ jsx(CopyIcon, { size: "smallest" }) }) })
+    ] });
     $[27] = isNewUser;
     $[28] = snackbarController;
     $[29] = t;
@@ -2268,262 +2267,272 @@ function UserDetailsForm(t0) {
   } else {
     t10 = $[31];
   }
-  const t11 = submitCount > 0 && Boolean(errors.displayName);
-  const t12 = values_0.displayName ?? "";
-  let t13;
-  if ($[32] !== t) {
-    t13 = t("name");
-    $[32] = t;
-    $[33] = t13;
+  let t11;
+  if ($[32] !== t10 || $[33] !== t9) {
+    t11 = /* @__PURE__ */ jsx(DialogTitle, { variant: "h4", gutterBottom: false, children: /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between", children: [
+      t9,
+      t10
+    ] }) });
+    $[32] = t10;
+    $[33] = t9;
+    $[34] = t11;
   } else {
-    t13 = $[33];
+    t11 = $[34];
   }
+  const t12 = submitCount > 0 && Boolean(errors.displayName);
+  const t13 = values_0.displayName ?? "";
   let t14;
-  if ($[34] !== handleChange || $[35] !== t11 || $[36] !== t12 || $[37] !== t13) {
-    t14 = /* @__PURE__ */ jsx(TextField, { name: "displayName", required: true, error: t11, value: t12, onChange: handleChange, "aria-describedby": "name-helper-text", label: t13 });
-    $[34] = handleChange;
-    $[35] = t11;
-    $[36] = t12;
-    $[37] = t13;
-    $[38] = t14;
+  if ($[35] !== t) {
+    t14 = t("name");
+    $[35] = t;
+    $[36] = t14;
   } else {
-    t14 = $[38];
+    t14 = $[36];
   }
   let t15;
-  if ($[39] !== errors || $[40] !== submitCount || $[41] !== t) {
-    t15 = submitCount > 0 && Boolean(errors.displayName) ? errors.displayName : t("name_of_this_user");
-    $[39] = errors;
-    $[40] = submitCount;
-    $[41] = t;
-    $[42] = t15;
+  if ($[37] !== handleChange || $[38] !== t12 || $[39] !== t13 || $[40] !== t14) {
+    t15 = /* @__PURE__ */ jsx(TextField, { name: "displayName", required: true, error: t12, value: t13, onChange: handleChange, "aria-describedby": "name-helper-text", label: t14 });
+    $[37] = handleChange;
+    $[38] = t12;
+    $[39] = t13;
+    $[40] = t14;
+    $[41] = t15;
   } else {
-    t15 = $[42];
+    t15 = $[41];
   }
   let t16;
-  if ($[43] !== t15) {
-    t16 = /* @__PURE__ */ jsx(FieldCaption, { children: t15 });
-    $[43] = t15;
-    $[44] = t16;
+  if ($[42] !== errors || $[43] !== submitCount || $[44] !== t) {
+    t16 = submitCount > 0 && Boolean(errors.displayName) ? errors.displayName : t("name_of_this_user");
+    $[42] = errors;
+    $[43] = submitCount;
+    $[44] = t;
+    $[45] = t16;
   } else {
-    t16 = $[44];
+    t16 = $[45];
   }
   let t17;
-  if ($[45] !== t14 || $[46] !== t16) {
-    t17 = /* @__PURE__ */ jsxs("div", { className: "col-span-12", children: [
-      t14,
-      t16
-    ] });
-    $[45] = t14;
+  if ($[46] !== t16) {
+    t17 = /* @__PURE__ */ jsx(FieldCaption, { children: t16 });
     $[46] = t16;
     $[47] = t17;
   } else {
     t17 = $[47];
   }
-  const t18 = submitCount > 0 && Boolean(errors.email);
-  const t19 = values_0.email ?? "";
-  let t20;
-  if ($[48] !== t) {
-    t20 = t("email");
-    $[48] = t;
-    $[49] = t20;
+  let t18;
+  if ($[48] !== t15 || $[49] !== t17) {
+    t18 = /* @__PURE__ */ jsxs("div", { className: "col-span-12", children: [
+      t15,
+      t17
+    ] });
+    $[48] = t15;
+    $[49] = t17;
+    $[50] = t18;
   } else {
-    t20 = $[49];
+    t18 = $[50];
   }
+  const t19 = submitCount > 0 && Boolean(errors.email);
+  const t20 = values_0.email ?? "";
   let t21;
-  if ($[50] !== handleChange || $[51] !== t18 || $[52] !== t19 || $[53] !== t20) {
-    t21 = /* @__PURE__ */ jsx(TextField, { required: true, error: t18, name: "email", value: t19, onChange: handleChange, "aria-describedby": "email-helper-text", label: t20 });
-    $[50] = handleChange;
-    $[51] = t18;
-    $[52] = t19;
-    $[53] = t20;
-    $[54] = t21;
+  if ($[51] !== t) {
+    t21 = t("email");
+    $[51] = t;
+    $[52] = t21;
   } else {
-    t21 = $[54];
+    t21 = $[52];
   }
   let t22;
-  if ($[55] !== errors || $[56] !== submitCount || $[57] !== t) {
-    t22 = submitCount > 0 && Boolean(errors.email) ? errors.email : t("email_of_this_user");
-    $[55] = errors;
-    $[56] = submitCount;
-    $[57] = t;
-    $[58] = t22;
+  if ($[53] !== handleChange || $[54] !== t19 || $[55] !== t20 || $[56] !== t21) {
+    t22 = /* @__PURE__ */ jsx(TextField, { required: true, error: t19, name: "email", value: t20, onChange: handleChange, "aria-describedby": "email-helper-text", label: t21 });
+    $[53] = handleChange;
+    $[54] = t19;
+    $[55] = t20;
+    $[56] = t21;
+    $[57] = t22;
   } else {
-    t22 = $[58];
+    t22 = $[57];
   }
   let t23;
-  if ($[59] !== t22) {
-    t23 = /* @__PURE__ */ jsx(FieldCaption, { children: t22 });
-    $[59] = t22;
-    $[60] = t23;
+  if ($[58] !== errors || $[59] !== submitCount || $[60] !== t) {
+    t23 = submitCount > 0 && Boolean(errors.email) ? errors.email : t("email_of_this_user");
+    $[58] = errors;
+    $[59] = submitCount;
+    $[60] = t;
+    $[61] = t23;
   } else {
-    t23 = $[60];
+    t23 = $[61];
   }
   let t24;
-  if ($[61] !== t21 || $[62] !== t23) {
-    t24 = /* @__PURE__ */ jsxs("div", { className: "col-span-12", children: [
-      t21,
-      t23
-    ] });
-    $[61] = t21;
+  if ($[62] !== t23) {
+    t24 = /* @__PURE__ */ jsx(FieldCaption, { children: t23 });
     $[62] = t23;
     $[63] = t24;
   } else {
     t24 = $[63];
   }
   let t25;
-  if ($[64] !== t) {
-    t25 = t("roles");
-    $[64] = t;
-    $[65] = t25;
+  if ($[64] !== t22 || $[65] !== t24) {
+    t25 = /* @__PURE__ */ jsxs("div", { className: "col-span-12", children: [
+      t22,
+      t24
+    ] });
+    $[64] = t22;
+    $[65] = t24;
+    $[66] = t25;
   } else {
-    t25 = $[65];
+    t25 = $[66];
   }
   let t26;
-  if ($[66] !== values_0.roles) {
-    t26 = values_0.roles?.map(_temp5) ?? [];
-    $[66] = values_0.roles;
-    $[67] = t26;
+  if ($[67] !== t) {
+    t26 = t("roles");
+    $[67] = t;
+    $[68] = t26;
   } else {
-    t26 = $[67];
+    t26 = $[68];
   }
   let t27;
-  if ($[68] !== roles || $[69] !== setFieldValue) {
-    t27 = (value) => setFieldValue("roles", value.map((id) => roles.find((r_1) => r_1.id === id)));
-    $[68] = roles;
-    $[69] = setFieldValue;
+  if ($[69] !== values_0.roles) {
+    t27 = values_0.roles?.map(_temp5) ?? [];
+    $[69] = values_0.roles;
     $[70] = t27;
   } else {
     t27 = $[70];
   }
   let t28;
-  if ($[71] !== roles) {
-    t28 = roles.map(_temp6);
+  if ($[71] !== roles || $[72] !== setFieldValue) {
+    t28 = (value) => setFieldValue("roles", value.map((id) => roles.find((r_1) => r_1.id === id)));
     $[71] = roles;
-    $[72] = t28;
+    $[72] = setFieldValue;
+    $[73] = t28;
   } else {
-    t28 = $[72];
+    t28 = $[73];
   }
   let t29;
-  if ($[73] !== t25 || $[74] !== t26 || $[75] !== t27 || $[76] !== t28) {
-    t29 = /* @__PURE__ */ jsx("div", { className: "col-span-12", children: /* @__PURE__ */ jsx(MultiSelect, { className: "w-full", label: t25, value: t26, onValueChange: t27, children: t28 }) });
-    $[73] = t25;
-    $[74] = t26;
-    $[75] = t27;
-    $[76] = t28;
-    $[77] = t29;
+  if ($[74] !== roles) {
+    t29 = roles.map(_temp6);
+    $[74] = roles;
+    $[75] = t29;
   } else {
-    t29 = $[77];
+    t29 = $[75];
   }
   let t30;
-  if ($[78] !== t10 || $[79] !== t17 || $[80] !== t24 || $[81] !== t29) {
-    t30 = /* @__PURE__ */ jsx(DialogContent, { className: "h-full flex-grow", children: /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-12 gap-4", children: [
-      t10,
-      t17,
-      t24,
-      t29
-    ] }) });
-    $[78] = t10;
-    $[79] = t17;
-    $[80] = t24;
-    $[81] = t29;
-    $[82] = t30;
+  if ($[76] !== t26 || $[77] !== t27 || $[78] !== t28 || $[79] !== t29) {
+    t30 = /* @__PURE__ */ jsx("div", { className: "col-span-12", children: /* @__PURE__ */ jsx(MultiSelect, { className: "w-full", label: t26, value: t27, onValueChange: t28, children: t29 }) });
+    $[76] = t26;
+    $[77] = t27;
+    $[78] = t28;
+    $[79] = t29;
+    $[80] = t30;
   } else {
-    t30 = $[82];
+    t30 = $[80];
   }
   let t31;
-  if ($[83] !== handleClose) {
-    t31 = () => {
-      handleClose();
-    };
-    $[83] = handleClose;
+  if ($[81] !== t18 || $[82] !== t25 || $[83] !== t30) {
+    t31 = /* @__PURE__ */ jsx(DialogContent, { className: "h-full flex-grow", children: /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-12 gap-4", children: [
+      t18,
+      t25,
+      t30
+    ] }) });
+    $[81] = t18;
+    $[82] = t25;
+    $[83] = t30;
     $[84] = t31;
   } else {
     t31 = $[84];
   }
   let t32;
-  if ($[85] !== t) {
-    t32 = t("cancel");
-    $[85] = t;
+  if ($[85] !== handleClose) {
+    t32 = () => {
+      handleClose();
+    };
+    $[85] = handleClose;
     $[86] = t32;
   } else {
     t32 = $[86];
   }
   let t33;
-  if ($[87] !== t31 || $[88] !== t32) {
-    t33 = /* @__PURE__ */ jsx(Button, { variant: "text", onClick: t31, children: t32 });
-    $[87] = t31;
-    $[88] = t32;
-    $[89] = t33;
+  if ($[87] !== t) {
+    t33 = t("cancel");
+    $[87] = t;
+    $[88] = t33;
   } else {
-    t33 = $[89];
+    t33 = $[88];
   }
-  const t34 = !dirty;
-  let t35;
-  if ($[90] !== isNewUser || $[91] !== t) {
-    t35 = isNewUser ? t("create_user") : t("update");
-    $[90] = isNewUser;
-    $[91] = t;
-    $[92] = t35;
+  let t34;
+  if ($[89] !== t32 || $[90] !== t33) {
+    t34 = /* @__PURE__ */ jsx(Button, { variant: "text", onClick: t32, children: t33 });
+    $[89] = t32;
+    $[90] = t33;
+    $[91] = t34;
   } else {
-    t35 = $[92];
+    t34 = $[91];
   }
+  const t35 = !dirty;
   let t36;
-  if ($[93] !== isSubmitting || $[94] !== t34 || $[95] !== t35) {
-    t36 = /* @__PURE__ */ jsx(LoadingButton, { variant: "filled", type: "submit", disabled: t34, loading: isSubmitting, children: t35 });
-    $[93] = isSubmitting;
-    $[94] = t34;
-    $[95] = t35;
-    $[96] = t36;
+  if ($[92] !== isNewUser || $[93] !== t) {
+    t36 = isNewUser ? t("create_user") : t("update");
+    $[92] = isNewUser;
+    $[93] = t;
+    $[94] = t36;
   } else {
-    t36 = $[96];
+    t36 = $[94];
   }
   let t37;
-  if ($[97] !== t33 || $[98] !== t36) {
-    t37 = /* @__PURE__ */ jsxs(DialogActions, { children: [
-      t33,
-      t36
-    ] });
-    $[97] = t33;
-    $[98] = t36;
-    $[99] = t37;
+  if ($[95] !== isSubmitting || $[96] !== t35 || $[97] !== t36) {
+    t37 = /* @__PURE__ */ jsx(LoadingButton, { variant: "filled", type: "submit", disabled: t35, loading: isSubmitting, children: t36 });
+    $[95] = isSubmitting;
+    $[96] = t35;
+    $[97] = t36;
+    $[98] = t37;
   } else {
-    t37 = $[99];
+    t37 = $[98];
   }
   let t38;
-  if ($[100] !== handleSubmit || $[101] !== t30 || $[102] !== t37 || $[103] !== t9) {
-    t38 = /* @__PURE__ */ jsxs("form", { onSubmit: handleSubmit, autoComplete: "off", noValidate: true, style: t7, children: [
-      t9,
-      t30,
+  if ($[99] !== t34 || $[100] !== t37) {
+    t38 = /* @__PURE__ */ jsxs(DialogActions, { children: [
+      t34,
       t37
     ] });
-    $[100] = handleSubmit;
-    $[101] = t30;
-    $[102] = t37;
-    $[103] = t9;
-    $[104] = t38;
+    $[99] = t34;
+    $[100] = t37;
+    $[101] = t38;
   } else {
-    t38 = $[104];
+    t38 = $[101];
   }
   let t39;
-  if ($[105] !== formex || $[106] !== t38) {
-    t39 = /* @__PURE__ */ jsx(Formex, { value: formex, children: t38 });
-    $[105] = formex;
-    $[106] = t38;
-    $[107] = t39;
+  if ($[102] !== handleSubmit || $[103] !== t11 || $[104] !== t31 || $[105] !== t38) {
+    t39 = /* @__PURE__ */ jsxs("form", { onSubmit: handleSubmit, autoComplete: "off", noValidate: true, style: t7, children: [
+      t11,
+      t31,
+      t38
+    ] });
+    $[102] = handleSubmit;
+    $[103] = t11;
+    $[104] = t31;
+    $[105] = t38;
+    $[106] = t39;
   } else {
-    t39 = $[107];
+    t39 = $[106];
   }
   let t40;
-  if ($[108] !== open || $[109] !== t39 || $[110] !== t6) {
-    t40 = /* @__PURE__ */ jsx(Dialog, { open, onOpenChange: t6, maxWidth: "4xl", children: t39 });
-    $[108] = open;
-    $[109] = t39;
-    $[110] = t6;
+  if ($[107] !== formex || $[108] !== t39) {
+    t40 = /* @__PURE__ */ jsx(Formex, { value: formex, children: t39 });
+    $[107] = formex;
+    $[108] = t39;
+    $[109] = t40;
+  } else {
+    t40 = $[109];
+  }
+  let t41;
+  if ($[110] !== open || $[111] !== t40 || $[112] !== t6) {
+    t41 = /* @__PURE__ */ jsx(Dialog, { open, onOpenChange: t6, maxWidth: "4xl", children: t40 });
+    $[110] = open;
     $[111] = t40;
+    $[112] = t6;
+    $[113] = t41;
   } else {
-    t40 = $[111];
+    t41 = $[113];
   }
-  return t40;
+  return t41;
 }
 function _temp6(userRole) {
   return /* @__PURE__ */ jsx(MultiSelectItem, { value: userRole.id, children: /* @__PURE__ */ jsx(RoleChip, { role: userRole }, userRole?.id) }, userRole.id);
@@ -2671,7 +2680,10 @@ function UsersTable(t0) {
         onUserClicked(user);
       }, children: [
         /* @__PURE__ */ jsx(TableCell, { className: "w-12", children: /* @__PURE__ */ jsx(Avatar, { src: user.photoURL ?? void 0, outerClassName: "w-8 h-8 min-w-8 min-h-8 p-0", className: "text-sm", hover: false, children: user.displayName ? user.displayName[0].toUpperCase() : user.email ? user.email[0].toUpperCase() : "U" }) }),
-        /* @__PURE__ */ jsx(TableCell, { children: user.email }),
+        /* @__PURE__ */ jsx(TableCell, { children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col", children: [
+          /* @__PURE__ */ jsx("div", { children: user.email }),
+          user.uid && /* @__PURE__ */ jsx("div", { className: "text-xs text-surface-accent-500 dark:text-surface-accent-400 font-mono mt-1", children: user.uid })
+        ] }) }),
         /* @__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$1) }) : null }),
         /* @__PURE__ */ jsx(TableCell, { children: formattedDate }),