@strapi-community/plugin-better-auth-dashboard 1.0.0-alpha.3 → 1.0.0-alpha.4

package/dist/admin/{Root-DBjGZL7H.mjs → Root-B1LuKMEv.mjs}

@@ -1,13 +1,13 @@
 import { jsx, jsxs, Fragment } from "react/jsx-runtime";
 import { useEffect, useState, useRef, useMemo } from "react";
 import { useQuery, useQueryClient, useMutation, QueryClient, QueryClientProvider } from "react-query";
-import { Modal, Typography, Button, Portal, Flex, IconButton, Box, Field, TextInput, Combobox, ComboboxOption, Checkbox, SingleSelect, SingleSelectOption, NumberInput, JSONInput, Textarea, Alert, Tabs, Grid, SearchForm, Searchbar, Loader, Badge, Pagination } from "@strapi/design-system";
+import { Modal, Typography, Button, Portal, Flex, IconButton, Box, Field, TextInput, Combobox, ComboboxOption, Checkbox, SingleSelect, SingleSelectOption, NumberInput, JSONInput, Textarea, Alert, Tabs, Grid, SearchForm, Searchbar, Loader, Badge } from "@strapi/design-system";
 import styled, { keyframes } from "styled-components";
 import { dashClient } from "@better-auth/infra/client";
 import { createAuthClient, InferPlugin } from "better-auth/client";
 import { Cross, Images, Trash, Plus, Pencil } from "@strapi/icons";
 import { useNotification, useFetchClient } from "@strapi/strapi/admin";
