@burdenoff/microfe-timecampus 2026.703.4 → 2026.703.5

package/dist/timecampus/pages/client-portal/ClientPortalPage.js

@@ -1,99 +1,114 @@
-import { getInitials as e } from "../../utils/helpers.js";
-import { StatCard as t } from "../../components/StatCard.js";
-import { LoadingSkeleton as n } from "../../components/LoadingSkeleton.js";
-import { useCreateClientPortalConfigMutation as r, useDeleteClientPortalConfigMutation as i, useGetClientPortalStatsQuery as a, useListClientPortalConfigsQuery as o, useRegenerateClientPortalShareTokenMutation as ee, useToggleClientPortalMutation as te, useUpdateClientPortalConfigMutation as s } from "../../../generated/wspace-operations.js";
+import { cn as e, formatDate as t, formatNumber as n, getInitials as r } from "../../utils/helpers.js";
+import { StatCard as i } from "../../components/StatCard.js";
+import { LoadingSkeleton as a } from "../../components/LoadingSkeleton.js";
+import { useCreateClientPortalConfigMutation as o, useDeleteClientPortalConfigMutation as s, useGetClientPortalStatsQuery as ee, useListClientPortalConfigsQuery as te, useRegenerateClientPortalShareTokenMutation as ne, useToggleClientPortalMutation as re, useUpdateClientPortalConfigMutation as ie } from "../../../generated/wspace-operations.js";
 import { PageLayout as c } from "../../components/PageLayout.js";
-import { EmptyState as ne } from "../../components/EmptyState.js";
-import { Modal as l } from "../../components/Modal.js";
-import { StatusBadge as re } from "../../components/StatusBadge.js";
-import { ToastContainer as ie, useToast as ae } from "../../components/Toast.js";
-import { useState as u } from "react";
-import { Building2 as oe, Check as se, DollarSign as ce, FolderOpen as le, Link2 as ue, Pencil as de, Plus as fe, Power as pe, RefreshCw as me, Trash2 as he } from "lucide-react";
-import { gql as d } from "@apollo/client";
-import { useApolloClient as ge } from "@apollo/client/react";
-import { Fragment as f, jsx as p, jsxs as m } from "react/jsx-runtime";
-import { uploadBlobToFiles as h } from "@burdenoff/fe-libs/storage";
+import { StatusBadge as ae } from "../../components/StatusBadge.js";
+import { EmptyState as oe } from "../../components/EmptyState.js";
+import { ChartCard as l } from "../../components/ChartCard.js";
+import { ToastContainer as se, useToast as ce } from "../../components/Toast.js";
+import { Modal as u } from "../../components/Modal.js";
+import { BarsChart as le } from "../../components/charts/BarsChart.js";
+import { DonutChart as ue } from "../../components/charts/DonutChart.js";
+import { ProgressMeter as de } from "../../components/charts/ProgressMeter.js";
+import "../../components/index.js";
+import { useState as d } from "react";
+import { Building2 as fe, Check as pe, FolderOpen as me, Link2 as he, Pencil as f, Plus as p, Power as m, PowerOff as ge, RefreshCw as _e, Trash2 as ve, Users as ye } from "lucide-react";
+import { gql as h } from "@apollo/client";
+import { useApolloClient as be } from "@apollo/client/react";
+import { Fragment as g, jsx as _, jsxs as v } from "react/jsx-runtime";
+import { GlassCard as xe } from "@burdenoff/fe-libs/ui";
+import { uploadBlobToFiles as Se } from "@burdenoff/fe-libs/storage";
 //#region src/timecampus/pages/client-portal/ClientPortalPage.tsx
-var g = 25, _ = "mt-1 w-full rounded-md border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary placeholder:text-text-secondary", v = "mt-1 block w-full text-sm text-text-secondary file:mr-3 file:rounded-md file:border-0 file:bg-action-primary-bg file:px-3 file:py-1.5 file:text-sm file:font-medium file:text-action-primary-text hover:file:bg-action-primary-bg/90", y = d`
+var y = 25, b = "mt-1 w-full rounded-md border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary placeholder:text-text-secondary", Ce = "mt-1 block w-full text-sm text-text-secondary file:mr-3 file:rounded-md file:border-0 file:bg-action-primary-bg file:px-3 file:py-1.5 file:text-sm file:font-medium file:text-action-primary-text hover:file:bg-action-primary-bg/90", we = h`
   query TimeCampus_GetFileDownloadUrl($id: ID!, $expiresIn: Int) {
     getFileDownloadUrl(id: $id, expiresIn: $expiresIn)
   }
