@mesob/auth-react 0.4.7 → 0.5.2

package/dist/index.js

@@ -1,74 +1,63 @@
 "use client";
-import {
-  RoleUsersPage
-} from "./chunk-SGUROG23.js";
-import {
-  TenantDetailPageContent
-} from "./chunk-QPEUVMSP.js";
-import "./chunk-GBDNBY6K.js";
-import {
-  UserDetailLayoutContent
-} from "./chunk-X6EUQZSZ.js";
-import {
-  UserDetailPageContent
-} from "./chunk-NJMNRSJH.js";
-import {
-  UserActivityPageContent
-} from "./chunk-NFGFJPCX.js";
 import {
   Security
-} from "./chunk-73ZNGEWU.js";
+} from "./chunk-SBSAOWP5.js";
 import {
   AuthFormSkeleton
 } from "./chunk-5M7I7WNH.js";
 import {
   ProfileSkeleton
 } from "./chunk-NEO72TMH.js";
-import "./chunk-5BFG47VF.js";
-import "./chunk-5AEV7RAN.js";
-import "./chunk-ZZ6D4KE4.js";
-import "./chunk-TLQMK2QF.js";
-import "./chunk-6IEX2RLA.js";
-import "./chunk-UGQP733V.js";
+import {
+  getSafeRedirectFromSearch
+} from "./chunk-G2XRGSQE.js";
+import "./chunk-55WFD2Y2.js";
+import "./chunk-KWL6FBP7.js";
+import "./chunk-NUCDZRXS.js";
+import "./chunk-WBRGSWKX.js";
+import "./chunk-HVAYVDIM.js";
+import "./chunk-XGE6G3EK.js";
 import {
   ProfileLayout,
   ProfileSidebar
-} from "./chunk-SGDXNT7M.js";
-import "./chunk-X2BHF4KC.js";
-import "./chunk-DG6GRTPG.js";
+} from "./chunk-LQX2365R.js";
+import "./chunk-WTAKMSWN.js";
+import "./chunk-4CUQIZ2Q.js";
 import {
   Roles
-} from "./chunk-4NUO6F3J.js";
+} from "./chunk-ZMJUIRZ6.js";
 import {
   SessionsPage
-} from "./chunk-H5PUZDNU.js";
+} from "./chunk-YQLGGIE4.js";
 import {
   Sessions
-} from "./chunk-YFQNNSSC.js";
+} from "./chunk-C34HWZA5.js";
 import {
   TenantsPage
-} from "./chunk-6THPM5LB.js";
-import "./chunk-EWXK56WQ.js";
+} from "./chunk-GXWBGB6G.js";
+import {
+  str as str2
+} from "./chunk-EWXK56WQ.js";
 import {
   Tenants
-} from "./chunk-UY55LEIG.js";
+} from "./chunk-UN6YBSRS.js";
 import {
   UsersPage
-} from "./chunk-N4JFMKGK.js";
-import "./chunk-ECF6S2Y2.js";
+} from "./chunk-RPKO5EQ5.js";
+import "./chunk-24E7XFGP.js";
 import {
   Users
-} from "./chunk-5HAABEAS.js";
+} from "./chunk-J4Q7RYYY.js";
 import {
   Account
-} from "./chunk-4ABXALRN.js";
+} from "./chunk-XL2DCDFZ.js";
 import "./chunk-C5ZW7FD2.js";
 import {
   PermissionsPage
-} from "./chunk-T34HJRUW.js";
+} from "./chunk-CDX5V66G.js";
 import {
   Permissions
-} from "./chunk-MVVAPYUD.js";
+} from "./chunk-NLK2J4UG.js";
 import {
   DataTable
 } from "./chunk-TFVBER3Y.js";
@@ -77,68 +66,75 @@ import {
 } from "./chunk-RT5C7IAE.js";
 import {
   RoleDetailLayout
-} from "./chunk-EQWOGD4F.js";
+} from "./chunk-OPSVSBOB.js";
 import {
   RoleDetailPage
-} from "./chunk-7CLKBH5Z.js";
+} from "./chunk-S772WZD7.js";
 import {
   RolePermissionsPage
-} from "./chunk-IQNQGPIT.js";
+} from "./chunk-LJIZEECR.js";
 import {
   PermissionSelector
-} from "./chunk-GVEBIL3O.js";
+} from "./chunk-6L4K26KM.js";
 import {
+  RoleCard,
+  RolesList,
   RolesPage
-} from "./chunk-RCQTWNAG.js";
-import "./chunk-MQI6Q2S4.js";
-import "./chunk-OW75JENQ.js";
+} from "./chunk-R6ME7P5U.js";
+import {
+  str
+} from "./chunk-OW75JENQ.js";
 import {
   SignUp
-} from "./chunk-OXUOGOG3.js";
+} from "./chunk-JNVJWNJT.js";
 import {
   VerifyEmail
-} from "./chunk-VVKXFEAN.js";
+} from "./chunk-PFUTYTDB.js";
 import {
   VerifyPhone
-} from "./chunk-5E3XN6SW.js";
+} from "./chunk-22WQJ3NP.js";
 import {
   VerificationForm
-} from "./chunk-Z34NJZRL.js";
+} from "./chunk-WFHQTVY6.js";
 import {
   Deny
-} from "./chunk-CP4TTRV4.js";
+} from "./chunk-RZFCA4YG.js";
 import {
   AuthErrorBoundary,
   ErrorBoundary
 } from "./chunk-7KXTL6NT.js";
 import {
   DomainsPage
-} from "./chunk-MWMSZVH3.js";
-import "./chunk-W3D4HG5W.js";
-import "./chunk-WY2JJNZW.js";
-import "./chunk-NPW7D2HZ.js";
+} from "./chunk-BIP5XEDV.js";
+import {
+  authApi$
+} from "./chunk-QJOBPOTR.js";
+import "./chunk-QHHVGLHT.js";
+import {
+  defaultEntityQueryOptions
+} from "./chunk-NPW7D2HZ.js";
 import {
   IAMGuard
-} from "./chunk-V6ZHX4LT.js";
+} from "./chunk-DJWX4ENN.js";
 import {
   Grant
-} from "./chunk-5SDS2E3F.js";
+} from "./chunk-PCBJBXEK.js";
 import {
   AuthCard
 } from "./chunk-G2AW2H36.js";