-import { g as getMediaLibraryComponent, P as PluginIcon } from "./index-BpruO4vo.mjs";
+import { g as getMediaLibraryComponent, P as PluginIcon } from "./index-QVlTR8eL.mjs";
 const dashPathMethods = () => ({
   id: "dash-path-methods",
   pathMethods: {
@@ -1038,6 +1038,7 @@ function OrganizationDetail({
   const schemaQuery = useModelSchema("organization");
   const qc = useQueryClient();
   const { toggleNotification } = useNotification();
+  const { get, put } = useFetchClient();
   const orgQuery = useQuery({
     queryKey: ["dash-org", organizationId],
     queryFn: async () => {
@@ -1084,6 +1085,16 @@ function OrganizationDetail({
       return result.data ?? [];
     }
   });
+  const strapiOrgQuery = useQuery({
+    queryKey: ["dash-strapi-org", organizationId],
+    enabled: !!orgQuery.data,
+    queryFn: async () => {
+      const { data } = await get(
+        `/better-auth-dashboard/db?uid=plugin::better-auth.organization&filters[id][$eq]=${organizationId}&pagination[pageSize]=1`
+      );
+      return data.results?.[0] ?? null;
+    }
+  });
   const [activeTab, setActiveTab] = useState("details");
   const [editName, setEditName] = useState(void 0);
   const [editSlug, setEditSlug] = useState(void 0);
@@ -1113,13 +1124,13 @@ function OrganizationDetail({
       if (editName !== void 0) body.name = editName;
       if (editSlug !== void 0) body.slug = editSlug;
       if (editLogo !== void 0) body.logo = editLogo;
-      const result = await client.dash.organization.update(
-        body,
-        withContext({ organizationId })
+      const documentId = strapiOrgQuery.data?.documentId;
+      if (!documentId)
+        throw new Error("Could not resolve documentId for organization");
+      await put(
+        `/better-auth-dashboard/db/${documentId}?uid=plugin::better-auth.organization`,
+        body
       );
-      if (result.error)
-        throw new Error(result.error.message ?? "Update failed");
-      return result.data;
     },
     onSuccess: () => {
       qc.invalidateQueries({ queryKey: ["dash-org", organizationId] });
@@ -2132,6 +2143,7 @@ function OrgAvatar({ name, logo }) {
 }
 function OrganizationsPage({ teamsEnabled }) {
   const qc = useQueryClient();
+  const { toggleNotification } = useNotification();
   const [page, setPage] = useState(1);
   const [search, setSearch] = useState("");
   const [searchInput, setSearchInput] = useState("");
@@ -2171,6 +2183,13 @@ function OrganizationsPage({ teamsEnabled }) {
     onSuccess: () => {
       setConfirmDelete(null);
       qc.invalidateQueries({ queryKey: ["dash-organizations"] });
+      toggleNotification({ type: "success", message: "Organization deleted" });
+    },
+    onError: (err) => {
+      toggleNotification({
+        type: "danger",
+        message: err.message ?? "Failed to delete organization"
+      });
     }
   });
   const deleteManyMutation = useMutation({
@@ -2183,10 +2202,20 @@ function OrganizationsPage({ teamsEnabled }) {
         throw new Error(result.error.message ?? "Delete failed");
       return result.data;
     },
-    onSuccess: () => {
+    onSuccess: (_data, organizationIds) => {
       setConfirmDeleteMany(false);
       setSelected(/* @__PURE__ */ new Set());
       qc.invalidateQueries({ queryKey: ["dash-organizations"] });
+      toggleNotification({
+        type: "success",
+        message: `${organizationIds.length} organization${organizationIds.length !== 1 ? "s" : ""} deleted`
+      });
+    },
+    onError: (err) => {
+      toggleNotification({
+        type: "danger",
+        message: err.message ?? "Failed to delete organizations"
+      });
     }
   });
   const orgs = orgsQuery.data && "organizations" in orgsQuery.data ? orgsQuery.data.organizations : [];
@@ -3269,6 +3298,42 @@ function OverviewPage() {
       return r.data;
     }
   });
+  const sessionsRaw = sessionsQuery.data ?? [];
+  const activeUserIds = [];
+  const lastActiveByUserId = /* @__PURE__ */ new Map();
+  for (const s of sessionsRaw) {
+    if (!lastActiveByUserId.has(s.userId)) {
+      lastActiveByUserId.set(s.userId, s.createdAt);
+      activeUserIds.push(s.userId);
+    }
+  }
+  const activeUsersQuery = useQuery({
+    queryKey: ["dash-active-users", activeUserIds],
+    queryFn: async () => {
+      if (activeUserIds.length === 0) return [];
+      const params = new URLSearchParams({ uid: "plugin::better-auth.user" });
+      for (let i = 0; i < activeUserIds.length; i++) {
+        params.set(`filters[id][$in][${i}]`, activeUserIds[i]);
+      }
+      params.set("pagination[pageSize]", "12");
+      const { data } = await get(
+        `/better-auth-dashboard/db?${params}`
+      );
+      return data.results ?? [];
+    },
+    enabled: feedMode === "active" && activeUserIds.length > 0
+  });
+  const chartRef = useRef(null);
+  const [chartHeight, setChartHeight] = useState(0);
+  useEffect(() => {
+    const el = chartRef.current;
+    if (!el) return;
+    const ro = new ResizeObserver((entries) => {
+      for (const entry of entries) setChartHeight(entry.contentRect.height);
+    });
+    ro.observe(el);
+    return () => ro.disconnect();
+  }, []);
   if (statsQuery.isLoading) {
     return /* @__PURE__ */ jsx(
       Flex,
@@ -3286,8 +3351,12 @@ function OverviewPage() {
   const graphData = graphQuery.data?.data ?? [];
   const rtnData = retentionQuery.data?.data ?? [];
   const users = usersQuery.data?.users ?? [];
-  const sessions = sessionsQuery.data ?? [];
   const orgCount = orgsQuery.data?.total ?? 0;
+  const activeUserMap = /* @__PURE__ */ new Map();
+  for (const u of activeUsersQuery.data ?? []) {
+    activeUserMap.set(String(u.id), u);
+  }
+  const sortedActiveUsers = activeUserIds.map((uid) => activeUserMap.get(uid)).filter((u) => u !== void 0);
   const totalSpark = graphData.map((d) => d.totalUsers);
   const newSpark = graphData.map((d) => d.newUsers);
   const activeSpark = graphData.map((d) => d.activeUsers);
@@ -3391,7 +3460,7 @@ function OverviewPage() {
       /* @__PURE__ */ jsx(DivLine, {})
     ] }),
     /* @__PURE__ */ jsxs(TwoPanel, { children: [
-      /* @__PURE__ */ jsxs(ChartCard, { $delay: 5, children: [
+      /* @__PURE__ */ jsxs(ChartCard, { ref: chartRef, $delay: 5, children: [
         /* @__PURE__ */ jsxs(ChartHeader, { children: [
           /* @__PURE__ */ jsx(ChartTitle, { children: "User Growth" }),
           /* @__PURE__ */ jsx(SeriesRow, { children: ALL_SERIES.map((s) => /* @__PURE__ */ jsxs(
@@ -3427,57 +3496,57 @@ function OverviewPage() {
           }
         )
       ] }),
-      /* @__PURE__ */ jsxs(FeedCard, { $delay: 6, children: [
-        /* @__PURE__ */ jsxs(FeedHead, { children: [
-          /* @__PURE__ */ jsx("span", { children: feedMode === "signups" ? "Recent Sign-ups" : "Recent Active" }),
-          /* @__PURE__ */ jsxs(
-            FeedSelect,
-            {
-              value: feedMode,
-              onChange: (e) => setFeedMode(e.target.value),
-              children: [
-                /* @__PURE__ */ jsx("option", { value: "signups", children: "Recent Sign-ups" }),
-                /* @__PURE__ */ jsx("option", { value: "active", children: "Recent Active" })
-              ]
-            }
-          )
-        ] }),
-        /* @__PURE__ */ jsx(FeedScroll, { children: feedMode === "signups" ? usersQuery.isLoading ? /* @__PURE__ */ jsx(Flex, { justifyContent: "center", padding: 4, children: /* @__PURE__ */ jsx(Loader, { children: "Loading…" }) }) : users.length === 0 ? /* @__PURE__ */ jsx(Empty, { children: "No users yet" }) : users.map((u) => /* @__PURE__ */ jsxs(FeedItem, { children: [
-          /* @__PURE__ */ jsxs(FeedTop, { children: [
-            /* @__PURE__ */ jsxs(Flex, { alignItems: "center", gap: 1, style: { minWidth: 0 }, children: [
-              /* @__PURE__ */ jsx(Avatar, { name: u.name, src: u.image, size: 20 }),
-              /* @__PURE__ */ jsx(FeedName, { title: u.name, children: u.name })
+      /* @__PURE__ */ jsxs(
+        FeedCard,
+        {
+          $delay: 6,
+          style: chartHeight > 0 ? { height: chartHeight } : void 0,
+          children: [
+            /* @__PURE__ */ jsxs(FeedHead, { children: [
+              /* @__PURE__ */ jsx("span", { children: feedMode === "signups" ? "Recent Sign-ups" : "Recently Active" }),
+              /* @__PURE__ */ jsxs(
+                FeedSelect,
+                {
+                  value: feedMode,
+                  onChange: (e) => setFeedMode(e.target.value),
+                  children: [
+                    /* @__PURE__ */ jsx("option", { value: "signups", children: "Recent Sign-ups" }),
+                    /* @__PURE__ */ jsx("option", { value: "active", children: "Recently Active" })
+                  ]
+                }
+              )
             ] }),
-            /* @__PURE__ */ jsx(FeedMeta, { children: relTime(u.createdAt) })
-          ] }),
-          /* @__PURE__ */ jsx(FeedEmail, { title: u.email, children: u.email })
-        ] }, u.id)) : sessionsQuery.isLoading ? /* @__PURE__ */ jsx(Flex, { justifyContent: "center", padding: 4, children: /* @__PURE__ */ jsx(Loader, { children: "Loading…" }) }) : sessions.length === 0 ? /* @__PURE__ */ jsx(Empty, { children: "No sessions yet" }) : sessions.map((s) => /* @__PURE__ */ jsxs(FeedItem, { children: [
-          /* @__PURE__ */ jsxs(FeedTop, { children: [
-            /* @__PURE__ */ jsx(
-              FeedName,
-              {
-                title: s.userAgent ?? void 0,
-                style: { fontFamily: T.mono, fontSize: 10 },
-                children: s.ipAddress ?? "—"
-              }
-            ),
-            /* @__PURE__ */ jsx(FeedMeta, { children: relTime(s.createdAt) })
-          ] }),
-          /* @__PURE__ */ jsx(
-            FeedEmail,
-            {
-              title: s.userAgent ?? void 0,
-              style: {
-                fontSize: 9,
-                overflow: "hidden",
-                textOverflow: "ellipsis",
-                whiteSpace: "nowrap"
-              },
-              children: s.userAgent ?? "Unknown agent"
-            }
-          )
-        ] }, s.documentId)) })
-      ] })
+            /* @__PURE__ */ jsx(FeedScroll, { children: feedMode === "signups" ? usersQuery.isLoading ? /* @__PURE__ */ jsx(Flex, { justifyContent: "center", padding: 4, children: /* @__PURE__ */ jsx(Loader, { children: "Loading…" }) }) : users.length === 0 ? /* @__PURE__ */ jsx(Empty, { children: "No users yet" }) : users.map((u) => /* @__PURE__ */ jsxs(FeedItem, { children: [
+              /* @__PURE__ */ jsxs(FeedTop, { children: [
+                /* @__PURE__ */ jsxs(Flex, { alignItems: "center", gap: 1, style: { minWidth: 0 }, children: [
+                  /* @__PURE__ */ jsx(Avatar, { name: u.name, src: u.image, size: 20 }),
+                  /* @__PURE__ */ jsx(FeedName, { title: u.name, children: u.name })
+                ] }),
+                /* @__PURE__ */ jsx(FeedMeta, { children: relTime(u.createdAt) })
+              ] }),
+              /* @__PURE__ */ jsx(FeedEmail, { title: u.email, children: u.email })
+            ] }, u.id)) : activeUsersQuery.isLoading || sessionsQuery.isLoading ? /* @__PURE__ */ jsx(Flex, { justifyContent: "center", padding: 4, children: /* @__PURE__ */ jsx(Loader, { children: "Loading…" }) }) : sortedActiveUsers.length === 0 ? /* @__PURE__ */ jsx(Empty, { children: "No recent activity" }) : sortedActiveUsers.map((u) => /* @__PURE__ */ jsxs(FeedItem, { children: [
+              /* @__PURE__ */ jsxs(FeedTop, { children: [
+                /* @__PURE__ */ jsxs(Flex, { alignItems: "center", gap: 1, style: { minWidth: 0 }, children: [
+                  /* @__PURE__ */ jsx(
+                    Avatar,
+                    {
+                      name: u.name,
+                      src: u.image ?? void 0,
+                      size: 20
+                    }
+                  ),
+                  /* @__PURE__ */ jsx(FeedName, { title: u.name, children: u.name })
+                ] }),
+                /* @__PURE__ */ jsx(FeedMeta, { children: relTime(
+                  lastActiveByUserId.get(String(u.id)) ?? u.createdAt
+                ) })
+              ] }),
+              /* @__PURE__ */ jsx(FeedEmail, { title: u.email, children: u.email })
+            ] }, u.documentId)) })
+          ]
+        }
+      )
     ] }),
     /* @__PURE__ */ jsxs(SectionDivider, { children: [
       /* @__PURE__ */ jsx(DivLabel, { children: "Retention & Activity" }),
@@ -3853,9 +3922,10 @@ const SessionCard = styled.div`
   align-items: flex-start;
   justify-content: space-between;
   gap: 12px;
-  padding: 10px 0;
-  border-bottom: 1px solid #f5f5f9;
-  &:last-child { border-bottom: none; }
+  padding: 10px 14px;
+  background: white;
+  border: 1px solid #eaeaef;
+  border-radius: 8px;
 `;
 const SessionMeta = styled.div`
   display: flex;
@@ -3961,6 +4031,7 @@ function UserDetailDrawer({
   const [banExpiresDays, setBanExpiresDays] = useState("");
   const [confirmRevokeAll, setConfirmRevokeAll] = useState(false);
   const [confirmRevokeSessionId, setConfirmRevokeSessionId] = useState(null);
+  const [confirmBan, setConfirmBan] = useState(false);
   const [confirmUnban, setConfirmUnban] = useState(false);
   const [confirmUnlinkAccountId, setConfirmUnlinkAccountId] = useState(null);
   const [confirmDisable2FA, setConfirmDisable2FA] = useState(false);
@@ -3984,33 +4055,18 @@ function UserDetailDrawer({
   };
   const updateMutation = useMutation({
     mutationFn: async () => {
-      const baBody = {};
-      if (editName !== void 0) baBody.name = editName;
-      if (editEmail !== void 0) baBody.email = editEmail;
+      const body = { ...editExtra };
+      if (editName !== void 0) body.name = editName;
+      if (editEmail !== void 0) body.email = editEmail;
       if (editEmailVerified !== void 0)
-        baBody.emailVerified = editEmailVerified;
-      if (editImage !== void 0) baBody.image = editImage;
-      const ops = [];
-      if (Object.keys(baBody).length > 0) {
-        ops.push(
-          client.dash.updateUser(baBody, withContext({ userId })).then((result) => {
-            if (result.error)
-              throw new Error(result.error.message ?? "Update failed");
-          })
-        );
-      }
-      if (Object.keys(editExtra).length > 0) {
-        const documentId = strapiUserQuery.data?.documentId;
-        if (!documentId)
-          throw new Error("Could not resolve documentId for user");
-        ops.push(
-          put(
-            `/better-auth-dashboard/db/${documentId}?uid=plugin::better-auth.user`,
-            editExtra
-          )
-        );
-      }
-      await Promise.all(ops);
+        body.emailVerified = editEmailVerified;
+      if (editImage !== void 0) body.image = editImage;
+      const documentId = strapiUserQuery.data?.documentId;
+      if (!documentId) throw new Error("Could not resolve documentId for user");
+      await put(
+        `/better-auth-dashboard/db/${documentId}?uid=plugin::better-auth.user`,
+        body
+      );
     },
     onSuccess: () => {
       qc.invalidateQueries({ queryKey: ["dash-user", userId] });
@@ -4092,6 +4148,7 @@ function UserDetailDrawer({
       return result.data;
     },
     onSuccess: () => {
+      setConfirmBan(false);
       qc.invalidateQueries({ queryKey: ["dash-user", userId] });
       qc.invalidateQueries({ queryKey: ["dash-users"] });
       setBanReason("");
@@ -4707,7 +4764,8 @@ function UserDetailDrawer({
               ] })
             ] })
           ] }) }),
-          banEnabled && /* @__PURE__ */ jsx(Tabs.Content, { value: "ban", children: /* @__PURE__ */ jsx(Flex, { direction: "column", gap: 4, paddingTop: 6, children: user?.banned ? /* @__PURE__ */ jsxs(Fragment, { children: [
+          banEnabled && /* @__PURE__ */ jsx(Tabs.Content, { value: "ban", children: /* @__PURE__ */ jsx(Flex, { direction: "column", gap: 5, paddingTop: 6, children: user?.banned ? /* @__PURE__ */ jsxs(FormSection, { children: [
+            /* @__PURE__ */ jsx(SectionLabel, { children: "Ban status" }),
             /* @__PURE__ */ jsxs(WarnCard, { children: [
               /* @__PURE__ */ jsx(
                 Typography,
@@ -4722,7 +4780,7 @@ function UserDetailDrawer({
                 "Reason: ",
                 user.banReason
               ] }),
-              user.banExpires && /* @__PURE__ */ jsxs(Typography, { variant: "pi", textColor: "danger600", children: [
+              user.banExpires ? /* @__PURE__ */ jsxs(Typography, { variant: "pi", textColor: "danger600", children: [
                 "Expires:",
                 " ",
                 new Date(user.banExpires).toLocaleDateString(
@@ -4734,8 +4792,7 @@ function UserDetailDrawer({
                     day: "numeric"
                   }
                 )
-              ] }),
-              !user.banExpires && /* @__PURE__ */ jsx(Typography, { variant: "pi", textColor: "danger600", children: "Duration: Permanent" })
+              ] }) : /* @__PURE__ */ jsx(Typography, { variant: "pi", textColor: "danger600", children: "Duration: Permanent" })
             ] }),
             /* @__PURE__ */ jsx(Box, { children: /* @__PURE__ */ jsx(
               Button,
@@ -4745,27 +4802,28 @@ function UserDetailDrawer({
                 children: "Lift ban"
               }
             ) })
-          ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
+          ] }) : /* @__PURE__ */ jsxs(FormSection, { children: [
+            /* @__PURE__ */ jsx(SectionLabel, { children: "Apply ban" }),
+            /* @__PURE__ */ jsxs(
+              Field.Root,
+              {
+                hint: "Optional — will be shown to the user",
+                style: { width: "100%" },
+                children: [
+                  /* @__PURE__ */ jsx(Field.Label, { children: "Reason" }),
+                  /* @__PURE__ */ jsx(
+                    TextInput,
+                    {
+                      value: banReason,
+                      onChange: (e) => setBanReason(e.target.value),
+                      placeholder: "e.g. Violated terms of service"
+                    }
+                  ),
+                  /* @__PURE__ */ jsx(Field.Hint, {})
+                ]
+              }
+            ),
             /* @__PURE__ */ jsxs(Grid.Root, { gap: 4, children: [
-              /* @__PURE__ */ jsx(Grid.Item, { col: 12, children: /* @__PURE__ */ jsxs(
-                Field.Root,
-                {
-                  hint: "Optional — will be shown to the user",
-                  style: { width: "100%" },
-                  children: [
-                    /* @__PURE__ */ jsx(Field.Label, { children: "Reason" }),
-                    /* @__PURE__ */ jsx(
-                      TextInput,
-                      {
-                        value: banReason,
-                        onChange: (e) => setBanReason(e.target.value),
-                        placeholder: "e.g. Violated terms of service"
-                      }
-                    ),
-                    /* @__PURE__ */ jsx(Field.Hint, {})
-                  ]
-                }
-              ) }),
               /* @__PURE__ */ jsx(Grid.Item, { col: 6, children: /* @__PURE__ */ jsxs(
                 Field.Root,
                 {
@@ -4786,24 +4844,13 @@ function UserDetailDrawer({
                   ]
                 }
               ) }),
-              /* @__PURE__ */ jsx(Grid.Item, { col: 6, children: banExpiryPreview ? /* @__PURE__ */ jsx(
-                Flex,
-                {
-                  direction: "column",
-                  justifyContent: "flex-end",
-                  style: { height: "100%", paddingBottom: 4 },
-                  children: /* @__PURE__ */ jsxs(PreviewPill, { children: [
-                    "⏱ Expires ",
-                    banExpiryPreview
-                  ] })
-                }
-              ) : /* @__PURE__ */ jsx(
+              /* @__PURE__ */ jsx(Grid.Item, { col: 6, children: /* @__PURE__ */ jsx(
                 Flex,
                 {
                   direction: "column",
                   justifyContent: "flex-end",
                   style: { height: "100%", paddingBottom: 4 },
-                  children: /* @__PURE__ */ jsx(PreviewPill, { children: "♾ Permanent ban" })
+                  children: /* @__PURE__ */ jsx(PreviewPill, { children: banExpiryPreview ? `⏱ Expires ${banExpiryPreview}` : "♾ Permanent ban" })
                 }
               ) })
             ] }),
@@ -4811,8 +4858,7 @@ function UserDetailDrawer({
               Button,
               {
                 variant: "danger",
-                loading: banMutation.isLoading,
-                onClick: () => banMutation.mutate(),
+                onClick: () => setConfirmBan(true),
                 children: "Ban user"
               }
             ) })
@@ -4839,19 +4885,27 @@ function UserDetailDrawer({
             ] }),
             /* @__PURE__ */ jsxs(FormSection, { children: [
               /* @__PURE__ */ jsx(SectionLabel, { children: "Active sessions" }),
-              sessionsQuery.isLoading ? /* @__PURE__ */ jsx(Flex, { justifyContent: "center", padding: 4, children: /* @__PURE__ */ jsx(Loader, { children: "Loading sessions…" }) }) : (sessionsQuery.data ?? []).length === 0 ? /* @__PURE__ */ jsx(Typography, { variant: "pi", textColor: "neutral500", children: "No active sessions." }) : /* @__PURE__ */ jsx(Flex, { direction: "column", gap: 0, alignItems: "stretch", children: (sessionsQuery.data ?? []).map((session) => /* @__PURE__ */ jsxs(SessionCard, { children: [
+              sessionsQuery.isLoading ? /* @__PURE__ */ jsx(Flex, { justifyContent: "center", padding: 4, children: /* @__PURE__ */ jsx(Loader, { children: "Loading sessions…" }) }) : (sessionsQuery.data ?? []).length === 0 ? /* @__PURE__ */ jsx(Typography, { variant: "pi", textColor: "neutral500", children: "No active sessions." }) : /* @__PURE__ */ jsx(Flex, { direction: "column", gap: 2, alignItems: "stretch", children: (sessionsQuery.data ?? []).map((session) => /* @__PURE__ */ jsxs(SessionCard, { children: [
                 /* @__PURE__ */ jsxs(SessionMeta, { children: [
-                  /* @__PURE__ */ jsxs(Flex, { gap: 2, alignItems: "center", style: { flexWrap: "wrap" }, children: [
-                    session.ipAddress && /* @__PURE__ */ jsx(IpChip, { children: session.ipAddress }),
-                    /* @__PURE__ */ jsxs(TimestampText, { children: [
-                      "Created",
-                      " ",
-                      new Date(session.createdAt).toLocaleString(),
-                      " · Expires",
-                      " ",
-                      new Date(session.expiresAt).toLocaleString()
-                    ] })
-                  ] }),
+                  /* @__PURE__ */ jsxs(
+                    Flex,
+                    {
+                      gap: 2,
+                      alignItems: "center",
+                      style: { flexWrap: "wrap" },
+                      children: [
+                        session.ipAddress && /* @__PURE__ */ jsx(IpChip, { children: session.ipAddress }),
+                        /* @__PURE__ */ jsxs(TimestampText, { children: [
+                          "Created",
+                          " ",
+                          new Date(session.createdAt).toLocaleString(),
+                          " · Expires",
+                          " ",
+                          new Date(session.expiresAt).toLocaleString()
+                        ] })
+                      ]
+                    }
+                  ),
                   session.userAgent && /* @__PURE__ */ jsx(AgentText, { children: session.userAgent })
                 ] }),
                 /* @__PURE__ */ jsx(
@@ -4913,6 +4967,18 @@ function UserDetailDrawer({
             onCancel: () => setConfirmRevokeSessionId(null)
           }
         ),
+        confirmBan && /* @__PURE__ */ jsx(
+          ConfirmDialog,
+          {
+            title: "Ban user",
+            message: banReason ? `Ban this user for the following reason: "${banReason}"? They will be prevented from signing in.` : "Are you sure you want to ban this user? They will be prevented from signing in.",
+            confirmLabel: "Ban user",
+            variant: "danger",
+            loading: banMutation.isLoading,
+            onConfirm: () => banMutation.mutate(),
+            onCancel: () => setConfirmBan(false)
+          }
+        ),
         confirmUnban && /* @__PURE__ */ jsx(
           ConfirmDialog,
           {
@@ -5143,6 +5209,7 @@ const Toolbar = styled.div`
 `;
 function UsersPage({ config }) {
   const qc = useQueryClient();
+  const { toggleNotification } = useNotification();
   const banEnabled = hasPlugin(config, "admin");
   const emailVerificationEnabled = config.emailVerification.sendVerificationEmailEnabled;
   const twoFactorEnabled = hasPlugin(config, "two-factor");
@@ -5174,6 +5241,13 @@ function UsersPage({ config }) {
       setConfirmDelete(null);
       qc.invalidateQueries({ queryKey: ["dash-users"] });
       qc.invalidateQueries({ queryKey: ["dash-user-stats"] });
+      toggleNotification({ type: "success", message: "User deleted" });
+    },
+    onError: (err) => {
+      toggleNotification({
+        type: "danger",
+        message: err.message ?? "Failed to delete user"
+      });
     }
   });
   const deleteManyMutation = useMutation({
@@ -5186,11 +5260,21 @@ function UsersPage({ config }) {
         throw new Error(result.error.message ?? "Delete failed");
       return result.data;
     },
-    onSuccess: () => {
+    onSuccess: (_data, userIds) => {
       setConfirmDeleteMany(false);
       setSelected(/* @__PURE__ */ new Set());
       qc.invalidateQueries({ queryKey: ["dash-users"] });
       qc.invalidateQueries({ queryKey: ["dash-user-stats"] });
+      toggleNotification({
+        type: "success",
+        message: `${userIds.length} user${userIds.length !== 1 ? "s" : ""} deleted`
+      });
+    },
+    onError: (err) => {
+      toggleNotification({
+        type: "danger",
+        message: err.message ?? "Failed to delete users"
+      });
     }
   });
   const banManyMutation = useMutation({
@@ -5202,10 +5286,20 @@ function UsersPage({ config }) {
       if (result.error) throw new Error(result.error.message ?? "Ban failed");
       return result.data;
     },
-    onSuccess: () => {
+    onSuccess: (_data, userIds) => {
       setConfirmBanMany(false);
       setSelected(/* @__PURE__ */ new Set());
       qc.invalidateQueries({ queryKey: ["dash-users"] });
+      toggleNotification({
+        type: "success",
+        message: `${userIds.length} user${userIds.length !== 1 ? "s" : ""} banned`
+      });
+    },
+    onError: (err) => {
+      toggleNotification({
+        type: "danger",
+        message: err.message ?? "Failed to ban users"
+      });
     }
   });
   const toggleSelect = (id) => {
@@ -5384,14 +5478,28 @@ function UsersPage({ config }) {
         user.id
       )) })
     ] }) }),
-    pageCount > 1 && /* @__PURE__ */ jsx(Flex, { justifyContent: "flex-end", children: /* @__PURE__ */ jsx(
-      Pagination,
-      {
-        activePage: page,
-        pageCount,
-        onChangePage: setPage
-      }
-    ) }),
+    pageCount > 1 && /* @__PURE__ */ jsx(Flex, { justifyContent: "flex-end", children: /* @__PURE__ */ jsxs(Flex, { gap: 2, children: [
+      /* @__PURE__ */ jsx(
+        Button,
+        {
+          variant: "tertiary",
+          size: "S",
+          disabled: page === 1,
+          onClick: () => setPage((p) => p - 1),
+          children: "Previous"
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        Button,
+        {
+          variant: "tertiary",
+          size: "S",
+          disabled: page >= pageCount,
+          onClick: () => setPage((p) => p + 1),
+          children: "Next"
+        }
+      )
+    ] }) }),
     showCreate && /* @__PURE__ */ jsx(CreateUserDialog, { onClose: () => setShowCreate(false) }),
     detailUserId && /* @__PURE__ */ jsx(
       UserDetailDrawer,

package/dist/admin/{index-xZ2FHX3i.js → index-CIxfFlzU.js}

@@ -55,7 +55,7 @@ const index = {
         id: `${PLUGIN_ID}.plugin.name`,
         defaultMessage: "Auth Dashboard"
       },
-      Component: async () => Promise.resolve().then(() => require("./Root-BnRbzS-u.js"))
+      Component: async () => Promise.resolve().then(() => require("./Root-7EredGQZ.js"))
     });
   },
   bootstrap() {

package/dist/admin/{index-BpruO4vo.mjs → index-QVlTR8eL.mjs}

@@ -54,7 +54,7 @@ const index = {
         id: `${PLUGIN_ID}.plugin.name`,
         defaultMessage: "Auth Dashboard"
       },
-      Component: async () => import("./Root-DBjGZL7H.mjs")
+      Component: async () => import("./Root-B1LuKMEv.mjs")
     });
   },
   bootstrap() {

package/dist/admin/index.js

@@ -1,4 +1,4 @@
 "use strict";
 Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
-const index = require("./index-xZ2FHX3i.js");
+const index = require("./index-CIxfFlzU.js");
 exports.default = index.index;

package/dist/admin/index.mjs

@@ -1,4 +1,4 @@
-import { i } from "./index-BpruO4vo.mjs";
+import { i } from "./index-QVlTR8eL.mjs";
 export {
   i as default
 };