-`, _e = d`
+`, Te = h`
   mutation TimeCampusClient_EnsureFolder($path: String!) {
     ensureFolderByPath(path: $path) {
       id
     }
   }
 `;
-function ve(e) {
+function Ee(e) {
 	return `${typeof window < "u" ? window.location.origin : ""}/portal/${e}`;
 }
-var b = {
+var x = {
 	clientName: "",
 	contactEmail: "",
 	contactPhone: "",
 	description: "",
 	logoUrl: ""
 };
-function x() {
-	let { toasts: d, addToast: x, dismissToast: ye } = ae(), S = ge(), [be, C] = u(null), [w, T] = u(!1), { data: E, loading: D, error: O, refetch: k, fetchMore: A } = o({
+function S() {
+	let { toasts: h, addToast: S, dismissToast: C } = ce(), w = be(), [T, E] = d(null), [D, O] = d(!1), { data: k, loading: De, error: Oe, refetch: A, fetchMore: ke } = te({
 		variables: {
-			limit: g,
+			limit: y,
 			offset: 0
 		},
 		notifyOnNetworkStatusChange: !0
-	}), { data: j, refetch: M } = a(), [N, { loading: P }] = ee(), [xe, { loading: F }] = r(), [Se, { loading: I }] = s(), [Ce, { loading: L }] = i(), [we] = te(), R = E?.clientPortalConfigs?.items ?? [], Te = E?.clientPortalConfigs?.hasMore ?? !1, z = j?.clientPortalStats, [B, V] = u(!1), [Ee, H] = u(!1), [U, W] = u(null), [G, K] = u(b), [q, J] = u(null), [Y, X] = u(null), Z = async () => {
-		await Promise.all([k(), M()]);
-	}, De = async (e) => {
+	}), { data: Ae, refetch: je } = ee(), [Me, { loading: j }] = ne(), [Ne, { loading: M }] = o(), [N, { loading: P }] = ie(), [Pe, { loading: F }] = s(), [Fe] = re(), I = k?.clientPortalConfigs?.items ?? [], Ie = k?.clientPortalConfigs?.hasMore ?? !1, L = Ae?.clientPortalStats, R = (e) => e.projects.reduce((e, t) => e + t.trackedHours, 0), z = (L?.totalClients ?? 0) - (L?.activeClients ?? 0), Le = I.map((e) => ({
+		name: e.clientName,
+		hours: R(e)
+	})).filter((e) => e.hours > 0).sort((e, t) => t.hours - e.hours).slice(0, 8), B = I.reduce((e, t) => Math.max(e, R(t)), 0), Re = [{
+		name: "Active",
+		value: L?.activeClients ?? 0
+	}, {
+		name: "Inactive",
+		value: Math.max(z, 0)
+	}], [V, H] = d(!1), [ze, U] = d(!1), [W, G] = d(null), [K, q] = d(x), [J, Y] = d(null), [Be, X] = d(null), Z = async () => {
+		await Promise.all([A(), je()]);
+	}, Ve = async (e) => {
 		if (e.shareToken) try {
-			await navigator.clipboard.writeText(ve(e.shareToken)), C(e.id), window.setTimeout(() => C(null), 2e3);
+			await navigator.clipboard.writeText(Ee(e.shareToken)), E(e.id), window.setTimeout(() => E(null), 2e3);
 		} catch {
-			x({
+			S({
 				title: "Clipboard unavailable",
 				variant: "error"
 			});
 		}
-	}, Oe = async (e) => {
+	}, He = async (e) => {
 		X(e.id);
 		try {
-			await N({ variables: { id: e.id } }), x({
+			await Me({ variables: { id: e.id } }), S({
 				title: "Share link regenerated",
 				variant: "success"
-			}), await k();
+			}), await A();
 		} catch {
-			x({
+			S({
 				title: "Failed to regenerate link",
 				variant: "error"
 			});
 		} finally {
 			X(null);
 		}
-	}, ke = () => {
-		W(null), K(b), H(!0);
-	}, Ae = (e) => {
-		W(e), K({
+	}, Ue = () => {
+		G(null), q(x), U(!0);
+	}, We = (e) => {
+		G(e), q({
 			clientName: e.clientName,
 			contactEmail: e.contactEmail ?? "",
 			contactPhone: e.contactPhone ?? "",
 			description: e.description ?? "",
 			logoUrl: e.logoUrl ?? ""
-		}), H(!0);
-	}, je = async (e) => {
-		T(!0);
+		}), U(!0);
+	}, Ge = async (e) => {
+		O(!0);
 		try {
-			let { data: t } = await S.mutate({
-				mutation: _e,
+			let { data: t } = await w.mutate({
+				mutation: Te,
 				variables: { path: "/TimeCampus/ClientLogos" }
 			}), n = t?.ensureFolderByPath?.id;
 			if (!n) throw Error("Could not resolve upload folder");
-			let r = await h({
-				client: S,
+			let r = await Se({
+				client: w,
 				blob: e,
 				filename: e.name,
 				mimeType: e.type || "application/octet-stream",
 				folderId: n
-			}), { data: i } = await S.query({
-				query: y,
+			}), { data: i } = await w.query({
+				query: we,
 				variables: {
 					id: r.id,
 					expiresIn: 604800
@@ -101,88 +116,88 @@ function x() {
 				fetchPolicy: "no-cache"
 			}), a = i?.getFileDownloadUrl;
 			if (!a) throw Error("No download URL returned");
-			K((e) => ({
+			q((e) => ({
 				...e,
 				logoUrl: a
 			}));
 		} catch {
-			x({
+			S({
 				title: "Failed to upload logo",
 				variant: "error"
 			});
 		} finally {
-			T(!1);
+			O(!1);
 		}
 	}, Q = () => {
-		H(!1), W(null);
-	}, Me = async () => {
-		if (G.clientName.trim()) try {
-			U ? (await Se({ variables: {
-				id: U.id,
+		U(!1), G(null);
+	}, Ke = async () => {
+		if (K.clientName.trim()) try {
+			W ? (await N({ variables: {
+				id: W.id,
 				input: {
-					clientName: G.clientName.trim(),
-					contactEmail: G.contactEmail.trim() || void 0,
-					contactPhone: G.contactPhone.trim() || void 0,
-					description: G.description.trim() || void 0,
-					logoUrl: G.logoUrl || void 0
+					clientName: K.clientName.trim(),
+					contactEmail: K.contactEmail.trim() || void 0,
+					contactPhone: K.contactPhone.trim() || void 0,
+					description: K.description.trim() || void 0,
+					logoUrl: K.logoUrl || void 0
 				}
-			} }), x({
+			} }), S({
 				title: "Client updated",
 				variant: "success"
-			})) : (await xe({ variables: { input: {
-				clientName: G.clientName.trim(),
-				contactEmail: G.contactEmail.trim() || void 0,
-				contactPhone: G.contactPhone.trim() || void 0,
-				description: G.description.trim() || void 0,
-				logoUrl: G.logoUrl || void 0,
+			})) : (await Ne({ variables: { input: {
+				clientName: K.clientName.trim(),
+				contactEmail: K.contactEmail.trim() || void 0,
+				contactPhone: K.contactPhone.trim() || void 0,
+				description: K.description.trim() || void 0,
+				logoUrl: K.logoUrl || void 0,
 				isActive: !0
-			} } }), x({
+			} } }), S({
 				title: "Client added",
 				variant: "success"
 			})), Q(), await Z();
 		} catch {
-			x({
-				title: U ? "Failed to update client" : "Failed to add client",
+			S({
+				title: W ? "Failed to update client" : "Failed to add client",
 				variant: "error"
 			});
 		}
-	}, Ne = async () => {
-		if (q) try {
-			await Ce({ variables: { id: q.id } }), x({
+	}, qe = async () => {
+		if (J) try {
+			await Pe({ variables: { id: J.id } }), S({
 				title: "Client deleted",
 				variant: "success"
-			}), J(null), await Z();
+			}), Y(null), await Z();
 		} catch {
-			x({
+			S({
 				title: "Failed to delete client",
 				variant: "error"
 			});
 		}
-	}, Pe = async (e) => {
+	}, Je = async (e) => {
 		X(e.id);
 		try {
-			await we({ variables: {
+			await Fe({ variables: {
 				id: e.id,
 				isActive: !e.isActive
-			} }), x({
+			} }), S({
 				title: e.isActive ? "Client deactivated" : "Client activated",
 				variant: "success"
 			}), await Z();
 		} catch {
-			x({
+			S({
 				title: "Failed to toggle client",
 				variant: "error"
 			});
 		} finally {
 			X(null);
 		}
-	}, Fe = async () => {
-		V(!0);
+	}, Ye = async () => {
+		H(!0);
 		try {
-			await A({
+			await ke({
 				variables: {
-					limit: g,
-					offset: R.length
+					limit: y,
+					offset: I.length
 				},
 				updateQuery: (e, { fetchMoreResult: t }) => t ? {
 					...e,
@@ -193,247 +208,324 @@ function x() {
 				} : e
 			});
 		} finally {
-			V(!1);
+			H(!1);
 		}
 	};
-	if (D && R.length === 0) return /* @__PURE__ */ p(c, {
+	if (De && I.length === 0) return /* @__PURE__ */ _(c, {
 		title: "Client Portal",
 		description: "Manage clients and their projects",
-		children: /* @__PURE__ */ p(n, {
+		children: /* @__PURE__ */ _(a, {
 			variant: "list",
 			count: 4
 		})
 	});
-	if (O) return /* @__PURE__ */ p(c, {
+	if (Oe) return /* @__PURE__ */ _(c, {
 		title: "Client Portal",
 		description: "Manage clients and their projects",
-		children: /* @__PURE__ */ p("div", {
+		children: /* @__PURE__ */ _("div", {
 			className: "rounded-lg border border-status-error-bg/40 bg-status-error-bg p-4 text-sm text-status-error-text",
 			children: "Failed to load client portal data. Please try again later."
 		})
 	});
-	let $ = /* @__PURE__ */ m("button", {
-		onClick: ke,
+	let $ = /* @__PURE__ */ v("button", {
+		onClick: Ue,
 		className: "inline-flex items-center gap-1.5 rounded-md bg-action-primary-bg px-3 py-2 text-sm font-medium text-action-primary-text hover:bg-action-primary-bg/90",
-		children: [/* @__PURE__ */ p(fe, { className: "h-4 w-4" }), "Add Client"]
+		children: [/* @__PURE__ */ _(p, { className: "h-4 w-4" }), "Add Client"]
 	});
-	return /* @__PURE__ */ m(c, {
+	return /* @__PURE__ */ v(c, {
 		title: "Client Portal",
 		description: "Manage clients and their projects",
 		purpose: "Give clients a transparent window into the work you do for them — the projects, hours and progress tied to each one — so billing conversations are backed by data and trust, not spreadsheets.",
 		actions: $,
 		children: [
-			/* @__PURE__ */ m("div", {
+			/* @__PURE__ */ v("div", {
 				className: "grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-4",
 				children: [
-					/* @__PURE__ */ p(t, {
+					/* @__PURE__ */ _(i, {
 						featured: !0,
 						title: "Active Clients",
-						value: String(z?.activeClients ?? 0),
-						icon: /* @__PURE__ */ p(oe, { className: "h-5 w-5" })
+						value: String(L?.activeClients ?? 0),
+						icon: /* @__PURE__ */ _(fe, { className: "h-5 w-5" })
 					}),
-					/* @__PURE__ */ p(t, {
+					/* @__PURE__ */ _(i, {
 						title: "Total Projects",
-						value: String(z?.totalProjectsShared ?? 0),
-						icon: /* @__PURE__ */ p(le, { className: "h-5 w-5" })
+						value: String(L?.totalProjectsShared ?? 0),
+						icon: /* @__PURE__ */ _(me, { className: "h-5 w-5" })
 					}),
-					/* @__PURE__ */ p(t, {
+					/* @__PURE__ */ _(i, {
 						title: "Total Clients",
-						value: String(z?.totalClients ?? 0),
-						icon: /* @__PURE__ */ p(ce, { className: "h-5 w-5" })
+						value: String(L?.totalClients ?? 0),
+						icon: /* @__PURE__ */ _(ye, { className: "h-5 w-5" })
 					}),
-					/* @__PURE__ */ p(t, {
-						title: "Active",
-						value: String(z?.activeClients ?? 0),
-						trend: {
-							value: 0,
-							label: "clients"
-						}
+					/* @__PURE__ */ _(i, {
+						title: "Inactive",
+						value: String(Math.max(z, 0)),
+						icon: /* @__PURE__ */ _(ge, { className: "h-5 w-5" }),
+						iconBgColor: "bg-bg-sunken text-text-secondary",
+						description: "portals turned off"
 					})
 				]
 			}),
-			R.length === 0 ? /* @__PURE__ */ p(ne, {
+			I.length === 0 ? /* @__PURE__ */ _(oe, {
 				illustration: "empty-people",
 				title: "No clients configured yet",
 				description: "Add your first client to share projects and tracked hours with them.",
 				action: $
-			}) : /* @__PURE__ */ m(f, { children: [/* @__PURE__ */ p("div", {
-				className: "rounded-xl border border-border-seam bg-gloss-card shadow-pop",
-				children: /* @__PURE__ */ p("div", {
-					className: "divide-y divide-border",
-					children: R.map((t) => {
-						let n = t.projects.reduce((e, t) => e + t.trackedHours, 0), r = Y === t.id;
-						return /* @__PURE__ */ m("div", {
-							className: "flex flex-col gap-3 p-4 hover:bg-bg-sunken/50 transition-colors sm:flex-row sm:items-center sm:justify-between",
-							children: [/* @__PURE__ */ m("div", {
-								className: "flex items-center gap-3",
-								children: [/* @__PURE__ */ p("div", {
-									className: "flex h-10 w-10 items-center justify-center rounded-lg bg-action-primary-bg/10 text-sm font-medium text-primary",
-									children: e(t.clientName)
-								}), /* @__PURE__ */ m("div", { children: [/* @__PURE__ */ p("p", {
-									className: "text-sm font-medium text-text-primary",
-									children: t.clientName
-								}), /* @__PURE__ */ m("p", {
-									className: "text-xs text-text-secondary",
-									children: [
-										t.projects.length,
-										" projects ·",
-										" ",
-										n,
-										"h tracked",
-										t.contactEmail && /* @__PURE__ */ m(f, { children: [" · ", t.contactEmail] })
-									]
-								})] })]
-							}), /* @__PURE__ */ m("div", {
-								className: "flex flex-wrap items-center gap-2",
-								children: [
-									t.isActive && t.shareToken && /* @__PURE__ */ m(f, { children: [/* @__PURE__ */ p("button", {
+			}) : /* @__PURE__ */ v(g, { children: [
+				/* @__PURE__ */ v("div", {
+					className: "grid grid-cols-1 gap-4 lg:grid-cols-3",
+					children: [/* @__PURE__ */ _(l, {
+						title: "Tracked hours by client",
+						description: "Top clients by logged hours (loaded page)",
+						className: "lg:col-span-2",
+						children: /* @__PURE__ */ _(le, {
+							data: Le,
+							xKey: "name",
+							series: [{
+								key: "hours",
+								label: "Tracked hours"
+							}],
+							orientation: "horizontal",
+							height: 260,
+							categoryWidth: 120,
+							valueFormat: (e) => `${e.toLocaleString()}h`,
+							emptyLabel: "No tracked hours logged yet.",
+							ariaLabel: "Tracked hours by client"
+						})
+					}), /* @__PURE__ */ _(l, {
+						title: "Portal status",
+						description: "Shared vs. private clients",
+						children: /* @__PURE__ */ _(ue, {
+							data: Re,
+							centerLabel: "Clients",
+							centerValue: L?.totalClients ?? 0,
+							height: 260,
+							emptyLabel: "No clients yet.",
+							ariaLabel: "Clients by portal status"
+						})
+					})]
+				}),
+				/* @__PURE__ */ _("div", {
+					className: "grid grid-cols-1 gap-4 sm:grid-cols-2 xl:grid-cols-3",
+					children: I.map((i) => {
+						let a = R(i), o = Be === i.id, s = T === i.id;
+						return /* @__PURE__ */ v(xe, {
+							treatment: "insight",
+							glow: i.isActive,
+							className: "p-4",
+							children: [
+								/* @__PURE__ */ v("div", {
+									className: "flex items-start justify-between gap-3",
+									children: [/* @__PURE__ */ v("div", {
+										className: "flex min-w-0 items-center gap-3",
+										children: [i.logoUrl ? /* @__PURE__ */ _("img", {
+											src: i.logoUrl,
+											alt: `${i.clientName} logo`,
+											className: "h-11 w-11 shrink-0 rounded-lg border border-border-seam object-cover"
+										}) : /* @__PURE__ */ _("div", {
+											className: "flex h-11 w-11 shrink-0 items-center justify-center rounded-lg bg-action-primary-bg/10 text-sm font-semibold text-primary",
+											children: r(i.clientName)
+										}), /* @__PURE__ */ v("div", {
+											className: "min-w-0",
+											children: [/* @__PURE__ */ _("p", {
+												className: "truncate text-sm font-semibold text-text-primary",
+												children: i.clientName
+											}), /* @__PURE__ */ v("p", {
+												className: "truncate text-xs text-text-secondary",
+												children: ["Since ", t(i.createdAt)]
+											})]
+										})]
+									}), /* @__PURE__ */ _(ae, {
+										label: i.isActive ? "active" : "inactive",
+										status: i.isActive ? "active" : "inactive"
+									})]
+								}),
+								/* @__PURE__ */ v("div", {
+									className: "mt-4 grid grid-cols-2 gap-3",
+									children: [/* @__PURE__ */ v("div", {
+										className: "rounded-lg border border-border-seam bg-bg-sunken/40 px-3 py-2",
+										children: [/* @__PURE__ */ _("p", {
+											className: "text-[11px] font-medium uppercase tracking-wide text-text-secondary",
+											children: "Projects"
+										}), /* @__PURE__ */ _("p", {
+											className: "mt-0.5 text-lg font-semibold tabular-nums text-text-primary",
+											children: i.projects.length
+										})]
+									}), /* @__PURE__ */ v("div", {
+										className: "rounded-lg border border-border-seam bg-bg-sunken/40 px-3 py-2",
+										children: [/* @__PURE__ */ _("p", {
+											className: "text-[11px] font-medium uppercase tracking-wide text-text-secondary",
+											children: "Tracked hours"
+										}), /* @__PURE__ */ v("p", {
+											className: "mt-0.5 text-lg font-semibold tabular-nums text-text-primary",
+											children: [n(a), "h"]
+										})]
+									})]
+								}),
+								B > 0 && /* @__PURE__ */ _("div", {
+									className: "mt-3",
+									children: /* @__PURE__ */ _(de, {
+										value: a,
+										max: B,
+										tone: "success",
+										size: "sm",
+										showValue: !1,
+										label: "Tracked volume vs. top client"
+									})
+								}),
+								/* @__PURE__ */ v("div", {
+									className: "mt-4 flex items-center justify-between rounded-lg border border-border-seam bg-bg-sunken/40 px-3 py-2",
+									children: [/* @__PURE__ */ _("span", {
+										className: "text-xs font-medium text-text-secondary",
+										children: "Public Access"
+									}), /* @__PURE__ */ v("button", {
+										type: "button",
+										disabled: o,
+										onClick: () => void Je(i),
+										title: i.isActive ? "Deactivate client portal" : "Activate client portal",
+										className: e("inline-flex items-center gap-1.5 rounded-full px-3 py-1 text-xs font-medium transition-colors disabled:opacity-50", i.isActive ? "bg-status-success-bg text-status-success-text hover:bg-status-success-bg/80" : "border border-border-seam bg-bg-surface text-text-secondary hover:bg-bg-sunken/60"),
+										children: [/* @__PURE__ */ _(m, { className: "h-3.5 w-3.5" }), i.isActive ? "Active" : "Inactive"]
+									})]
+								}),
+								/* @__PURE__ */ v("div", {
+									className: "mt-4 flex flex-wrap items-center gap-2 border-t border-border-seam pt-3",
+									children: [i.isActive && i.shareToken && /* @__PURE__ */ v(g, { children: [/* @__PURE__ */ _("button", {
 										type: "button",
-										onClick: () => void De(t),
+										onClick: () => void Ve(i),
 										title: "Copy the client's private share link",
-										className: "inline-flex items-center gap-1 rounded-md border border-border-seam bg-bg-surface px-2 py-1 text-xs text-text-secondary hover:bg-bg-sunken/50",
-										children: be === t.id ? /* @__PURE__ */ m(f, { children: [/* @__PURE__ */ p(se, { className: "h-3.5 w-3.5" }), " Copied"] }) : /* @__PURE__ */ m(f, { children: [/* @__PURE__ */ p(ue, { className: "h-3.5 w-3.5" }), " Share link"] })
-									}), /* @__PURE__ */ p("button", {
+										className: "inline-flex items-center gap-1.5 rounded-md border border-border-seam bg-bg-surface px-2.5 py-1.5 text-xs font-medium text-text-secondary hover:bg-bg-sunken/60",
+										children: s ? /* @__PURE__ */ v(g, { children: [/* @__PURE__ */ _(pe, { className: "h-3.5 w-3.5" }), " Copied"] }) : /* @__PURE__ */ v(g, { children: [/* @__PURE__ */ _(he, { className: "h-3.5 w-3.5" }), " Share link"] })
+									}), /* @__PURE__ */ v("button", {
 										type: "button",
-										disabled: r && P,
-										onClick: () => void Oe(t),
+										disabled: o && j,
+										onClick: () => void He(i),
 										title: "Regenerate the link (invalidates the old one)",
-										className: "inline-flex items-center rounded-md border border-border-seam bg-bg-surface p-1.5 text-text-secondary hover:bg-bg-sunken/50 disabled:opacity-50",
-										children: /* @__PURE__ */ p(me, { className: `h-3.5 w-3.5 ${r && P ? "animate-spin" : ""}` })
-									})] }),
-									/* @__PURE__ */ m("button", {
-										type: "button",
-										disabled: r,
-										onClick: () => void Pe(t),
-										title: t.isActive ? "Deactivate client portal" : "Activate client portal",
-										className: "inline-flex items-center gap-1 rounded-md border border-border-seam bg-bg-surface px-2 py-1 text-xs text-text-secondary hover:bg-bg-sunken/50 disabled:opacity-50",
-										children: [/* @__PURE__ */ p(pe, { className: "h-3.5 w-3.5" }), t.isActive ? "Deactivate" : "Activate"]
-									}),
-									/* @__PURE__ */ p(re, {
-										label: t.isActive ? "active" : "inactive",
-										status: t.isActive ? "active" : "inactive"
-									}),
-									/* @__PURE__ */ p("button", {
-										type: "button",
-										onClick: () => Ae(t),
-										title: "Edit client",
-										className: "inline-flex items-center rounded-md border border-border-seam bg-bg-surface p-1.5 text-text-secondary hover:bg-bg-sunken/50",
-										children: /* @__PURE__ */ p(de, { className: "h-3.5 w-3.5" })
-									}),
-									/* @__PURE__ */ p("button", {
-										type: "button",
-										onClick: () => J(t),
-										title: "Delete client",
-										className: "inline-flex items-center rounded-md border border-border-seam bg-bg-surface p-1.5 text-status-error-text hover:bg-status-error-bg",
-										children: /* @__PURE__ */ p(he, { className: "h-3.5 w-3.5" })
-									})
-								]
-							})]
-						}, t.id);
+										className: "inline-flex items-center gap-1.5 rounded-md border border-border-seam bg-bg-surface px-2.5 py-1.5 text-xs font-medium text-text-secondary hover:bg-bg-sunken/60 disabled:opacity-50",
+										children: [/* @__PURE__ */ _(_e, { className: e("h-3.5 w-3.5", o && j && "animate-spin") }), "Regenerate"]
+									})] }), /* @__PURE__ */ v("div", {
+										className: "ml-auto flex items-center gap-1",
+										children: [/* @__PURE__ */ _("button", {
+											type: "button",
+											onClick: () => We(i),
+											title: "Edit client",
+											className: "inline-flex items-center rounded-md border border-border-seam bg-bg-surface p-1.5 text-text-secondary hover:bg-bg-sunken/60",
+											children: /* @__PURE__ */ _(f, { className: "h-3.5 w-3.5" })
+										}), /* @__PURE__ */ _("button", {
+											type: "button",
+											onClick: () => Y(i),
+											title: "Delete client",
+											className: "inline-flex items-center rounded-md border border-border-seam bg-bg-surface p-1.5 text-status-error-text hover:bg-status-error-bg",
+											children: /* @__PURE__ */ _(ve, { className: "h-3.5 w-3.5" })
+										})]
+									})]
+								})
+							]
+						}, i.id);
+					})
+				}),
+				Ie && /* @__PURE__ */ _("div", {
+					className: "flex justify-center",
+					children: /* @__PURE__ */ _("button", {
+						onClick: Ye,
+						disabled: V,
+						className: "rounded-md border border-border-subtle px-4 py-2 text-sm font-medium text-text-primary hover:bg-bg-sunken/50 disabled:opacity-50",
+						children: V ? "Loading..." : "Load more"
 					})
 				})
-			}), Te && /* @__PURE__ */ p("div", {
-				className: "mt-4 flex justify-center",
-				children: /* @__PURE__ */ p("button", {
-					onClick: Fe,
-					disabled: B,
-					className: "rounded-md border border-border-subtle px-4 py-2 text-sm font-medium text-text-primary hover:bg-bg-sunken/50 disabled:opacity-50",
-					children: B ? "Loading..." : "Load more"
-				})
-			})] }),
-			/* @__PURE__ */ p(l, {
-				open: Ee,
+			] }),
+			/* @__PURE__ */ _(u, {
+				open: ze,
 				onClose: Q,
-				title: U ? "Edit Client" : "Add Client",
-				description: U ? "Update this client's portal details." : "Set up a client so you can share projects and tracked hours with them.",
-				footer: /* @__PURE__ */ m(f, { children: [/* @__PURE__ */ p("button", {
+				title: W ? "Edit Client" : "Add Client",
+				description: W ? "Update this client's portal details." : "Set up a client so you can share projects and tracked hours with them.",
+				footer: /* @__PURE__ */ v(g, { children: [/* @__PURE__ */ _("button", {
 					onClick: Q,
 					className: "rounded-md border border-border-subtle px-4 py-2 text-sm font-medium text-text-primary hover:bg-bg-sunken/50",
 					children: "Cancel"
-				}), /* @__PURE__ */ p("button", {
-					onClick: Me,
-					disabled: F || I || !G.clientName.trim(),
+				}), /* @__PURE__ */ _("button", {
+					onClick: Ke,
+					disabled: M || P || !K.clientName.trim(),
 					className: "rounded-md bg-action-primary-bg px-4 py-2 text-sm font-medium text-action-primary-text hover:bg-action-primary-bg/90 disabled:opacity-50",
-					children: F || I ? "Saving..." : U ? "Save Changes" : "Add Client"
+					children: M || P ? "Saving..." : W ? "Save Changes" : "Add Client"
 				})] }),
-				children: /* @__PURE__ */ m("div", {
+				children: /* @__PURE__ */ v("div", {
 					className: "space-y-4",
 					children: [
-						/* @__PURE__ */ m("div", { children: [/* @__PURE__ */ p("label", {
+						/* @__PURE__ */ v("div", { children: [/* @__PURE__ */ _("label", {
 							className: "block text-sm font-medium text-text-primary",
 							children: "Client Name"
-						}), /* @__PURE__ */ p("input", {
+						}), /* @__PURE__ */ _("input", {
 							type: "text",
 							placeholder: "e.g. Acme Corp",
-							value: G.clientName,
-							onChange: (e) => K({
-								...G,
+							value: K.clientName,
+							onChange: (e) => q({
+								...K,
 								clientName: e.target.value
 							}),
-							className: _
+							className: b
 						})] }),
-						/* @__PURE__ */ m("div", {
+						/* @__PURE__ */ v("div", {
 							className: "grid grid-cols-1 gap-4 sm:grid-cols-2",
-							children: [/* @__PURE__ */ m("div", { children: [/* @__PURE__ */ p("label", {
+							children: [/* @__PURE__ */ v("div", { children: [/* @__PURE__ */ _("label", {
 								className: "block text-sm font-medium text-text-primary",
 								children: "Contact Email"
-							}), /* @__PURE__ */ p("input", {
+							}), /* @__PURE__ */ _("input", {
 								type: "email",
 								placeholder: "contact@client.com",
-								value: G.contactEmail,
-								onChange: (e) => K({
-									...G,
+								value: K.contactEmail,
+								onChange: (e) => q({
+									...K,
 									contactEmail: e.target.value
 								}),
-								className: _
-							})] }), /* @__PURE__ */ m("div", { children: [/* @__PURE__ */ p("label", {
+								className: b
+							})] }), /* @__PURE__ */ v("div", { children: [/* @__PURE__ */ _("label", {
 								className: "block text-sm font-medium text-text-primary",
 								children: "Contact Phone"
-							}), /* @__PURE__ */ p("input", {
+							}), /* @__PURE__ */ _("input", {
 								type: "tel",
 								placeholder: "Optional",
-								value: G.contactPhone,
-								onChange: (e) => K({
-									...G,
+								value: K.contactPhone,
+								onChange: (e) => q({
+									...K,
 									contactPhone: e.target.value
 								}),
-								className: _
+								className: b
 							})] })]
 						}),
-						/* @__PURE__ */ m("div", { children: [/* @__PURE__ */ p("label", {
+						/* @__PURE__ */ v("div", { children: [/* @__PURE__ */ _("label", {
 							className: "block text-sm font-medium text-text-primary",
 							children: "Description"
-						}), /* @__PURE__ */ p("textarea", {
+						}), /* @__PURE__ */ _("textarea", {
 							rows: 3,
 							placeholder: "Notes about this client (optional)",
-							value: G.description,
-							onChange: (e) => K({
-								...G,
+							value: K.description,
+							onChange: (e) => q({
+								...K,
 								description: e.target.value
 							}),
-							className: _
+							className: b
 						})] }),
-						/* @__PURE__ */ m("div", { children: [
-							/* @__PURE__ */ p("label", {
+						/* @__PURE__ */ v("div", { children: [
+							/* @__PURE__ */ _("label", {
 								className: "block text-sm font-medium text-text-primary",
 								children: "Logo"
 							}),
-							/* @__PURE__ */ p("input", {
+							/* @__PURE__ */ _("input", {
 								type: "file",
 								accept: "image/*",
-								disabled: w,
+								disabled: D,
 								onChange: (e) => {
 									let t = e.target.files?.[0];
-									t && je(t), e.target.value = "";
+									t && Ge(t), e.target.value = "";
 								},
-								className: v
+								className: Ce
 							}),
-							w && /* @__PURE__ */ p("p", {
+							D && /* @__PURE__ */ _("p", {
 								className: "mt-1 text-xs text-text-secondary",
 								children: "Uploading…"
 							}),
-							G.logoUrl && /* @__PURE__ */ p("img", {
-								src: G.logoUrl,
+							K.logoUrl && /* @__PURE__ */ _("img", {
+								src: K.logoUrl,
 								alt: "Client logo preview",
 								className: "mt-2 h-16 w-16 rounded-md border border-border-seam object-cover"
 							})
@@ -441,35 +533,35 @@ function x() {
 					]
 				})
 			}),
-			/* @__PURE__ */ p(l, {
-				open: q !== null,
-				onClose: () => J(null),
+			/* @__PURE__ */ _(u, {
+				open: J !== null,
+				onClose: () => Y(null),
 				title: "Delete client?",
-				description: q ? `"${q.clientName}" and its share link will be removed.` : void 0,
+				description: J ? `"${J.clientName}" and its share link will be removed.` : void 0,
 				size: "sm",
-				footer: /* @__PURE__ */ m(f, { children: [/* @__PURE__ */ p("button", {
-					onClick: () => J(null),
+				footer: /* @__PURE__ */ v(g, { children: [/* @__PURE__ */ _("button", {
+					onClick: () => Y(null),
 					className: "rounded-md border border-border-subtle px-4 py-2 text-sm font-medium text-text-primary hover:bg-bg-sunken/50",
 					children: "Cancel"
-				}), /* @__PURE__ */ p("button", {
-					onClick: Ne,
-					disabled: L,
+				}), /* @__PURE__ */ _("button", {
+					onClick: qe,
+					disabled: F,
 					className: "rounded-md bg-status-error-bg px-4 py-2 text-sm font-medium text-status-error-text hover:bg-status-error-bg/80 disabled:opacity-50",
-					children: L ? "Deleting..." : "Delete"
+					children: F ? "Deleting..." : "Delete"
 				})] }),
-				children: /* @__PURE__ */ p("p", {
+				children: /* @__PURE__ */ _("p", {
 					className: "text-sm text-text-secondary",
 					children: "The client will lose access to their shared portal immediately. This cannot be undone."
 				})
 			}),
-			/* @__PURE__ */ p(ie, {
-				toasts: d,
-				onDismiss: ye
+			/* @__PURE__ */ _(se, {
+				toasts: h,
+				onDismiss: C
 			})
 		]
 	});
 }
 //#endregion
-export { x as ClientPortalPage };
+export { S as ClientPortalPage };
 
 //# sourceMappingURL=ClientPortalPage.js.map