@burdenoff/microfe-timecampus 2026.703.4 → 2026.703.6

package/dist/timecampus/pages/team/TeamPage.js

@@ -3,111 +3,168 @@ import { StatCard as n } from "../../components/StatCard.js";
 import { LoadingSkeleton as r } from "../../components/LoadingSkeleton.js";
 import { useGetTimeEntryStatsQuery as i } from "../../../generated/wspace-operations.js";
 import { PageLayout as a } from "../../components/PageLayout.js";
-import { Clock as o, TrendingUp as s, Users as c } from "lucide-react";
-import { jsx as l, jsxs as u } from "react/jsx-runtime";
-import { NextSteps as d } from "@burdenoff/fe-libs/ui";
+import { ChartCard as o } from "../../components/ChartCard.js";
+import { DonutChart as s } from "../../components/charts/DonutChart.js";
+import { ProgressMeter as c } from "../../components/charts/ProgressMeter.js";
+import "../../components/index.js";
+import { Activity as l, Clock as u, TrendingUp as d, Users as f } from "lucide-react";
+import { jsx as p, jsxs as m } from "react/jsx-runtime";
+import { NextSteps as h } from "@burdenoff/fe-libs/ui";
 //#region src/timecampus/pages/team/TeamPage.tsx
-function f() {
-	let { workspaceId: f = "" } = e(), p = t(), { data: m, loading: h, error: g } = i({ skip: !f }), _ = m?.timeEntryStats;
-	if (h) return /* @__PURE__ */ l(a, {
+var g = (e) => `${Number.isInteger(e) ? e : e.toFixed(1)}h`;
+function _() {
+	let { workspaceId: _ = "" } = e(), v = t(), { data: y, loading: b, error: x } = i({ skip: !_ }), S = y?.timeEntryStats;
+	if (b) return /* @__PURE__ */ p(a, {
 		title: "Team Overview",
 		description: "Monitor team performance and activity",
-		children: /* @__PURE__ */ l(r, {
+		children: /* @__PURE__ */ p(r, {
 			variant: "card",
 			count: 4
 		})
 	});
-	if (g) return /* @__PURE__ */ l(a, {
+	if (x) return /* @__PURE__ */ p(a, {
 		title: "Team Overview",
 		description: "Monitor team performance and activity",
-		children: /* @__PURE__ */ l("div", {
+		children: /* @__PURE__ */ p("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 team data. Please try again later."
 		})
 	});
-	let v = Math.floor(_?.totalHours ?? 0), y = Math.round(((_?.totalHours ?? 0) - v) * 60), b = _?.totalHours ? Math.round((_.billableHours ?? 0) / _.totalHours * 100) : 0;
-	return /* @__PURE__ */ u(a, {
+	let C = S?.totalHours ?? 0, w = S?.billableHours ?? 0, T = Math.max(0, C - w), E = Math.floor(C), D = Math.round((C - E) * 60), O = C > 0 ? Math.round(w / C * 100) : 0, k = [{
+		name: "Billable",
+		value: Math.round(w * 10) / 10
+	}, {
+		name: "Non-billable",
+		value: Math.round(T * 10) / 10
+	}];
+	return /* @__PURE__ */ m(a, {
 		title: "Team Overview",
 		description: "Monitor team performance and activity",
 		purpose: "See how your whole team is spending its time at a glance — who's active, how many hours are billable, and where capacity is going — so you can balance workload and catch problems early.",
-		children: [
-			/* @__PURE__ */ l(d, {
-				storageKey: "timecampus-team",
-				className: "mb-6",
-				steps: [
-					{
-						id: "members",
-						label: "Manage team members",
-						description: "Add people and check individual workloads.",
-						onClick: () => p("/team/members")
-					},
-					{
-						id: "analytics",
-						label: "Open team analytics",
-						description: "Compare utilisation and trends across the team.",
-						onClick: () => p("/team/analytics")
-					},
-					{
-						id: "activity",
-						label: "Watch live team activity",
-						description: "See what people are working on right now.",
-						onClick: () => p("/team-activity")
-					}
-				]
-			}),
-			/* @__PURE__ */ u("div", {
+		children: [/* @__PURE__ */ p(h, {
+			storageKey: "timecampus-team",
+			className: "mb-6",
+			steps: [
+				{
+					id: "members",
+					label: "Manage team members",
+					description: "Add people and check individual workloads.",
+					onClick: () => v("/team/members")
+				},
+				{
+					id: "analytics",
+					label: "Open team analytics",
+					description: "Compare utilisation and trends across the team.",
+					onClick: () => v("/team/analytics")
+				},
+				{
+					id: "activity",
+					label: "Watch live team activity",
+					description: "See what people are working on right now.",
+					onClick: () => v("/team-activity")
+				}
+			]
+		}), /* @__PURE__ */ m("div", {
+			className: "space-y-6",
+			children: [/* @__PURE__ */ m("div", {
 				className: "grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-4",
 				children: [
-					/* @__PURE__ */ l(n, {
+					/* @__PURE__ */ p(n, {
 						featured: !0,
 						title: "Total Entries",
-						value: String(_?.totalEntries ?? 0),
-						icon: /* @__PURE__ */ l(c, { className: "h-5 w-5" })
+						value: String(S?.totalEntries ?? 0),
+						icon: /* @__PURE__ */ p(f, { className: "h-5 w-5" })
 					}),
-					/* @__PURE__ */ l(n, {
+					/* @__PURE__ */ p(n, {
 						title: "Active Timers",
-						value: String(_?.activeTimers ?? 0),
-						icon: /* @__PURE__ */ l(c, { className: "h-5 w-5" }),
+						value: String(S?.activeTimers ?? 0),
+						icon: /* @__PURE__ */ p(l, { className: "h-5 w-5" }),
 						iconBgColor: "bg-status-success-bg text-status-success-text"
 					}),
-					/* @__PURE__ */ l(n, {
+					/* @__PURE__ */ p(n, {
 						title: "Total Hours",
-						value: `${v}h ${y}m`,
-						icon: /* @__PURE__ */ l(o, { className: "h-5 w-5" }),
+						value: `${E}h ${D}m`,
+						icon: /* @__PURE__ */ p(u, { className: "h-5 w-5" }),
 						trend: {
-							value: _?.billableHours ?? 0,
+							value: S?.billableHours ?? 0,
 							label: "billable hours"
 						}
 					}),
-					/* @__PURE__ */ l(n, {
+					/* @__PURE__ */ p(n, {
 						title: "Billable Rate",
-						value: `${b}%`,
-						icon: /* @__PURE__ */ l(s, { className: "h-5 w-5" }),
+						value: `${O}%`,
+						icon: /* @__PURE__ */ p(d, { className: "h-5 w-5" }),
 						trend: {
-							value: b,
+							value: O,
 							label: "of total hours"
 						}
 					})
 				]
-			}),
-			/* @__PURE__ */ u("div", {
-				className: "rounded-xl border border-border-seam bg-gloss-card shadow-pop p-6",
-				children: [/* @__PURE__ */ l("h3", {
-					className: "mb-4 text-sm font-semibold text-text-primary",
-					children: "Team Activity Feed"
-				}), /* @__PURE__ */ l("button", {
-					onClick: () => p("/team-activity"),
-					className: "flex h-48 w-full items-center justify-center rounded-lg border border-dashed border-border-subtle transition-colors hover:bg-bg-sunken/50",
-					children: /* @__PURE__ */ l("p", {
-						className: "text-sm text-text-secondary",
-						children: "Open the live team activity timeline"
+			}), /* @__PURE__ */ m("div", {
+				className: "grid grid-cols-1 gap-6 lg:grid-cols-2",
+				children: [/* @__PURE__ */ p(o, {
+					title: "Hours Breakdown",
+					description: "How the team's tracked time splits by billability.",
+					children: /* @__PURE__ */ p(s, {
+						data: k,
+						centerValue: Math.round(C * 10) / 10,
+						centerLabel: "Total tracked",
+						valueFormat: g,
+						height: 240,
+						emptyLabel: "No tracked hours yet"
 					})
+				}), /* @__PURE__ */ m("div", {
+					className: "rounded-xl border border-border-seam bg-gloss-card shadow-pop p-6",
+					children: [
+						/* @__PURE__ */ p("h3", {
+							className: "mb-4 text-sm font-semibold text-text-primary",
+							children: "Team Capacity & Activity"
+						}),
+						/* @__PURE__ */ p(c, {
+							label: "Billable rate",
+							value: w,
+							max: C > 0 ? C : 1,
+							higherIsWorse: !1,
+							thresholds: {
+								warning: .5,
+								danger: .3
+							},
+							format: g
+						}),
+						/* @__PURE__ */ m("div", {
+							className: "mt-5 grid grid-cols-2 gap-3",
+							children: [/* @__PURE__ */ m("div", {
+								className: "rounded-lg border border-border-subtle bg-bg-sunken/40 p-3",
+								children: [/* @__PURE__ */ p("p", {
+									className: "text-xs text-text-secondary",
+									children: "Active timers"
+								}), /* @__PURE__ */ p("p", {
+									className: "mt-1 text-lg font-semibold tabular-nums text-text-primary",
+									children: S?.activeTimers ?? 0
+								})]
+							}), /* @__PURE__ */ m("div", {
+								className: "rounded-lg border border-border-subtle bg-bg-sunken/40 p-3",
+								children: [/* @__PURE__ */ p("p", {
+									className: "text-xs text-text-secondary",
+									children: "Time entries"
+								}), /* @__PURE__ */ p("p", {
+									className: "mt-1 text-lg font-semibold tabular-nums text-text-primary",
+									children: S?.totalEntries ?? 0
+								})]
+							})]
+						}),
+						/* @__PURE__ */ m("button", {
+							onClick: () => v("/team-activity"),
+							className: "mt-5 inline-flex w-full items-center justify-center gap-1.5 rounded-md bg-action-primary-bg px-4 py-2.5 text-sm font-medium text-action-primary-text transition-colors hover:bg-action-primary-bg/90",
+							children: [/* @__PURE__ */ p(l, { className: "h-4 w-4" }), "Open live team activity"]
+						})
+					]
 				})]
-			})
-		]
+			})]
+		})]
 	});
 }
 //#endregion
-export { f as TeamPage };
+export { _ as TeamPage };
 
 //# sourceMappingURL=TeamPage.js.map

package/dist/timecampus/pages/team/TeamPage.js.map

@@ -1 +1 @@
-{"version":3,"file":"TeamPage.js","names":[],"sources":["../../../../src/timecampus/pages/team/TeamPage.tsx"],"sourcesContent":["import { Users, Clock, TrendingUp } from \"lucide-react\";\nimport { NextSteps } from \"@burdenoff/fe-libs/ui\";\nimport { PageLayout } from \"../../components/PageLayout\";\nimport { StatCard } from \"../../components/StatCard\";\nimport { LoadingSkeleton } from \"../../components/LoadingSkeleton\";\nimport {\n  useTimeCampus,\n  useTimeCampusNavigate,\n} from \"../../providers/TimeCampusProvider\";\nimport { useGetTimeEntryStatsQuery } from \"@/generated/wspace-operations\";\n\nexport function TeamPage() {\n  const { workspaceId = \"\" } = useTimeCampus();\n  const navigate = useTimeCampusNavigate();\n\n  const { data, loading, error } = useGetTimeEntryStatsQuery({\n    skip: !workspaceId,\n  });\n\n  const stats = data?.timeEntryStats;\n\n  if (loading) {\n    return (\n      <PageLayout\n        title=\"Team Overview\"\n        description=\"Monitor team performance and activity\"\n      >\n        <LoadingSkeleton variant=\"card\" count={4} />\n      </PageLayout>\n    );\n  }\n\n  if (error) {\n    return (\n      <PageLayout\n        title=\"Team Overview\"\n        description=\"Monitor team performance and activity\"\n      >\n        <div className=\"rounded-lg border border-status-error-bg/40 bg-status-error-bg p-4 text-sm text-status-error-text\">\n          Failed to load team data. Please try again later.\n        </div>\n      </PageLayout>\n    );\n  }\n\n  const totalH = Math.floor(stats?.totalHours ?? 0);\n  const totalM = Math.round(((stats?.totalHours ?? 0) - totalH) * 60);\n  const billablePercent = stats?.totalHours\n    ? Math.round(((stats.billableHours ?? 0) / stats.totalHours) * 100)\n    : 0;\n\n  return (\n    <PageLayout\n      title=\"Team Overview\"\n      description=\"Monitor team performance and activity\"\n      purpose=\"See how your whole team is spending its time at a glance — who's active, how many hours are billable, and where capacity is going — so you can balance workload and catch problems early.\"\n    >\n      <NextSteps\n        storageKey=\"timecampus-team\"\n        className=\"mb-6\"\n        steps={[\n          {\n            id: \"members\",\n            label: \"Manage team members\",\n            description: \"Add people and check individual workloads.\",\n            onClick: () => navigate(\"/team/members\"),\n          },\n          {\n            id: \"analytics\",\n            label: \"Open team analytics\",\n            description: \"Compare utilisation and trends across the team.\",\n            onClick: () => navigate(\"/team/analytics\"),\n          },\n          {\n            id: \"activity\",\n            label: \"Watch live team activity\",\n            description: \"See what people are working on right now.\",\n            onClick: () => navigate(\"/team-activity\"),\n          },\n        ]}\n      />\n      <div className=\"grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-4\">\n        <StatCard\n          featured\n          title=\"Total Entries\"\n          value={String(stats?.totalEntries ?? 0)}\n          icon={<Users className=\"h-5 w-5\" />}\n        />\n        <StatCard\n          title=\"Active Timers\"\n          value={String(stats?.activeTimers ?? 0)}\n          icon={<Users className=\"h-5 w-5\" />}\n          iconBgColor=\"bg-status-success-bg text-status-success-text\"\n        />\n        <StatCard\n          title=\"Total Hours\"\n          value={`${totalH}h ${totalM}m`}\n          icon={<Clock className=\"h-5 w-5\" />}\n          trend={{ value: stats?.billableHours ?? 0, label: \"billable hours\" }}\n        />\n        <StatCard\n          title=\"Billable Rate\"\n          value={`${billablePercent}%`}\n          icon={<TrendingUp className=\"h-5 w-5\" />}\n          trend={{ value: billablePercent, label: \"of total hours\" }}\n        />\n      </div>\n\n      <div className=\"rounded-xl border border-border-seam bg-gloss-card shadow-pop p-6\">\n        <h3 className=\"mb-4 text-sm font-semibold text-text-primary\">\n          Team Activity Feed\n        </h3>\n        <button\n          onClick={() => navigate(\"/team-activity\")}\n          className=\"flex h-48 w-full items-center justify-center rounded-lg border border-dashed border-border-subtle transition-colors hover:bg-bg-sunken/50\"\n        >\n          <p className=\"text-sm text-text-secondary\">\n            Open the live team activity timeline\n          </p>\n        </button>\n      </div>\n    </PageLayout>\n  );\n}\n"],"mappings":";;;;;;;;;AAWA,SAAgB,IAAW;CACzB,IAAM,EAAE,iBAAc,OAAO,GAAe,EACtC,IAAW,GAAuB,EAElC,EAAE,SAAM,YAAS,aAAU,EAA0B,EACzD,MAAM,CAAC,GACR,CAAC,EAEI,IAAQ,GAAM;AAEpB,KAAI,EACF,QACE,kBAAC,GAAD;EACE,OAAM;EACN,aAAY;YAEZ,kBAAC,GAAD;GAAiB,SAAQ;GAAO,OAAO;GAAK,CAAA;EACjC,CAAA;AAIjB,KAAI,EACF,QACE,kBAAC,GAAD;EACE,OAAM;EACN,aAAY;YAEZ,kBAAC,OAAD;GAAK,WAAU;aAAoG;GAE7G,CAAA;EACK,CAAA;CAIjB,IAAM,IAAS,KAAK,MAAM,GAAO,cAAc,EAAE,EAC3C,IAAS,KAAK,QAAQ,GAAO,cAAc,KAAK,KAAU,GAAG,EAC7D,IAAkB,GAAO,aAC3B,KAAK,OAAQ,EAAM,iBAAiB,KAAK,EAAM,aAAc,IAAI,GACjE;AAEJ,QACE,kBAAC,GAAD;EACE,OAAM;EACN,aAAY;EACZ,SAAQ;YAHV;GAKE,kBAAC,GAAD;IACE,YAAW;IACX,WAAU;IACV,OAAO;KACL;MACE,IAAI;MACJ,OAAO;MACP,aAAa;MACb,eAAe,EAAS,gBAAgB;MACzC;KACD;MACE,IAAI;MACJ,OAAO;MACP,aAAa;MACb,eAAe,EAAS,kBAAkB;MAC3C;KACD;MACE,IAAI;MACJ,OAAO;MACP,aAAa;MACb,eAAe,EAAS,iBAAiB;MAC1C;KACF;IACD,CAAA;GACF,kBAAC,OAAD;IAAK,WAAU;cAAf;KACE,kBAAC,GAAD;MACE,UAAA;MACA,OAAM;MACN,OAAO,OAAO,GAAO,gBAAgB,EAAE;MACvC,MAAM,kBAAC,GAAD,EAAO,WAAU,WAAY,CAAA;MACnC,CAAA;KACF,kBAAC,GAAD;MACE,OAAM;MACN,OAAO,OAAO,GAAO,gBAAgB,EAAE;MACvC,MAAM,kBAAC,GAAD,EAAO,WAAU,WAAY,CAAA;MACnC,aAAY;MACZ,CAAA;KACF,kBAAC,GAAD;MACE,OAAM;MACN,OAAO,GAAG,EAAO,IAAI,EAAO;MAC5B,MAAM,kBAAC,GAAD,EAAO,WAAU,WAAY,CAAA;MACnC,OAAO;OAAE,OAAO,GAAO,iBAAiB;OAAG,OAAO;OAAkB;MACpE,CAAA;KACF,kBAAC,GAAD;MACE,OAAM;MACN,OAAO,GAAG,EAAgB;MAC1B,MAAM,kBAAC,GAAD,EAAY,WAAU,WAAY,CAAA;MACxC,OAAO;OAAE,OAAO;OAAiB,OAAO;OAAkB;MAC1D,CAAA;KACE;;GAEN,kBAAC,OAAD;IAAK,WAAU;cAAf,CACE,kBAAC,MAAD;KAAI,WAAU;eAA+C;KAExD,CAAA,EACL,kBAAC,UAAD;KACE,eAAe,EAAS,iBAAiB;KACzC,WAAU;eAEV,kBAAC,KAAD;MAAG,WAAU;gBAA8B;MAEvC,CAAA;KACG,CAAA,CACL;;GACK"}
+{"version":3,"file":"TeamPage.js","names":[],"sources":["../../../../src/timecampus/pages/team/TeamPage.tsx"],"sourcesContent":["import { Users, Clock, TrendingUp, Activity } from \"lucide-react\";\nimport { NextSteps } from \"@burdenoff/fe-libs/ui\";\nimport {\n  PageLayout,\n  StatCard,\n  ChartCard,\n  LoadingSkeleton,\n  DonutChart,\n  ProgressMeter,\n} from \"../../components\";\nimport {\n  useTimeCampus,\n  useTimeCampusNavigate,\n} from \"../../providers/TimeCampusProvider\";\nimport { useGetTimeEntryStatsQuery } from \"@/generated/wspace-operations\";\n\nconst formatHrs = (v: number): string =>\n  `${Number.isInteger(v) ? v : v.toFixed(1)}h`;\n\nexport function TeamPage() {\n  const { workspaceId = \"\" } = useTimeCampus();\n  const navigate = useTimeCampusNavigate();\n\n  const { data, loading, error } = useGetTimeEntryStatsQuery({\n    skip: !workspaceId,\n  });\n\n  const stats = data?.timeEntryStats;\n\n  if (loading) {\n    return (\n      <PageLayout\n        title=\"Team Overview\"\n        description=\"Monitor team performance and activity\"\n      >\n        <LoadingSkeleton variant=\"card\" count={4} />\n      </PageLayout>\n    );\n  }\n\n  if (error) {\n    return (\n      <PageLayout\n        title=\"Team Overview\"\n        description=\"Monitor team performance and activity\"\n      >\n        <div className=\"rounded-lg border border-status-error-bg/40 bg-status-error-bg p-4 text-sm text-status-error-text\">\n          Failed to load team data. Please try again later.\n        </div>\n      </PageLayout>\n    );\n  }\n\n  const totalHours = stats?.totalHours ?? 0;\n  const billableHours = stats?.billableHours ?? 0;\n  const nonBillableHours = Math.max(0, totalHours - billableHours);\n  const totalH = Math.floor(totalHours);\n  const totalM = Math.round((totalHours - totalH) * 60);\n  const billablePercent =\n    totalHours > 0 ? Math.round((billableHours / totalHours) * 100) : 0;\n\n  const hoursBreakdown = [\n    { name: \"Billable\", value: Math.round(billableHours * 10) / 10 },\n    { name: \"Non-billable\", value: Math.round(nonBillableHours * 10) / 10 },\n  ];\n\n  return (\n    <PageLayout\n      title=\"Team Overview\"\n      description=\"Monitor team performance and activity\"\n      purpose=\"See how your whole team is spending its time at a glance — who's active, how many hours are billable, and where capacity is going — so you can balance workload and catch problems early.\"\n    >\n      <NextSteps\n        storageKey=\"timecampus-team\"\n        className=\"mb-6\"\n        steps={[\n          {\n            id: \"members\",\n            label: \"Manage team members\",\n            description: \"Add people and check individual workloads.\",\n            onClick: () => navigate(\"/team/members\"),\n          },\n          {\n            id: \"analytics\",\n            label: \"Open team analytics\",\n            description: \"Compare utilisation and trends across the team.\",\n            onClick: () => navigate(\"/team/analytics\"),\n          },\n          {\n            id: \"activity\",\n            label: \"Watch live team activity\",\n            description: \"See what people are working on right now.\",\n            onClick: () => navigate(\"/team-activity\"),\n          },\n        ]}\n      />\n\n      <div className=\"space-y-6\">\n        <div className=\"grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-4\">\n          <StatCard\n            featured\n            title=\"Total Entries\"\n            value={String(stats?.totalEntries ?? 0)}\n            icon={<Users className=\"h-5 w-5\" />}\n          />\n          <StatCard\n            title=\"Active Timers\"\n            value={String(stats?.activeTimers ?? 0)}\n            icon={<Activity className=\"h-5 w-5\" />}\n            iconBgColor=\"bg-status-success-bg text-status-success-text\"\n          />\n          <StatCard\n            title=\"Total Hours\"\n            value={`${totalH}h ${totalM}m`}\n            icon={<Clock className=\"h-5 w-5\" />}\n            trend={{\n              value: stats?.billableHours ?? 0,\n              label: \"billable hours\",\n            }}\n          />\n          <StatCard\n            title=\"Billable Rate\"\n            value={`${billablePercent}%`}\n            icon={<TrendingUp className=\"h-5 w-5\" />}\n            trend={{ value: billablePercent, label: \"of total hours\" }}\n          />\n        </div>\n\n        <div className=\"grid grid-cols-1 gap-6 lg:grid-cols-2\">\n          <ChartCard\n            title=\"Hours Breakdown\"\n            description=\"How the team's tracked time splits by billability.\"\n          >\n            <DonutChart\n              data={hoursBreakdown}\n              centerValue={Math.round(totalHours * 10) / 10}\n              centerLabel=\"Total tracked\"\n              valueFormat={formatHrs}\n              height={240}\n              emptyLabel=\"No tracked hours yet\"\n            />\n          </ChartCard>\n\n          <div className=\"rounded-xl border border-border-seam bg-gloss-card shadow-pop p-6\">\n            <h3 className=\"mb-4 text-sm font-semibold text-text-primary\">\n              Team Capacity & Activity\n            </h3>\n            <ProgressMeter\n              label=\"Billable rate\"\n              value={billableHours}\n              max={totalHours > 0 ? totalHours : 1}\n              higherIsWorse={false}\n              thresholds={{ warning: 0.5, danger: 0.3 }}\n              format={formatHrs}\n            />\n            <div className=\"mt-5 grid grid-cols-2 gap-3\">\n              <div className=\"rounded-lg border border-border-subtle bg-bg-sunken/40 p-3\">\n                <p className=\"text-xs text-text-secondary\">Active timers</p>\n                <p className=\"mt-1 text-lg font-semibold tabular-nums text-text-primary\">\n                  {stats?.activeTimers ?? 0}\n                </p>\n              </div>\n              <div className=\"rounded-lg border border-border-subtle bg-bg-sunken/40 p-3\">\n                <p className=\"text-xs text-text-secondary\">Time entries</p>\n                <p className=\"mt-1 text-lg font-semibold tabular-nums text-text-primary\">\n                  {stats?.totalEntries ?? 0}\n                </p>\n              </div>\n            </div>\n            <button\n              onClick={() => navigate(\"/team-activity\")}\n              className=\"mt-5 inline-flex w-full items-center justify-center gap-1.5 rounded-md bg-action-primary-bg px-4 py-2.5 text-sm font-medium text-action-primary-text transition-colors hover:bg-action-primary-bg/90\"\n            >\n              <Activity className=\"h-4 w-4\" />\n              Open live team activity\n            </button>\n          </div>\n        </div>\n      </div>\n    </PageLayout>\n  );\n}\n"],"mappings":"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"}

package/dist/timecampus/pages/team-activity/TeamActivityPage.js

@@ -4,108 +4,214 @@ import { StatCard as n } from "../../components/StatCard.js";
 import { LoadingSkeleton as r } from "../../components/LoadingSkeleton.js";
 import { useGetTimeEntryStatsQuery as i, useListWorkPatternsQuery as a } from "../../../generated/wspace-operations.js";
 import { PageLayout as o } from "../../components/PageLayout.js";
-import { EmptyState as s } from "../../components/EmptyState.js";
-import { Activity as c, CheckCircle as l, Clock as u, Users as d } from "lucide-react";
-import { jsx as f, jsxs as p } from "react/jsx-runtime";
+import { StatusBadge as s } from "../../components/StatusBadge.js";
+import { EmptyState as c } from "../../components/EmptyState.js";
+import { ChartCard as l } from "../../components/ChartCard.js";
+import { BarsChart as u } from "../../components/charts/BarsChart.js";
+import { ProgressMeter as d } from "../../components/charts/ProgressMeter.js";
+import "../../components/index.js";
+import { Activity as f, CheckCircle as p, Clock as m, Users as h, Zap as g } from "lucide-react";
+import { jsx as _, jsxs as v } from "react/jsx-runtime";
 //#region src/timecampus/pages/team-activity/TeamActivityPage.tsx
-function m() {
-	let { workspaceId: m = "" } = e(), { data: h, loading: g, error: _ } = i(), { data: v, loading: y, error: b } = a({ variables: { limit: 10 } }), x = h?.timeEntryStats, S = v?.workPatterns ?? [];
-	return g && y ? /* @__PURE__ */ f(o, {
+var y = (e) => `${Number.isInteger(e) ? e : e.toFixed(1)}h`, b = (e) => e.slice(0, 2).toUpperCase(), x = (e) => e.slice(0, 8), S = (e) => new Date(e).toLocaleDateString(void 0, {
+	month: "short",
+	day: "numeric"
+});
+function C() {
+	let { workspaceId: C = "" } = e(), { data: w, loading: T, error: E } = i({ skip: !C }), { data: D, loading: O, error: k } = a({
+		variables: { limit: 10 },
+		skip: !C
+	}), A = w?.timeEntryStats, j = D?.workPatterns ?? [];
+	if (T && O) return /* @__PURE__ */ _(o, {
 		title: "Team Activity",
 		description: "Real-time team activity feed",
-		children: /* @__PURE__ */ f(r, {
+		children: /* @__PURE__ */ _(r, {
 			variant: "list",
 			count: 5
 		})
-	}) : _ && b ? /* @__PURE__ */ f(o, {
+	});
+	if (E && k) return /* @__PURE__ */ _(o, {
 		title: "Team Activity",
 		description: "Real-time team activity feed",
-		children: /* @__PURE__ */ f("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 team activity data. Please try again later."
 		})
-	}) : /* @__PURE__ */ p(o, {
+	});
+	let M = [...j].reverse().map((e) => ({
+		label: S(e.date),
+		focus: Math.round(e.focusHours * 10) / 10,
+		meetings: Math.round(e.meetingHours * 10) / 10,
+		breaks: Math.round(e.breakHours * 10) / 10
+	}));
+	return /* @__PURE__ */ _(o, {
 		title: "Team Activity",
 		description: "Real-time team activity feed",
 		purpose: "A live pulse of what your team is doing right now — who's tracking, recent deep-work sessions, and today's hours — so you stay connected to the team's progress without interrupting anyone.",
-		children: [/* @__PURE__ */ p("div", {
-			className: "grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-4",
+		children: /* @__PURE__ */ v("div", {
+			className: "space-y-6",
 			children: [
-				/* @__PURE__ */ f(n, {
-					featured: !0,
-					title: "Active Timers",
-					value: String(x?.activeTimers ?? 0),
-					icon: /* @__PURE__ */ f(d, { className: "h-5 w-5" })
-				}),
-				/* @__PURE__ */ f(n, {
-					title: "Total Entries",
-					value: String(x?.totalEntries ?? 0),
-					icon: /* @__PURE__ */ f(l, { className: "h-5 w-5" }),
-					description: "Today"
+				/* @__PURE__ */ v("div", {
+					className: "grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-4",
+					children: [
+						/* @__PURE__ */ _(n, {
+							featured: !0,
+							title: "Active Timers",
+							value: String(A?.activeTimers ?? 0),
+							icon: /* @__PURE__ */ _(h, { className: "h-5 w-5" })
+						}),
+						/* @__PURE__ */ _(n, {
+							title: "Total Entries",
+							value: String(A?.totalEntries ?? 0),
+							icon: /* @__PURE__ */ _(p, { className: "h-5 w-5" }),
+							description: "Today"
+						}),
+						/* @__PURE__ */ _(n, {
+							title: "Team Hours",
+							value: y(Math.round(A?.totalHours ?? 0)),
+							icon: /* @__PURE__ */ _(m, { className: "h-5 w-5" }),
+							description: "Total tracked"
+						}),
+						/* @__PURE__ */ _(n, {
+							title: "Billable Hours",
+							value: y(Math.round(A?.billableHours ?? 0)),
+							icon: /* @__PURE__ */ _(f, { className: "h-5 w-5" }),
+							iconBgColor: "bg-status-success-bg text-status-success-text"
+						})
+					]
 				}),
-				/* @__PURE__ */ f(n, {
-					title: "Team Hours",
-					value: `${Math.round(x?.totalHours ?? 0)}h`,
-					icon: /* @__PURE__ */ f(u, { className: "h-5 w-5" }),
-					description: "Total tracked"
+				M.length > 0 && /* @__PURE__ */ _(l, {
+					title: "Recent Work Patterns",
+					description: "Focus, meeting and break hours across the latest logged patterns.",
+					children: /* @__PURE__ */ _(u, {
+						data: M,
+						xKey: "label",
+						stacked: !0,
+						height: 240,
+						valueFormat: y,
+						series: [
+							{
+								key: "focus",
+								label: "Focus"
+							},
+							{
+								key: "meetings",
+								label: "Meetings"
+							},
+							{
+								key: "breaks",
+								label: "Breaks"
+							}
+						],
+						emptyLabel: "No work patterns yet"
+					})
 				}),
-				/* @__PURE__ */ f(n, {
-					title: "Billable Hours",
-					value: `${Math.round(x?.billableHours ?? 0)}h`,
-					icon: /* @__PURE__ */ f(c, { className: "h-5 w-5" }),
-					iconBgColor: "bg-status-success-bg text-status-success-text"
+				/* @__PURE__ */ v("div", {
+					className: "rounded-xl border border-border-seam bg-gloss-card shadow-pop p-4 sm:p-6",
+					children: [/* @__PURE__ */ _("h3", {
+						className: "mb-4 text-sm font-semibold text-text-primary",
+						children: "Activity Feed"
+					}), j.length === 0 && !O ? /* @__PURE__ */ _(c, {
+						illustration: "empty-notifications",
+						title: "No recent activity yet",
+						description: "As your team tracks time and completes focus sessions, their activity will stream in here."
+					}) : /* @__PURE__ */ _("ul", {
+						className: "space-y-3",
+						children: j.map((e) => {
+							let n = e.deepWorkSessions > 0, r = !!e.energyLevel || !!e.mood || !!e.stressLevel;
+							return /* @__PURE__ */ _("li", {
+								className: "rounded-lg border border-border-subtle bg-bg-surface/40 p-4",
+								children: /* @__PURE__ */ v("div", {
+									className: "flex items-start gap-3",
+									children: [/* @__PURE__ */ _("div", {
+										className: "mt-0.5 flex h-9 w-9 shrink-0 items-center justify-center rounded-full bg-action-primary-bg/10 text-xs font-semibold uppercase text-primary",
+										children: b(e.userId)
+									}), /* @__PURE__ */ v("div", {
+										className: "min-w-0 flex-1",
+										children: [
+											/* @__PURE__ */ v("div", {
+												className: "flex flex-wrap items-center gap-x-2 gap-y-1",
+												children: [
+													/* @__PURE__ */ v("span", {
+														className: "inline-flex items-center rounded-full bg-bg-sunken px-2 py-0.5 text-xs font-medium text-text-secondary",
+														children: ["#", x(e.userId)]
+													}),
+													/* @__PURE__ */ _("span", {
+														className: "text-xs text-text-secondary",
+														children: t(e.createdAt)
+													}),
+													n && /* @__PURE__ */ _(s, {
+														variant: "success",
+														label: "Deep work"
+													})
+												]
+											}),
+											/* @__PURE__ */ v("p", {
+												className: "mt-1.5 flex items-center gap-1.5 text-sm font-medium text-text-primary",
+												children: [_(n ? g : f, { className: "h-3.5 w-3.5 text-primary" }), n ? "Completed deep work session" : "Logged work pattern"]
+											}),
+											/* @__PURE__ */ v("div", {
+												className: "mt-2 flex flex-wrap gap-x-4 gap-y-1 text-xs text-text-secondary",
+												children: [
+													/* @__PURE__ */ v("span", { children: [e.focusHours.toFixed(1), "h focus"] }),
+													/* @__PURE__ */ v("span", { children: [e.meetingHours.toFixed(1), "h meetings"] }),
+													e.deepWorkSessions > 0 && /* @__PURE__ */ v("span", { children: [e.deepWorkSessions, " deep sessions"] }),
+													e.interruptions > 0 && /* @__PURE__ */ v("span", { children: [e.interruptions, " interruptions"] }),
+													/* @__PURE__ */ _("span", { children: S(e.date) })
+												]
+											}),
+											e.productivityScore != null && /* @__PURE__ */ v("div", {
+												className: "mt-3",
+												children: [/* @__PURE__ */ v("div", {
+													className: "mb-1 flex items-center justify-between text-xs",
+													children: [/* @__PURE__ */ _("span", {
+														className: "text-text-secondary",
+														children: "Productivity"
+													}), /* @__PURE__ */ v("span", {
+														className: "tabular-nums text-text-primary",
+														children: [Math.round(e.productivityScore), "%"]
+													})]
+												}), /* @__PURE__ */ _(d, {
+													value: e.productivityScore,
+													max: 100,
+													higherIsWorse: !1,
+													thresholds: {
+														warning: .6,
+														danger: .4
+													},
+													showValue: !1,
+													size: "sm"
+												})]
+											}),
+											r && /* @__PURE__ */ v("div", {
+												className: "mt-3 flex flex-wrap gap-1.5",
+												children: [
+													e.energyLevel && /* @__PURE__ */ _(s, {
+														variant: "info",
+														label: `Energy: ${e.energyLevel}`
+													}),
+													e.mood && /* @__PURE__ */ _(s, {
+														variant: "muted",
+														label: `Mood: ${e.mood}`
+													}),
+													e.stressLevel && /* @__PURE__ */ _(s, {
+														variant: "warning",
+														label: `Stress: ${e.stressLevel}`
+													})
+												]
+											})
+										]
+									})]
+								})
+							}, e.id);
+						})
+					})]
 				})
 			]
-		}), /* @__PURE__ */ p("div", {
-			className: "rounded-xl border border-border-seam bg-gloss-card shadow-pop p-6",
-			children: [/* @__PURE__ */ f("h3", {
-				className: "mb-4 text-sm font-semibold text-text-primary",
-				children: "Activity Feed"
-			}), /* @__PURE__ */ p("div", {
-				className: "space-y-4",
-				children: [S.length === 0 && !y && /* @__PURE__ */ f(s, {
-					illustration: "empty-notifications",
-					title: "No recent activity yet",
-					description: "As your team tracks time and completes focus sessions, their activity will stream in here."
-				}), S.map((e) => /* @__PURE__ */ p("div", {
-					className: "flex items-start gap-3",
-					children: [/* @__PURE__ */ f("div", {
-						className: "mt-0.5 flex h-8 w-8 shrink-0 items-center justify-center rounded-full bg-action-primary-bg/10",
-						children: /* @__PURE__ */ f(c, { className: "h-4 w-4 text-primary" })
-					}), /* @__PURE__ */ p("div", {
-						className: "flex-1",
-						children: [/* @__PURE__ */ p("p", {
-							className: "text-sm text-text-primary",
-							children: [
-								/* @__PURE__ */ f("span", {
-									className: "font-medium",
-									children: e.userId
-								}),
-								" ",
-								e.deepWorkSessions > 0 ? "Completed deep work session" : "Logged work pattern"
-							]
-						}), /* @__PURE__ */ p("p", {
-							className: "text-xs text-text-secondary",
-							children: [
-								e.focusHours.toFixed(1),
-								"h focus ·",
-								" ",
-								e.meetingHours.toFixed(1),
-								"h meetings ·",
-								" ",
-								e.productivityScore ? `${e.productivityScore}% productivity` : e.date,
-								" ",
-								"· ",
-								t(e.createdAt)
-							]
-						})]
-					})]
-				}, e.id))]
-			})]
-		})]
+		})
 	});
 }
 //#endregion
-export { m as TeamActivityPage };
+export { C as TeamActivityPage };
 
 //# sourceMappingURL=TeamActivityPage.js.map

package/dist/timecampus/pages/team-activity/TeamActivityPage.js.map

@@ -1 +1 @@
-{"version":3,"file":"TeamActivityPage.js","names":[],"sources":["../../../../src/timecampus/pages/team-activity/TeamActivityPage.tsx"],"sourcesContent":["import { Activity, Users, Clock, CheckCircle } from \"lucide-react\";\nimport { PageLayout } from \"../../components/PageLayout\";\nimport { StatCard } from \"../../components/StatCard\";\nimport { EmptyState } from \"../../components/EmptyState\";\nimport { LoadingSkeleton } from \"../../components/LoadingSkeleton\";\nimport { formatRelativeTime } from \"../../utils/helpers\";\nimport { useTimeCampus } from \"../../providers/TimeCampusProvider\";\nimport {\n  useGetTimeEntryStatsQuery,\n  useListWorkPatternsQuery,\n  type WorkPatternFieldsFragment,\n} from \"@/generated/wspace-operations\";\n\nexport function TeamActivityPage() {\n  const { workspaceId = \"\" } = useTimeCampus();\n\n  const {\n    data: statsData,\n    loading: statsLoading,\n    error: statsError,\n  } = useGetTimeEntryStatsQuery();\n  const {\n    data: patternsData,\n    loading: patternsLoading,\n    error: patternsError,\n  } = useListWorkPatternsQuery({ variables: { limit: 10 } });\n\n  const stats = statsData?.timeEntryStats;\n  const patterns = patternsData?.workPatterns ?? [];\n\n  if (statsLoading && patternsLoading) {\n    return (\n      <PageLayout\n        title=\"Team Activity\"\n        description=\"Real-time team activity feed\"\n      >\n        <LoadingSkeleton variant=\"list\" count={5} />\n      </PageLayout>\n    );\n  }\n\n  if (statsError && patternsError) {\n    return (\n      <PageLayout\n        title=\"Team Activity\"\n        description=\"Real-time team activity feed\"\n      >\n        <div className=\"rounded-lg border border-status-error-bg/40 bg-status-error-bg p-4 text-sm text-status-error-text\">\n          Failed to load team activity data. Please try again later.\n        </div>\n      </PageLayout>\n    );\n  }\n\n  return (\n    <PageLayout\n      title=\"Team Activity\"\n      description=\"Real-time team activity feed\"\n      purpose=\"A live pulse of what your team is doing right now — who's tracking, recent deep-work sessions, and today's hours — so you stay connected to the team's progress without interrupting anyone.\"\n    >\n      <div className=\"grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-4\">\n        <StatCard\n          featured\n          title=\"Active Timers\"\n          value={String(stats?.activeTimers ?? 0)}\n          icon={<Users className=\"h-5 w-5\" />}\n        />\n        <StatCard\n          title=\"Total Entries\"\n          value={String(stats?.totalEntries ?? 0)}\n          icon={<CheckCircle className=\"h-5 w-5\" />}\n          description=\"Today\"\n        />\n        <StatCard\n          title=\"Team Hours\"\n          value={`${Math.round(stats?.totalHours ?? 0)}h`}\n          icon={<Clock className=\"h-5 w-5\" />}\n          description=\"Total tracked\"\n        />\n        <StatCard\n          title=\"Billable Hours\"\n          value={`${Math.round(stats?.billableHours ?? 0)}h`}\n          icon={<Activity className=\"h-5 w-5\" />}\n          iconBgColor=\"bg-status-success-bg text-status-success-text\"\n        />\n      </div>\n\n      <div className=\"rounded-xl border border-border-seam bg-gloss-card shadow-pop p-6\">\n        <h3 className=\"mb-4 text-sm font-semibold text-text-primary\">\n          Activity Feed\n        </h3>\n        <div className=\"space-y-4\">\n          {patterns.length === 0 && !patternsLoading && (\n            <EmptyState\n              illustration=\"empty-notifications\"\n              title=\"No recent activity yet\"\n              description=\"As your team tracks time and completes focus sessions, their activity will stream in here.\"\n            />\n          )}\n          {patterns.map((pattern: WorkPatternFieldsFragment) => (\n            <div key={pattern.id} className=\"flex items-start gap-3\">\n              <div className=\"mt-0.5 flex h-8 w-8 shrink-0 items-center justify-center rounded-full bg-action-primary-bg/10\">\n                <Activity className=\"h-4 w-4 text-primary\" />\n              </div>\n              <div className=\"flex-1\">\n                <p className=\"text-sm text-text-primary\">\n                  <span className=\"font-medium\">{pattern.userId}</span>{\" \"}\n                  {pattern.deepWorkSessions > 0\n                    ? \"Completed deep work session\"\n                    : \"Logged work pattern\"}\n                </p>\n                <p className=\"text-xs text-text-secondary\">\n                  {pattern.focusHours.toFixed(1)}h focus &middot;{\" \"}\n                  {pattern.meetingHours.toFixed(1)}h meetings &middot;{\" \"}\n                  {pattern.productivityScore\n                    ? `${pattern.productivityScore}% productivity`\n                    : pattern.date}{\" \"}\n                  &middot; {formatRelativeTime(pattern.createdAt)}\n                </p>\n              </div>\n            </div>\n          ))}\n        </div>\n      </div>\n    </PageLayout>\n  );\n}\n"],"mappings":";;;;;;;;;;AAaA,SAAgB,IAAmB;CACjC,IAAM,EAAE,iBAAc,OAAO,GAAe,EAEtC,EACJ,MAAM,GACN,SAAS,GACT,OAAO,MACL,GAA2B,EACzB,EACJ,MAAM,GACN,SAAS,GACT,OAAO,MACL,EAAyB,EAAE,WAAW,EAAE,OAAO,IAAI,EAAE,CAAC,EAEpD,IAAQ,GAAW,gBACnB,IAAW,GAAc,gBAAgB,EAAE;AA0BjD,QAxBI,KAAgB,IAEhB,kBAAC,GAAD;EACE,OAAM;EACN,aAAY;YAEZ,kBAAC,GAAD;GAAiB,SAAQ;GAAO,OAAO;GAAK,CAAA;EACjC,CAAA,GAIb,KAAc,IAEd,kBAAC,GAAD;EACE,OAAM;EACN,aAAY;YAEZ,kBAAC,OAAD;GAAK,WAAU;aAAoG;GAE7G,CAAA;EACK,CAAA,GAKf,kBAAC,GAAD;EACE,OAAM;EACN,aAAY;EACZ,SAAQ;YAHV,CAKE,kBAAC,OAAD;GAAK,WAAU;aAAf;IACE,kBAAC,GAAD;KACE,UAAA;KACA,OAAM;KACN,OAAO,OAAO,GAAO,gBAAgB,EAAE;KACvC,MAAM,kBAAC,GAAD,EAAO,WAAU,WAAY,CAAA;KACnC,CAAA;IACF,kBAAC,GAAD;KACE,OAAM;KACN,OAAO,OAAO,GAAO,gBAAgB,EAAE;KACvC,MAAM,kBAAC,GAAD,EAAa,WAAU,WAAY,CAAA;KACzC,aAAY;KACZ,CAAA;IACF,kBAAC,GAAD;KACE,OAAM;KACN,OAAO,GAAG,KAAK,MAAM,GAAO,cAAc,EAAE,CAAC;KAC7C,MAAM,kBAAC,GAAD,EAAO,WAAU,WAAY,CAAA;KACnC,aAAY;KACZ,CAAA;IACF,kBAAC,GAAD;KACE,OAAM;KACN,OAAO,GAAG,KAAK,MAAM,GAAO,iBAAiB,EAAE,CAAC;KAChD,MAAM,kBAAC,GAAD,EAAU,WAAU,WAAY,CAAA;KACtC,aAAY;KACZ,CAAA;IACE;MAEN,kBAAC,OAAD;GAAK,WAAU;aAAf,CACE,kBAAC,MAAD;IAAI,WAAU;cAA+C;IAExD,CAAA,EACL,kBAAC,OAAD;IAAK,WAAU;cAAf,CACG,EAAS,WAAW,KAAK,CAAC,KACzB,kBAAC,GAAD;KACE,cAAa;KACb,OAAM;KACN,aAAY;KACZ,CAAA,EAEH,EAAS,KAAK,MACb,kBAAC,OAAD;KAAsB,WAAU;eAAhC,CACE,kBAAC,OAAD;MAAK,WAAU;gBACb,kBAAC,GAAD,EAAU,WAAU,wBAAyB,CAAA;MACzC,CAAA,EACN,kBAAC,OAAD;MAAK,WAAU;gBAAf,CACE,kBAAC,KAAD;OAAG,WAAU;iBAAb;QACE,kBAAC,QAAD;SAAM,WAAU;mBAAe,EAAQ;SAAc,CAAA;QAAC;QACrD,EAAQ,mBAAmB,IACxB,gCACA;QACF;UACJ,kBAAC,KAAD;OAAG,WAAU;iBAAb;QACG,EAAQ,WAAW,QAAQ,EAAE;QAAC;QAAiB;QAC/C,EAAQ,aAAa,QAAQ,EAAE;QAAC;QAAoB;QACpD,EAAQ,oBACL,GAAG,EAAQ,kBAAkB,kBAC7B,EAAQ;QAAM;QAAI;QACZ,EAAmB,EAAQ,UAAU;QAC7C;SACA;QACF;OApBI,EAAQ,GAoBZ,CACN,CACE;MACF;KACK"}
+{"version":3,"file":"TeamActivityPage.js","names":[],"sources":["../../../../src/timecampus/pages/team-activity/TeamActivityPage.tsx"],"sourcesContent":["import { Activity, Users, Clock, CheckCircle, Zap } from \"lucide-react\";\nimport {\n  PageLayout,\n  StatCard,\n  ChartCard,\n  StatusBadge,\n  EmptyState,\n  LoadingSkeleton,\n  BarsChart,\n  ProgressMeter,\n} from \"../../components\";\nimport { formatRelativeTime } from \"../../utils/helpers\";\nimport { useTimeCampus } from \"../../providers/TimeCampusProvider\";\nimport {\n  useGetTimeEntryStatsQuery,\n  useListWorkPatternsQuery,\n  type WorkPatternFieldsFragment,\n} from \"@/generated/wspace-operations\";\n\nconst formatHrs = (v: number): string =>\n  `${Number.isInteger(v) ? v : v.toFixed(1)}h`;\n\n// Member identity (name/avatar) is owned by the groups module and is NOT\n// fetched by this page — the work-pattern feed only carries a raw `userId`\n// UUID. Until a member-lookup field is available we render a stable monogram +\n// short-id chip instead of a bare UUID. See report FUNC-GAP note.\nconst monogram = (userId: string): string => userId.slice(0, 2).toUpperCase();\nconst shortId = (userId: string): string => userId.slice(0, 8);\n\nconst shortDate = (value: string): string =>\n  new Date(value).toLocaleDateString(undefined, {\n    month: \"short\",\n    day: \"numeric\",\n  });\n\nexport function TeamActivityPage() {\n  const { workspaceId = \"\" } = useTimeCampus();\n\n  const {\n    data: statsData,\n    loading: statsLoading,\n    error: statsError,\n  } = useGetTimeEntryStatsQuery({ skip: !workspaceId });\n  const {\n    data: patternsData,\n    loading: patternsLoading,\n    error: patternsError,\n  } = useListWorkPatternsQuery({\n    variables: { limit: 10 },\n    skip: !workspaceId,\n  });\n\n  const stats = statsData?.timeEntryStats;\n  const patterns = patternsData?.workPatterns ?? [];\n\n  if (statsLoading && patternsLoading) {\n    return (\n      <PageLayout\n        title=\"Team Activity\"\n        description=\"Real-time team activity feed\"\n      >\n        <LoadingSkeleton variant=\"list\" count={5} />\n      </PageLayout>\n    );\n  }\n\n  if (statsError && patternsError) {\n    return (\n      <PageLayout\n        title=\"Team Activity\"\n        description=\"Real-time team activity feed\"\n      >\n        <div className=\"rounded-lg border border-status-error-bg/40 bg-status-error-bg p-4 text-sm text-status-error-text\">\n          Failed to load team activity data. Please try again later.\n        </div>\n      </PageLayout>\n    );\n  }\n\n  // Recent work patterns as a real stacked composition — sourced only from the\n  // rows already fetched above (oldest → newest for a left-to-right timeline).\n  const patternBars = [...patterns].reverse().map((pattern) => ({\n    label: shortDate(pattern.date),\n    focus: Math.round(pattern.focusHours * 10) / 10,\n    meetings: Math.round(pattern.meetingHours * 10) / 10,\n    breaks: Math.round(pattern.breakHours * 10) / 10,\n  }));\n\n  return (\n    <PageLayout\n      title=\"Team Activity\"\n      description=\"Real-time team activity feed\"\n      purpose=\"A live pulse of what your team is doing right now — who's tracking, recent deep-work sessions, and today's hours — so you stay connected to the team's progress without interrupting anyone.\"\n    >\n      <div className=\"space-y-6\">\n        <div className=\"grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-4\">\n          <StatCard\n            featured\n            title=\"Active Timers\"\n            value={String(stats?.activeTimers ?? 0)}\n            icon={<Users className=\"h-5 w-5\" />}\n          />\n          <StatCard\n            title=\"Total Entries\"\n            value={String(stats?.totalEntries ?? 0)}\n            icon={<CheckCircle className=\"h-5 w-5\" />}\n            description=\"Today\"\n          />\n          <StatCard\n            title=\"Team Hours\"\n            value={formatHrs(Math.round(stats?.totalHours ?? 0))}\n            icon={<Clock className=\"h-5 w-5\" />}\n            description=\"Total tracked\"\n          />\n          <StatCard\n            title=\"Billable Hours\"\n            value={formatHrs(Math.round(stats?.billableHours ?? 0))}\n            icon={<Activity className=\"h-5 w-5\" />}\n            iconBgColor=\"bg-status-success-bg text-status-success-text\"\n          />\n        </div>\n\n        {patternBars.length > 0 && (\n          <ChartCard\n            title=\"Recent Work Patterns\"\n            description=\"Focus, meeting and break hours across the latest logged patterns.\"\n          >\n            <BarsChart\n              data={patternBars}\n              xKey=\"label\"\n              stacked\n              height={240}\n              valueFormat={formatHrs}\n              series={[\n                { key: \"focus\", label: \"Focus\" },\n                { key: \"meetings\", label: \"Meetings\" },\n                { key: \"breaks\", label: \"Breaks\" },\n              ]}\n              emptyLabel=\"No work patterns yet\"\n            />\n          </ChartCard>\n        )}\n\n        <div className=\"rounded-xl border border-border-seam bg-gloss-card shadow-pop p-4 sm:p-6\">\n          <h3 className=\"mb-4 text-sm font-semibold text-text-primary\">\n            Activity Feed\n          </h3>\n          {patterns.length === 0 && !patternsLoading ? (\n            <EmptyState\n              illustration=\"empty-notifications\"\n              title=\"No recent activity yet\"\n              description=\"As your team tracks time and completes focus sessions, their activity will stream in here.\"\n            />\n          ) : (\n            <ul className=\"space-y-3\">\n              {patterns.map((pattern: WorkPatternFieldsFragment) => {\n                const isDeepWork = pattern.deepWorkSessions > 0;\n                const hasVitals =\n                  Boolean(pattern.energyLevel) ||\n                  Boolean(pattern.mood) ||\n                  Boolean(pattern.stressLevel);\n                return (\n                  <li\n                    key={pattern.id}\n                    className=\"rounded-lg border border-border-subtle bg-bg-surface/40 p-4\"\n                  >\n                    <div className=\"flex items-start gap-3\">\n                      <div className=\"mt-0.5 flex h-9 w-9 shrink-0 items-center justify-center rounded-full bg-action-primary-bg/10 text-xs font-semibold uppercase text-primary\">\n                        {monogram(pattern.userId)}\n                      </div>\n                      <div className=\"min-w-0 flex-1\">\n                        <div className=\"flex flex-wrap items-center gap-x-2 gap-y-1\">\n                          <span className=\"inline-flex items-center rounded-full bg-bg-sunken px-2 py-0.5 text-xs font-medium text-text-secondary\">\n                            #{shortId(pattern.userId)}\n                          </span>\n                          <span className=\"text-xs text-text-secondary\">\n                            {formatRelativeTime(pattern.createdAt)}\n                          </span>\n                          {isDeepWork && (\n                            <StatusBadge variant=\"success\" label=\"Deep work\" />\n                          )}\n                        </div>\n                        <p className=\"mt-1.5 flex items-center gap-1.5 text-sm font-medium text-text-primary\">\n                          {isDeepWork ? (\n                            <Zap className=\"h-3.5 w-3.5 text-primary\" />\n                          ) : (\n                            <Activity className=\"h-3.5 w-3.5 text-primary\" />\n                          )}\n                          {isDeepWork\n                            ? \"Completed deep work session\"\n                            : \"Logged work pattern\"}\n                        </p>\n                        <div className=\"mt-2 flex flex-wrap gap-x-4 gap-y-1 text-xs text-text-secondary\">\n                          <span>{pattern.focusHours.toFixed(1)}h focus</span>\n                          <span>\n                            {pattern.meetingHours.toFixed(1)}h meetings\n                          </span>\n                          {pattern.deepWorkSessions > 0 && (\n                            <span>\n                              {pattern.deepWorkSessions} deep sessions\n                            </span>\n                          )}\n                          {pattern.interruptions > 0 && (\n                            <span>{pattern.interruptions} interruptions</span>\n                          )}\n                          <span>{shortDate(pattern.date)}</span>\n                        </div>\n                        {pattern.productivityScore != null && (\n                          <div className=\"mt-3\">\n                            <div className=\"mb-1 flex items-center justify-between text-xs\">\n                              <span className=\"text-text-secondary\">\n                                Productivity\n                              </span>\n                              <span className=\"tabular-nums text-text-primary\">\n                                {Math.round(pattern.productivityScore)}%\n                              </span>\n                            </div>\n                            <ProgressMeter\n                              value={pattern.productivityScore}\n                              max={100}\n                              higherIsWorse={false}\n                              thresholds={{ warning: 0.6, danger: 0.4 }}\n                              showValue={false}\n                              size=\"sm\"\n                            />\n                          </div>\n                        )}\n                        {hasVitals && (\n                          <div className=\"mt-3 flex flex-wrap gap-1.5\">\n                            {pattern.energyLevel && (\n                              <StatusBadge\n                                variant=\"info\"\n                                label={`Energy: ${pattern.energyLevel}`}\n                              />\n                            )}\n                            {pattern.mood && (\n                              <StatusBadge\n                                variant=\"muted\"\n                                label={`Mood: ${pattern.mood}`}\n                              />\n                            )}\n                            {pattern.stressLevel && (\n                              <StatusBadge\n                                variant=\"warning\"\n                                label={`Stress: ${pattern.stressLevel}`}\n                              />\n                            )}\n                          </div>\n                        )}\n                      </div>\n                    </div>\n                  </li>\n                );\n              })}\n            </ul>\n          )}\n        </div>\n      </div>\n    </PageLayout>\n  );\n}\n"],"mappings":"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"}