-import "./chunk-RMJNENJB.js";
+import "./chunk-K2523VB5.js";
 import {
   ForgotPassword
-} from "./chunk-4X3CJHKR.js";
+} from "./chunk-ZGDN6MQA.js";
 import {
   ResetPasswordForm
-} from "./chunk-H7JRQFFI.js";
+} from "./chunk-TEARMXTQ.js";
 import {
   SetPassword
-} from "./chunk-TEHMLZFI.js";
+} from "./chunk-UOQGT574.js";
 import {
   SignIn
-} from "./chunk-Y4AH5JY4.js";
+} from "./chunk-VVFBMIIB.js";
 import {
   normalizePhone
 } from "./chunk-V2W3WPCZ.js";
@@ -148,7 +144,7 @@ import {
 import "./chunk-DPH2PHK3.js";
 import {
   useTranslator
-} from "./chunk-EPEXIGKB.js";
+} from "./chunk-XUV6CYTY.js";
 import {
   MesobAuthProvider,
   getSessionCookieName,
@@ -157,13 +153,928 @@ import {
   useConfig,
   useHasAuthCookie,
   useSession
-} from "./chunk-AWSAC7RT.js";
+} from "./chunk-2XIZ27DU.js";
 
 // src/hooks/use-session-cookie-name.ts
 function useSessionCookieName() {
   const { config } = useConfig();
   return getSessionCookieName(config);
 }
