@strapi-community/plugin-better-auth-dashboard 1.0.0-beta.1 → 1.0.0-beta.2

package/dist/admin/index-CANDPUGD.mjs

@@ -1,1215 +0,0 @@
-import { jsx, jsxs } from "react/jsx-runtime";
-import { Flex, Loader } from "@strapi/design-system";
-import { Page, useFetchClient } from "@strapi/strapi/admin";
-import { useState, useRef, useEffect } from "react";
-import { useQuery } from "react-query";
-import styled, { keyframes } from "styled-components";
-import { b as PERMISSIONS, P as PLUGIN_ID, c as client } from "./index-D9CiI8Yr.mjs";
-import { A as Avatar } from "./Avatar-DNczJU0i.mjs";
-const T = {
-  bg: "#f6f6f9",
-  bgCard: "#ffffff",
-  border: "#eaeaef",
-  borderHover: "rgba(73,69,255,0.35)",
-  accent: "#4945ff",
-  green: "#5cb176",
-  greenDim: "rgba(92,177,118,0.12)",
-  amber: "#d9822f",
-  red: "#d02b20",
-  redDim: "rgba(208,43,32,0.1)",
-  purple: "#8460b8",
-  textPrimary: "#32324d",
-  textSecondary: "#666687",
-  textMuted: "#b8b8c7",
-  mono: `'SFMono-Regular', Consolas, 'Liberation Mono', Menlo, monospace`
-};
-const fadeUp = keyframes`
-  from { opacity: 0; transform: translateY(10px); }
-  to   { opacity: 1; transform: translateY(0); }
-`;
-const Wrap = styled.div`
-  padding: 28px 32px 48px;
-  background: ${T.bg};
-  min-height: 100%;
-  display: flex;
-  flex-direction: column;
-  gap: 22px;
-`;
-const SectionDivider = styled.div`
-  display: flex;
-  align-items: center;
-  gap: 10px;
-  margin-bottom: -6px;
-`;
-const DivLabel = styled.span`
-  font-size: 9px;
-  font-weight: 700;
-  letter-spacing: 0.14em;
-  text-transform: uppercase;
-  color: ${T.textMuted};
-  white-space: nowrap;
-`;
-const DivLine = styled.div`
-  flex: 1;
-  height: 1px;
-  background: ${T.border};
-`;
-const Card = styled.div`
-  background: ${T.bgCard};
-  border: 1px solid ${T.border};
-  border-radius: 12px;
-  overflow: hidden;
-  position: relative;
-  animation: ${fadeUp} 380ms ease both;
-  animation-delay: ${(p) => (p.$delay ?? 0) * 55}ms;
-  transition: border-color 200ms, box-shadow 200ms;
-  &:hover {
-    border-color: ${T.borderHover};
-    box-shadow: 0 0 0 1px ${T.borderHover}, 0 8px 32px rgba(124,109,250,0.07);
-  }
-`;
-const PillGroup = styled.div`
-  display: flex;
-  background: rgba(0,0,0,0.03);
-  border: 1px solid ${T.border};
-  border-radius: 9px;
-  padding: 3px;
-  gap: 2px;
-`;
-const Pill = styled.button`
-  appearance: none;
-  border: none;
-  cursor: pointer;
-  padding: 5px 16px;
-  border-radius: 6px;
-  font-size: 11px;
-  font-weight: 600;
-  letter-spacing: 0.03em;
-  transition: background 180ms, color 180ms;
-  background: ${(p) => p.$active ? T.accent : "transparent"};
-  color: ${(p) => p.$active ? "#fff" : T.textSecondary};
-  &:hover {
-    background: ${(p) => p.$active ? T.accent : "rgba(0,0,0,0.05)"};
-    color: ${(p) => p.$active ? "#fff" : T.textPrimary};
-  }
-`;
-const StatGrid = styled.div`
-  display: grid;
-  grid-template-columns: repeat(5, 1fr);
-  gap: 10px;
-  @media (max-width: 1200px) { grid-template-columns: repeat(3, 1fr); }
-`;
-const StatCard = styled(Card)`
-  padding: 18px 20px 0;
-  &::after {
-    content: '';
-    position: absolute;
-    top: 0; left: 0; right: 0;
-    height: 2px;
-    background: ${(p) => p.$accent};
-    opacity: 0.75;
-  }
-`;
-const StatLabel = styled.div`
-  font-size: 9px;
-  font-weight: 700;
-  letter-spacing: 0.1em;
-  text-transform: uppercase;
-  color: ${T.textMuted};
-  margin-bottom: 10px;
-`;
-const StatValue = styled.div`
-  font-size: 30px;
-  font-weight: 800;
-  color: ${T.textPrimary};
-  line-height: 1;
-  letter-spacing: -0.045em;
-  font-variant-numeric: tabular-nums;
-  margin-bottom: 10px;
-`;
-const TrendBadge = styled.span`
-  display: inline-flex;
-  align-items: center;
-  gap: 3px;
-  padding: 2px 8px;
-  border-radius: 20px;
-  font-size: 9px;
-  font-weight: 700;
-  letter-spacing: 0.03em;
-  background: ${(p) => p.$pos ? T.greenDim : T.redDim};
-  color: ${(p) => p.$pos ? T.green : T.red};
-  margin-bottom: 12px;
-`;
-const SparkWrap = styled.div`
-  height: 44px;
-  margin: 0 -20px;
-`;
-const ChartCard = styled(Card)`
-  padding: 20px 20px 12px;
-  display: flex;
-  flex-direction: column;
-  gap: 10px;
-`;
-const ChartHeader = styled.div`
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  gap: 12px;
-  flex-shrink: 0;
-`;
-const ChartTitle = styled.div`
-  font-size: 12px;
-  font-weight: 700;
-  color: ${T.textPrimary};
-  letter-spacing: 0.01em;
-`;
-const SeriesRow = styled.div`
-  display: flex;
-  align-items: center;
-  gap: 6px;
-`;
-const SeriesBtn = styled.button`
-  appearance: none;
-  border: 1px solid ${(p) => p.$on ? `${p.$c}55` : T.border};
-  background: ${(p) => p.$on ? `${p.$c}18` : "transparent"};
-  color: ${(p) => p.$on ? p.$c : T.textMuted};
-  font-size: 10px;
-  font-weight: 600;
-  padding: 3px 10px 3px 8px;
-  border-radius: 6px;
-  cursor: pointer;
-  display: flex;
-  align-items: center;
-  gap: 5px;
-  transition: all 160ms;
-  &:hover {
-    border-color: ${(p) => `${p.$c}88`};
-    color: ${(p) => p.$c};
-    background: ${(p) => `${p.$c}22`};
-  }
-`;
-const SDot = styled.span`
-  width: 6px; height: 6px;
-  border-radius: 50%;
-  background: ${(p) => p.$c};
-  display: inline-block;
-  flex-shrink: 0;
-`;
-const HoverInfo = styled.div`
-  font-size: 11px;
-  color: ${T.textSecondary};
-  font-variant-numeric: tabular-nums;
-  font-family: ${T.mono};
-  min-height: 15px;
-`;
-const TwoPanel = styled.div`
-  display: grid;
-  grid-template-columns: ${(p) => p.$ratio ?? "1fr 288px"};
-  gap: 10px;
-  align-items: stretch;
-  @media (max-width: 900px) { grid-template-columns: 1fr; }
-`;
-const FeedCard = styled(Card)`
-  display: flex;
-  flex-direction: column;
-  overflow: hidden;
-`;
-const FeedHead = styled.div`
-  padding: 13px 16px 9px;
-  border-bottom: 1px solid ${T.border};
-  font-size: 11px;
-  font-weight: 700;
-  color: ${T.textPrimary};
-  flex-shrink: 0;
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-`;
-const FeedSelect = styled.select`
-  appearance: none;
-  border: 1px solid ${T.border};
-  border-radius: 6px;
-  background: ${T.bgCard};
-  color: ${T.textSecondary};
-  font-size: 10px;
-  font-weight: 600;
-  padding: 3px 22px 3px 8px;
-  cursor: pointer;
-  outline: none;
-  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%23666687'/%3E%3C/svg%3E");
-  background-repeat: no-repeat;
-  background-position: right 7px center;
-  transition: border-color 160ms;
-  &:hover, &:focus { border-color: ${T.accent}; color: ${T.textPrimary}; }
-`;
-const FeedScroll = styled.div`
-  flex: 1;
-  overflow-y: auto;
-  min-height: 0;
-  &::-webkit-scrollbar { width: 4px; }
-  &::-webkit-scrollbar-thumb { background: ${T.textMuted}; border-radius: 2px; }
-`;
-const FeedItem = styled.div`
-  padding: 9px 14px;
-  border-bottom: 1px solid #f0f0f5;
-  display: flex;
-  flex-direction: column;
-  gap: 3px;
-  transition: background 130ms;
-  &:hover { background: #fafaff; }
-  &:last-child { border-bottom: none; }
-`;
-const FeedTop = styled.div`
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  gap: 6px;
-`;
-const FeedName = styled.span`
-  font-size: 11px;
-  font-weight: 600;
-  color: ${T.textPrimary};
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-`;
-const FeedEmail = styled.span`
-  font-size: 10px;
-  color: ${T.textSecondary};
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-  display: block;
-`;
-const FeedMeta = styled.span`
-  font-size: 9px;
-  color: ${T.textMuted};
-  white-space: nowrap;
-  font-variant-numeric: tabular-nums;
-`;
-const RtnCard = styled(Card)`
-  padding: 20px;
-  display: flex;
-  flex-direction: column;
-  gap: 12px;
-`;
-const RtnRow = styled.div`
-  display: flex;
-  align-items: center;
-  gap: 10px;
-  padding: 4px 6px;
-  border-radius: 7px;
-  transition: background 130ms;
-  background: ${(p) => p.$hov ? "#f0f0f6" : "transparent"};
-  cursor: default;
-`;
-const RtnLabel = styled.span`
-  font-size: 10px;
-  color: ${T.textSecondary};
-  min-width: 80px;
-  text-align: right;
-  white-space: nowrap;
-`;
-const RtnSize = styled.span`
-  font-size: 9px;
-  color: ${T.textMuted};
-  min-width: 52px;
-  text-align: right;
-  white-space: nowrap;
-  font-variant-numeric: tabular-nums;
-`;
-const RtnTrack = styled.div`
-  flex: 1;
-  height: 10px;
-  background: #eaeaef;
-  border-radius: 4px;
-  overflow: hidden;
-`;
-const RtnBar = styled.div`
-  width: ${(p) => Math.max(p.$w, 0.5)}%;
-  height: 100%;
-  background: hsl(${(p) => p.$hue}, 60%, 50%);
-  border-radius: 4px;
-  transition: width 0.55s cubic-bezier(0.25, 0.46, 0.45, 0.94);
-`;
-const RtnPct = styled.span`
-  font-size: 10px;
-  font-weight: 700;
-  color: hsl(${(p) => p.$hue}, 60%, 60%);
-  min-width: 38px;
-  text-align: right;
-  font-variant-numeric: tabular-nums;
-  font-family: ${T.mono};
-`;
-const RtnTip = styled.div`
-  font-size: 10px;
-  color: ${T.textSecondary};
-  min-height: 14px;
-  font-variant-numeric: tabular-nums;
-  padding: 0 6px;
-`;
-const RingGrid = styled.div`
-  display: flex;
-  flex-direction: column;
-  gap: 10px;
-`;
-const RingCard = styled(Card)`
-  padding: 18px 20px;
-  display: flex;
-  align-items: center;
-  gap: 16px;
-  flex: 1;
-`;
-const RingInfo = styled.div`
-  display: flex;
-  flex-direction: column;
-  gap: 4px;
-`;
-const RingVal = styled.div`
-  font-size: 24px;
-  font-weight: 800;
-  color: ${T.textPrimary};
-  letter-spacing: -0.04em;
-  font-variant-numeric: tabular-nums;
-  line-height: 1;
-`;
-const RingLabel = styled.div`
-  font-size: 9px;
-  font-weight: 700;
-  text-transform: uppercase;
-  letter-spacing: 0.1em;
-  color: ${T.textMuted};
-`;
-const Empty = styled.div`
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  justify-content: center;
-  padding: 32px;
-  color: ${T.textMuted};
-  font-size: 12px;
-  gap: 8px;
-`;
-function useCountUp(target, duration = 850) {
-  const [count, setCount] = useState(0);
-  const prevRef = useRef(0);
-  useEffect(() => {
-    let raf;
-    let start = 0;
-    const from = prevRef.current;
-    const diff = target - from;
-    const step = (ts) => {
-      if (!start) start = ts;
-      const progress = Math.min((ts - start) / duration, 1);
-      const eased = 1 - (1 - progress) ** 3;
-      setCount(Math.round(from + eased * diff));
-      if (progress < 1) raf = requestAnimationFrame(step);
-      else prevRef.current = target;
-    };
-    raf = requestAnimationFrame(step);
-    return () => cancelAnimationFrame(raf);
-  }, [target, duration]);
-  return count;
-}
-function Sparkline({
-  data,
-  color,
-  id
-}) {
-  const W = 300;
-  const H = 44;
-  if (data.length < 2) return /* @__PURE__ */ jsx("svg", { width: "100%", height: H });
-  const min = Math.min(...data);
-  const max = Math.max(...data, min + 1);
-  const pts = data.map((v, i) => ({
-    x: i / (data.length - 1) * W,
-    y: H - 3 - (v - min) / (max - min) * (H - 8)
-  }));
-  const line = pts.reduce((a, p, i) => {
-    if (i === 0) return `M ${p.x} ${p.y}`;
-    const pr = pts[i - 1];
-    const cx = (pr.x + p.x) / 2;
-    return `${a} C ${cx} ${pr.y} ${cx} ${p.y} ${p.x} ${p.y}`;
-  }, "");
-  const area = `${line} L ${pts.at(-1).x} ${H} L 0 ${H} Z`;
-  const gid = `spk-${id}`;
-  return /* @__PURE__ */ jsxs(
-    "svg",
-    {
-      width: "100%",
-      height: H,
-      viewBox: `0 0 ${W} ${H}`,
-      preserveAspectRatio: "none",
-      "aria-hidden": true,
-      children: [
-        /* @__PURE__ */ jsx("defs", { children: /* @__PURE__ */ jsxs("linearGradient", { id: gid, x1: "0", y1: "0", x2: "0", y2: "1", children: [
-          /* @__PURE__ */ jsx("stop", { offset: "0%", stopColor: color, stopOpacity: "0.32" }),
-          /* @__PURE__ */ jsx("stop", { offset: "100%", stopColor: color, stopOpacity: "0" })
-        ] }) }),
-        /* @__PURE__ */ jsx("path", { d: area, fill: `url(#${gid})` }),
-        /* @__PURE__ */ jsx(
-          "path",
-          {
-            d: line,
-            stroke: color,
-            strokeWidth: "1.6",
-            fill: "none",
-            strokeLinecap: "round"
-          }
-        )
-      ]
-    }
-  );
-}
-const ALL_SERIES = [
-  { key: "totalUsers", color: T.accent, label: "Total" },
-  { key: "newUsers", color: T.green, label: "New" },
-  { key: "activeUsers", color: T.amber, label: "Active" }
-];
-function GrowthChart({
-  data,
-  hovered,
-  onHover,
-  activeSeries
-}) {
-  const W = 600;
-  const H = 200;
-  const PL = 40;
-  const PR = 12;
-  const PT = 12;
-  const PB = 28;
-  const CW = W - PL - PR;
-  const CH = H - PT - PB;
-  if (!data.length) {
-    return /* @__PURE__ */ jsxs(Empty, { children: [
-      /* @__PURE__ */ jsx("div", { style: { fontSize: 24 }, children: "📊" }),
-      /* @__PURE__ */ jsx("div", { children: "No growth data for this period" })
-    ] });
-  }
-  const active = ALL_SERIES.filter((s) => activeSeries.has(s.key));
-  const allVals = data.flatMap((d) => active.map((s) => d[s.key]));
-  const maxV = Math.max(...allVals, 10);
-  const yMax = Math.ceil(maxV * 1.15);
-  const xp = (i) => PL + i / Math.max(data.length - 1, 1) * CW;
-  const yp = (v) => PT + (1 - v / yMax) * CH;
-  const smooth = (vals) => {
-    const pts = vals.map((v, i) => ({ x: xp(i), y: yp(v) }));
-    const path = pts.reduce((a, p, i) => {
-      if (i === 0) return `M ${p.x} ${p.y}`;
-      const pr = pts[i - 1];
-      const cx = (pr.x + p.x) / 2;
-      return `${a} C ${cx} ${pr.y} ${cx} ${p.y} ${p.x} ${p.y}`;
-    }, "");
-    const area = `${path} L ${pts.at(-1).x} ${PT + CH} L ${pts[0].x} ${PT + CH} Z`;
-    return { pts, path, area };
-  };
-  const lines = active.map((s) => ({
-    ...s,
-    ...smooth(data.map((d) => d[s.key]))
-  }));
-  const yTicks = Array.from({ length: 5 }, (_, i) => {
-    const v = yMax * (4 - i) / 4;
-    return { v: Math.round(v), y: yp(v) };
-  });
-  const step = Math.max(1, Math.ceil(data.length / 8));
-  const segW = CW / Math.max(data.length - 1, 1);
-  return /* @__PURE__ */ jsxs(
-    "svg",
-    {
-      width: "100%",
-      viewBox: `0 0 ${W} ${H}`,
-      preserveAspectRatio: "xMidYMid meet",
-      style: { display: "block" },
-      "aria-label": "User growth chart",
-      role: "img",
-      children: [
-        /* @__PURE__ */ jsx("defs", { children: lines.map((s) => /* @__PURE__ */ jsxs(
-          "linearGradient",
-          {
-            id: `ag-${s.key}`,
-            x1: "0",
-            y1: "0",
-            x2: "0",
-            y2: "1",
-            children: [
-              /* @__PURE__ */ jsx("stop", { offset: "0%", stopColor: s.color, stopOpacity: "0.18" }),
-              /* @__PURE__ */ jsx("stop", { offset: "100%", stopColor: s.color, stopOpacity: "0" })
-            ]
-          },
-          s.key
-        )) }),
-        yTicks.map((t) => /* @__PURE__ */ jsxs("g", { children: [
-          /* @__PURE__ */ jsx(
-            "line",
-            {
-              x1: PL,
-              y1: t.y,
-              x2: W - PR,
-              y2: t.y,
-              stroke: "#eaeaef",
-              strokeWidth: "1"
-            }
-          ),
-          /* @__PURE__ */ jsx(
-            "text",
-            {
-              x: PL - 6,
-              y: t.y + 4,
-              textAnchor: "end",
-              fill: T.textMuted,
-              fontSize: "9",
-              children: t.v >= 1e3 ? `${(t.v / 1e3).toFixed(1)}k` : t.v
-            }
-          )
-        ] }, t.v)),
-        /* @__PURE__ */ jsx(
-          "line",
-          {
-            x1: PL,
-            y1: PT + CH,
-            x2: W - PR,
-            y2: PT + CH,
-            stroke: "#eaeaef",
-            strokeWidth: "1"
-          }
-        ),
-        lines.map((s) => /* @__PURE__ */ jsx("path", { d: s.area, fill: `url(#ag-${s.key})` }, `area-${s.key}`)),
-        lines.map((s) => /* @__PURE__ */ jsx(
-          "path",
-          {
-            d: s.path,
-            stroke: s.color,
-            strokeWidth: "2",
-            fill: "none",
-            strokeLinecap: "round",
-            strokeLinejoin: "round"
-          },
-          `line-${s.key}`
-        )),
-        data.map((d, i) => {
-          if (i % step !== 0 && i !== data.length - 1) return null;
-          return /* @__PURE__ */ jsx(
-            "text",
-            {
-              x: xp(i),
-              y: H - 6,
-              textAnchor: "middle",
-              fill: T.textMuted,
-              fontSize: "9",
-              children: d.label
-            },
-            i
-          );
-        }),
-        data.map((d, i) => {
-          const isHov = hovered === i;
-          return (
-            // biome-ignore lint/a11y/noStaticElementInteractions: SVG chart hover
-            /* @__PURE__ */ jsxs(
-              "g",
-              {
-                onMouseEnter: () => onHover(i),
-                onMouseLeave: () => onHover(null),
-                style: { cursor: "crosshair" },
-                children: [
-                  /* @__PURE__ */ jsx(
-                    "rect",
-                    {
-                      x: xp(i) - segW / 2,
-                      y: PT,
-                      width: segW,
-                      height: CH,
-                      fill: "transparent"
-                    }
-                  ),
-                  isHov && /* @__PURE__ */ jsx(
-                    "line",
-                    {
-                      x1: xp(i),
-                      y1: PT,
-                      x2: xp(i),
-                      y2: PT + CH,
-                      stroke: "rgba(50,50,77,0.2)",
-                      strokeWidth: "1",
-                      strokeDasharray: "3 3"
-                    }
-                  ),
-                  lines.map((s) => /* @__PURE__ */ jsx(
-                    "circle",
-                    {
-                      cx: xp(i),
-                      cy: yp(d[s.key]),
-                      r: isHov ? 4 : 2.5,
-                      fill: s.color,
-                      stroke: T.bg,
-                      strokeWidth: isHov ? 2 : 1,
-                      opacity: isHov ? 1 : 0.5
-                    },
-                    s.key
-                  ))
-                ]
-              },
-              i
-            )
-          );
-        })
-      ]
-    }
-  );
-}
-function ProgressRing({
-  value,
-  max,
-  color,
-  size = 56
-}) {
-  const r = (size - 9) / 2;
-  const circ = 2 * Math.PI * r;
-  const pct = Math.min(value / Math.max(max, 1), 1);
-  const offset = circ * (1 - pct);
-  return /* @__PURE__ */ jsxs(
-    "svg",
-    {
-      width: size,
-      height: size,
-      style: { flexShrink: 0 },
-      "aria-hidden": true,
-      children: [
-        /* @__PURE__ */ jsx(
-          "circle",
-          {
-            cx: size / 2,
-            cy: size / 2,
-            r,
-            fill: "none",
-            stroke: "#e5e7eb",
-            strokeWidth: "7"
-          }
-        ),
-        /* @__PURE__ */ jsx(
-          "circle",
-          {
-            cx: size / 2,
-            cy: size / 2,
-            r,
-            fill: "none",
-            stroke: color,
-            strokeWidth: "7",
-            strokeDasharray: `${circ} ${circ}`,
-            strokeDashoffset: offset,
-            strokeLinecap: "round",
-            transform: `rotate(-90 ${size / 2} ${size / 2})`,
-            style: {
-              transition: "stroke-dashoffset 0.9s cubic-bezier(0.4,0,0.2,1)"
-            }
-          }
-        )
-      ]
-    }
-  );
-}
-function relTime(date) {
-  const diff = Date.now() - new Date(date).getTime();
-  const mins = Math.floor(diff / 6e4);
-  if (mins < 1) return "just now";
-  if (mins < 60) return `${mins}m`;
-  const hrs = Math.floor(mins / 60);
-  if (hrs < 24) return `${hrs}h`;
-  return `${Math.floor(hrs / 24)}d`;
-}
-function rateHue(r) {
-  return r >= 70 ? 142 : r >= 40 ? 38 : 4;
-}
-function StatItem({
-  id,
-  label,
-  value,
-  pct,
-  sparkline,
-  color,
-  delay = 0
-}) {
-  const animated = useCountUp(value);
-  const isPos = pct === void 0 || pct >= 0;
-  return /* @__PURE__ */ jsxs(StatCard, { $delay: delay, $accent: color, children: [
-    /* @__PURE__ */ jsx(StatLabel, { children: label }),
-    /* @__PURE__ */ jsx(StatValue, { children: animated.toLocaleString() }),
-    pct !== void 0 && /* @__PURE__ */ jsxs(TrendBadge, { $pos: isPos, children: [
-      isPos ? "↑" : "↓",
-      " ",
-      Math.abs(pct).toFixed(1),
-      "%"
-    ] }),
-    sparkline && sparkline.length > 1 && /* @__PURE__ */ jsx(SparkWrap, { children: /* @__PURE__ */ jsx(Sparkline, { data: sparkline, color, id }) })
-  ] });
-}
-function OverviewPage() {
-  const { get } = useFetchClient();
-  const [period, setPeriod] = useState(
-    "weekly"
-  );
-  const [feedMode, setFeedMode] = useState("signups");
-  const [hovIdx, setHovIdx] = useState(null);
-  const [rtnHov, setRtnHov] = useState(null);
-  const [activeSeries, setActiveSeries] = useState(
-    () => /* @__PURE__ */ new Set(["totalUsers", "newUsers", "activeUsers"])
-  );
-  const toggleSeries = (key) => {
-    setActiveSeries((prev) => {
-      const next = new Set(prev);
-      if (next.has(key) && next.size > 1) next.delete(key);
-      else next.add(key);
-      return next;
-    });
-  };
-  const statsQuery = useQuery({
-    queryKey: ["dash-user-stats"],
-    queryFn: async () => {
-      const r = await client.dash.userStats();
-      if (r.error) throw new Error(r.error.message ?? "Failed");
-      return r.data;
-    }
-  });
-  const graphQuery = useQuery({
-    queryKey: ["dash-user-graph", period],
-    queryFn: async () => {
-      const r = await client.dash.userGraphData({ query: { period } });
-      if (r.error) throw new Error(r.error.message ?? "Failed");
-      return r.data;
-    }
-  });
-  const retentionQuery = useQuery({
-    queryKey: ["dash-user-retention", period],
-    queryFn: async () => {
-      const r = await client.dash.userRetentionData({ query: { period } });
-      if (r.error) throw new Error(r.error.message ?? "Failed");
-      return r.data;
-    }
-  });
-  const usersQuery = useQuery({
-    queryKey: ["dash-recent-users"],
-    queryFn: async () => {
-      const r = await client.dash.listUsers({
-        query: { limit: 12, offset: 0, sortBy: "createdAt", sortOrder: "desc" }
-      });
-      if (r.error) throw new Error(r.error.message ?? "Failed");
-      return r.data;
-    }
-  });
-  const sessionsQuery = useQuery({
-    queryKey: ["dash-recent-sessions"],
-    queryFn: async () => {
-      const { data } = await get(
-        "/better-auth-dashboard/db?uid=plugin::better-auth.session&pagination[pageSize]=12&sort[0]=updatedAt:desc"
-      );
-      return data.results ?? [];
-    },
-    refetchInterval: 3e4
-  });
-  const orgsQuery = useQuery({
-    queryKey: ["dash-orgs-count"],
-    queryFn: async () => {
-      const r = await client.dash.listOrganizations({
-        query: { page: 1, limit: 1 }
-      });
-      if (r.error) throw new Error(r.error.message ?? "Failed");
-      return r.data;
-    }
-  });
-  const sessionsRaw = sessionsQuery.data ?? [];
-  const activeUserIds = [];
-  const lastActiveByUserId = /* @__PURE__ */ new Map();
-  for (const s of sessionsRaw) {
-    const uid = String(s.userId);
-    if (!lastActiveByUserId.has(uid)) {
-      lastActiveByUserId.set(uid, s.updatedAt ?? s.createdAt);
-      activeUserIds.push(uid);
-    }
-  }
-  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,
-      {
-        justifyContent: "center",
-        alignItems: "center",
-        padding: 12,
-        style: { background: T.bg, minHeight: "100%" },
-        children: /* @__PURE__ */ jsx(Loader, { children: "Loading…" })
-      }
-    );
-  }
-  const stats = statsQuery.data;
-  if (!stats) return null;
-  const graphData = graphQuery.data?.data ?? [];
-  const rtnData = retentionQuery.data?.data ?? [];
-  const users = usersQuery.data?.users ?? [];
-  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);
-  const hovRow = hovIdx !== null ? graphData[hovIdx] : null;
-  const rtnHovRow = rtnHov !== null ? rtnData[rtnHov] : null;
-  const activeMax = Math.max(
-    stats.activeUsers.daily.active ?? 0,
-    stats.activeUsers.weekly.active ?? 0,
-    stats.activeUsers.monthly.active ?? 0,
-    1
-  );
-  return /* @__PURE__ */ jsxs(Wrap, { "data-testid": "overview-page", children: [
-    /* @__PURE__ */ jsxs(Flex, { justifyContent: "space-between", alignItems: "flex-end", children: [
-      /* @__PURE__ */ jsxs("div", { children: [
-        /* @__PURE__ */ jsx(
-          "div",
-          {
-            style: {
-              fontSize: 22,
-              fontWeight: 800,
-              color: T.textPrimary,
-              letterSpacing: "-0.03em"
-            },
-            children: "Overview"
-          }
-        ),
-        /* @__PURE__ */ jsx("div", { style: { fontSize: 11, color: T.textSecondary, marginTop: 4 }, children: (/* @__PURE__ */ new Date()).toLocaleDateString(void 0, {
-          weekday: "long",
-          year: "numeric",
-          month: "long",
-          day: "numeric"
-        }) })
-      ] }),
-      /* @__PURE__ */ jsx(PillGroup, { children: ["daily", "weekly", "monthly"].map((p) => /* @__PURE__ */ jsx(Pill, { $active: period === p, onClick: () => setPeriod(p), children: p[0].toUpperCase() + p.slice(1) }, p)) })
-    ] }),
-    /* @__PURE__ */ jsxs(SectionDivider, { children: [
-      /* @__PURE__ */ jsx(DivLabel, { children: "Metrics" }),
-      /* @__PURE__ */ jsx(DivLine, {})
-    ] }),
-    /* @__PURE__ */ jsxs(StatGrid, { children: [
-      /* @__PURE__ */ jsx(
-        StatItem,
-        {
-          id: "total",
-          label: "Total Users",
-          value: stats.total ?? 0,
-          sparkline: totalSpark,
-          color: T.accent,
-          delay: 0
-        }
-      ),
-      /* @__PURE__ */ jsx(
-        StatItem,
-        {
-          id: "d-sig",
-          label: "Daily Sign-ups",
-          value: stats.daily.signUps ?? 0,
-          pct: stats.daily.percentage ?? void 0,
-          sparkline: newSpark,
-          color: T.green,
-          delay: 1
-        }
-      ),
-      /* @__PURE__ */ jsx(
-        StatItem,
-        {
-          id: "w-sig",
-          label: "Weekly Sign-ups",
-          value: stats.weekly.signUps ?? 0,
-          pct: stats.weekly.percentage ?? void 0,
-          sparkline: newSpark,
-          color: T.green,
-          delay: 2
-        }
-      ),
-      /* @__PURE__ */ jsx(
-        StatItem,
-        {
-          id: "m-sig",
-          label: "Monthly Sign-ups",
-          value: stats.monthly.signUps ?? 0,
-          pct: stats.monthly.percentage ?? void 0,
-          sparkline: newSpark,
-          color: T.green,
-          delay: 3
-        }
-      ),
-      /* @__PURE__ */ jsx(
-        StatItem,
-        {
-          id: "orgs",
-          label: "Organizations",
-          value: orgCount,
-          color: T.purple,
-          delay: 4
-        }
-      )
-    ] }),
-    /* @__PURE__ */ jsxs(SectionDivider, { children: [
-      /* @__PURE__ */ jsx(DivLabel, { children: "Growth" }),
-      /* @__PURE__ */ jsx(DivLine, {})
-    ] }),
-    /* @__PURE__ */ jsxs(TwoPanel, { 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(
-            SeriesBtn,
-            {
-              $on: activeSeries.has(s.key),
-              $c: s.color,
-              onClick: () => toggleSeries(s.key),
-              children: [
-                /* @__PURE__ */ jsx(SDot, { $c: s.color }),
-                s.label
-              ]
-            },
-            s.key
-          )) })
-        ] }),
-        /* @__PURE__ */ jsx(HoverInfo, { children: hovRow ? `${hovRow.label}  ·  ${hovRow.totalUsers.toLocaleString()} total  ·  +${hovRow.newUsers.toLocaleString()} new  ·  ${hovRow.activeUsers.toLocaleString()} active` : "Hover the chart to inspect a data point" }),
-        graphQuery.isLoading ? /* @__PURE__ */ jsx(
-          Flex,
-          {
-            justifyContent: "center",
-            alignItems: "center",
-            style: { flex: 1, minHeight: 170 },
-            children: /* @__PURE__ */ jsx(Loader, { children: "Loading…" })
-          }
-        ) : /* @__PURE__ */ jsx(
-          GrowthChart,
-          {
-            data: graphData,
-            hovered: hovIdx,
-            onHover: setHovIdx,
-            activeSeries
-          }
-        )
-      ] }),
-      /* @__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(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" }),
-      /* @__PURE__ */ jsx(DivLine, {})
-    ] }),
-    /* @__PURE__ */ jsxs(TwoPanel, { children: [
-      /* @__PURE__ */ jsxs(RtnCard, { $delay: 7, children: [
-        /* @__PURE__ */ jsxs(ChartHeader, { children: [
-          /* @__PURE__ */ jsx(ChartTitle, { children: "Cohort Retention" }),
-          /* @__PURE__ */ jsx(Flex, { alignItems: "center", gap: 2, children: [
-            { hue: 142, label: "≥70%" },
-            { hue: 38, label: "40–70%" },
-            { hue: 4, label: "<40%" }
-          ].map(({ hue, label }) => /* @__PURE__ */ jsxs(
-            Flex,
-            {
-              alignItems: "center",
-              gap: 1,
-              style: { marginLeft: 8 },
-              children: [
-                /* @__PURE__ */ jsx(
-                  "span",
-                  {
-                    style: {
-                      width: 8,
-                      height: 8,
-                      borderRadius: "50%",
-                      background: `hsl(${hue},60%,50%)`,
-                      display: "inline-block",
-                      flexShrink: 0
-                    }
-                  }
-                ),
-                /* @__PURE__ */ jsx("span", { style: { fontSize: 9, color: T.textMuted }, children: label })
-              ]
-            },
-            hue
-          )) })
-        ] }),
-        /* @__PURE__ */ jsx(RtnTip, { children: rtnHovRow ? `Cohort ${rtnHovRow.label} · ${rtnHovRow.cohortSize.toLocaleString()} users · active ${rtnHovRow.activeStart} – ${rtnHovRow.activeEnd}` : "Hover a row to see cohort details" }),
-        retentionQuery.isLoading ? /* @__PURE__ */ jsx(
-          Flex,
-          {
-            justifyContent: "center",
-            alignItems: "center",
-            style: { minHeight: 80 },
-            children: /* @__PURE__ */ jsx(Loader, { children: "Loading…" })
-          }
-        ) : rtnData.length === 0 ? /* @__PURE__ */ jsxs(Empty, { children: [
-          /* @__PURE__ */ jsx("div", { style: { fontSize: 22 }, children: "📉" }),
-          /* @__PURE__ */ jsx("div", { children: "No retention data for this period" })
-        ] }) : /* @__PURE__ */ jsx("div", { style: { display: "flex", flexDirection: "column", gap: 5 }, children: rtnData.map((row, i) => {
-          const hue = rateHue(row.retentionRate);
-          return /* @__PURE__ */ jsxs(
-            RtnRow,
-            {
-              $hov: rtnHov === i,
-              onMouseEnter: () => setRtnHov(i),
-              onMouseLeave: () => setRtnHov(null),
-              children: [
-                /* @__PURE__ */ jsx(RtnLabel, { children: row.label }),
-                /* @__PURE__ */ jsx(RtnSize, { children: row.cohortSize.toLocaleString() }),
-                /* @__PURE__ */ jsx(RtnTrack, { children: /* @__PURE__ */ jsx(RtnBar, { $w: row.retentionRate, $hue: hue }) }),
-                /* @__PURE__ */ jsxs(RtnPct, { $hue: hue, children: [
-                  row.retentionRate.toFixed(1),
-                  "%"
-                ] })
-              ]
-            },
-            row.n
-          );
-        }) })
-      ] }),
-      /* @__PURE__ */ jsx(RingGrid, { children: [
-        {
-          label: "Daily Active",
-          value: stats.activeUsers.daily.active,
-          pct: stats.activeUsers.daily.percentage,
-          color: T.amber,
-          sparkline: activeSpark,
-          delay: 8
-        },
-        {
-          label: "Weekly Active",
-          value: stats.activeUsers.weekly.active,
-          pct: stats.activeUsers.weekly.percentage,
-          color: T.green,
-          sparkline: activeSpark,
-          delay: 9
-        },
-        {
-          label: "Monthly Active",
-          value: stats.activeUsers.monthly.active,
-          pct: stats.activeUsers.monthly.percentage,
-          color: T.accent,
-          sparkline: activeSpark,
-          delay: 10
-        }
-      ].map(({ label, value, pct, color, delay }) => {
-        const isPos = pct == null || pct >= 0;
-        return /* @__PURE__ */ jsxs(RingCard, { $delay: delay, children: [
-          /* @__PURE__ */ jsx(
-            ProgressRing,
-            {
-              value: value ?? 0,
-              max: activeMax,
-              color,
-              size: 56
-            }
-          ),
-          /* @__PURE__ */ jsxs(RingInfo, { children: [
-            /* @__PURE__ */ jsx(RingLabel, { children: label }),
-            /* @__PURE__ */ jsx(RingVal, { children: (value ?? 0).toLocaleString() }),
-            pct != null && /* @__PURE__ */ jsxs(
-              TrendBadge,
-              {
-                $pos: isPos,
-                style: { marginTop: 4, marginBottom: 0 },
-                children: [
-                  isPos ? "↑" : "↓",
-                  " ",
-                  Math.abs(pct).toFixed(1),
-                  "%"
-                ]
-              }
-            )
-          ] })
-        ] }, label);
-      }) })
-    ] })
-  ] });
-}
-function ProtectedOverviewPage() {
-  return /* @__PURE__ */ jsx(
-    Page.Protect,
-    {
-      permissions: PERMISSIONS.overview.filter(
-        (p) => p.action === `plugin::${PLUGIN_ID}.overview.read`
-      ),
-      children: /* @__PURE__ */ jsx(OverviewPage, {})
-    }
-  );
-}
-export {
-  OverviewPage,
-  ProtectedOverviewPage as default
-};