strapi-plugin-keycloak-realm-users 1.0.0

package/dist/_chunks/App-BaKrvCeS.mjs

@@ -0,0 +1,1975 @@
+import { jsx, jsxs, Fragment } from "react/jsx-runtime";
+import { useNavigate, useParams, Routes, Route } from "react-router-dom";
+import { useState, useCallback, useEffect, useRef } from "react";
+import { useIntl } from "react-intl";
+import { Flex, Loader, Button, EmptyStateLayout, Table, Thead, Tr, Th, Typography, Tbody, Td, Box, Badge, IconButton, Dialog, Tabs, Modal, Field, SingleSelect, SingleSelectOption, Checkbox, Alert, Grid, TextInput, Toggle, Pagination, MultiSelect, MultiSelectOption } from "@strapi/design-system";
+import { useFetchClient, useNotification, Layouts } from "@strapi/strapi/admin";
+import { Plus, User, Play, Pencil, Trash, Check, ArrowLeft, Download, Search, Key, Cross, Mail, File } from "@strapi/icons";
+import { A as API_BASE_PATH, g as getTrad, P as PLUGIN_ID } from "./index-jTVd7LdQ.mjs";
+const useRealms = () => {
+  const client = useFetchClient();
+  const { toggleNotification } = useNotification();
+  const [realms, setRealms] = useState([]);
+  const [isLoading, setIsLoading] = useState(true);
+  const fetchAll = useCallback(async () => {
+    setIsLoading(true);
+    try {
+      const { data } = await client.get(`${API_BASE_PATH}/realms`);
+      setRealms(data.data || []);
+    } catch (err) {
+      toggleNotification({
+        type: "danger",
+        message: err.response?.data?.error?.message || "Failed to fetch realms"
+      });
+    } finally {
+      setIsLoading(false);
+    }
+  }, [client, toggleNotification]);
+  const fetchOne = useCallback(
+    async (id) => {
+      try {
+        const { data } = await client.get(`${API_BASE_PATH}/realms/${id}`);
+        return data.data;
+      } catch (err) {
+        toggleNotification({
+          type: "danger",
+          message: err.response?.data?.error?.message || "Failed to fetch realm"
+        });
+        throw err;
+      }
+    },
+    [client, toggleNotification]
+  );
+  const create = useCallback(
+    async (realmData) => {
+      try {
+        const { data } = await client.post(`${API_BASE_PATH}/realms`, { data: realmData });
+        toggleNotification({
+          type: "success",
+          message: "Realm created successfully"
+        });
+        await fetchAll();
+        return data.data;
+      } catch (err) {
+        toggleNotification({
+          type: "danger",
+          message: err.response?.data?.error?.message || "Failed to create realm"
+        });
+        throw err;
+      }
+    },
+    [client, toggleNotification, fetchAll]
+  );
+  const update = useCallback(
+    async (id, realmData) => {
+      try {
+        const { data } = await client.put(`${API_BASE_PATH}/realms/${id}`, { data: realmData });
+        toggleNotification({
+          type: "success",
+          message: "Realm updated successfully"
+        });
+        await fetchAll();
+        return data.data;
+      } catch (err) {
+        toggleNotification({
+          type: "danger",
+          message: err.response?.data?.error?.message || "Failed to update realm"
+        });
+        throw err;
+      }
+    },
+    [client, toggleNotification, fetchAll]
+  );
+  const remove = useCallback(
+    async (id) => {
+      try {
+        await client.del(`${API_BASE_PATH}/realms/${id}`);
+        toggleNotification({
+          type: "success",
+          message: "Realm deleted successfully"
+        });
+        await fetchAll();
+      } catch (err) {
+        toggleNotification({
+          type: "danger",
+          message: err.response?.data?.error?.message || "Failed to delete realm"
+        });
+        throw err;
+      }
+    },
+    [client, toggleNotification, fetchAll]
+  );
+  const testConnection = useCallback(
+    async (id) => {
+      try {
+        const { data } = await client.post(`${API_BASE_PATH}/realms/${id}/test`);
+        return data.data;
+      } catch (err) {
+        return { success: false, message: err.response?.data?.error?.message || "Connection failed" };
+      }
+    },
+    [client]
+  );
+  const testConnectionRaw = useCallback(
+    async (config) => {
+      try {
+        const { data } = await client.post(`${API_BASE_PATH}/realms/test-connection`, { data: config });
+        return data.data;
+      } catch (err) {
+        return { success: false, message: err.response?.data?.error?.message || "Connection failed" };
+      }
+    },
+    [client]
+  );
+  useEffect(() => {
+    fetchAll();
+  }, [fetchAll]);
+  return {
+    realms,
+    isLoading,
+    fetchAll,
+    fetchOne,
+    create,
+    update,
+    remove,
+    testConnection,
+    testConnectionRaw
+  };
+};
+const RealmListPage = () => {
+  const { formatMessage } = useIntl();
+  const navigate = useNavigate();
+  const { realms, isLoading, remove, testConnection } = useRealms();
+  const [deleteId, setDeleteId] = useState(null);
+  const [testingId, setTestingId] = useState(null);
+  const [testResults, setTestResults] = useState({});
+  const handleDelete = async () => {
+    if (deleteId) {
+      await remove(deleteId);
+      setDeleteId(null);
+    }
+  };
+  const handleTest = async (id) => {
+    setTestingId(id);
+    const result = await testConnection(id);
+    setTestResults((prev) => ({ ...prev, [id]: result }));
+    setTestingId(null);
+  };
+  if (isLoading) {
+    return /* @__PURE__ */ jsx(Layouts.Root, { children: /* @__PURE__ */ jsx(Layouts.Content, { children: /* @__PURE__ */ jsx(Flex, { justifyContent: "center", padding: 8, children: /* @__PURE__ */ jsx(Loader, {}) }) }) });
+  }
+  return /* @__PURE__ */ jsxs(Layouts.Root, { children: [
+    /* @__PURE__ */ jsx(
+      Layouts.Header,
+      {
+        title: formatMessage({ id: getTrad("realms.title"), defaultMessage: "Keycloak Realms" }),
+        subtitle: formatMessage({
+          id: getTrad("realms.subtitle"),
+          defaultMessage: "Configure Keycloak realm connections"
+        }),
+        primaryAction: /* @__PURE__ */ jsx(Button, { startIcon: /* @__PURE__ */ jsx(Plus, {}), onClick: () => navigate(`/settings/${PLUGIN_ID}/realms/create`), children: formatMessage({ id: getTrad("realms.create"), defaultMessage: "Add Realm" }) })
+      }
+    ),
+    /* @__PURE__ */ jsx(Layouts.Content, { children: realms.length === 0 ? /* @__PURE__ */ jsx(
+      EmptyStateLayout,
+      {
+        icon: /* @__PURE__ */ jsx(User, { width: "10rem", height: "10rem" }),
+        content: formatMessage({
+          id: getTrad("realms.empty.description"),
+          defaultMessage: "Add your first Keycloak realm to start managing users."
+        }),
+        action: /* @__PURE__ */ jsx(
+          Button,
+          {
+            variant: "secondary",
+            startIcon: /* @__PURE__ */ jsx(Plus, {}),
+            onClick: () => navigate(`/settings/${PLUGIN_ID}/realms/create`),
+            children: formatMessage({ id: getTrad("realms.create"), defaultMessage: "Add Realm" })
+          }
+        )
+      }
+    ) : /* @__PURE__ */ jsxs(Table, { colCount: 6, rowCount: realms.length + 1, children: [
+      /* @__PURE__ */ jsx(Thead, { children: /* @__PURE__ */ jsxs(Tr, { children: [
+        /* @__PURE__ */ jsx(Th, { children: /* @__PURE__ */ jsx(Typography, { variant: "sigma", children: formatMessage({ id: getTrad("realm.displayName"), defaultMessage: "Display Name" }) }) }),
+        /* @__PURE__ */ jsx(Th, { children: /* @__PURE__ */ jsx(Typography, { variant: "sigma", children: formatMessage({ id: getTrad("realm.name"), defaultMessage: "Name" }) }) }),
+        /* @__PURE__ */ jsx(Th, { children: /* @__PURE__ */ jsx(Typography, { variant: "sigma", children: formatMessage({ id: getTrad("realm.realmName"), defaultMessage: "Realm Name" }) }) }),
+        /* @__PURE__ */ jsx(Th, { children: /* @__PURE__ */ jsx(Typography, { variant: "sigma", children: formatMessage({ id: getTrad("realm.enabled"), defaultMessage: "Enabled" }) }) }),
+        /* @__PURE__ */ jsx(Th, { children: /* @__PURE__ */ jsx(Typography, { variant: "sigma", children: "Status" }) }),
+        /* @__PURE__ */ jsx(Th, { children: /* @__PURE__ */ jsx(Typography, { variant: "sigma", children: "Actions" }) })
+      ] }) }),
+      /* @__PURE__ */ jsx(Tbody, { children: realms.map((realm) => /* @__PURE__ */ jsxs(Tr, { children: [
+        /* @__PURE__ */ jsx(Td, { children: /* @__PURE__ */ jsxs(Flex, { alignItems: "center", gap: 2, children: [
+          /* @__PURE__ */ jsx(
+            Box,
+            {
+              width: "12px",
+              height: "12px",
+              borderRadius: "50%",
+              background: realm.color || "primary600"
+            }
+          ),
+          /* @__PURE__ */ jsx(Typography, { textColor: "neutral800", fontWeight: "bold", children: realm.displayName })
+        ] }) }),
+        /* @__PURE__ */ jsx(Td, { children: /* @__PURE__ */ jsx(Typography, { textColor: "neutral600", children: realm.name }) }),
+        /* @__PURE__ */ jsx(Td, { children: /* @__PURE__ */ jsx(Typography, { textColor: "neutral600", children: realm.realmName }) }),
+        /* @__PURE__ */ jsx(Td, { children: /* @__PURE__ */ jsx(Badge, { backgroundColor: realm.enabled ? "success100" : "neutral150", children: realm.enabled ? "Enabled" : "Disabled" }) }),
+        /* @__PURE__ */ jsx(Td, { children: testResults[realm.documentId] ? /* @__PURE__ */ jsx(
+          Badge,
+          {
+            backgroundColor: testResults[realm.documentId].success ? "success100" : "danger100",
+            children: testResults[realm.documentId].success ? "Connected" : "Failed"
+          }
+        ) : /* @__PURE__ */ jsx(Typography, { textColor: "neutral400", children: "-" }) }),
+        /* @__PURE__ */ jsx(Td, { children: /* @__PURE__ */ jsxs(Flex, { gap: 1, children: [
+          /* @__PURE__ */ jsx(
+            IconButton,
+            {
+              withTooltip: false,
+              label: "Test Connection",
+              onClick: () => handleTest(realm.documentId),
+              loading: testingId === realm.documentId,
+              children: /* @__PURE__ */ jsx(Play, {})
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            IconButton,
+            {
+              withTooltip: false,
+              label: "Manage Users",
+              onClick: () => navigate(`/settings/${PLUGIN_ID}/realms/${realm.documentId}/users`),
+              children: /* @__PURE__ */ jsx(User, {})
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            IconButton,
+            {
+              withTooltip: false,
+              label: "Edit",
+              onClick: () => navigate(`/settings/${PLUGIN_ID}/realms/${realm.documentId}`),
+              children: /* @__PURE__ */ jsx(Pencil, {})
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            IconButton,
+            {
+              withTooltip: false,
+              label: "Delete",
+              onClick: () => setDeleteId(realm.documentId),
+              children: /* @__PURE__ */ jsx(Trash, {})
+            }
+          )
+        ] }) })
+      ] }, realm.documentId)) })
+    ] }) }),
+    /* @__PURE__ */ jsx(Dialog.Root, { open: !!deleteId, onOpenChange: () => setDeleteId(null), children: /* @__PURE__ */ jsxs(Dialog.Content, { children: [
+      /* @__PURE__ */ jsx(Dialog.Header, { children: "Delete Realm" }),
+      /* @__PURE__ */ jsx(Dialog.Body, { children: formatMessage({
+        id: getTrad("realm.delete.confirm"),
+        defaultMessage: "Are you sure you want to delete this realm configuration?"
+      }) }),
+      /* @__PURE__ */ jsxs(Dialog.Footer, { children: [
+        /* @__PURE__ */ jsx(Dialog.Cancel, { children: /* @__PURE__ */ jsx(Button, { variant: "tertiary", children: "Cancel" }) }),
+        /* @__PURE__ */ jsx(Dialog.Action, { children: /* @__PURE__ */ jsx(Button, { variant: "danger-light", onClick: handleDelete, children: "Delete" }) })
+      ] })
+    ] }) })
+  ] });
+};
+const useRealmAdmins = (realmId) => {
+  const client = useFetchClient();
+  const { toggleNotification } = useNotification();
+  const [admins, setAdmins] = useState([]);
+  const [strapiUsers, setStrapiUsers] = useState([]);
+  const [isLoading, setIsLoading] = useState(false);
+  const fetchAdmins = useCallback(async () => {
+    if (!realmId) return;
+    setIsLoading(true);
+    try {
+      const { data } = await client.get(`${API_BASE_PATH}/realms/${realmId}/admins`);
+      setAdmins(data.data || []);
+    } catch (err) {
+      toggleNotification({
+        type: "danger",
+        message: err.response?.data?.error?.message || "Failed to fetch realm admins"
+      });
+    } finally {
+      setIsLoading(false);
+    }
+  }, [realmId, client, toggleNotification]);
+  const fetchStrapiUsers = useCallback(async () => {
+    try {
+      const { data } = await client.get("/admin/users");
+      setStrapiUsers(data.data?.results || data.data || []);
+    } catch (err) {
+      toggleNotification({
+        type: "danger",
+        message: "Failed to fetch Strapi users"
+      });
+    }
+  }, [client, toggleNotification]);
+  const addAdmin = useCallback(
+    async (strapiUserId, strapiUserEmail, permissions) => {
+      try {
+        const { data } = await client.post(`${API_BASE_PATH}/realms/${realmId}/admins`, {
+          data: {
+            strapiUserId,
+            strapiUserEmail,
+            permissions
+          }
+        });
+        toggleNotification({
+          type: "success",
+          message: "Admin added successfully"
+        });
+        await fetchAdmins();
+        return data.data;
+      } catch (err) {
+        toggleNotification({
+          type: "danger",
+          message: err.response?.data?.error?.message || "Failed to add admin"
+        });
+        throw err;
+      }
+    },
+    [realmId, client, toggleNotification, fetchAdmins]
+  );
+  const updateAdmin = useCallback(
+    async (adminId, permissions) => {
+      try {
+        const { data } = await client.put(`${API_BASE_PATH}/realms/${realmId}/admins/${adminId}`, {
+          data: { permissions }
+        });
+        toggleNotification({
+          type: "success",
+          message: "Admin permissions updated"
+        });
+        await fetchAdmins();
+        return data.data;
+      } catch (err) {
+        toggleNotification({
+          type: "danger",
+          message: err.response?.data?.error?.message || "Failed to update admin"
+        });
+        throw err;
+      }
+    },
+    [realmId, client, toggleNotification, fetchAdmins]
+  );
+  const removeAdmin = useCallback(
+    async (adminId) => {
+      try {
+        await client.del(`${API_BASE_PATH}/realms/${realmId}/admins/${adminId}`);
+        toggleNotification({
+          type: "success",
+          message: "Admin removed successfully"
+        });
+        await fetchAdmins();
+      } catch (err) {
+        toggleNotification({
+          type: "danger",
+          message: err.response?.data?.error?.message || "Failed to remove admin"
+        });
+        throw err;
+      }
+    },
+    [realmId, client, toggleNotification, fetchAdmins]
+  );
+  return {
+    admins,
+    strapiUsers,
+    isLoading,
+    fetchAdmins,
+    fetchStrapiUsers,
+    addAdmin,
+    updateAdmin,
+    removeAdmin
+  };
+};
+const PERMISSIONS = [
+  { key: "canRead", label: "Read", description: "View users" },
+  { key: "canCreate", label: "Create", description: "Add new users" },
+  { key: "canUpdate", label: "Update", description: "Edit user details" },
+  { key: "canDelete", label: "Delete", description: "Remove users" },
+  { key: "canResetPassword", label: "Reset Password", description: "Change user passwords" },
+  { key: "canManageRoles", label: "Manage Roles", description: "Assign/remove Keycloak roles" }
+];
+const RealmEditPage = () => {
+  const { id } = useParams();
+  const navigate = useNavigate();
+  const { formatMessage } = useIntl();
+  const { fetchOne, create, update, testConnectionRaw } = useRealms();
+  const {
+    admins,
+    strapiUsers,
+    isLoading: isLoadingAdmins,
+    fetchAdmins,
+    fetchStrapiUsers,
+    addAdmin,
+    updateAdmin,
+    removeAdmin
+  } = useRealmAdmins(id);
+  const isEditMode = !!id;
+  const [activeTab, setActiveTab] = useState("configuration");
+  const [isLoading, setIsLoading] = useState(isEditMode);
+  const [isSaving, setIsSaving] = useState(false);
+  const [isTesting, setIsTesting] = useState(false);
+  const [testResult, setTestResult] = useState(null);
+  const [formData, setFormData] = useState({
+    name: "",
+    displayName: "",
+    serverUrl: "",
+    realmName: "",
+    clientId: "",
+    clientSecret: "",
+    enabled: true,
+    color: "#4945ff"
+  });
+  const [errors, setErrors] = useState({});
+  const [showAddModal, setShowAddModal] = useState(false);
+  const [showEditModal, setShowEditModal] = useState(false);
+  const [selectedAdmin, setSelectedAdmin] = useState(null);
+  const [deleteAdminId, setDeleteAdminId] = useState(null);
+  const [newAdminUserId, setNewAdminUserId] = useState("");
+  const [adminPermissions, setAdminPermissions] = useState({
+    canRead: true,
+    canCreate: false,
+    canUpdate: false,
+    canDelete: false,
+    canResetPassword: false,
+    canManageRoles: false
+  });
+  useEffect(() => {
+    if (isEditMode) {
+      fetchOne(id).then((realm) => {
+        setFormData({
+          name: realm.name || "",
+          displayName: realm.displayName || "",
+          serverUrl: realm.serverUrl || "",
+          realmName: realm.realmName || "",
+          clientId: realm.clientId || "",
+          clientSecret: "",
+          enabled: realm.enabled !== false,
+          color: realm.color || "#4945ff"
+        });
+      }).catch(() => {
+        navigate(`/settings/${PLUGIN_ID}`);
+      }).finally(() => {
+        setIsLoading(false);
+      });
+    }
+  }, [id, isEditMode, fetchOne, navigate]);
+  useEffect(() => {
+    if (isEditMode && activeTab === "admins") {
+      fetchAdmins();
+      fetchStrapiUsers();
+    }
+  }, [isEditMode, activeTab, fetchAdmins, fetchStrapiUsers]);
+  const handleChange = (field) => (e) => {
+    const value = e.target ? e.target.value : e;
+    setFormData((prev) => ({ ...prev, [field]: value }));
+    setErrors((prev) => ({ ...prev, [field]: null }));
+    setTestResult(null);
+  };
+  const handleToggle = (field) => () => {
+    setFormData((prev) => ({ ...prev, [field]: !prev[field] }));
+  };
+  const validate = () => {
+    const newErrors = {};
+    if (!formData.name) {
+      newErrors.name = "Name is required";
+    } else if (!/^[a-z0-9-]+$/.test(formData.name)) {
+      newErrors.name = "Name must contain only lowercase letters, numbers, and hyphens";
+    }
+    if (!formData.displayName) {
+      newErrors.displayName = "Display name is required";
+    }
+    if (!formData.serverUrl) {
+      newErrors.serverUrl = "Server URL is required";
+    }
+    if (!formData.realmName) {
+      newErrors.realmName = "Realm name is required";
+    }
+    if (!formData.clientId) {
+      newErrors.clientId = "Client ID is required";
+    }
+    if (!isEditMode && !formData.clientSecret) {
+      newErrors.clientSecret = "Client secret is required for new realms";
+    }
+    setErrors(newErrors);
+    return Object.keys(newErrors).length === 0;
+  };
+  const handleTestConnection = async () => {
+    if (!formData.serverUrl || !formData.realmName || !formData.clientId) {
+      setTestResult({ success: false, message: "Please fill in server URL, realm name, and client ID" });
+      return;
+    }
+    setIsTesting(true);
+    setTestResult(null);
+    try {
+      const result = await testConnectionRaw({
+        serverUrl: formData.serverUrl,
+        realmName: formData.realmName,
+        clientId: formData.clientId,
+        clientSecret: formData.clientSecret || void 0
+      });
+      setTestResult(result);
+    } catch {
+      setTestResult({ success: false, message: "Connection test failed" });
+    } finally {
+      setIsTesting(false);
+    }
+  };
+  const handleSubmit = async () => {
+    if (!validate()) return;
+    setIsSaving(true);
+    try {
+      const dataToSave = { ...formData };
+      if (!dataToSave.clientSecret) {
+        delete dataToSave.clientSecret;
+      }
+      if (isEditMode) {
+        await update(id, dataToSave);
+      } else {
+        await create(dataToSave);
+      }
+      navigate(`/settings/${PLUGIN_ID}`);
+    } catch {
+    } finally {
+      setIsSaving(false);
+    }
+  };
+  const handleOpenAddModal = () => {
+    setNewAdminUserId("");
+    setAdminPermissions({
+      canRead: true,
+      canCreate: false,
+      canUpdate: false,
+      canDelete: false,
+      canResetPassword: false,
+      canManageRoles: false
+    });
+    setShowAddModal(true);
+  };
+  const handleOpenEditModal = (admin) => {
+    setSelectedAdmin(admin);
+    setAdminPermissions({
+      canRead: admin.canRead || false,
+      canCreate: admin.canCreate || false,
+      canUpdate: admin.canUpdate || false,
+      canDelete: admin.canDelete || false,
+      canResetPassword: admin.canResetPassword || false,
+      canManageRoles: admin.canManageRoles || false
+    });
+    setShowEditModal(true);
+  };
+  const handleAddAdmin = async () => {
+    if (!newAdminUserId) return;
+    const selectedUser = strapiUsers.find((u) => u.id === parseInt(newAdminUserId, 10));
+    try {
+      await addAdmin(parseInt(newAdminUserId, 10), selectedUser?.email, adminPermissions);
+      setShowAddModal(false);
+    } catch {
+    }
+  };
+  const handleUpdateAdmin = async () => {
+    if (!selectedAdmin) return;
+    try {
+      await updateAdmin(selectedAdmin.strapiUserId, adminPermissions);
+      setShowEditModal(false);
+      setSelectedAdmin(null);
+    } catch {
+    }
+  };
+  const handleDeleteAdmin = async () => {
+    if (!deleteAdminId) return;
+    try {
+      await removeAdmin(deleteAdminId);
+      setDeleteAdminId(null);
+    } catch {
+    }
+  };
+  const handlePermissionChange = (key) => () => {
+    setAdminPermissions((prev) => ({ ...prev, [key]: !prev[key] }));
+  };
+  const availableUsers = strapiUsers.filter(
+    (user) => !admins.some((admin) => admin.strapiUserId === user.id)
+  );
+  if (isLoading) {
+    return /* @__PURE__ */ jsx(Layouts.Root, { children: /* @__PURE__ */ jsx(Layouts.Content, { children: /* @__PURE__ */ jsx(Flex, { justifyContent: "center", padding: 8, children: /* @__PURE__ */ jsx(Loader, {}) }) }) });
+  }
+  return /* @__PURE__ */ jsxs(Layouts.Root, { children: [
+    /* @__PURE__ */ jsx(
+      Layouts.Header,
+      {
+        title: isEditMode ? "Edit Realm" : "Create Realm",
+        subtitle: isEditMode && formData.displayName,
+        navigationAction: /* @__PURE__ */ jsx(
+          Button,
+          {
+            startIcon: /* @__PURE__ */ jsx(ArrowLeft, {}),
+            variant: "ghost",
+            onClick: () => navigate(`/settings/${PLUGIN_ID}`),
+            children: formatMessage({ id: getTrad("common.back"), defaultMessage: "Back" })
+          }
+        ),
+        primaryAction: /* @__PURE__ */ jsxs(Flex, { gap: 2, children: [
+          activeTab === "configuration" && /* @__PURE__ */ jsxs(Fragment, { children: [
+            /* @__PURE__ */ jsx(
+              Button,
+              {
+                variant: "secondary",
+                startIcon: /* @__PURE__ */ jsx(Play, {}),
+                onClick: handleTestConnection,
+                loading: isTesting,
+                children: formatMessage({ id: getTrad("realm.testConnection"), defaultMessage: "Test Connection" })
+              }
+            ),
+            /* @__PURE__ */ jsx(Button, { startIcon: /* @__PURE__ */ jsx(Check, {}), onClick: handleSubmit, loading: isSaving, children: formatMessage({ id: getTrad("common.save"), defaultMessage: "Save" }) })
+          ] }),
+          activeTab === "admins" && /* @__PURE__ */ jsx(Button, { startIcon: /* @__PURE__ */ jsx(Plus, {}), onClick: handleOpenAddModal, children: "Add Admin" })
+        ] })
+      }
+    ),
+    /* @__PURE__ */ jsx(Layouts.Content, { children: isEditMode ? /* @__PURE__ */ jsxs(Tabs.Root, { value: activeTab, onValueChange: setActiveTab, children: [
+      /* @__PURE__ */ jsxs(Tabs.List, { children: [
+        /* @__PURE__ */ jsx(Tabs.Trigger, { value: "configuration", children: "Configuration" }),
+        /* @__PURE__ */ jsx(Tabs.Trigger, { value: "admins", children: "Admins" })
+      ] }),
+      /* @__PURE__ */ jsxs(Box, { marginTop: 4, children: [
+        /* @__PURE__ */ jsx(Tabs.Content, { value: "configuration", children: /* @__PURE__ */ jsx(
+          ConfigurationTab,
+          {
+            formData,
+            errors,
+            testResult,
+            isEditMode,
+            handleChange,
+            handleToggle,
+            setTestResult,
+            formatMessage
+          }
+        ) }),
+        /* @__PURE__ */ jsx(Tabs.Content, { value: "admins", children: /* @__PURE__ */ jsx(
+          AdminsTab,
+          {
+            admins,
+            isLoading: isLoadingAdmins,
+            onEdit: handleOpenEditModal,
+            onDelete: setDeleteAdminId
+          }
+        ) })
+      ] })
+    ] }) : /* @__PURE__ */ jsx(
+      ConfigurationTab,
+      {
+        formData,
+        errors,
+        testResult,
+        isEditMode,
+        handleChange,
+        handleToggle,
+        setTestResult,
+        formatMessage
+      }
+    ) }),
+    /* @__PURE__ */ jsx(Modal.Root, { open: showAddModal, onOpenChange: () => setShowAddModal(false), children: /* @__PURE__ */ jsxs(Modal.Content, { children: [
+      /* @__PURE__ */ jsx(Modal.Header, { children: /* @__PURE__ */ jsx(Modal.Title, { children: "Add Realm Admin" }) }),
+      /* @__PURE__ */ jsx(Modal.Body, { children: /* @__PURE__ */ jsxs(Flex, { direction: "column", gap: 4, children: [
+        /* @__PURE__ */ jsxs(Field.Root, { children: [
+          /* @__PURE__ */ jsx(Field.Label, { required: true, children: "Select User" }),
+          /* @__PURE__ */ jsx(
+            SingleSelect,
+            {
+              value: newAdminUserId,
+              onChange: setNewAdminUserId,
+              placeholder: "Select a Strapi user...",
+              children: availableUsers.map((user) => /* @__PURE__ */ jsxs(SingleSelectOption, { value: String(user.id), children: [
+                user.firstname,
+                " ",
+                user.lastname,
+                " (",
+                user.email,
+                ")"
+              ] }, user.id))
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsxs(Box, { children: [
+          /* @__PURE__ */ jsx(Typography, { variant: "pi", fontWeight: "bold", children: "Permissions" }),
+          /* @__PURE__ */ jsx(Box, { marginTop: 2, children: PERMISSIONS.map((perm) => /* @__PURE__ */ jsxs(Flex, { alignItems: "center", gap: 2, marginBottom: 2, children: [
+            /* @__PURE__ */ jsx(
+              Checkbox,
+              {
+                checked: adminPermissions[perm.key],
+                onCheckedChange: handlePermissionChange(perm.key)
+              }
+            ),
+            /* @__PURE__ */ jsxs(Box, { children: [
+              /* @__PURE__ */ jsx(Typography, { fontWeight: "semiBold", children: perm.label }),
+              /* @__PURE__ */ jsx(Typography, { variant: "pi", textColor: "neutral600", children: perm.description })
+            ] })
+          ] }, perm.key)) })
+        ] })
+      ] }) }),
+      /* @__PURE__ */ jsxs(Modal.Footer, { children: [
+        /* @__PURE__ */ jsx(Modal.Close, { children: /* @__PURE__ */ jsx(Button, { variant: "tertiary", children: "Cancel" }) }),
+        /* @__PURE__ */ jsx(Button, { onClick: handleAddAdmin, disabled: !newAdminUserId, children: "Add Admin" })
+      ] })
+    ] }) }),
+    /* @__PURE__ */ jsx(Modal.Root, { open: showEditModal, onOpenChange: () => setShowEditModal(false), children: /* @__PURE__ */ jsxs(Modal.Content, { children: [
+      /* @__PURE__ */ jsx(Modal.Header, { children: /* @__PURE__ */ jsx(Modal.Title, { children: "Edit Admin Permissions" }) }),
+      /* @__PURE__ */ jsx(Modal.Body, { children: /* @__PURE__ */ jsxs(Flex, { direction: "column", gap: 4, children: [
+        selectedAdmin && /* @__PURE__ */ jsx(Box, { background: "neutral100", padding: 3, hasRadius: true, children: /* @__PURE__ */ jsx(Typography, { fontWeight: "bold", children: selectedAdmin.strapiUserEmail }) }),
+        /* @__PURE__ */ jsxs(Box, { children: [
+          /* @__PURE__ */ jsx(Typography, { variant: "pi", fontWeight: "bold", children: "Permissions" }),
+          /* @__PURE__ */ jsx(Box, { marginTop: 2, children: PERMISSIONS.map((perm) => /* @__PURE__ */ jsxs(Flex, { alignItems: "center", gap: 2, marginBottom: 2, children: [
+            /* @__PURE__ */ jsx(
+              Checkbox,
+              {
+                checked: adminPermissions[perm.key],
+                onCheckedChange: handlePermissionChange(perm.key)
+              }
+            ),
+            /* @__PURE__ */ jsxs(Box, { children: [
+              /* @__PURE__ */ jsx(Typography, { fontWeight: "semiBold", children: perm.label }),
+              /* @__PURE__ */ jsx(Typography, { variant: "pi", textColor: "neutral600", children: perm.description })
+            ] })
+          ] }, perm.key)) })
+        ] })
+      ] }) }),
+      /* @__PURE__ */ jsxs(Modal.Footer, { children: [
+        /* @__PURE__ */ jsx(Modal.Close, { children: /* @__PURE__ */ jsx(Button, { variant: "tertiary", children: "Cancel" }) }),
+        /* @__PURE__ */ jsx(Button, { onClick: handleUpdateAdmin, children: "Save Permissions" })
+      ] })
+    ] }) }),
+    /* @__PURE__ */ jsx(Dialog.Root, { open: !!deleteAdminId, onOpenChange: () => setDeleteAdminId(null), children: /* @__PURE__ */ jsxs(Dialog.Content, { children: [
+      /* @__PURE__ */ jsx(Dialog.Header, { children: "Remove Admin" }),
+      /* @__PURE__ */ jsx(Dialog.Body, { children: "Are you sure you want to remove this admin from the realm? They will lose all permissions." }),
+      /* @__PURE__ */ jsxs(Dialog.Footer, { children: [
+        /* @__PURE__ */ jsx(Dialog.Cancel, { children: /* @__PURE__ */ jsx(Button, { variant: "tertiary", children: "Cancel" }) }),
+        /* @__PURE__ */ jsx(Dialog.Action, { children: /* @__PURE__ */ jsx(Button, { variant: "danger-light", onClick: handleDeleteAdmin, children: "Remove" }) })
+      ] })
+    ] }) })
+  ] });
+};
+const ConfigurationTab = ({
+  formData,
+  errors,
+  testResult,
+  isEditMode,
+  handleChange,
+  handleToggle,
+  setTestResult,
+  formatMessage
+}) => /* @__PURE__ */ jsxs(Box, { background: "neutral0", padding: 6, shadow: "filterShadow", hasRadius: true, children: [
+  testResult && /* @__PURE__ */ jsx(Box, { marginBottom: 4, children: /* @__PURE__ */ jsx(
+    Alert,
+    {
+      variant: testResult.success ? "success" : "danger",
+      title: testResult.success ? "Connection Successful" : "Connection Failed",
+      onClose: () => setTestResult(null),
+      closeLabel: "Close",
+      children: testResult.success ? `Connected to realm: ${testResult.realmDisplayName || formData.realmName}` : testResult.message
+    }
+  ) }),
+  /* @__PURE__ */ jsxs(Grid.Root, { gap: 4, children: [
+    /* @__PURE__ */ jsx(Grid.Item, { col: 6, s: 12, children: /* @__PURE__ */ jsxs(Field.Root, { error: errors.name, children: [
+      /* @__PURE__ */ jsx(Field.Label, { required: true, children: formatMessage({ id: getTrad("realm.name"), defaultMessage: "Name" }) }),
+      /* @__PURE__ */ jsx(
+        TextInput,
+        {
+          name: "name",
+          value: formData.name,
+          onChange: handleChange("name"),
+          disabled: isEditMode
+        }
+      ),
+      /* @__PURE__ */ jsx(Field.Hint, { children: formatMessage({
+        id: getTrad("realm.name.hint"),
+        defaultMessage: "Unique identifier (lowercase, numbers, hyphens only)"
+      }) }),
+      /* @__PURE__ */ jsx(Field.Error, {})
+    ] }) }),
+    /* @__PURE__ */ jsx(Grid.Item, { col: 6, s: 12, children: /* @__PURE__ */ jsxs(Field.Root, { error: errors.displayName, children: [
+      /* @__PURE__ */ jsx(Field.Label, { required: true, children: formatMessage({ id: getTrad("realm.displayName"), defaultMessage: "Display Name" }) }),
+      /* @__PURE__ */ jsx(
+        TextInput,
+        {
+          name: "displayName",
+          value: formData.displayName,
+          onChange: handleChange("displayName")
+        }
+      ),
+      /* @__PURE__ */ jsx(Field.Error, {})
+    ] }) }),
+    /* @__PURE__ */ jsx(Grid.Item, { col: 12, children: /* @__PURE__ */ jsxs(Field.Root, { error: errors.serverUrl, children: [
+      /* @__PURE__ */ jsx(Field.Label, { required: true, children: formatMessage({ id: getTrad("realm.serverUrl"), defaultMessage: "Server URL" }) }),
+      /* @__PURE__ */ jsx(
+        TextInput,
+        {
+          name: "serverUrl",
+          value: formData.serverUrl,
+          onChange: handleChange("serverUrl")
+        }
+      ),
+      /* @__PURE__ */ jsx(Field.Hint, { children: formatMessage({
+        id: getTrad("realm.serverUrl.hint"),
+        defaultMessage: "e.g., https://keycloak.example.com"
+      }) }),
+      /* @__PURE__ */ jsx(Field.Error, {})
+    ] }) }),
+    /* @__PURE__ */ jsx(Grid.Item, { col: 6, s: 12, children: /* @__PURE__ */ jsxs(Field.Root, { error: errors.realmName, children: [
+      /* @__PURE__ */ jsx(Field.Label, { required: true, children: formatMessage({ id: getTrad("realm.realmName"), defaultMessage: "Realm Name" }) }),
+      /* @__PURE__ */ jsx(
+        TextInput,
+        {
+          name: "realmName",
+          value: formData.realmName,
+          onChange: handleChange("realmName")
+        }
+      ),
+      /* @__PURE__ */ jsx(Field.Hint, { children: formatMessage({
+        id: getTrad("realm.realmName.hint"),
+        defaultMessage: "The Keycloak realm name"
+      }) }),
+      /* @__PURE__ */ jsx(Field.Error, {})
+    ] }) }),
+    /* @__PURE__ */ jsx(Grid.Item, { col: 6, s: 12, children: /* @__PURE__ */ jsxs(Field.Root, { error: errors.clientId, children: [
+      /* @__PURE__ */ jsx(Field.Label, { required: true, children: formatMessage({ id: getTrad("realm.clientId"), defaultMessage: "Client ID" }) }),
+      /* @__PURE__ */ jsx(
+        TextInput,
+        {
+          name: "clientId",
+          value: formData.clientId,
+          onChange: handleChange("clientId")
+        }
+      ),
+      /* @__PURE__ */ jsx(Field.Hint, { children: formatMessage({
+        id: getTrad("realm.clientId.hint"),
+        defaultMessage: "Service account client ID with admin permissions"
+      }) }),
+      /* @__PURE__ */ jsx(Field.Error, {})
+    ] }) }),
+    /* @__PURE__ */ jsx(Grid.Item, { col: 12, children: /* @__PURE__ */ jsxs(Field.Root, { error: errors.clientSecret, children: [
+      /* @__PURE__ */ jsx(Field.Label, { required: !isEditMode, children: formatMessage({ id: getTrad("realm.clientSecret"), defaultMessage: "Client Secret" }) }),
+      /* @__PURE__ */ jsx(
+        TextInput,
+        {
+          name: "clientSecret",
+          type: "password",
+          value: formData.clientSecret,
+          onChange: handleChange("clientSecret"),
+          placeholder: isEditMode ? "Leave empty to keep current secret" : ""
+        }
+      ),
+      /* @__PURE__ */ jsx(Field.Error, {})
+    ] }) }),
+    /* @__PURE__ */ jsx(Grid.Item, { col: 6, s: 12, children: /* @__PURE__ */ jsxs(Field.Root, { children: [
+      /* @__PURE__ */ jsx(Field.Label, { children: formatMessage({ id: getTrad("realm.color"), defaultMessage: "Color" }) }),
+      /* @__PURE__ */ jsx(
+        TextInput,
+        {
+          name: "color",
+          type: "color",
+          value: formData.color,
+          onChange: handleChange("color")
+        }
+      )
+    ] }) }),
+    /* @__PURE__ */ jsx(Grid.Item, { col: 6, s: 12, children: /* @__PURE__ */ jsxs(Flex, { direction: "column", gap: 1, children: [
+      /* @__PURE__ */ jsx(Typography, { variant: "pi", fontWeight: "bold", children: formatMessage({ id: getTrad("realm.enabled"), defaultMessage: "Enabled" }) }),
+      /* @__PURE__ */ jsx(
+        Toggle,
+        {
+          checked: formData.enabled,
+          onChange: handleToggle("enabled"),
+          onLabel: "On",
+          offLabel: "Off"
+        }
+      )
+    ] }) })
+  ] })
+] });
+const AdminsTab = ({ admins, isLoading, onEdit, onDelete }) => {
+  if (isLoading) {
+    return /* @__PURE__ */ jsx(Flex, { justifyContent: "center", padding: 8, children: /* @__PURE__ */ jsx(Loader, {}) });
+  }
+  if (admins.length === 0) {
+    return /* @__PURE__ */ jsx(Box, { background: "neutral0", padding: 6, shadow: "filterShadow", hasRadius: true, children: /* @__PURE__ */ jsx(
+      EmptyStateLayout,
+      {
+        icon: /* @__PURE__ */ jsx(User, { width: "6rem", height: "6rem" }),
+        content: "No admins assigned to this realm yet. Add an admin to allow them to manage users."
+      }
+    ) });
+  }
+  return /* @__PURE__ */ jsx(Box, { background: "neutral0", padding: 6, shadow: "filterShadow", hasRadius: true, children: /* @__PURE__ */ jsxs(Table, { colCount: 8, rowCount: admins.length + 1, children: [
+    /* @__PURE__ */ jsx(Thead, { children: /* @__PURE__ */ jsxs(Tr, { children: [
+      /* @__PURE__ */ jsx(Th, { children: /* @__PURE__ */ jsx(Typography, { variant: "sigma", children: "User" }) }),
+      /* @__PURE__ */ jsx(Th, { children: /* @__PURE__ */ jsx(Typography, { variant: "sigma", children: "Read" }) }),
+      /* @__PURE__ */ jsx(Th, { children: /* @__PURE__ */ jsx(Typography, { variant: "sigma", children: "Create" }) }),
+      /* @__PURE__ */ jsx(Th, { children: /* @__PURE__ */ jsx(Typography, { variant: "sigma", children: "Update" }) }),
+      /* @__PURE__ */ jsx(Th, { children: /* @__PURE__ */ jsx(Typography, { variant: "sigma", children: "Delete" }) }),
+      /* @__PURE__ */ jsx(Th, { children: /* @__PURE__ */ jsx(Typography, { variant: "sigma", children: "Password" }) }),
+      /* @__PURE__ */ jsx(Th, { children: /* @__PURE__ */ jsx(Typography, { variant: "sigma", children: "Roles" }) }),
+      /* @__PURE__ */ jsx(Th, { children: /* @__PURE__ */ jsx(Typography, { variant: "sigma", children: "Actions" }) })
+    ] }) }),
+    /* @__PURE__ */ jsx(Tbody, { children: admins.map((admin) => /* @__PURE__ */ jsxs(Tr, { children: [
+      /* @__PURE__ */ jsx(Td, { children: /* @__PURE__ */ jsx(Typography, { fontWeight: "bold", children: admin.strapiUserEmail }) }),
+      /* @__PURE__ */ jsx(Td, { children: /* @__PURE__ */ jsx(PermissionBadge, { enabled: admin.canRead }) }),
+      /* @__PURE__ */ jsx(Td, { children: /* @__PURE__ */ jsx(PermissionBadge, { enabled: admin.canCreate }) }),
+      /* @__PURE__ */ jsx(Td, { children: /* @__PURE__ */ jsx(PermissionBadge, { enabled: admin.canUpdate }) }),
+      /* @__PURE__ */ jsx(Td, { children: /* @__PURE__ */ jsx(PermissionBadge, { enabled: admin.canDelete }) }),
+      /* @__PURE__ */ jsx(Td, { children: /* @__PURE__ */ jsx(PermissionBadge, { enabled: admin.canResetPassword }) }),
+      /* @__PURE__ */ jsx(Td, { children: /* @__PURE__ */ jsx(PermissionBadge, { enabled: admin.canManageRoles }) }),
+      /* @__PURE__ */ jsx(Td, { children: /* @__PURE__ */ jsxs(Flex, { gap: 1, children: [
+        /* @__PURE__ */ jsx(IconButton, { withTooltip: false, label: "Edit", onClick: () => onEdit(admin), children: /* @__PURE__ */ jsx(Pencil, {}) }),
+        /* @__PURE__ */ jsx(
+          IconButton,
+          {
+            withTooltip: false,
+            label: "Remove",
+            onClick: () => onDelete(admin.strapiUserId),
+            children: /* @__PURE__ */ jsx(Trash, {})
+          }
+        )
+      ] }) })
+    ] }, admin.documentId)) })
+  ] }) });
+};
+const PermissionBadge = ({ enabled }) => /* @__PURE__ */ jsx(Badge, { backgroundColor: enabled ? "success100" : "neutral150", children: enabled ? "Yes" : "No" });
+const RealmsPage = {
+  List: RealmListPage,
+  Edit: RealmEditPage
+};
+const useKeycloakUsers = (realmId) => {
+  const client = useFetchClient();
+  const { toggleNotification } = useNotification();
+  const [users, setUsers] = useState([]);
+  const [isLoading, setIsLoading] = useState(false);
+  const [pagination, setPagination] = useState({
+    page: 1,
+    pageSize: 25,
+    total: 0,
+    pageCount: 0
+  });
+  const fetchUsers = useCallback(
+    async ({ search = "", page = 1, pageSize = 25 } = {}) => {
+      if (!realmId) return;
+      setIsLoading(true);
+      try {
+        const { data } = await client.get(`${API_BASE_PATH}/realms/${realmId}/users`, {
+          params: { search, page, pageSize }
+        });
+        setUsers(data.data?.users || []);
+        setPagination(data.data?.pagination || { page: 1, pageSize: 25, total: 0, pageCount: 0 });
+      } catch (err) {
+        toggleNotification({
+          type: "danger",
+          message: err.response?.data?.error?.message || "Failed to fetch users"
+        });
+      } finally {
+        setIsLoading(false);
+      }
+    },
+    [realmId, client, toggleNotification]
+  );
+  const getUser = useCallback(
+    async (userId) => {
+      try {
+        const { data } = await client.get(`${API_BASE_PATH}/realms/${realmId}/users/${userId}`);
+        return data.data;
+      } catch (err) {
+        toggleNotification({
+          type: "danger",
+          message: err.response?.data?.error?.message || "Failed to fetch user"
+        });
+        throw err;
+      }
+    },
+    [realmId, client, toggleNotification]
+  );
+  const createUser = useCallback(
+    async (userData) => {
+      try {
+        const { data } = await client.post(`${API_BASE_PATH}/realms/${realmId}/users`, {
+          data: userData
+        });
+        toggleNotification({
+          type: "success",
+          message: "User created successfully"
+        });
+        await fetchUsers();
+        return data.data;
+      } catch (err) {
+        toggleNotification({
+          type: "danger",
+          message: err.response?.data?.error?.message || "Failed to create user"
+        });
+        throw err;
+      }
+    },
+    [realmId, client, toggleNotification, fetchUsers]
+  );
+  const updateUser = useCallback(
+    async (userId, userData) => {
+      try {
+        const { data } = await client.put(`${API_BASE_PATH}/realms/${realmId}/users/${userId}`, {
+          data: userData
+        });
+        toggleNotification({
+          type: "success",
+          message: "User updated successfully"
+        });
+        await fetchUsers();
+        return data.data;
+      } catch (err) {
+        toggleNotification({
+          type: "danger",
+          message: err.response?.data?.error?.message || "Failed to update user"
+        });
+        throw err;
+      }
+    },
+    [realmId, client, toggleNotification, fetchUsers]
+  );
+  const deleteUser = useCallback(
+    async (userId) => {
+      try {
+        await client.del(`${API_BASE_PATH}/realms/${realmId}/users/${userId}`);
+        toggleNotification({
+          type: "success",
+          message: "User deleted successfully"
+        });
+        await fetchUsers();
+      } catch (err) {
+        toggleNotification({
+          type: "danger",
+          message: err.response?.data?.error?.message || "Failed to delete user"
+        });
+        throw err;
+      }
+    },
+    [realmId, client, toggleNotification, fetchUsers]
+  );
+  const resetPassword = useCallback(
+    async (userId, password, temporary = true) => {
+      try {
+        await client.post(`${API_BASE_PATH}/realms/${realmId}/users/${userId}/reset-password`, {
+          data: { password, temporary }
+        });
+        toggleNotification({
+          type: "success",
+          message: "Password reset successfully"
+        });
+      } catch (err) {
+        toggleNotification({
+          type: "danger",
+          message: err.response?.data?.error?.message || "Failed to reset password"
+        });
+        throw err;
+      }
+    },
+    [realmId, client, toggleNotification]
+  );
+  const enableUser = useCallback(
+    async (userId) => {
+      try {
+        await client.post(`${API_BASE_PATH}/realms/${realmId}/users/${userId}/enable`);
+        toggleNotification({
+          type: "success",
+          message: "User enabled successfully"
+        });
+        await fetchUsers();
+      } catch (err) {
+        toggleNotification({
+          type: "danger",
+          message: err.response?.data?.error?.message || "Failed to enable user"
+        });
+        throw err;
+      }
+    },
+    [realmId, client, toggleNotification, fetchUsers]
+  );
+  const disableUser = useCallback(
+    async (userId) => {
+      try {
+        await client.post(`${API_BASE_PATH}/realms/${realmId}/users/${userId}/disable`);
+        toggleNotification({
+          type: "success",
+          message: "User disabled successfully"
+        });
+        await fetchUsers();
+      } catch (err) {
+        toggleNotification({
+          type: "danger",
+          message: err.response?.data?.error?.message || "Failed to disable user"
+        });
+        throw err;
+      }
+    },
+    [realmId, client, toggleNotification, fetchUsers]
+  );
+  const sendVerificationEmail = useCallback(
+    async (userId) => {
+      try {
+        await client.post(`${API_BASE_PATH}/realms/${realmId}/users/${userId}/send-verify-email`);
+        toggleNotification({
+          type: "success",
+          message: "Verification email sent"
+        });
+      } catch (err) {
+        toggleNotification({
+          type: "danger",
+          message: err.response?.data?.error?.message || "Failed to send verification email"
+        });
+        throw err;
+      }
+    },
+    [realmId, client, toggleNotification]
+  );
+  const sendResetPasswordEmail = useCallback(
+    async (userId) => {
+      try {
+        await client.post(`${API_BASE_PATH}/realms/${realmId}/users/${userId}/send-reset-password-email`);
+        toggleNotification({
+          type: "success",
+          message: "Password reset email sent"
+        });
+      } catch (err) {
+        toggleNotification({
+          type: "danger",
+          message: err.response?.data?.error?.message || "Failed to send reset email"
+        });
+        throw err;
+      }
+    },
+    [realmId, client, toggleNotification]
+  );
+  const bulkImport = useCallback(
+    async (usersData) => {
+      try {
+        const { data } = await client.post(`${API_BASE_PATH}/realms/${realmId}/users/import`, {
+          data: { users: usersData }
+        });
+        const result = data.data;
+        toggleNotification({
+          type: result.failed.length > 0 ? "warning" : "success",
+          message: `Imported ${result.success.length} users. ${result.failed.length} failed.`
+        });
+        await fetchUsers();
+        return result;
+      } catch (err) {
+        toggleNotification({
+          type: "danger",
+          message: err.response?.data?.error?.message || "Failed to import users"
+        });
+        throw err;
+      }
+    },
+    [realmId, client, toggleNotification, fetchUsers]
+  );
+  const exportUsers = useCallback(
+    async (format = "json") => {
+      try {
+        const { data } = await client.get(`${API_BASE_PATH}/realms/${realmId}/users/export`, {
+          params: { format }
+        });
+        return format === "csv" ? data : data.data;
+      } catch (err) {
+        toggleNotification({
+          type: "danger",
+          message: err.response?.data?.error?.message || "Failed to export users"
+        });
+        throw err;
+      }
+    },
+    [realmId, client, toggleNotification]
+  );
+  useEffect(() => {
+    if (realmId) {
+      fetchUsers();
+    }
+  }, [realmId]);
+  return {
+    users,
+    isLoading,
+    pagination,
+    fetchUsers,
+    getUser,
+    createUser,
+    updateUser,
+    deleteUser,
+    resetPassword,
+    enableUser,
+    disableUser,
+    sendVerificationEmail,
+    sendResetPasswordEmail,
+    bulkImport,
+    exportUsers
+  };
+};
+const UserListPage = () => {
+  const { realmId } = useParams();
+  const navigate = useNavigate();
+  const { formatMessage } = useIntl();
+  const { fetchOne: fetchRealm } = useRealms();
+  const {
+    users,
+    isLoading,
+    pagination,
+    fetchUsers,
+    deleteUser,
+    resetPassword,
+    enableUser,
+    disableUser,
+    sendVerificationEmail,
+    exportUsers
+  } = useKeycloakUsers(realmId);
+  const [realm, setRealm] = useState(null);
+  const [search, setSearch] = useState("");
+  const [deleteId, setDeleteId] = useState(null);
+  const [resetPasswordUser, setResetPasswordUser] = useState(null);
+  const [newPassword, setNewPassword] = useState("");
+  const [temporaryPassword, setTemporaryPassword] = useState(true);
+  useEffect(() => {
+    fetchRealm(realmId).then(setRealm).catch(() => navigate(`/settings/${PLUGIN_ID}`));
+  }, [realmId, fetchRealm, navigate]);
+  const debounceRef = useRef(null);
+  const handleSearch = useCallback(
+    (value) => {
+      setSearch(value);
+      if (debounceRef.current) {
+        clearTimeout(debounceRef.current);
+      }
+      debounceRef.current = setTimeout(() => {
+        fetchUsers({ search: value, page: 1 });
+      }, 300);
+    },
+    [fetchUsers]
+  );
+  const handlePageChange = (page) => {
+    fetchUsers({ search, page });
+  };
+  const handleDelete = async () => {
+    if (deleteId) {
+      await deleteUser(deleteId);
+      setDeleteId(null);
+    }
+  };
+  const handleResetPassword = async () => {
+    if (resetPasswordUser && newPassword) {
+      await resetPassword(resetPasswordUser.id, newPassword, temporaryPassword);
+      setResetPasswordUser(null);
+      setNewPassword("");
+      setTemporaryPassword(true);
+    }
+  };
+  const handleExport = async (format) => {
+    try {
+      const data = await exportUsers(format);
+      const blob = new Blob(
+        [format === "csv" ? data : JSON.stringify(data, null, 2)],
+        { type: format === "csv" ? "text/csv" : "application/json" }
+      );
+      const url = URL.createObjectURL(blob);
+      const a = document.createElement("a");
+      a.href = url;
+      a.download = `keycloak-users-${realm?.name || realmId}.${format}`;
+      a.click();
+      URL.revokeObjectURL(url);
+    } catch {
+    }
+  };
+  if (!realm) {
+    return /* @__PURE__ */ jsx(Layouts.Root, { children: /* @__PURE__ */ jsx(Layouts.Content, { children: /* @__PURE__ */ jsx(Flex, { justifyContent: "center", padding: 8, children: /* @__PURE__ */ jsx(Loader, {}) }) }) });
+  }
+  const canCreate = realm.permissions?.canCreate;
+  const canUpdate = realm.permissions?.canUpdate;
+  const canDelete = realm.permissions?.canDelete;
+  const canResetPassword = realm.permissions?.canResetPassword;
+  return /* @__PURE__ */ jsxs(Layouts.Root, { children: [
+    /* @__PURE__ */ jsx(
+      Layouts.Header,
+      {
+        title: formatMessage({ id: getTrad("users.title"), defaultMessage: "Users" }),
+        subtitle: /* @__PURE__ */ jsxs(Flex, { alignItems: "center", gap: 2, children: [
+          /* @__PURE__ */ jsx(
+            Box,
+            {
+              width: "12px",
+              height: "12px",
+              borderRadius: "50%",
+              background: realm.color || "primary600"
+            }
+          ),
+          /* @__PURE__ */ jsx(Typography, { textColor: "neutral600", children: realm.displayName })
+        ] }),
+        navigationAction: /* @__PURE__ */ jsx(
+          Button,
+          {
+            startIcon: /* @__PURE__ */ jsx(ArrowLeft, {}),
+            variant: "ghost",
+            onClick: () => navigate(`/settings/${PLUGIN_ID}`),
+            children: formatMessage({ id: getTrad("common.back"), defaultMessage: "Back" })
+          }
+        ),
+        primaryAction: /* @__PURE__ */ jsxs(Flex, { gap: 2, children: [
+          /* @__PURE__ */ jsx(Button, { variant: "tertiary", startIcon: /* @__PURE__ */ jsx(Download, {}), onClick: () => handleExport("json"), children: formatMessage({ id: getTrad("users.export"), defaultMessage: "Export" }) }),
+          canCreate && /* @__PURE__ */ jsx(
+            Button,
+            {
+              startIcon: /* @__PURE__ */ jsx(Plus, {}),
+              onClick: () => navigate(`/settings/${PLUGIN_ID}/realms/${realmId}/users/create`),
+              children: formatMessage({ id: getTrad("users.create"), defaultMessage: "Create User" })
+            }
+          )
+        ] })
+      }
+    ),
+    /* @__PURE__ */ jsxs(Layouts.Content, { children: [
+      /* @__PURE__ */ jsx(Box, { marginBottom: 4, children: /* @__PURE__ */ jsx(Field.Root, { children: /* @__PURE__ */ jsx(
+        TextInput,
+        {
+          name: "search",
+          placeholder: formatMessage({
+            id: getTrad("users.search"),
+            defaultMessage: "Search users..."
+          }),
+          value: search,
+          onChange: (e) => handleSearch(e.target.value),
+          startAction: /* @__PURE__ */ jsx(Search, {})
+        }
+      ) }) }),
+      users.length === 0 && !isLoading ? /* @__PURE__ */ jsx(
+        EmptyStateLayout,
+        {
+          icon: /* @__PURE__ */ jsx(User, { width: "10rem", height: "10rem" }),
+          content: formatMessage({
+            id: getTrad("users.empty.description"),
+            defaultMessage: "Create your first user or adjust your search."
+          }),
+          action: canCreate && /* @__PURE__ */ jsx(
+            Button,
+            {
+              variant: "secondary",
+              startIcon: /* @__PURE__ */ jsx(Plus, {}),
+              onClick: () => navigate(`/settings/${PLUGIN_ID}/realms/${realmId}/users/create`),
+              children: formatMessage({ id: getTrad("users.create"), defaultMessage: "Create User" })
+            }
+          )
+        }
+      ) : /* @__PURE__ */ jsxs(Box, { style: { opacity: isLoading ? 0.5 : 1, transition: "opacity 0.2s" }, children: [
+        /* @__PURE__ */ jsxs(Table, { colCount: 7, rowCount: users.length + 1, children: [
+          /* @__PURE__ */ jsx(Thead, { children: /* @__PURE__ */ jsxs(Tr, { children: [
+            /* @__PURE__ */ jsx(Th, { children: /* @__PURE__ */ jsx(Typography, { variant: "sigma", children: formatMessage({ id: getTrad("user.username"), defaultMessage: "Username" }) }) }),
+            /* @__PURE__ */ jsx(Th, { children: /* @__PURE__ */ jsx(Typography, { variant: "sigma", children: formatMessage({ id: getTrad("user.email"), defaultMessage: "Email" }) }) }),
+            /* @__PURE__ */ jsx(Th, { children: /* @__PURE__ */ jsx(Typography, { variant: "sigma", children: formatMessage({ id: getTrad("user.firstName"), defaultMessage: "First Name" }) }) }),
+            /* @__PURE__ */ jsx(Th, { children: /* @__PURE__ */ jsx(Typography, { variant: "sigma", children: formatMessage({ id: getTrad("user.lastName"), defaultMessage: "Last Name" }) }) }),
+            /* @__PURE__ */ jsx(Th, { children: /* @__PURE__ */ jsx(Typography, { variant: "sigma", children: formatMessage({ id: getTrad("user.enabled"), defaultMessage: "Enabled" }) }) }),
+            /* @__PURE__ */ jsx(Th, { children: /* @__PURE__ */ jsx(Typography, { variant: "sigma", children: formatMessage({ id: getTrad("user.emailVerified"), defaultMessage: "Verified" }) }) }),
+            /* @__PURE__ */ jsx(Th, { children: /* @__PURE__ */ jsx(Typography, { variant: "sigma", children: "Actions" }) })
+          ] }) }),
+          /* @__PURE__ */ jsx(Tbody, { children: users.map((user) => /* @__PURE__ */ jsxs(Tr, { children: [
+            /* @__PURE__ */ jsx(Td, { children: /* @__PURE__ */ jsx(Typography, { textColor: "neutral800", fontWeight: "bold", children: user.username }) }),
+            /* @__PURE__ */ jsx(Td, { children: /* @__PURE__ */ jsx(Typography, { textColor: "neutral600", children: user.email || "-" }) }),
+            /* @__PURE__ */ jsx(Td, { children: /* @__PURE__ */ jsx(Typography, { textColor: "neutral600", children: user.firstName || "-" }) }),
+            /* @__PURE__ */ jsx(Td, { children: /* @__PURE__ */ jsx(Typography, { textColor: "neutral600", children: user.lastName || "-" }) }),
+            /* @__PURE__ */ jsx(Td, { children: /* @__PURE__ */ jsx(Badge, { backgroundColor: user.enabled ? "success100" : "danger100", children: user.enabled ? "Yes" : "No" }) }),
+            /* @__PURE__ */ jsx(Td, { children: /* @__PURE__ */ jsx(Badge, { backgroundColor: user.emailVerified ? "success100" : "neutral150", children: user.emailVerified ? "Yes" : "No" }) }),
+            /* @__PURE__ */ jsx(Td, { children: /* @__PURE__ */ jsxs(Flex, { gap: 1, children: [
+              canResetPassword && /* @__PURE__ */ jsx(
+                IconButton,
+                {
+                  withTooltip: false,
+                  label: "Reset Password",
+                  onClick: () => setResetPasswordUser(user),
+                  children: /* @__PURE__ */ jsx(Key, {})
+                }
+              ),
+              canUpdate && /* @__PURE__ */ jsxs(Fragment, { children: [
+                /* @__PURE__ */ jsx(
+                  IconButton,
+                  {
+                    withTooltip: false,
+                    label: user.enabled ? "Disable" : "Enable",
+                    onClick: () => user.enabled ? disableUser(user.id) : enableUser(user.id),
+                    children: user.enabled ? /* @__PURE__ */ jsx(Cross, {}) : /* @__PURE__ */ jsx(Check, {})
+                  }
+                ),
+                !user.emailVerified && /* @__PURE__ */ jsx(
+                  IconButton,
+                  {
+                    withTooltip: false,
+                    label: "Send Verification Email",
+                    onClick: () => sendVerificationEmail(user.id),
+                    children: /* @__PURE__ */ jsx(Mail, {})
+                  }
+                ),
+                /* @__PURE__ */ jsx(
+                  IconButton,
+                  {
+                    withTooltip: false,
+                    label: "Edit",
+                    onClick: () => navigate(`/settings/${PLUGIN_ID}/realms/${realmId}/users/${user.id}`),
+                    children: /* @__PURE__ */ jsx(Pencil, {})
+                  }
+                )
+              ] }),
+              canDelete && /* @__PURE__ */ jsx(IconButton, { withTooltip: false, label: "Delete", onClick: () => setDeleteId(user.id), children: /* @__PURE__ */ jsx(Trash, {}) })
+            ] }) })
+          ] }, user.id)) })
+        ] }),
+        pagination.pageCount > 1 && /* @__PURE__ */ jsx(Box, { marginTop: 4, children: /* @__PURE__ */ jsx(
+          Pagination,
+          {
+            activePage: pagination.page,
+            pageCount: pagination.pageCount,
+            onChangePage: handlePageChange
+          }
+        ) })
+      ] })
+    ] }),
+    /* @__PURE__ */ jsx(Dialog.Root, { open: !!deleteId, onOpenChange: () => setDeleteId(null), children: /* @__PURE__ */ jsxs(Dialog.Content, { children: [
+      /* @__PURE__ */ jsx(Dialog.Header, { children: "Delete User" }),
+      /* @__PURE__ */ jsx(Dialog.Body, { children: formatMessage({
+        id: getTrad("user.delete.confirm"),
+        defaultMessage: "Are you sure you want to delete this user?"
+      }) }),
+      /* @__PURE__ */ jsxs(Dialog.Footer, { children: [
+        /* @__PURE__ */ jsx(Dialog.Cancel, { children: /* @__PURE__ */ jsx(Button, { variant: "tertiary", children: "Cancel" }) }),
+        /* @__PURE__ */ jsx(Dialog.Action, { children: /* @__PURE__ */ jsx(Button, { variant: "danger-light", onClick: handleDelete, children: "Delete" }) })
+      ] })
+    ] }) }),
+    /* @__PURE__ */ jsx(Modal.Root, { open: !!resetPasswordUser, onOpenChange: () => setResetPasswordUser(null), children: /* @__PURE__ */ jsxs(Modal.Content, { children: [
+      /* @__PURE__ */ jsx(Modal.Header, { children: /* @__PURE__ */ jsx(Modal.Title, { children: formatMessage({ id: getTrad("user.resetPassword"), defaultMessage: "Reset Password" }) }) }),
+      /* @__PURE__ */ jsx(Modal.Body, { children: /* @__PURE__ */ jsxs(Flex, { direction: "column", gap: 4, children: [
+        /* @__PURE__ */ jsxs(Typography, { children: [
+          "Reset password for user: ",
+          /* @__PURE__ */ jsx("strong", { children: resetPasswordUser?.username })
+        ] }),
+        /* @__PURE__ */ jsxs(Field.Root, { children: [
+          /* @__PURE__ */ jsx(Field.Label, { required: true, children: formatMessage({ id: getTrad("password.new"), defaultMessage: "New Password" }) }),
+          /* @__PURE__ */ jsx(
+            TextInput,
+            {
+              type: "password",
+              value: newPassword,
+              onChange: (e) => setNewPassword(e.target.value)
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsxs(Flex, { alignItems: "center", gap: 2, children: [
+          /* @__PURE__ */ jsx(
+            Toggle,
+            {
+              checked: temporaryPassword,
+              onChange: () => setTemporaryPassword(!temporaryPassword),
+              onLabel: "Yes",
+              offLabel: "No"
+            }
+          ),
+          /* @__PURE__ */ jsx(Typography, { children: formatMessage({
+            id: getTrad("password.temporary"),
+            defaultMessage: "Temporary (user must change on login)"
+          }) })
+        ] })
+      ] }) }),
+      /* @__PURE__ */ jsxs(Modal.Footer, { children: [
+        /* @__PURE__ */ jsx(Modal.Close, { children: /* @__PURE__ */ jsx(Button, { variant: "tertiary", children: "Cancel" }) }),
+        /* @__PURE__ */ jsx(Button, { onClick: handleResetPassword, disabled: !newPassword, children: "Reset Password" })
+      ] })
+    ] }) })
+  ] });
+};
+const useKeycloakRoles = (realmId) => {
+  const client = useFetchClient();
+  const { toggleNotification } = useNotification();
+  const [roles, setRoles] = useState([]);
+  const [isLoading, setIsLoading] = useState(false);
+  const fetchRoles = useCallback(async () => {
+    if (!realmId) return;
+    setIsLoading(true);
+    try {
+      const { data } = await client.get(`${API_BASE_PATH}/realms/${realmId}/roles`);
+      setRoles(data.data || []);
+    } catch (err) {
+      toggleNotification({
+        type: "danger",
+        message: err.response?.data?.error?.message || "Failed to fetch roles"
+      });
+    } finally {
+      setIsLoading(false);
+    }
+  }, [realmId, client, toggleNotification]);
+  const getUserRoles = useCallback(
+    async (userId) => {
+      try {
+        const { data } = await client.get(`${API_BASE_PATH}/realms/${realmId}/users/${userId}/roles`);
+        return data.data || [];
+      } catch (err) {
+        toggleNotification({
+          type: "danger",
+          message: err.response?.data?.error?.message || "Failed to fetch user roles"
+        });
+        throw err;
+      }
+    },
+    [realmId, client, toggleNotification]
+  );
+  const assignRoles = useCallback(
+    async (userId, rolesToAssign) => {
+      try {
+        await client.post(`${API_BASE_PATH}/realms/${realmId}/users/${userId}/roles`, {
+          data: { roles: rolesToAssign }
+        });
+        toggleNotification({
+          type: "success",
+          message: "Roles assigned successfully"
+        });
+      } catch (err) {
+        toggleNotification({
+          type: "danger",
+          message: err.response?.data?.error?.message || "Failed to assign roles"
+        });
+        throw err;
+      }
+    },
+    [realmId, client, toggleNotification]
+  );
+  const removeRoles = useCallback(
+    async (userId, rolesToRemove) => {
+      try {
+        await client.del(`${API_BASE_PATH}/realms/${realmId}/users/${userId}/roles`, {
+          data: { roles: rolesToRemove }
+        });
+        toggleNotification({
+          type: "success",
+          message: "Roles removed successfully"
+        });
+      } catch (err) {
+        toggleNotification({
+          type: "danger",
+          message: err.response?.data?.error?.message || "Failed to remove roles"
+        });
+        throw err;
+      }
+    },
+    [realmId, client, toggleNotification]
+  );
+  useEffect(() => {
+    if (realmId) {
+      fetchRoles();
+    }
+  }, [realmId, fetchRoles]);
+  return {
+    roles,
+    isLoading,
+    fetchRoles,
+    getUserRoles,
+    assignRoles,
+    removeRoles
+  };
+};
+const UserEditPage = () => {
+  const { realmId, userId } = useParams();
+  const navigate = useNavigate();
+  const { formatMessage } = useIntl();
+  const { fetchOne: fetchRealm } = useRealms();
+  const { getUser, createUser, updateUser } = useKeycloakUsers(realmId);
+  const { roles, getUserRoles, assignRoles, removeRoles } = useKeycloakRoles(realmId);
+  const isEditMode = !!userId;
+  const [realm, setRealm] = useState(null);
+  const [isLoading, setIsLoading] = useState(true);
+  const [isSaving, setIsSaving] = useState(false);
+  const [formData, setFormData] = useState({
+    username: "",
+    email: "",
+    firstName: "",
+    lastName: "",
+    enabled: true,
+    emailVerified: false
+  });
+  const [selectedRoles, setSelectedRoles] = useState([]);
+  const [originalRoles, setOriginalRoles] = useState([]);
+  const [errors, setErrors] = useState({});
+  useEffect(() => {
+    const loadData = async () => {
+      try {
+        const realmData = await fetchRealm(realmId);
+        setRealm(realmData);
+        if (isEditMode) {
+          const [userData, userRoles] = await Promise.all([
+            getUser(userId),
+            getUserRoles(userId)
+          ]);
+          setFormData({
+            username: userData.username || "",
+            email: userData.email || "",
+            firstName: userData.firstName || "",
+            lastName: userData.lastName || "",
+            enabled: userData.enabled !== false,
+            emailVerified: userData.emailVerified === true
+          });
+          const roleNames = userRoles.map((r) => r.name);
+          setSelectedRoles(roleNames);
+          setOriginalRoles(roleNames);
+        }
+      } catch {
+        navigate(`/settings/${PLUGIN_ID}/realms/${realmId}/users`);
+      } finally {
+        setIsLoading(false);
+      }
+    };
+    loadData();
+  }, [realmId, userId, isEditMode, fetchRealm, getUser, getUserRoles, navigate]);
+  const handleChange = (field) => (e) => {
+    const value = e.target ? e.target.value : e;
+    setFormData((prev) => ({ ...prev, [field]: value }));
+    setErrors((prev) => ({ ...prev, [field]: null }));
+  };
+  const handleToggle = (field) => () => {
+    setFormData((prev) => ({ ...prev, [field]: !prev[field] }));
+  };
+  const validate = () => {
+    const newErrors = {};
+    if (!formData.username) {
+      newErrors.username = "Username is required";
+    }
+    if (formData.email && !/^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(formData.email)) {
+      newErrors.email = "Invalid email format";
+    }
+    setErrors(newErrors);
+    return Object.keys(newErrors).length === 0;
+  };
+  const handleSubmit = async () => {
+    if (!validate()) return;
+    setIsSaving(true);
+    try {
+      if (isEditMode) {
+        await updateUser(userId, formData);
+        const rolesToAssign = selectedRoles.filter((r) => !originalRoles.includes(r));
+        const rolesToRemove = originalRoles.filter((r) => !selectedRoles.includes(r));
+        if (rolesToAssign.length > 0) {
+          const roleObjects = roles.filter((r) => rolesToAssign.includes(r.name)).map((r) => ({ id: r.id, name: r.name }));
+          await assignRoles(userId, roleObjects);
+        }
+        if (rolesToRemove.length > 0) {
+          const roleObjects = roles.filter((r) => rolesToRemove.includes(r.name)).map((r) => ({ id: r.id, name: r.name }));
+          await removeRoles(userId, roleObjects);
+        }
+      } else {
+        const newUser = await createUser(formData);
+        if (selectedRoles.length > 0 && newUser?.id) {
+          const roleObjects = roles.filter((r) => selectedRoles.includes(r.name)).map((r) => ({ id: r.id, name: r.name }));
+          await assignRoles(newUser.id, roleObjects);
+        }
+      }
+      navigate(`/settings/${PLUGIN_ID}/realms/${realmId}/users`);
+    } catch {
+    } finally {
+      setIsSaving(false);
+    }
+  };
+  if (isLoading) {
+    return /* @__PURE__ */ jsx(Layouts.Root, { children: /* @__PURE__ */ jsx(Layouts.Content, { children: /* @__PURE__ */ jsx(Flex, { justifyContent: "center", padding: 8, children: /* @__PURE__ */ jsx(Loader, {}) }) }) });
+  }
+  return /* @__PURE__ */ jsxs(Layouts.Root, { children: [
+    /* @__PURE__ */ jsx(
+      Layouts.Header,
+      {
+        title: isEditMode ? "Edit User" : "Create User",
+        subtitle: /* @__PURE__ */ jsxs(Flex, { alignItems: "center", gap: 2, children: [
+          /* @__PURE__ */ jsx(
+            Box,
+            {
+              width: "12px",
+              height: "12px",
+              borderRadius: "50%",
+              background: realm?.color || "primary600"
+            }
+          ),
+          /* @__PURE__ */ jsx(Typography, { textColor: "neutral600", children: realm?.displayName })
+        ] }),
+        navigationAction: /* @__PURE__ */ jsx(
+          Button,
+          {
+            startIcon: /* @__PURE__ */ jsx(ArrowLeft, {}),
+            variant: "ghost",
+            onClick: () => navigate(`/settings/${PLUGIN_ID}/realms/${realmId}/users`),
+            children: formatMessage({ id: getTrad("common.back"), defaultMessage: "Back" })
+          }
+        ),
+        primaryAction: /* @__PURE__ */ jsx(Button, { startIcon: /* @__PURE__ */ jsx(Check, {}), onClick: handleSubmit, loading: isSaving, children: formatMessage({ id: getTrad("common.save"), defaultMessage: "Save" }) })
+      }
+    ),
+    /* @__PURE__ */ jsx(Layouts.Content, { children: /* @__PURE__ */ jsx(Box, { background: "neutral0", padding: 6, shadow: "filterShadow", hasRadius: true, children: /* @__PURE__ */ jsxs(Grid.Root, { gap: 4, children: [
+      /* @__PURE__ */ jsx(Grid.Item, { col: 6, s: 12, children: /* @__PURE__ */ jsxs(Field.Root, { error: errors.username, children: [
+        /* @__PURE__ */ jsx(Field.Label, { required: true, children: formatMessage({ id: getTrad("user.username"), defaultMessage: "Username" }) }),
+        /* @__PURE__ */ jsx(
+          TextInput,
+          {
+            name: "username",
+            value: formData.username,
+            onChange: handleChange("username"),
+            disabled: isEditMode
+          }
+        ),
+        /* @__PURE__ */ jsx(Field.Error, {})
+      ] }) }),
+      /* @__PURE__ */ jsx(Grid.Item, { col: 6, s: 12, children: /* @__PURE__ */ jsxs(Field.Root, { error: errors.email, children: [
+        /* @__PURE__ */ jsx(Field.Label, { children: formatMessage({ id: getTrad("user.email"), defaultMessage: "Email" }) }),
+        /* @__PURE__ */ jsx(
+          TextInput,
+          {
+            name: "email",
+            type: "email",
+            value: formData.email,
+            onChange: handleChange("email")
+          }
+        ),
+        /* @__PURE__ */ jsx(Field.Error, {})
+      ] }) }),
+      /* @__PURE__ */ jsx(Grid.Item, { col: 6, s: 12, children: /* @__PURE__ */ jsxs(Field.Root, { children: [
+        /* @__PURE__ */ jsx(Field.Label, { children: formatMessage({ id: getTrad("user.firstName"), defaultMessage: "First Name" }) }),
+        /* @__PURE__ */ jsx(
+          TextInput,
+          {
+            name: "firstName",
+            value: formData.firstName,
+            onChange: handleChange("firstName")
+          }
+        )
+      ] }) }),
+      /* @__PURE__ */ jsx(Grid.Item, { col: 6, s: 12, children: /* @__PURE__ */ jsxs(Field.Root, { children: [
+        /* @__PURE__ */ jsx(Field.Label, { children: formatMessage({ id: getTrad("user.lastName"), defaultMessage: "Last Name" }) }),
+        /* @__PURE__ */ jsx(
+          TextInput,
+          {
+            name: "lastName",
+            value: formData.lastName,
+            onChange: handleChange("lastName")
+          }
+        )
+      ] }) }),
+      /* @__PURE__ */ jsx(Grid.Item, { col: 6, s: 12, children: /* @__PURE__ */ jsxs(Flex, { direction: "column", gap: 1, children: [
+        /* @__PURE__ */ jsx(Typography, { variant: "pi", fontWeight: "bold", children: formatMessage({ id: getTrad("user.enabled"), defaultMessage: "Enabled" }) }),
+        /* @__PURE__ */ jsx(
+          Toggle,
+          {
+            checked: formData.enabled,
+            onChange: handleToggle("enabled"),
+            onLabel: "Yes",
+            offLabel: "No"
+          }
+        )
+      ] }) }),
+      /* @__PURE__ */ jsx(Grid.Item, { col: 6, s: 12, children: /* @__PURE__ */ jsxs(Flex, { direction: "column", gap: 1, children: [
+        /* @__PURE__ */ jsx(Typography, { variant: "pi", fontWeight: "bold", children: formatMessage({ id: getTrad("user.emailVerified"), defaultMessage: "Email Verified" }) }),
+        /* @__PURE__ */ jsx(
+          Toggle,
+          {
+            checked: formData.emailVerified,
+            onChange: handleToggle("emailVerified"),
+            onLabel: "Yes",
+            offLabel: "No"
+          }
+        )
+      ] }) }),
+      roles.length > 0 && /* @__PURE__ */ jsx(Grid.Item, { col: 12, children: /* @__PURE__ */ jsxs(Field.Root, { children: [
+        /* @__PURE__ */ jsx(Field.Label, { children: formatMessage({ id: getTrad("user.roles"), defaultMessage: "Roles" }) }),
+        /* @__PURE__ */ jsx(
+          MultiSelect,
+          {
+            value: selectedRoles,
+            onChange: setSelectedRoles,
+            placeholder: "Select roles...",
+            children: roles.map((role) => /* @__PURE__ */ jsx(MultiSelectOption, { value: role.name, children: role.name }, role.id))
+          }
+        )
+      ] }) })
+    ] }) }) })
+  ] });
+};
+const UsersPage = {
+  List: UserListPage,
+  Edit: UserEditPage
+};
+const useAuditLogs = (options = {}) => {
+  const { realmId, keycloakUserId } = options;
+  const client = useFetchClient();
+  const { toggleNotification } = useNotification();
+  const [logs, setLogs] = useState([]);
+  const [isLoading, setIsLoading] = useState(false);
+  const [total, setTotal] = useState(0);
+  const fetchLogs = useCallback(
+    async ({ limit = 50, offset = 0, action, realmName } = {}) => {
+      setIsLoading(true);
+      try {
+        let url = `${API_BASE_PATH}/audit-logs`;
+        const params = { limit, offset };
+        if (realmId) {
+          url = `${API_BASE_PATH}/audit-logs/realm/${realmId}`;
+        } else if (keycloakUserId) {
+          url = `${API_BASE_PATH}/audit-logs/user/${keycloakUserId}`;
+        } else {
+          if (action) params.action = action;
+          if (realmName) params.realmName = realmName;
+        }
+        const { data } = await client.get(url, { params });
+        setLogs(data.data || []);
+        setTotal(data.meta?.total || data.data?.length || 0);
+      } catch (err) {
+        toggleNotification({
+          type: "danger",
+          message: err.response?.data?.error?.message || "Failed to fetch audit logs"
+        });
+      } finally {
+        setIsLoading(false);
+      }
+    },
+    [client, toggleNotification, realmId, keycloakUserId]
+  );
+  useEffect(() => {
+    fetchLogs();
+  }, [fetchLogs]);
+  return {
+    logs,
+    isLoading,
+    total,
+    fetchLogs
+  };
+};
+const ACTION_COLORS = {
+  CREATE_USER: "success100",
+  UPDATE_USER: "primary100",
+  DELETE_USER: "danger100",
+  RESET_PASSWORD: "warning100",
+  ASSIGN_ROLE: "success100",
+  REMOVE_ROLE: "warning100",
+  ENABLE_USER: "success100",
+  DISABLE_USER: "warning100",
+  SEND_VERIFY_EMAIL: "primary100",
+  SEND_RESET_PASSWORD_EMAIL: "primary100",
+  BULK_IMPORT: "success100"
+};
+const formatDate = (dateString) => {
+  const date = new Date(dateString);
+  return date.toLocaleString();
+};
+const AuditPage = () => {
+  const navigate = useNavigate();
+  const { formatMessage } = useIntl();
+  const { realms } = useRealms();
+  const [selectedRealm, setSelectedRealm] = useState("");
+  const [selectedAction, setSelectedAction] = useState("");
+  const { logs, isLoading, fetchLogs } = useAuditLogs();
+  const handleRealmChange = (value) => {
+    setSelectedRealm(value);
+    fetchLogs({ realmName: value || void 0, action: selectedAction || void 0 });
+  };
+  const handleActionChange = (value) => {
+    setSelectedAction(value);
+    fetchLogs({ realmName: selectedRealm || void 0, action: value || void 0 });
+  };
+  return /* @__PURE__ */ jsxs(Layouts.Root, { children: [
+    /* @__PURE__ */ jsx(
+      Layouts.Header,
+      {
+        title: formatMessage({ id: getTrad("audit.title"), defaultMessage: "Audit Log" }),
+        subtitle: formatMessage({
+          id: getTrad("audit.subtitle"),
+          defaultMessage: "Track user management actions"
+        }),
+        navigationAction: /* @__PURE__ */ jsx(
+          Button,
+          {
+            startIcon: /* @__PURE__ */ jsx(ArrowLeft, {}),
+            variant: "ghost",
+            onClick: () => navigate(`/settings/${PLUGIN_ID}`),
+            children: formatMessage({ id: getTrad("common.back"), defaultMessage: "Back" })
+          }
+        )
+      }
+    ),
+    /* @__PURE__ */ jsxs(Layouts.Content, { children: [
+      /* @__PURE__ */ jsx(Box, { marginBottom: 4, children: /* @__PURE__ */ jsxs(Flex, { gap: 4, children: [
+        /* @__PURE__ */ jsx(Box, { width: "200px", children: /* @__PURE__ */ jsxs(Field.Root, { children: [
+          /* @__PURE__ */ jsx(Field.Label, { children: "Filter by Realm" }),
+          /* @__PURE__ */ jsxs(
+            SingleSelect,
+            {
+              value: selectedRealm,
+              onChange: handleRealmChange,
+              placeholder: "All realms",
+              children: [
+                /* @__PURE__ */ jsx(SingleSelectOption, { value: "", children: "All realms" }),
+                realms.map((realm) => /* @__PURE__ */ jsx(SingleSelectOption, { value: realm.name, children: realm.displayName }, realm.documentId))
+              ]
+            }
+          )
+        ] }) }),
+        /* @__PURE__ */ jsx(Box, { width: "200px", children: /* @__PURE__ */ jsxs(Field.Root, { children: [
+          /* @__PURE__ */ jsx(Field.Label, { children: "Filter by Action" }),
+          /* @__PURE__ */ jsxs(
+            SingleSelect,
+            {
+              value: selectedAction,
+              onChange: handleActionChange,
+              placeholder: "All actions",
+              children: [
+                /* @__PURE__ */ jsx(SingleSelectOption, { value: "", children: "All actions" }),
+                /* @__PURE__ */ jsx(SingleSelectOption, { value: "CREATE_USER", children: "Create User" }),
+                /* @__PURE__ */ jsx(SingleSelectOption, { value: "UPDATE_USER", children: "Update User" }),
+                /* @__PURE__ */ jsx(SingleSelectOption, { value: "DELETE_USER", children: "Delete User" }),
+                /* @__PURE__ */ jsx(SingleSelectOption, { value: "RESET_PASSWORD", children: "Reset Password" }),
+                /* @__PURE__ */ jsx(SingleSelectOption, { value: "ASSIGN_ROLE", children: "Assign Role" }),
+                /* @__PURE__ */ jsx(SingleSelectOption, { value: "REMOVE_ROLE", children: "Remove Role" }),
+                /* @__PURE__ */ jsx(SingleSelectOption, { value: "ENABLE_USER", children: "Enable User" }),
+                /* @__PURE__ */ jsx(SingleSelectOption, { value: "DISABLE_USER", children: "Disable User" }),
+                /* @__PURE__ */ jsx(SingleSelectOption, { value: "BULK_IMPORT", children: "Bulk Import" })
+              ]
+            }
+          )
+        ] }) })
+      ] }) }),
+      isLoading ? /* @__PURE__ */ jsx(Flex, { justifyContent: "center", padding: 8, children: /* @__PURE__ */ jsx(Loader, {}) }) : logs.length === 0 ? /* @__PURE__ */ jsx(
+        EmptyStateLayout,
+        {
+          icon: /* @__PURE__ */ jsx(File, { width: "10rem", height: "10rem" }),
+          content: "No audit logs found"
+        }
+      ) : /* @__PURE__ */ jsxs(Table, { colCount: 6, rowCount: logs.length + 1, children: [
+        /* @__PURE__ */ jsx(Thead, { children: /* @__PURE__ */ jsxs(Tr, { children: [
+          /* @__PURE__ */ jsx(Th, { children: /* @__PURE__ */ jsx(Typography, { variant: "sigma", children: formatMessage({ id: getTrad("audit.date"), defaultMessage: "Date" }) }) }),
+          /* @__PURE__ */ jsx(Th, { children: /* @__PURE__ */ jsx(Typography, { variant: "sigma", children: formatMessage({ id: getTrad("audit.action"), defaultMessage: "Action" }) }) }),
+          /* @__PURE__ */ jsx(Th, { children: /* @__PURE__ */ jsx(Typography, { variant: "sigma", children: formatMessage({ id: getTrad("audit.realm"), defaultMessage: "Realm" }) }) }),
+          /* @__PURE__ */ jsx(Th, { children: /* @__PURE__ */ jsx(Typography, { variant: "sigma", children: formatMessage({ id: getTrad("audit.user"), defaultMessage: "Keycloak User" }) }) }),
+          /* @__PURE__ */ jsx(Th, { children: /* @__PURE__ */ jsx(Typography, { variant: "sigma", children: formatMessage({ id: getTrad("audit.performedBy"), defaultMessage: "Performed By" }) }) }),
+          /* @__PURE__ */ jsx(Th, { children: /* @__PURE__ */ jsx(Typography, { variant: "sigma", children: "Details" }) })
+        ] }) }),
+        /* @__PURE__ */ jsx(Tbody, { children: logs.map((log) => /* @__PURE__ */ jsxs(Tr, { children: [
+          /* @__PURE__ */ jsx(Td, { children: /* @__PURE__ */ jsx(Typography, { textColor: "neutral600", children: formatDate(log.createdAt) }) }),
+          /* @__PURE__ */ jsx(Td, { children: /* @__PURE__ */ jsx(Badge, { backgroundColor: ACTION_COLORS[log.action] || "neutral150", children: log.action.replace(/_/g, " ") }) }),
+          /* @__PURE__ */ jsx(Td, { children: /* @__PURE__ */ jsx(Typography, { textColor: "neutral800", children: log.realmDisplayName || log.realmName }) }),
+          /* @__PURE__ */ jsx(Td, { children: /* @__PURE__ */ jsx(Typography, { textColor: "neutral800", children: log.keycloakUsername || log.keycloakUserId || "-" }) }),
+          /* @__PURE__ */ jsx(Td, { children: /* @__PURE__ */ jsx(Typography, { textColor: "neutral600", children: log.performedByEmail || "-" }) }),
+          /* @__PURE__ */ jsx(Td, { children: /* @__PURE__ */ jsx(Typography, { textColor: "neutral500", ellipsis: true, children: log.details ? JSON.stringify(log.details).substring(0, 50) : "-" }) })
+        ] }, log.documentId)) })
+      ] })
+    ] })
+  ] });
+};
+const App = () => {
+  return /* @__PURE__ */ jsxs(Routes, { children: [
+    /* @__PURE__ */ jsx(Route, { index: true, element: /* @__PURE__ */ jsx(RealmsPage.List, {}) }),
+    /* @__PURE__ */ jsx(Route, { path: "realms/create", element: /* @__PURE__ */ jsx(RealmsPage.Edit, {}) }),
+    /* @__PURE__ */ jsx(Route, { path: "realms/:id", element: /* @__PURE__ */ jsx(RealmsPage.Edit, {}) }),
+    /* @__PURE__ */ jsx(Route, { path: "realms/:realmId/users", element: /* @__PURE__ */ jsx(UsersPage.List, {}) }),
+    /* @__PURE__ */ jsx(Route, { path: "realms/:realmId/users/create", element: /* @__PURE__ */ jsx(UsersPage.Edit, {}) }),
+    /* @__PURE__ */ jsx(Route, { path: "realms/:realmId/users/:userId", element: /* @__PURE__ */ jsx(UsersPage.Edit, {}) }),
+    /* @__PURE__ */ jsx(Route, { path: "audit", element: /* @__PURE__ */ jsx(AuditPage, {}) })
+  ] });
+};
+export {
+  App as default
+};