strapi-plugin-oidc 1.0.0

package/dist/admin/index-D_0jCOLk.js

@@ -0,0 +1,491 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("react/jsx-runtime");
+const reactRouterDom = require("react-router-dom");
+const admin = require("@strapi/strapi/admin");
+const react = require("react");
+const designSystem = require("@strapi/design-system");
+const icons = require("@strapi/icons");
+const reactIntl = require("react-intl");
+const index = require("./index-C0GkDnGG.js");
+const en = require("./en-jFPbEFeK.js");
+const styled = require("styled-components");
+const _interopDefault = (e) => e && e.__esModule ? e : { default: e };
+const styled__default = /* @__PURE__ */ _interopDefault(styled);
+function getTrad(id) {
+  const pluginIdWithId = `${index.pluginId}.${id}`;
+  return {
+    id: pluginIdWithId,
+    defaultMessage: en.default[id] || pluginIdWithId
+  };
+}
+function Role({ oidcRoles, roles, onChangeRole }) {
+  const { formatMessage } = reactIntl.useIntl();
+  return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+    /* @__PURE__ */ jsxRuntime.jsx(designSystem.Typography, { tag: "p", variant: "omega", textColor: "neutral600", marginBottom: 4, children: formatMessage(getTrad("roles.notes")) }),
+    /* @__PURE__ */ jsxRuntime.jsx(designSystem.Flex, { direction: "column", alignItems: "stretch", gap: 4, marginBottom: 4, children: oidcRoles.map((oidcRole) => /* @__PURE__ */ jsxRuntime.jsx(designSystem.Box, { children: /* @__PURE__ */ jsxRuntime.jsx(
+      designSystem.MultiSelect,
+      {
+        withTags: true,
+        placeholder: formatMessage(getTrad("roles.placeholder")),
+        value: oidcRole["role"] ? oidcRole["role"].map((r) => r.toString()) : [],
+        onChange: (value) => {
+          if (value && value.length > 0) {
+            onChangeRole(value, oidcRole["oauth_type"]);
+          }
+        },
+        children: roles.map((role) => /* @__PURE__ */ jsxRuntime.jsx(designSystem.MultiSelectOption, { value: role.id.toString(), children: role.name }, role.id))
+      }
+    ) }, oidcRole["oauth_type"])) })
+  ] });
+}
+const CustomTable = styled__default.default(designSystem.Table)`
+  th, td, th span, td span {
+    font-size: 1.3rem !important;
+  }
+`;
+const LocalizedDate = ({ date }) => {
+  const userLocale = navigator.language || "en-US";
+  return new Intl.DateTimeFormat(userLocale, {
+    year: "numeric",
+    month: "long",
+    day: "numeric",
+    hour: "2-digit",
+    minute: "2-digit"
+  }).format(new Date(date));
+};
+function Whitelist({ users, roles, oidcRoles = [], useWhitelist, loading, onSave, onDelete }) {
+  const [email, setEmail] = react.useState("");
+  const [selectedRoles, setSelectedRoles] = react.useState([]);
+  const [page, setPage] = react.useState(1);
+  const { formatMessage } = reactIntl.useIntl();
+  const PAGE_SIZE = 10;
+  const pageCount = Math.ceil(users.length / PAGE_SIZE) || 1;
+  const paginatedUsers = users.slice((page - 1) * PAGE_SIZE, page * PAGE_SIZE);
+  const onSaveEmail = react.useCallback(async () => {
+    const emailText = email.trim();
+    if (users.some((user) => user.email === emailText)) {
+      alert(
+        formatMessage(getTrad("whitelist.error.unique"))
+      );
+    } else {
+      await onSave(emailText, selectedRoles);
+      setEmail("");
+      setSelectedRoles([]);
+    }
+  }, [email, selectedRoles, users, onSave, formatMessage]);
+  const isValidEmail = react.useCallback(() => {
+    const emailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
+    return emailRegex.test(email);
+  }, [email]);
+  return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Box, { children: [
+    /* @__PURE__ */ jsxRuntime.jsx(designSystem.Typography, { tag: "p", variant: "omega", textColor: "neutral600", marginBottom: 4, children: formatMessage(getTrad("whitelist.description")) }),
+    /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Flex, { gap: 4, marginTop: 5, marginBottom: 5, alignItems: "flex-start", children: [
+      /* @__PURE__ */ jsxRuntime.jsx(designSystem.Box, { style: { flex: 1 }, children: /* @__PURE__ */ jsxRuntime.jsx(designSystem.Field.Root, { children: /* @__PURE__ */ jsxRuntime.jsx(
+        designSystem.Field.Input,
+        {
+          type: "text",
+          disabled: loading,
+          value: email,
+          hasError: Boolean(email && !isValidEmail()),
+          onChange: (e) => setEmail(e.currentTarget.value),
+          placeholder: formatMessage(getTrad("whitelist.email.placeholder"))
+        }
+      ) }) }),
+      /* @__PURE__ */ jsxRuntime.jsx(designSystem.Box, { style: { flex: 1 }, children: /* @__PURE__ */ jsxRuntime.jsx(designSystem.Field.Root, { children: /* @__PURE__ */ jsxRuntime.jsx(
+        designSystem.MultiSelect,
+        {
+          withTags: true,
+          placeholder: formatMessage(getTrad("whitelist.roles.placeholder")),
+          value: selectedRoles,
+          onChange: (value) => {
+            setSelectedRoles(value || []);
+          },
+          children: roles.map((role) => /* @__PURE__ */ jsxRuntime.jsx(designSystem.MultiSelectOption, { value: role.id.toString(), children: role.name }, role.id))
+        }
+      ) }) }),
+      /* @__PURE__ */ jsxRuntime.jsx(designSystem.Box, { children: /* @__PURE__ */ jsxRuntime.jsx(
+        designSystem.Button,
+        {
+          size: "L",
+          startIcon: /* @__PURE__ */ jsxRuntime.jsx(icons.Plus, {}),
+          disabled: loading || email.trim() === "" || !isValidEmail(),
+          loading,
+          onClick: onSaveEmail,
+          children: formatMessage(getTrad("page.add"))
+        }
+      ) })
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsx(designSystem.Divider, {}),
+    /* @__PURE__ */ jsxRuntime.jsxs(CustomTable, { colCount: 5, rowCount: users.length, children: [
+      /* @__PURE__ */ jsxRuntime.jsx(designSystem.Thead, { children: /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Tr, { children: [
+        /* @__PURE__ */ jsxRuntime.jsx(designSystem.Th, { children: formatMessage(getTrad("whitelist.table.no")) }),
+        /* @__PURE__ */ jsxRuntime.jsx(designSystem.Th, { children: formatMessage(getTrad("whitelist.table.email")) }),
+        /* @__PURE__ */ jsxRuntime.jsx(designSystem.Th, { children: formatMessage(getTrad("whitelist.table.roles")) }),
+        /* @__PURE__ */ jsxRuntime.jsx(designSystem.Th, { children: formatMessage(getTrad("whitelist.table.created")) }),
+        /* @__PURE__ */ jsxRuntime.jsx(designSystem.Th, { style: { paddingRight: 0 }, children: " " })
+      ] }) }),
+      /* @__PURE__ */ jsxRuntime.jsx(designSystem.Tbody, { children: users.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx(designSystem.Tr, { children: /* @__PURE__ */ jsxRuntime.jsx(designSystem.Td, { colSpan: 5, children: /* @__PURE__ */ jsxRuntime.jsx(designSystem.Flex, { justifyContent: "center", padding: 4, children: /* @__PURE__ */ jsxRuntime.jsx(designSystem.Typography, { textColor: "neutral600", children: formatMessage(getTrad("whitelist.table.empty")) }) }) }) }) : paginatedUsers.map((user, index2) => {
+        let userRolesNames = (user.roles || []).map((roleId) => {
+          const r = roles.find((ro) => ro.id.toString() === roleId.toString());
+          return r ? r.name : roleId;
+        }).join(", ");
+        if (!userRolesNames) {
+          const defaultRolesIds = oidcRoles.reduce((acc, oidc) => {
+            if (oidc.role) {
+              acc.push(...oidc.role);
+            }
+            return acc;
+          }, []);
+          userRolesNames = defaultRolesIds.map((roleId) => {
+            const r = roles.find((ro) => ro.id.toString() === roleId.toString());
+            return r ? r.name : roleId;
+          }).join(", ");
+        }
+        return /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Tr, { children: [
+          /* @__PURE__ */ jsxRuntime.jsx(designSystem.Td, { children: index2 + 1 + (page - 1) * PAGE_SIZE }),
+          /* @__PURE__ */ jsxRuntime.jsx(designSystem.Td, { children: user.email }),
+          /* @__PURE__ */ jsxRuntime.jsx(designSystem.Td, { children: userRolesNames || "-" }),
+          /* @__PURE__ */ jsxRuntime.jsx(designSystem.Td, { children: /* @__PURE__ */ jsxRuntime.jsx(LocalizedDate, { date: user.createdAt }) }),
+          /* @__PURE__ */ jsxRuntime.jsx(designSystem.Td, { style: { paddingRight: 0 }, children: /* @__PURE__ */ jsxRuntime.jsx(designSystem.Flex, { justifyContent: "flex-end", onClick: (e) => e.stopPropagation(), style: { width: "100%" }, children: /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Dialog.Root, { children: [
+            /* @__PURE__ */ jsxRuntime.jsx(designSystem.Dialog.Trigger, { children: /* @__PURE__ */ jsxRuntime.jsx(designSystem.IconButton, { label: formatMessage(getTrad("whitelist.delete.label")), withTooltip: false, children: /* @__PURE__ */ jsxRuntime.jsx(icons.Trash, {}) }) }),
+            /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Dialog.Content, { children: [
+              /* @__PURE__ */ jsxRuntime.jsx(designSystem.Dialog.Header, { children: formatMessage(getTrad("whitelist.delete.title")) }),
+              /* @__PURE__ */ jsxRuntime.jsx(designSystem.Dialog.Body, { icon: /* @__PURE__ */ jsxRuntime.jsx(icons.WarningCircle, { fill: "danger600" }), children: /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Flex, { direction: "column", alignItems: "center", gap: 2, children: [
+                /* @__PURE__ */ jsxRuntime.jsx(designSystem.Flex, { justifyContent: "center", children: /* @__PURE__ */ jsxRuntime.jsx(designSystem.Typography, { id: "confirm-description", children: formatMessage(getTrad("whitelist.delete.description")) }) }),
+                /* @__PURE__ */ jsxRuntime.jsx(designSystem.Flex, { justifyContent: "center", children: /* @__PURE__ */ jsxRuntime.jsx(designSystem.Typography, { variant: "omega", fontWeight: "bold", children: user.email }) }),
+                /* @__PURE__ */ jsxRuntime.jsx(designSystem.Flex, { justifyContent: "center", marginTop: 2, children: /* @__PURE__ */ jsxRuntime.jsx(designSystem.Typography, { variant: "pi", textColor: "neutral600", children: formatMessage(getTrad("whitelist.delete.note")) }) })
+              ] }) }),
+              /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Dialog.Footer, { children: [
+                /* @__PURE__ */ jsxRuntime.jsx(designSystem.Dialog.Cancel, { children: /* @__PURE__ */ jsxRuntime.jsx(designSystem.Button, { fullWidth: true, variant: "tertiary", children: formatMessage(getTrad("page.cancel")) }) }),
+                /* @__PURE__ */ jsxRuntime.jsx(designSystem.Dialog.Action, { children: /* @__PURE__ */ jsxRuntime.jsx(designSystem.Button, { fullWidth: true, variant: "danger-light", onClick: () => onDelete(user.email), children: formatMessage(getTrad("page.ok")) }) })
+              ] })
+            ] })
+          ] }) }) })
+        ] }, user.email);
+      }) })
+    ] }),
+    pageCount > 1 && /* @__PURE__ */ jsxRuntime.jsx(designSystem.Box, { paddingTop: 4, children: /* @__PURE__ */ jsxRuntime.jsx(designSystem.Flex, { justifyContent: "flex-end", children: /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Pagination, { activePage: page, pageCount, children: [
+      /* @__PURE__ */ jsxRuntime.jsx(designSystem.PreviousLink, { href: "#", onClick: (e) => {
+        e.preventDefault();
+        setPage((p) => Math.max(1, p - 1));
+      }, children: "Go to previous page" }),
+      Array.from({ length: pageCount }).map((_, i) => /* @__PURE__ */ jsxRuntime.jsxs(designSystem.PageLink, { number: i + 1, href: "#", onClick: (e) => {
+        e.preventDefault();
+        setPage(i + 1);
+      }, children: [
+        "Go to page ",
+        i + 1
+      ] }, i + 1)),
+      /* @__PURE__ */ jsxRuntime.jsx(designSystem.NextLink, { href: "#", onClick: (e) => {
+        e.preventDefault();
+        setPage((p) => Math.min(pageCount, p + 1));
+      }, children: "Go to next page" })
+    ] }) }) })
+  ] }) });
+}
+const AlertMessage = styled__default.default.div`
+    position: fixed;
+    left: 50%;
+    transform: translateX(-50%);
+    top: 2.875rem;
+    z-index: 10;
+    width: 31.25rem;
+`;
+function SuccessAlertMessage({ onClose }) {
+  const { formatMessage } = reactIntl.useIntl();
+  return /* @__PURE__ */ jsxRuntime.jsx(AlertMessage, { children: /* @__PURE__ */ jsxRuntime.jsx(
+    designSystem.Alert,
+    {
+      title: "Success",
+      variant: "success",
+      closeLabel: "",
+      onClose,
+      children: formatMessage(getTrad("page.save.success"))
+    }
+  ) });
+}
+function ErrorAlertMessage({ onClose }) {
+  const { formatMessage } = reactIntl.useIntl();
+  return /* @__PURE__ */ jsxRuntime.jsx(AlertMessage, { children: /* @__PURE__ */ jsxRuntime.jsx(
+    designSystem.Alert,
+    {
+      title: "Error",
+      variant: "danger",
+      closeLabel: "",
+      onClose,
+      children: formatMessage(getTrad("page.save.error"))
+    }
+  ) });
+}
+function MatchedUserAlertMessage({ onClose, count }) {
+  const { formatMessage } = reactIntl.useIntl();
+  const id = count > 1 ? "tab.whitelist.users_exists" : "tab.whitelist.user_exists";
+  return /* @__PURE__ */ jsxRuntime.jsx(AlertMessage, { children: /* @__PURE__ */ jsxRuntime.jsx(
+    designSystem.Alert,
+    {
+      title: "Info",
+      variant: "default",
+      closeLabel: "",
+      onClose,
+      children: formatMessage(getTrad(id))
+    }
+  ) });
+}
+const SwitchContainer = styled__default.default.label`
+  position: relative;
+  display: inline-block;
+  width: 40px;
+  height: 24px;
+  cursor: ${({ $disabled }) => $disabled ? "not-allowed" : "pointer"};
+  opacity: ${({ $disabled }) => $disabled ? 0.5 : 1};
+`;
+const SwitchInput = styled__default.default.input`
+  opacity: 0;
+  width: 0;
+  height: 0;
+
+  &:checked + span {
+    background-color: ${({ theme }) => theme.colors.primary600};
+  }
+
+  &:focus + span {
+    box-shadow: 0 0 1px ${({ theme }) => theme.colors.primary600};
+  }
+
+  &:checked + span:before {
+    transform: translateX(16px);
+  }
+  
+  &:disabled + span {
+    pointer-events: none;
+  }
+`;
+const SwitchSlider = styled__default.default.span`
+  position: absolute;
+  cursor: inherit;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  background-color: ${({ theme }) => theme.colors.neutral300};
+  transition: 0.4s;
+  border-radius: 24px;
+
+  &:before {
+    position: absolute;
+    content: "";
+    height: 18px;
+    width: 18px;
+    left: 3px;
+    bottom: 3px;
+    background-color: white;
+    transition: 0.4s;
+    border-radius: 50%;
+  }
+`;
+function CustomSwitch({ checked, onChange, label, disabled }) {
+  return /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Flex, { gap: 3, children: [
+    /* @__PURE__ */ jsxRuntime.jsxs(SwitchContainer, { $disabled: disabled, children: [
+      /* @__PURE__ */ jsxRuntime.jsx(
+        SwitchInput,
+        {
+          type: "checkbox",
+          checked,
+          onChange,
+          disabled
+        }
+      ),
+      /* @__PURE__ */ jsxRuntime.jsx(SwitchSlider, {})
+    ] }),
+    label && /* @__PURE__ */ jsxRuntime.jsx(designSystem.Typography, { variant: "pi", fontWeight: "bold", textColor: disabled ? "neutral500" : "neutral800", children: label })
+  ] });
+}
+function HomePage$1() {
+  const { formatMessage } = reactIntl.useIntl();
+  const [loading, setLoading] = react.useState(false);
+  const [initialOidcRoles, setInitialOIDCRoles] = react.useState([]);
+  const [oidcRoles, setOIDCRoles] = react.useState([]);
+  const [roles, setRoles] = react.useState([]);
+  const [initialUseWhitelist, setInitialUseWhitelist] = react.useState(false);
+  const [useWhitelist, setUseWhitelist] = react.useState(false);
+  const [initialEnforceOIDC, setInitialEnforceOIDC] = react.useState(false);
+  const [enforceOIDC, setEnforceOIDC] = react.useState(false);
+  const [initialUsers, setInitialUsers] = react.useState([]);
+  const [users, setUsers] = react.useState([]);
+  const [showSuccess, setSuccess] = react.useState(false);
+  const [showError, setError] = react.useState(false);
+  const [showMatched, setMatched] = react.useState(0);
+  const { get, put, post, del } = admin.useFetchClient();
+  react.useEffect(() => {
+    get(`/strapi-plugin-oidc/oidc-roles`).then((response) => {
+      setOIDCRoles(response.data);
+      setInitialOIDCRoles(JSON.parse(JSON.stringify(response.data)));
+    });
+    get(`/admin/roles`).then((response) => {
+      setRoles(response.data.data);
+    });
+    get("/strapi-plugin-oidc/whitelist").then((response) => {
+      setUsers(response.data.whitelistUsers);
+      setInitialUsers(JSON.parse(JSON.stringify(response.data.whitelistUsers)));
+      setUseWhitelist(response.data.useWhitelist);
+      setInitialUseWhitelist(response.data.useWhitelist);
+      setEnforceOIDC(response.data.enforceOIDC);
+      setInitialEnforceOIDC(response.data.enforceOIDC);
+    });
+  }, [setOIDCRoles, setRoles]);
+  const onChangeRole = (values, oidcId) => {
+    for (const oidcRole of oidcRoles) {
+      if (oidcRole["oauth_type"] === oidcId) {
+        oidcRole["role"] = values;
+      }
+    }
+    setOIDCRoles(oidcRoles.slice());
+  };
+  const onSaveAll = async () => {
+    setLoading(true);
+    try {
+      await put("/strapi-plugin-oidc/oidc-roles", {
+        roles: oidcRoles.map((role) => ({
+          "oauth_type": role["oauth_type"],
+          role: role["role"]
+        }))
+      });
+      await put("/strapi-plugin-oidc/whitelist/settings", {
+        useWhitelist,
+        enforceOIDC
+      });
+      const syncResponse = await put("/strapi-plugin-oidc/whitelist/sync", {
+        users: users.map((u) => ({ email: u.email, roles: u.roles }))
+      });
+      setInitialOIDCRoles(JSON.parse(JSON.stringify(oidcRoles)));
+      setInitialUseWhitelist(useWhitelist);
+      setInitialEnforceOIDC(enforceOIDC);
+      get("/strapi-plugin-oidc/whitelist").then((getResponse) => {
+        setUsers(getResponse.data.whitelistUsers);
+        setInitialUsers(JSON.parse(JSON.stringify(getResponse.data.whitelistUsers)));
+      });
+      if (syncResponse.data && syncResponse.data.matchedExistingUsersCount > 0) {
+        setMatched(syncResponse.data.matchedExistingUsersCount);
+        setTimeout(() => {
+          setMatched(0);
+        }, 3e3);
+      } else {
+        setSuccess(true);
+        setTimeout(() => {
+          setSuccess(false);
+        }, 3e3);
+      }
+    } catch (e) {
+      console.error(e);
+      setError(true);
+      setTimeout(() => {
+        setError(false);
+      }, 3e3);
+    } finally {
+      setLoading(false);
+    }
+  };
+  const onRegisterWhitelist = async (email, selectedRoles) => {
+    const newUser = { email, roles: selectedRoles, createdAt: (/* @__PURE__ */ new Date()).toISOString() };
+    setUsers([...users, newUser]);
+  };
+  const onDeleteWhitelist = async (email) => {
+    setUsers(users.filter((u) => u.email !== email));
+  };
+  const onToggleWhitelist = (e) => {
+    const newValue = e.target.checked;
+    setUseWhitelist(newValue);
+  };
+  const onToggleEnforce = (e) => {
+    const newValue = e.target.checked;
+    setEnforceOIDC(newValue);
+  };
+  const isDirty = useWhitelist !== initialUseWhitelist || enforceOIDC !== initialEnforceOIDC || JSON.stringify(oidcRoles) !== JSON.stringify(initialOidcRoles) || JSON.stringify(users) !== JSON.stringify(initialUsers);
+  return /* @__PURE__ */ jsxRuntime.jsxs(admin.Page.Protect, { permissions: [{ action: "plugin::strapi-plugin-oidc.read", subject: null }], children: [
+    /* @__PURE__ */ jsxRuntime.jsx(
+      admin.Layouts.Header,
+      {
+        title: formatMessage(getTrad("page.title.oidc")),
+        subtitle: formatMessage(getTrad("page.title"))
+      }
+    ),
+    showSuccess && /* @__PURE__ */ jsxRuntime.jsx(SuccessAlertMessage, { onClose: () => setSuccess(false) }),
+    showError && /* @__PURE__ */ jsxRuntime.jsx(ErrorAlertMessage, { onClose: () => setError(false) }),
+    showMatched > 0 && /* @__PURE__ */ jsxRuntime.jsx(MatchedUserAlertMessage, { count: showMatched, onClose: () => setMatched(0) }),
+    /* @__PURE__ */ jsxRuntime.jsx(admin.Layouts.Content, { children: /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Flex, { direction: "column", alignItems: "stretch", gap: 6, children: [
+      /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Box, { background: "neutral0", hasRadius: true, shadow: "filterShadow", padding: 6, children: [
+        /* @__PURE__ */ jsxRuntime.jsx(designSystem.Box, { paddingBottom: 4, children: /* @__PURE__ */ jsxRuntime.jsx(designSystem.Typography, { variant: "beta", tag: "h2", children: formatMessage(getTrad("roles.title")) }) }),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          Role,
+          {
+            roles,
+            oidcRoles,
+            onChangeRole
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Box, { background: "neutral0", hasRadius: true, shadow: "filterShadow", padding: 6, children: [
+        /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Flex, { justifyContent: "space-between", paddingBottom: 4, children: [
+          /* @__PURE__ */ jsxRuntime.jsx(designSystem.Typography, { variant: "beta", tag: "h2", children: formatMessage(getTrad("whitelist.title")) }),
+          /* @__PURE__ */ jsxRuntime.jsx(
+            CustomSwitch,
+            {
+              checked: useWhitelist,
+              onChange: onToggleWhitelist,
+              label: useWhitelist ? formatMessage(getTrad("whitelist.toggle.enabled")) : formatMessage(getTrad("whitelist.toggle.disabled"))
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          Whitelist,
+          {
+            loading,
+            users,
+            roles,
+            oidcRoles,
+            useWhitelist,
+            onSave: onRegisterWhitelist,
+            onDelete: onDeleteWhitelist
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsx(designSystem.Box, { background: "neutral0", hasRadius: true, shadow: "filterShadow", padding: 6, children: /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Flex, { direction: "column", alignItems: "stretch", gap: 4, children: [
+        /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Flex, { justifyContent: "space-between", alignItems: "center", children: [
+          /* @__PURE__ */ jsxRuntime.jsx(designSystem.Typography, { variant: "epsilon", tag: "h4", children: formatMessage(getTrad("enforce.title")) }),
+          /* @__PURE__ */ jsxRuntime.jsx(
+            CustomSwitch,
+            {
+              checked: enforceOIDC,
+              onChange: onToggleEnforce,
+              disabled: useWhitelist && users.length === 0,
+              label: enforceOIDC ? formatMessage(getTrad("enforce.toggle.enabled")) : formatMessage(getTrad("enforce.toggle.disabled"))
+            }
+          )
+        ] }),
+        enforceOIDC && enforceOIDC !== initialEnforceOIDC && /* @__PURE__ */ jsxRuntime.jsx(designSystem.Box, { background: "danger100", padding: 3, hasRadius: true, children: /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Flex, { gap: 3, alignItems: "center", children: [
+          /* @__PURE__ */ jsxRuntime.jsx(icons.WarningCircle, { fill: "danger600" }),
+          /* @__PURE__ */ jsxRuntime.jsx(designSystem.Typography, { textColor: "danger600", children: formatMessage(getTrad("enforce.warning")) })
+        ] }) })
+      ] }) }),
+      /* @__PURE__ */ jsxRuntime.jsx(designSystem.Flex, { justifyContent: "flex-end", children: /* @__PURE__ */ jsxRuntime.jsx(
+        designSystem.Button,
+        {
+          size: "L",
+          onClick: onSaveAll,
+          disabled: !isDirty || loading,
+          loading,
+          children: formatMessage(getTrad("page.save"))
+        }
+      ) })
+    ] }) })
+  ] });
+}
+const HomePage = react.memo(HomePage$1);
+function App() {
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { children: /* @__PURE__ */ jsxRuntime.jsxs(reactRouterDom.Routes, { children: [
+    /* @__PURE__ */ jsxRuntime.jsx(reactRouterDom.Route, { index: true, element: /* @__PURE__ */ jsxRuntime.jsx(HomePage, {}) }),
+    /* @__PURE__ */ jsxRuntime.jsx(reactRouterDom.Route, { path: "*", element: /* @__PURE__ */ jsxRuntime.jsx(admin.Page.Error, {}) })
+  ] }) });
+}
+exports.default = App;