+
+// src/pages/iam/roles/users/_components/role-users-page.tsx
+import { IAMGuard as IAMGuard2 } from "@mesob/auth-react/components/iam/iam-guard";
+import { UserSelector } from "@mesob/auth-react/pages/iam/users/user-selector";
+import {
+  Avatar,
+  AvatarFallback,
+  AvatarImage,
+  Badge,
+  Button,
+  DataTablePagination,
+  DeleteConfirmButton,
+  DisplayTable,
+  EntityEmptyState,
+  EntityFilter,
+  EntityHeader,
+  EntityLoadingState,
+  EntitySearch,
+  EntitySort,
+  EntityViewToggle,
+  PageBody,
+  Tbody,
+  Td,
+  Th,
+  Thead,
+  Tr,
+  useEntityPagination,
+  useEntityParams
+} from "@mesob/ui/components";
+import { IconPlus, IconUser, IconUsers } from "@tabler/icons-react";
+import { useQueryClient } from "@tanstack/react-query";
+import { useMemo } from "react";
+import { toast } from "sonner";
+import { jsx, jsxs } from "react/jsx-runtime";
+var TABLE_COLUMN_COUNT = 4;
+function initials(user) {
+  return user.fullName.split(" ").filter(Boolean).slice(0, 2).map((part) => part[0]?.toUpperCase() ?? "").join("");
+}
+function UserIdentity({ user }) {
+  return /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3", children: [
+    /* @__PURE__ */ jsxs(Avatar, { className: "h-9 w-9", children: [
+      /* @__PURE__ */ jsx(AvatarImage, { src: user.image ?? void 0 }),
+      /* @__PURE__ */ jsx(AvatarFallback, { children: initials(user) })
+    ] }),
+    /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx("p", { className: "font-medium", children: user.fullName }) })
+  ] });
+}
+function UserContact({ user }) {
+  return /* @__PURE__ */ jsxs("div", { className: "space-y-1", children: [
+    user.email ? /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+      /* @__PURE__ */ jsx("span", { children: user.email }),
+      user.emailVerified ? /* @__PURE__ */ jsx(Badge, { variant: "outline", children: "Verified" }) : null
+    ] }) : null,
+    user.phone ? /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+      /* @__PURE__ */ jsx("span", { children: user.phone }),
+      user.phoneVerified ? /* @__PURE__ */ jsx(Badge, { variant: "outline", children: "Verified" }) : null
+    ] }) : null,
+    user.email || user.phone ? null : /* @__PURE__ */ jsx("span", { className: "text-muted-foreground", children: "\u2014" })
+  ] });
+}
+function UserRemoveButton({
+  roleId,
+  userId,
+  onRemove
+}) {
+  return /* @__PURE__ */ jsx(
+    DeleteConfirmButton,
+    {
+      entityName: "user",
+      onConfirm: () => onRemove(roleId, userId),
+      triggerClassName: "size-8 text-destructive hover:text-destructive"
+    }
+  );
+}
+function RoleUsersTable({
+  roleId,
+  users,
+  onRemove
+}) {
+  return /* @__PURE__ */ jsxs(DisplayTable, { withTableBorder: true, children: [
+    /* @__PURE__ */ jsx(Thead, { children: /* @__PURE__ */ jsxs(Tr, { children: [
+      /* @__PURE__ */ jsx(Th, { children: "User" }),
+      /* @__PURE__ */ jsx(Th, { children: "Contact" }),
+      /* @__PURE__ */ jsx(Th, { children: "Last sign in" }),
+      /* @__PURE__ */ jsx(Th, { className: "w-[60px]" })
+    ] }) }),
+    /* @__PURE__ */ jsx(Tbody, { children: users.map((user) => /* @__PURE__ */ jsxs(Tr, { children: [
+      /* @__PURE__ */ jsx(Td, { children: /* @__PURE__ */ jsx(UserIdentity, { user }) }),
+      /* @__PURE__ */ jsx(Td, { children: /* @__PURE__ */ jsx(UserContact, { user }) }),
+      /* @__PURE__ */ jsx(Td, { children: user.lastSignInAt ? new Date(user.lastSignInAt).toLocaleDateString() : "Never" }),
+      /* @__PURE__ */ jsx(Td, { children: /* @__PURE__ */ jsx(
+        UserRemoveButton,
+        {
+          roleId,
+          userId: user.id,
+          onRemove
+        }
+      ) })
+    ] }, user.id)) })
+  ] });
+}
+function RoleUsersCards({
+  roleId,
+  users,
+  onRemove
+}) {
+  return /* @__PURE__ */ jsx("div", { className: "grid grid-cols-1 gap-4 md:grid-cols-2 xl:grid-cols-3", children: users.map((user) => /* @__PURE__ */ jsx(
+    "div",
+    {
+      className: "rounded-xl border border-border/60 bg-card p-4 shadow-sm",
+      children: /* @__PURE__ */ jsxs("div", { className: "flex items-start justify-between gap-3", children: [
+        /* @__PURE__ */ jsxs("div", { className: "space-y-3", children: [
+          /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3", children: [
+            /* @__PURE__ */ jsxs(Avatar, { className: "h-10 w-10", children: [
+              /* @__PURE__ */ jsx(AvatarImage, { src: user.image ?? void 0 }),
+              /* @__PURE__ */ jsx(AvatarFallback, { children: initials(user) })
+            ] }),
+            /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx("p", { className: "font-semibold", children: user.fullName }) })
+          ] }),
+          /* @__PURE__ */ jsxs("div", { className: "space-y-1 text-sm text-muted-foreground", children: [
+            /* @__PURE__ */ jsx("p", { children: user.email ?? user.phone ?? "No contact info" }),
+            /* @__PURE__ */ jsxs("p", { children: [
+              "Last sign in",
+              " ",
+              user.lastSignInAt ? new Date(user.lastSignInAt).toLocaleDateString() : "never"
+            ] })
+          ] })
+        ] }),
+        /* @__PURE__ */ jsx(
+          UserRemoveButton,
+          {
+            roleId,
+            userId: user.id,
+            onRemove
+          }
+        )
+      ] })
+    },
+    user.id
+  )) });
+}
+function RoleUsersPage({ roleId }) {
+  return /* @__PURE__ */ jsx(IAMGuard2, { children: /* @__PURE__ */ jsx(RoleUsersPageContent, { roleId }) });
+}
+function RoleUsersPageContent({ roleId }) {
+  const qc = useQueryClient();
+  const { queryConfig, params, setParams } = useEntityParams({
+    searchKey: "search",
+    defaultSort: "fullName",
+    defaultOrder: "asc"
+  });
+  const usersQuery = useMemo(
+    () => ({
+      params: {
+        path: { id: roleId },
+        query: queryConfig.params.query
+      }
+    }),
+    [queryConfig, roleId]
+  );
+  const { data, isPending, isFetching } = authApi$.useQuery(
+    "get",
+    "/roles/{id}/users",
+    usersQuery,
+    { enabled: !!roleId }
+  );
+  const assignUsers = authApi$.useMutation("post", "/roles/{id}/users", {
+    onSuccess: (result) => {
+      qc.invalidateQueries({ queryKey: ["get", "/roles"] });
+      qc.invalidateQueries({ queryKey: ["get", "/roles/{id}"] });
+      qc.invalidateQueries({ queryKey: ["get", "/roles/{id}/users"] });
+      toast.success(
+        result?.created ? `${result.created} user(s) added` : "No changes"
+      );
+    },
+    onError: () => {
+      toast.error("Failed to assign users");
+    }
+  });
+  const revokeUser = authApi$.useMutation(
+    "delete",
+    "/roles/{id}/users/{userId}",
+    {
+      onSuccess: () => {
+        qc.invalidateQueries({ queryKey: ["get", "/roles"] });
+        qc.invalidateQueries({ queryKey: ["get", "/roles/{id}"] });
+        qc.invalidateQueries({ queryKey: ["get", "/roles/{id}/users"] });
+        toast.success("User removed");
+      },
+      onError: () => {
+        toast.error("Failed to remove user");
+      }
+    }
+  );
+  const users = data?.users ?? [];
+  const { total, pageCount } = useEntityPagination({
+    items: users,
+    total: data?.total,
+    pageSize: params.pageSize
+  });
+  const isLoading = isPending || isFetching;
+  const currentView = params.view || "table";
+  const handleRemoveUser = (targetRoleId, userId) => {
+    revokeUser.mutate({
+      params: {
+        path: { id: targetRoleId, userId }
+      }
+    });
+  };
+  if (!roleId) {
+    return null;
+  }
+  let content;
+  if (isLoading) {
+    content = /* @__PURE__ */ jsx(
+      EntityLoadingState,
+      {
+        view: currentView,
+        rowCount: params.pageSize,
+        columnCount: TABLE_COLUMN_COUNT,
+        cardCount: params.pageSize
+      }
+    );
+  } else if (total === 0) {
+    content = /* @__PURE__ */ jsx(
+      EntityEmptyState,
+      {
+        icon: IconUsers,
+        entityName: "user",
+        title: "No users assigned",
+        description: "Assign users from the selector to add them to this role."
+      }
+    );
+  } else if (currentView === "table") {
+    content = /* @__PURE__ */ jsxs("div", { className: "space-y-4", children: [
+      /* @__PURE__ */ jsx(
+        RoleUsersTable,
+        {
+          roleId,
+          users,
+          onRemove: handleRemoveUser
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        DataTablePagination,
+        {
+          pageIndex: params.page - 1,
+          pageSize: params.pageSize,
+          pageCount,
+          totalRows: total,
+          onPageChange: (page) => setParams({ page: page + 1 }),
+          onPageSizeChange: (pageSize) => setParams({ pageSize, page: 1 })
+        }
+      )
+    ] });
+  } else {
+    content = /* @__PURE__ */ jsxs("div", { className: "space-y-4", children: [
+      /* @__PURE__ */ jsx(
+        RoleUsersCards,
+        {
+          roleId,
+          users,
+          onRemove: handleRemoveUser
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        DataTablePagination,
+        {
+          pageIndex: params.page - 1,
+          pageSize: params.pageSize,
+          pageCount,
+          totalRows: total,
+          onPageChange: (page) => setParams({ page: page + 1 }),
+          onPageSizeChange: (pageSize) => setParams({ pageSize, page: 1 })
+        }
+      )
+    ] });
+  }
+  return /* @__PURE__ */ jsxs(PageBody, { className: "px-0 pb-6", children: [
+    /* @__PURE__ */ jsx(
+      EntityHeader,
+      {
+        icon: /* @__PURE__ */ jsx(IconUser, { className: "h-5 w-5" }),
+        title: "Role users",
+        actions: /* @__PURE__ */ jsx(
+          UserSelector,
+          {
+            trigger: /* @__PURE__ */ jsxs(Button, { size: "sm", loading: assignUsers.isPending, children: [
+              /* @__PURE__ */ jsx(IconPlus, { className: "h-4 w-4" }),
+              "Add users"
+            ] }),
+            multiple: true,
+            excludeIds: users.map((user) => user.id),
+            onSelect: (selectedUsers) => {
+              if (!selectedUsers.length) {
+                return;
+              }
+              assignUsers.mutate({
+                params: { path: { id: roleId } },
+                body: {
+                  userIds: selectedUsers.map((user) => user.id)
+                }
+              });
+            }
+          }
+        ),
+        search: /* @__PURE__ */ jsx(
+          EntitySearch,
+          {
+            paramKey: "search",
+            placeholder: "Search assigned users..."
+          }
+        ),
+        filter: /* @__PURE__ */ jsx(
+          EntityFilter,
+          {
+            options: [
+              { label: "All", value: "" },
+              { label: "Name", value: "fullName" },
+              { label: "Email", value: "email" },
+              { label: "Phone", value: "phone" }
+            ],
+            placeholder: "Search field"
+          }
+        ),
+        sort: /* @__PURE__ */ jsx(
+          EntitySort,
+          {
+            defaultSort: "fullName",
+            defaultOrder: "asc",
+            options: [
+              { label: "Created", value: "createdAt" },
+              { label: "Updated", value: "updatedAt" },
+              { label: "Name", value: "fullName" },
+              { label: "Last Sign In", value: "lastSignInAt" }
+            ]
+          }
+        ),
+        view: /* @__PURE__ */ jsx(EntityViewToggle, { views: ["table", "card"] })
+      }
+    ),
+    content
+  ] });
+}
+
+// src/pages/iam/tenants/tenant-detail-page-content.tsx
+import { IAMGuard as IAMGuard3 } from "@mesob/auth-react/components/iam/iam-guard";
+import {
+  Button as Button2,
+  Card,
+  CardContent,
+  CardHeader,
+  CardTitle,
+  EntityDetailHeader,
+  PageContainer,
+  useBreadcrumbs
+} from "@mesob/ui/components";
+import { IconBuilding } from "@tabler/icons-react";
+import { useQueryClient as useQueryClient2 } from "@tanstack/react-query";
+import { useMemo as useMemo2 } from "react";
+import { Fragment, jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
+function TenantDetailPageContent({
+  tenantId
+}) {
+  return /* @__PURE__ */ jsx2(IAMGuard3, { children: /* @__PURE__ */ jsx2(TenantDetailPageContentInner, { tenantId }) });
+}
+function TenantDetailPageContentInner({
+  tenantId
+}) {
+  const { hooks } = useApi();
+  const { config } = useConfig();
+  const homeHref = config.navigation?.defaultRedirectUrl || "/";
+  const qc = useQueryClient2();
+  const { data, isLoading } = hooks.useQuery(
+    "get",
+    "/tenants/{id}",
+    { params: { path: { id: tenantId } } },
+    { enabled: !!tenantId }
+  );
+  const tenant = data?.tenant;
+  const toggleActive = hooks.useMutation("put", "/tenants/{id}", {
+    onSuccess: () => {
+      qc.invalidateQueries({ queryKey: ["get", "/tenants/{id}"] });
+      qc.invalidateQueries({ queryKey: ["get", "/tenants"] });
+    }
+  });
+  const title = tenant ? str2(tenant.name) || tenant.id : tenantId ?? "Tenant";
+  useBreadcrumbs({
+    items: [
+      { label: "Home", href: homeHref },
+      { label: "IAM", href: "/iam" },
+      { label: "Tenants", href: "/iam/tenants" },
+      { label: title }
+    ]
+  });
+  const tabs = useMemo2(
+    () => [
+      {
+        value: "detail",
+        name: "Detail",
+        content: /* @__PURE__ */ jsxs2(Card, { className: "mt-4", children: [
+          /* @__PURE__ */ jsx2(CardHeader, { children: /* @__PURE__ */ jsx2(CardTitle, { children: "Tenant details" }) }),
+          /* @__PURE__ */ jsx2(CardContent, { className: "space-y-2 text-sm", children: tenant && /* @__PURE__ */ jsxs2(Fragment, { children: [
+            /* @__PURE__ */ jsxs2("p", { children: [
+              /* @__PURE__ */ jsx2("span", { className: "text-muted-foreground", children: "Name:" }),
+              " ",
+              str2(tenant.name) || "\u2014"
+            ] }),
+            /* @__PURE__ */ jsxs2("p", { children: [
+              /* @__PURE__ */ jsx2("span", { className: "text-muted-foreground", children: "Description:" }),
+              " ",
+              str2(tenant.description) || "\u2014"
+            ] }),
+            /* @__PURE__ */ jsxs2("p", { children: [
+              /* @__PURE__ */ jsx2("span", { className: "text-muted-foreground", children: "Language:" }),
+              " ",
+              tenant.defaultLanguage ?? "\u2014"
+            ] }),
+            /* @__PURE__ */ jsxs2("p", { children: [
+              /* @__PURE__ */ jsx2("span", { className: "text-muted-foreground", children: "Currency:" }),
+              " ",
+              tenant.defaultCurrency ?? "\u2014"
+            ] }),
+            /* @__PURE__ */ jsxs2("p", { children: [
+              /* @__PURE__ */ jsx2("span", { className: "text-muted-foreground", children: "Timezone:" }),
+              " ",
+              tenant.timezone ?? "\u2014"
+            ] })
+          ] }) })
+        ] })
+      },
+      {
+        value: "theme",
+        name: "Theme",
+        content: /* @__PURE__ */ jsxs2(Card, { className: "mt-4", children: [
+          /* @__PURE__ */ jsx2(CardHeader, { children: /* @__PURE__ */ jsx2(CardTitle, { children: "Theme" }) }),
+          /* @__PURE__ */ jsx2(CardContent, { className: "text-muted-foreground text-sm", children: "Theme settings (placeholder)" })
+        ] })
+      },
+      {
+        value: "settings",
+        name: "Settings",
+        content: /* @__PURE__ */ jsxs2(Card, { className: "mt-4", children: [
+          /* @__PURE__ */ jsx2(CardHeader, { children: /* @__PURE__ */ jsx2(CardTitle, { children: "Settings" }) }),
+          /* @__PURE__ */ jsx2(CardContent, { className: "text-muted-foreground text-sm", children: "Tenant settings (placeholder)" })
+        ] })
+      }
+    ],
+    [tenant]
+  );
+  const actions = tenant && /* @__PURE__ */ jsx2(
+    Button2,
+    {
+      variant: tenant.isActive ? "secondary" : "default",
+      size: "sm",
+      onClick: () => toggleActive.mutate({
+        params: { path: { id: tenantId } },
+        body: { isActive: !tenant.isActive }
+      }),
+      disabled: toggleActive.isPending,
+      children: tenant.isActive ? "Deactivate" : "Activate"
+    }
+  );
+  if (!tenantId) {
+    return null;
+  }
+  if (isLoading || !tenant) {
+    return /* @__PURE__ */ jsx2("div", { className: "flex flex-1 flex-col gap-4 p-4 pt-0", children: /* @__PURE__ */ jsx2("div", { className: "h-24 animate-pulse rounded-xl bg-muted" }) });
+  }
+  return /* @__PURE__ */ jsx2(PageContainer, { className: "flex flex-1 flex-col gap-4 p-4 pt-0", children: /* @__PURE__ */ jsx2(
+    EntityDetailHeader,
+    {
+      title,
+      icon: /* @__PURE__ */ jsx2(IconBuilding, { className: "h-5 w-5 text-muted-foreground" }),
+      actions,
+      tabs
+    }
+  ) });
+}
+
+// src/pages/iam/users/_components/user-detail-layout-content.tsx
+import { IAMGuard as IAMGuard4 } from "@mesob/auth-react/components/iam/iam-guard";
+import { toTitleCase } from "@mesob/common";
+import {
+  Button as Button3,
+  EntityDetailHeader as EntityDetailHeader2,
+  PageContainer as PageContainer2,
+  useBreadcrumbs as useBreadcrumbs2
+} from "@mesob/ui/components";
+import { IconUser as IconUser2 } from "@tabler/icons-react";
+import { useMemo as useMemo3 } from "react";
+import { jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
+function UserDetailLayoutContent({
+  userId,
+  children
+}) {
+  return /* @__PURE__ */ jsx3(IAMGuard4, { children: /* @__PURE__ */ jsx3(UserDetailLayoutContentInner, { userId, children }) });
+}
+function UserDetailLayoutContentInner({
+  userId,
+  children
+}) {
+  const { hooks } = useApi();
+  const { config } = useConfig();
+  const homeHref = config.navigation?.defaultRedirectUrl || "/";
+  const { data, isLoading } = hooks.useQuery(
+    "get",
+    "/users/{id}",
+    { params: { path: { id: userId } } },
+    { enabled: !!userId }
+  );
+  const user = data?.user;
+  const title = toTitleCase(user?.fullName || userId || "User");
+  useBreadcrumbs2({
+    items: [
+      { label: "Home", href: homeHref },
+      { label: "IAM", href: "/iam" },
+      { label: "Users", href: "/iam/users" },
+      { label: title }
+    ]
+  });
+  const tabs = useMemo3(
+    () => [
+      { value: "detail", name: "Detail", href: `/iam/users/${userId}` },
+      {
+        value: "activity",
+        name: "Activity",
+        href: `/iam/users/${userId}/activity`
+      }
+    ],
+    [userId]
+  );
+  if (!userId) {
+    return null;
+  }
+  return /* @__PURE__ */ jsxs3(PageContainer2, { children: [
+    /* @__PURE__ */ jsx3(
+      EntityDetailHeader2,
+      {
+        title,
+        icon: /* @__PURE__ */ jsx3(IconUser2, {}),
+        tabs,
+        loading: isLoading,
+        actions: /* @__PURE__ */ jsx3(Button3, { children: "Test Button" })
+      }
+    ),
+    children
+  ] });
+}
+
+// src/pages/iam/users/_components/user-detail-page-content.tsx
+import { IAMGuard as IAMGuard5 } from "@mesob/auth-react/components/iam/iam-guard";
+import {
+  Card as Card2,
+  CardContent as CardContent2,
+  CardHeader as CardHeader2,
+  CardTitle as CardTitle2,
+  Tooltip,
+  TooltipContent,
+  TooltipTrigger
+} from "@mesob/ui/components";
+import { IconCircleCheck } from "@tabler/icons-react";
+import { jsx as jsx4, jsxs as jsxs4 } from "react/jsx-runtime";
+function UserDetailPageContent({ userId }) {
+  return /* @__PURE__ */ jsx4(IAMGuard5, { children: /* @__PURE__ */ jsx4(UserDetailPageContentInner, { userId }) });
+}
+function UserDetailPageContentInner({ userId }) {
+  const { hooks } = useApi();
+  const { data, isLoading } = hooks.useQuery(
+    "get",
+    "/users/{id}",
+    { params: { path: { id: userId } } },
+    { enabled: !!userId }
+  );
+  const user = data?.user;
+  if (!userId) {
+    return null;
+  }
+  if (isLoading || !user) {
+    return /* @__PURE__ */ jsx4("div", { className: "h-32 animate-pulse rounded-xl bg-muted mt-4" });
+  }
+  return /* @__PURE__ */ jsxs4(Card2, { children: [
+    /* @__PURE__ */ jsx4(CardHeader2, { children: /* @__PURE__ */ jsx4(CardTitle2, { children: "User details" }) }),
+    /* @__PURE__ */ jsxs4(CardContent2, { className: "space-y-2 text-sm", children: [
+      /* @__PURE__ */ jsxs4("p", { children: [
+        /* @__PURE__ */ jsx4("span", { className: "text-muted-foreground", children: "Name:" }),
+        " ",
+        user.fullName || "\u2014"
+      ] }),
+      /* @__PURE__ */ jsxs4("p", { children: [
+        /* @__PURE__ */ jsx4("span", { className: "text-muted-foreground", children: "Email:" }),
+        " ",
+        user.email ?? "\u2014",
+        " ",
+        user.emailVerified && /* @__PURE__ */ jsxs4(Tooltip, { children: [
+          /* @__PURE__ */ jsx4(TooltipTrigger, { children: /* @__PURE__ */ jsx4(IconCircleCheck, { className: "inline size-4 text-muted-foreground" }) }),
+          /* @__PURE__ */ jsx4(TooltipContent, { children: "Email verified" })
+        ] })
+      ] }),
+      /* @__PURE__ */ jsxs4("p", { children: [
+        /* @__PURE__ */ jsx4("span", { className: "text-muted-foreground", children: "Phone:" }),
+        " ",
+        user.phone ?? "\u2014",
+        " ",
+        user.phoneVerified && /* @__PURE__ */ jsxs4(Tooltip, { children: [
+          /* @__PURE__ */ jsx4(TooltipTrigger, { children: /* @__PURE__ */ jsx4(IconCircleCheck, { className: "inline size-4 text-muted-foreground" }) }),
+          /* @__PURE__ */ jsx4(TooltipContent, { children: "Phone verified" })
+        ] })
+      ] }),
+      /* @__PURE__ */ jsxs4("p", { children: [
+        /* @__PURE__ */ jsx4("span", { className: "text-muted-foreground", children: "Last sign in:" }),
+        " ",
+        user.lastSignInAt ? new Date(user.lastSignInAt).toLocaleString() : "Never"
+      ] }),
+      user.roleCodes?.length ? /* @__PURE__ */ jsxs4("p", { children: [
+        /* @__PURE__ */ jsx4("span", { className: "text-muted-foreground", children: "Roles:" }),
+        " ",
+        user.roleCodes.join(", ")
+      ] }) : null
+    ] })
+  ] });
+}
+
+// src/pages/iam/users/activity/user-activity-page-content.tsx
+import { IAMGuard as IAMGuard6 } from "@mesob/auth-react/components/iam/iam-guard";
+import {
+  Card as Card3,
+  CardContent as CardContent3,
+  CardHeader as CardHeader3,
+  CardTitle as CardTitle3,
+  Section
+} from "@mesob/ui/components";
+import { IconCalendar as IconCalendar2 } from "@tabler/icons-react";
+
+// src/pages/iam/users/activity/_components/role-section.tsx
+import {
+  Button as Button4,
+  EntityEmptyState as EntityEmptyState2,
+  EntityLoadingState as EntityLoadingState2,
+  EntitySection,
+  useEntitySectionState as useEntitySectionState2
+} from "@mesob/ui/components";
+import { IconPlus as IconPlus2, IconShield as IconShield2 } from "@tabler/icons-react";
+import { useMemo as useMemo4, useState } from "react";
+
+// src/pages/iam/roles/_components/role-selector.tsx
+import {
+  EntitySelector,
+  useEntitySectionState
+} from "@mesob/ui/components";
+import { cn } from "@mesob/ui/lib/utils";
+import { IconCalendar, IconShield } from "@tabler/icons-react";
+import { Fragment as Fragment2, jsx as jsx5, jsxs as jsxs5 } from "react/jsx-runtime";
+function SelectableRoleCard({
+  role,
+  selected,
+  onToggle
+}) {
+  return (
+    // biome-ignore lint/a11y/useSemanticElements: div to avoid nested buttons from RoleCard
+    /* @__PURE__ */ jsx5(
+      "div",
+      {
+        role: "button",
+        tabIndex: 0,
+        onClick: onToggle,
+        onKeyDown: (e) => {
+          if (e.key === "Enter") {
+            onToggle();
+          }
+        },
+        className: cn(
+          "cursor-pointer rounded-lg transition-shadow focus:outline-none focus-visible:ring-2 focus-visible:ring-ring",
+          selected && "ring-primary ring-2"
+        ),
+        children: /* @__PURE__ */ jsx5(RoleCard, { role, mode: "static" })
+      }
+    )
+  );
+}
+var roleColumns = [
+  {
+    key: "role",
+    header: "Role",
+    cell: (role) => /* @__PURE__ */ jsxs5(Fragment2, { children: [
+      /* @__PURE__ */ jsx5("p", { className: "font-medium", children: str(role.name) || role.code }),
+      /* @__PURE__ */ jsx5("p", { className: "text-sm text-muted-foreground", children: role.code })
+    ] })
+  },
+  {
+    key: "description",
+    header: "Description",
+    cell: (role) => /* @__PURE__ */ jsx5("span", { className: "text-muted-foreground line-clamp-1 max-w-[200px]", children: str(role.description) || "\u2014" })
+  },
+  {
+    key: "created",
+    header: "Created",
+    cell: (role) => /* @__PURE__ */ jsxs5("div", { className: "flex items-center gap-1 text-muted-foreground", children: [
+      /* @__PURE__ */ jsx5(IconCalendar, { className: "h-4 w-4" }),
+      new Date(role.createdAt).toLocaleDateString()
+    ] })
+  }
+];
+function RoleSelector({
+  trigger,
+  multiple = true,
+  onSelect,
+  modalSize = "xl",
+  contentClassName
+}) {
+  const state = useEntitySectionState({
+    defaultSort: "createdAt",
+    defaultOrder: "desc",
+    defaultPageSize: 10,
+    searchParamName: "search"
+  });
+  const rolesQuery = state.queryConfig;
+  const { data, isPending, isFetching } = authApi$.useQuery(
+    "get",
+    "/roles",
+    rolesQuery,
+    defaultEntityQueryOptions
+  );
+  const roles = data?.roles ?? [];
+  const config = {
+    title: "Select role(s)",
+    modalSize,
+    contentClassName,
+    multiple,
+    entityName: "role",
+    entityIcon: IconShield,
+    columns: roleColumns,
+    columnCount: 3,
+    getItemLabel: (role) => str(role.name) || role.code,
+    searchPlaceholder: "Search roles...",
+    wrapHeaderInCard: false,
+    filterOptions: [
+      { label: "All", value: "" },
+      { label: "By Code", value: "code" }
+    ],
+    sortOptions: [
+      { label: "Created", value: "createdAt" },
+      { label: "Updated", value: "updatedAt" },
+      { label: "Code", value: "code" }
+    ],
+    showViewToggle: false,
+    renderCard: (role, selected, onToggle) => /* @__PURE__ */ jsx5(SelectableRoleCard, { role, selected, onToggle })
+  };
+  return /* @__PURE__ */ jsx5(
+    EntitySelector,
+    {
+      trigger,
+      config,
+      onSelect,
+      items: roles,
+      total: data?.total,
+      isLoading: isPending || isFetching,
+      state
+    }
+  );
+}
+
+// src/pages/iam/users/activity/_components/role-section.tsx
+import { Fragment as Fragment3, jsx as jsx6, jsxs as jsxs6 } from "react/jsx-runtime";
+var LIMIT = 100;
+var TABLE_COLUMN_COUNT2 = 4;
+function filterAndSort(roles, search, sort, order) {
+  let out = roles;
+  if (search.trim()) {
+    const q = search.trim().toLowerCase();
+    out = out.filter(
+      (r) => str(r.name).toLowerCase().includes(q) || r.code.toLowerCase().includes(q)
+    );
+  }
+  const mult = order === "asc" ? 1 : -1;
+  const by = sort === "code" ? "code" : "createdAt";
+  out = [...out].sort(
+    (a, b) => by === "code" ? mult * a.code.localeCompare(b.code) : mult * (new Date(a.createdAt).getTime() - new Date(b.createdAt).getTime())
+  );
+  return out;
+}
+function RoleSection({ userId }) {
+  const [open, setOpen] = useState(false);
+  const sectionState = useEntitySectionState2({
+    defaultSort: "createdAt",
+    defaultOrder: "desc",
+    defaultPageSize: 10,
+    filterOptions: [
+      { label: "All", value: "" },
+      { label: "By Code", value: "code" }
+    ],
+    sortOptions: [
+      { label: "Created", value: "createdAt" },
+      { label: "Updated", value: "updatedAt" },
+      { label: "Code", value: "code" }
+    ],
+    views: ["table", "card"]
+  });
+  const { data, isPending, isFetching } = authApi$.useQuery(
+    "get",
+    "/roles",
+    { params: { query: { limit: LIMIT } } },
+    { ...defaultEntityQueryOptions, enabled: open }
+  );
+  const isLoading = isPending || isFetching;
+  const roles = data?.roles ?? [];
+  const filtered = useMemo4(
+    () => filterAndSort(
+      roles,
+      sectionState.search,
+      sectionState.sort,
+      sectionState.order
+    ),
+    [roles, sectionState.search, sectionState.sort, sectionState.order]
+  );
+  const pageCount = Math.ceil(filtered.length / sectionState.pageSize) || 1;
+  const pageIndex = Math.min(sectionState.page - 1, Math.max(0, pageCount - 1));
+  const paginated = useMemo4(
+    () => filtered.slice(
+      pageIndex * sectionState.pageSize,
+      pageIndex * sectionState.pageSize + sectionState.pageSize
+    ),
+    [filtered, pageIndex, sectionState.pageSize]
+  );
+  return /* @__PURE__ */ jsx6(
+    EntitySection,
+    {
+      title: "Role",
+      state: sectionState,
+      onOpenChange: setOpen,
+      actions: /* @__PURE__ */ jsx6(
+        RoleSelector,
+        {
+          trigger: /* @__PURE__ */ jsxs6(Button4, { variant: "outline", size: "sm", children: [
+            /* @__PURE__ */ jsx6(IconPlus2, { className: "h-4 w-4" }),
+            "Add role"
+          ] }),
+          multiple: true,
+          onSelect: (roles2) => {
+            console.log("Selected roles:", userId, roles2);
+          }
+        }
+      ),
+      config: {
+        searchPlaceholder: "Search roles...",
+        filterOptions: sectionState.filterOptions,
+        sortOptions: sectionState.sortOptions,
+        views: sectionState.views
+      },
+      children: (state) => /* @__PURE__ */ jsxs6(Fragment3, { children: [
+        isLoading && /* @__PURE__ */ jsx6(
+          EntityLoadingState2,
+          {
+            view: state.view,
+            rowCount: state.pageSize,
+            columnCount: TABLE_COLUMN_COUNT2,
+            cardCount: state.pageSize
+          }
+        ),
+        !isLoading && filtered.length === 0 && /* @__PURE__ */ jsx6(
+          EntityEmptyState2,
+          {
+            icon: IconShield2,
+            entityName: "role",
+            title: "No roles",
+            description: roles.length === 0 ? "No roles in tenant." : "No matches."
+          }
+        ),
+        !isLoading && filtered.length > 0 && /* @__PURE__ */ jsx6(
+          RolesList,
+          {
+            data: paginated,
+            view: state.view,
+            pageIndex,
+            pageSize: state.pageSize,
+            pageCount,
+            totalRows: filtered.length,
+            onPageChange: (p) => state.setPage(p + 1),
+            onPageSizeChange: (size) => {
+              state.setPageSize(size);
+              state.setPage(1);
+            }
+          }
+        )
+      ] })
+    }
+  );
+}
+
+// src/pages/iam/users/activity/user-activity-page-content.tsx
+import { jsx as jsx7, jsxs as jsxs7 } from "react/jsx-runtime";
+function UserActivityPageContent({
+  userId
+}) {
+  return /* @__PURE__ */ jsx7(IAMGuard6, { children: /* @__PURE__ */ jsx7(UserActivityPageContentInner, { userId }) });
+}
+function UserActivityPageContentInner({
+  userId
+}) {
+  if (!userId) {
+    return null;
+  }
+  return /* @__PURE__ */ jsxs7("div", { className: "space-y-4", children: [
+    /* @__PURE__ */ jsxs7(Card3, { children: [
+      /* @__PURE__ */ jsx7(CardHeader3, { children: /* @__PURE__ */ jsx7(CardTitle3, { children: "Activity" }) }),
+      /* @__PURE__ */ jsxs7(CardContent3, { className: "flex items-center gap-2 text-muted-foreground text-sm", children: [
+        /* @__PURE__ */ jsx7(IconCalendar2, { className: "h-4 w-4" }),
+        "Activity (placeholder)"
+      ] })
+    ] }),
+    /* @__PURE__ */ jsx7(RoleSection, { userId }),
+    /* @__PURE__ */ jsx7(Section, { title: "Permissions", children: "test" }),
+    /* @__PURE__ */ jsx7(Section, { title: "Groups", children: "test" })
+  ] });
+}
 export {
   Account,
   AuthCard,
@@ -208,6 +1119,7 @@ export {
   VerificationForm,
   VerifyEmail,
   VerifyPhone,
+  getSafeRedirectFromSearch,
   getSessionCookieName,
   handleError,
   hasAuthCookie,