@burdenoff/microfe-timecampus 2026.625.1 → 2026.626.1

package/dist/timecampus/pages/email-tracking/EmailTrackingPage.js

@@ -3,42 +3,48 @@ import { formatRelativeTime as t, getPriorityColor as n, getStatusColor as r } f
 import { LoadingSkeleton as i } from "../../components/LoadingSkeleton.js";
 import { useListEmailTimeEntriesQuery as a } from "../../../generated/wspace-operations.js";
 import { PageLayout as o } from "../../components/PageLayout.js";
-import { Filter as s, Mail as c } from "lucide-react";
-import { jsx as l, jsxs as u } from "react/jsx-runtime";
+import { EmptyState as s } from "../../components/EmptyState.js";
+import { Filter as c, Mail as l } from "lucide-react";
+import { jsx as u, jsxs as d } from "react/jsx-runtime";
+import { GlassCard as f } from "@burdenoff/fe-libs/ui";
 //#region src/timecampus/pages/email-tracking/EmailTrackingPage.tsx
-function d() {
-	let { workspaceId: d = "" } = e(), { data: f, loading: p, error: m } = a({
+function p() {
+	let { workspaceId: p = "" } = e(), { data: m, loading: h, error: g } = a({
 		variables: { limit: 50 },
-		skip: !d
-	}), h = f?.emailTimeEntries ?? [];
-	return /* @__PURE__ */ l(o, {
+		skip: !p
+	}), _ = m?.emailTimeEntries ?? [];
+	return /* @__PURE__ */ u(o, {
 		title: "Email Tracking",
 		description: "Track time spent on emails",
-		actions: /* @__PURE__ */ u("button", {
+		purpose: "Surface the hidden hours email steals from your day — every message linked to the time it took and the project it belonged to — so inbox work finally shows up in your timesheets and reports.",
+		actions: /* @__PURE__ */ d("button", {
 			className: "inline-flex items-center gap-1.5 rounded-md border border-border-subtle px-3 py-2 text-sm font-medium text-text-primary hover:bg-bg-sunken/50",
-			children: [/* @__PURE__ */ l(s, { className: "h-4 w-4" }), "Filter"]
+			children: [/* @__PURE__ */ u(c, { className: "h-4 w-4" }), "Filter"]
 		}),
-		children: p ? /* @__PURE__ */ l(i, {
+		children: h ? /* @__PURE__ */ u(i, {
 			variant: "list",
 			count: 4
-		}) : m ? /* @__PURE__ */ l("div", {
+		}) : g ? /* @__PURE__ */ u("div", {
 			className: "rounded-xl border border-status-error-border/50 bg-status-error-bg/10 p-4 text-sm text-status-error-text",
 			children: "Failed to load email entries. Please try again later."
-		}) : /* @__PURE__ */ l("div", {
-			className: "rounded-xl border border-border-seam bg-gloss-card shadow-pop",
-			children: /* @__PURE__ */ l("div", {
+		}) : _.length === 0 ? /* @__PURE__ */ u(s, {
+			illustration: "empty-notifications",
+			title: "No email entries found",
+			description: "Once email tracking is connected, the time you spend reading and replying shows up here."
+		}) : /* @__PURE__ */ u(f, {
+			treatment: "glass",
+			glow: !0,
+			className: "overflow-hidden",
+			children: /* @__PURE__ */ u("div", {
 				className: "divide-y divide-border",
-				children: h.length === 0 ? /* @__PURE__ */ l("div", {
-					className: "p-8 text-center text-sm text-text-secondary",
-					children: "No email entries found."
-				}) : h.map((e) => /* @__PURE__ */ u("div", {
+				children: _.map((e) => /* @__PURE__ */ d("div", {
 					className: "flex items-center justify-between p-4 hover:bg-bg-sunken/50 transition-colors cursor-pointer",
-					children: [/* @__PURE__ */ u("div", {
+					children: [/* @__PURE__ */ d("div", {
 						className: "flex items-center gap-3",
-						children: [/* @__PURE__ */ l(c, { className: `h-5 w-5 ${e.isImportant ? "text-primary" : "text-text-secondary"}` }), /* @__PURE__ */ u("div", { children: [/* @__PURE__ */ l("p", {
+						children: [/* @__PURE__ */ u(l, { className: `h-5 w-5 ${e.isImportant ? "text-primary" : "text-text-secondary"}` }), /* @__PURE__ */ d("div", { children: [/* @__PURE__ */ u("p", {
 							className: `text-sm ${e.isImportant ? "font-semibold text-text-primary" : "font-medium text-text-primary"}`,
 							children: e.subject ?? "(No subject)"
-						}), /* @__PURE__ */ u("p", {
+						}), /* @__PURE__ */ d("p", {
 							className: "text-xs text-text-secondary",
 							children: [
 								e.sender ?? "Unknown",
@@ -50,12 +56,12 @@ function d() {
 								"min"
 							]
 						})] })]
-					}), /* @__PURE__ */ u("div", {
+					}), /* @__PURE__ */ d("div", {
 						className: "flex items-center gap-2",
-						children: [/* @__PURE__ */ l("span", {
+						children: [/* @__PURE__ */ u("span", {
 							className: `inline-flex rounded-full px-2 py-0.5 text-xs font-medium ${n(e.isImportant ? "high" : "low")}`,
 							children: e.isImportant ? "high" : "normal"
-						}), /* @__PURE__ */ l("span", {
+						}), /* @__PURE__ */ u("span", {
 							className: `inline-flex rounded-full px-2 py-0.5 text-xs font-medium ${r(e.category ?? "active")}`,
 							children: e.category ?? "uncategorized"
 						})]
@@ -66,6 +72,6 @@ function d() {
 	});
 }
 //#endregion
-export { d as EmailTrackingPage };
+export { p as EmailTrackingPage };
 
 //# sourceMappingURL=EmailTrackingPage.js.map

package/dist/timecampus/pages/email-tracking/EmailTrackingPage.js.map

@@ -1 +1 @@
-{"version":3,"file":"EmailTrackingPage.js","names":[],"sources":["../../../../src/timecampus/pages/email-tracking/EmailTrackingPage.tsx"],"sourcesContent":["import { Mail, Filter } from \"lucide-react\";\nimport { PageLayout } from \"../../components/PageLayout\";\nimport { LoadingSkeleton } from \"../../components/LoadingSkeleton\";\nimport {\n  getStatusColor,\n  getPriorityColor,\n  formatRelativeTime,\n} from \"../../utils/helpers\";\nimport { useTimeCampus } from \"../../providers/TimeCampusProvider\";\nimport {\n  useListEmailTimeEntriesQuery,\n  type EmailTimeEntryFieldsFragment,\n} from \"@/generated/wspace-operations\";\n\nexport function EmailTrackingPage() {\n  const { workspaceId = \"\" } = useTimeCampus();\n  const { data, loading, error } = useListEmailTimeEntriesQuery({\n    variables: { limit: 50 },\n    skip: !workspaceId,\n  });\n\n  const emails = data?.emailTimeEntries ?? [];\n\n  return (\n    <PageLayout\n      title=\"Email Tracking\"\n      description=\"Track time spent on emails\"\n      actions={\n        <button className=\"inline-flex items-center gap-1.5 rounded-md border border-border-subtle px-3 py-2 text-sm font-medium text-text-primary hover:bg-bg-sunken/50\">\n          <Filter className=\"h-4 w-4\" />\n          Filter\n        </button>\n      }\n    >\n      {loading ? (\n        <LoadingSkeleton variant=\"list\" count={4} />\n      ) : error ? (\n        <div className=\"rounded-xl border border-status-error-border/50 bg-status-error-bg/10 p-4 text-sm text-status-error-text\">\n          Failed to load email entries. Please try again later.\n        </div>\n      ) : (\n        <div className=\"rounded-xl border border-border-seam bg-gloss-card shadow-pop\">\n          <div className=\"divide-y divide-border\">\n            {emails.length === 0 ? (\n              <div className=\"p-8 text-center text-sm text-text-secondary\">\n                No email entries found.\n              </div>\n            ) : (\n              emails.map((email: EmailTimeEntryFieldsFragment) => (\n                <div\n                  key={email.id}\n                  className=\"flex items-center justify-between p-4 hover:bg-bg-sunken/50 transition-colors cursor-pointer\"\n                >\n                  <div className=\"flex items-center gap-3\">\n                    <Mail\n                      className={`h-5 w-5 ${email.isImportant ? \"text-primary\" : \"text-text-secondary\"}`}\n                    />\n                    <div>\n                      <p\n                        className={`text-sm ${email.isImportant ? \"font-semibold text-text-primary\" : \"font-medium text-text-primary\"}`}\n                      >\n                        {email.subject ?? \"(No subject)\"}\n                      </p>\n                      <p className=\"text-xs text-text-secondary\">\n                        {email.sender ?? \"Unknown\"} &middot;{\" \"}\n                        {formatRelativeTime(email.date)} &middot; ~\n                        {email.duration ?? 0}min\n                      </p>\n                    </div>\n                  </div>\n                  <div className=\"flex items-center gap-2\">\n                    <span\n                      className={`inline-flex rounded-full px-2 py-0.5 text-xs font-medium ${getPriorityColor(email.isImportant ? \"high\" : \"low\")}`}\n                    >\n                      {email.isImportant ? \"high\" : \"normal\"}\n                    </span>\n                    <span\n                      className={`inline-flex rounded-full px-2 py-0.5 text-xs font-medium ${getStatusColor(email.category ?? \"active\")}`}\n                    >\n                      {email.category ?? \"uncategorized\"}\n                    </span>\n                  </div>\n                </div>\n              ))\n            )}\n          </div>\n        </div>\n      )}\n    </PageLayout>\n  );\n}\n"],"mappings":";;;;;;;;AAcA,SAAgB,IAAoB;CAClC,IAAM,EAAE,iBAAc,OAAO,GAAe,EACtC,EAAE,SAAM,YAAS,aAAU,EAA6B;EAC5D,WAAW,EAAE,OAAO,IAAI;EACxB,MAAM,CAAC;EACR,CAAC,EAEI,IAAS,GAAM,oBAAoB,EAAE;AAE3C,QACE,kBAAC,GAAD;EACE,OAAM;EACN,aAAY;EACZ,SACE,kBAAC,UAAD;GAAQ,WAAU;aAAlB,CACE,kBAAC,GAAD,EAAQ,WAAU,WAAY,CAAA,EAAA,SAEvB;;YAGV,IACC,kBAAC,GAAD;GAAiB,SAAQ;GAAO,OAAO;GAAK,CAAA,GAC1C,IACF,kBAAC,OAAD;GAAK,WAAU;aAA2G;GAEpH,CAAA,GAEN,kBAAC,OAAD;GAAK,WAAU;aACb,kBAAC,OAAD;IAAK,WAAU;cACZ,EAAO,WAAW,IACjB,kBAAC,OAAD;KAAK,WAAU;eAA8C;KAEvD,CAAA,GAEN,EAAO,KAAK,MACV,kBAAC,OAAD;KAEE,WAAU;eAFZ,CAIE,kBAAC,OAAD;MAAK,WAAU;gBAAf,CACE,kBAAC,GAAD,EACE,WAAW,WAAW,EAAM,cAAc,iBAAiB,yBAC3D,CAAA,EACF,kBAAC,OAAD,EAAA,UAAA,CACE,kBAAC,KAAD;OACE,WAAW,WAAW,EAAM,cAAc,oCAAoC;iBAE7E,EAAM,WAAW;OAChB,CAAA,EACJ,kBAAC,KAAD;OAAG,WAAU;iBAAb;QACG,EAAM,UAAU;QAAU;QAAU;QACpC,EAAmB,EAAM,KAAK;QAAC;QAC/B,EAAM,YAAY;QAAE;QACnB;SACA,EAAA,CAAA,CACF;SACN,kBAAC,OAAD;MAAK,WAAU;gBAAf,CACE,kBAAC,QAAD;OACE,WAAW,4DAA4D,EAAiB,EAAM,cAAc,SAAS,MAAM;iBAE1H,EAAM,cAAc,SAAS;OACzB,CAAA,EACP,kBAAC,QAAD;OACE,WAAW,4DAA4D,EAAe,EAAM,YAAY,SAAS;iBAEhH,EAAM,YAAY;OACd,CAAA,CACH;QACF;OAhCC,EAAM,GAgCP,CACN;IAEA,CAAA;GACF,CAAA;EAEG,CAAA"}
+{"version":3,"file":"EmailTrackingPage.js","names":[],"sources":["../../../../src/timecampus/pages/email-tracking/EmailTrackingPage.tsx"],"sourcesContent":["import { Mail, Filter } from \"lucide-react\";\nimport { GlassCard } from \"@burdenoff/fe-libs/ui\";\nimport { PageLayout } from \"../../components/PageLayout\";\nimport { EmptyState } from \"../../components/EmptyState\";\nimport { LoadingSkeleton } from \"../../components/LoadingSkeleton\";\nimport {\n  getStatusColor,\n  getPriorityColor,\n  formatRelativeTime,\n} from \"../../utils/helpers\";\nimport { useTimeCampus } from \"../../providers/TimeCampusProvider\";\nimport {\n  useListEmailTimeEntriesQuery,\n  type EmailTimeEntryFieldsFragment,\n} from \"@/generated/wspace-operations\";\n\nexport function EmailTrackingPage() {\n  const { workspaceId = \"\" } = useTimeCampus();\n  const { data, loading, error } = useListEmailTimeEntriesQuery({\n    variables: { limit: 50 },\n    skip: !workspaceId,\n  });\n\n  const emails = data?.emailTimeEntries ?? [];\n\n  return (\n    <PageLayout\n      title=\"Email Tracking\"\n      description=\"Track time spent on emails\"\n      purpose=\"Surface the hidden hours email steals from your day — every message linked to the time it took and the project it belonged to — so inbox work finally shows up in your timesheets and reports.\"\n      actions={\n        <button className=\"inline-flex items-center gap-1.5 rounded-md border border-border-subtle px-3 py-2 text-sm font-medium text-text-primary hover:bg-bg-sunken/50\">\n          <Filter className=\"h-4 w-4\" />\n          Filter\n        </button>\n      }\n    >\n      {loading ? (\n        <LoadingSkeleton variant=\"list\" count={4} />\n      ) : error ? (\n        <div className=\"rounded-xl border border-status-error-border/50 bg-status-error-bg/10 p-4 text-sm text-status-error-text\">\n          Failed to load email entries. Please try again later.\n        </div>\n      ) : emails.length === 0 ? (\n        <EmptyState\n          illustration=\"empty-notifications\"\n          title=\"No email entries found\"\n          description=\"Once email tracking is connected, the time you spend reading and replying shows up here.\"\n        />\n      ) : (\n        <GlassCard treatment=\"glass\" glow className=\"overflow-hidden\">\n          <div className=\"divide-y divide-border\">\n            {emails.map((email: EmailTimeEntryFieldsFragment) => (\n              <div\n                key={email.id}\n                className=\"flex items-center justify-between p-4 hover:bg-bg-sunken/50 transition-colors cursor-pointer\"\n              >\n                <div className=\"flex items-center gap-3\">\n                  <Mail\n                    className={`h-5 w-5 ${email.isImportant ? \"text-primary\" : \"text-text-secondary\"}`}\n                  />\n                  <div>\n                    <p\n                      className={`text-sm ${email.isImportant ? \"font-semibold text-text-primary\" : \"font-medium text-text-primary\"}`}\n                    >\n                      {email.subject ?? \"(No subject)\"}\n                    </p>\n                    <p className=\"text-xs text-text-secondary\">\n                      {email.sender ?? \"Unknown\"} &middot;{\" \"}\n                      {formatRelativeTime(email.date)} &middot; ~\n                      {email.duration ?? 0}min\n                    </p>\n                  </div>\n                </div>\n                <div className=\"flex items-center gap-2\">\n                  <span\n                    className={`inline-flex rounded-full px-2 py-0.5 text-xs font-medium ${getPriorityColor(email.isImportant ? \"high\" : \"low\")}`}\n                  >\n                    {email.isImportant ? \"high\" : \"normal\"}\n                  </span>\n                  <span\n                    className={`inline-flex rounded-full px-2 py-0.5 text-xs font-medium ${getStatusColor(email.category ?? \"active\")}`}\n                  >\n                    {email.category ?? \"uncategorized\"}\n                  </span>\n                </div>\n              </div>\n            ))}\n          </div>\n        </GlassCard>\n      )}\n    </PageLayout>\n  );\n}\n"],"mappings":";;;;;;;;;;AAgBA,SAAgB,IAAoB;CAClC,IAAM,EAAE,iBAAc,OAAO,GAAe,EACtC,EAAE,SAAM,YAAS,aAAU,EAA6B;EAC5D,WAAW,EAAE,OAAO,IAAI;EACxB,MAAM,CAAC;EACR,CAAC,EAEI,IAAS,GAAM,oBAAoB,EAAE;AAE3C,QACE,kBAAC,GAAD;EACE,OAAM;EACN,aAAY;EACZ,SAAQ;EACR,SACE,kBAAC,UAAD;GAAQ,WAAU;aAAlB,CACE,kBAAC,GAAD,EAAQ,WAAU,WAAY,CAAA,EAAA,SAEvB;;YAGV,IACC,kBAAC,GAAD;GAAiB,SAAQ;GAAO,OAAO;GAAK,CAAA,GAC1C,IACF,kBAAC,OAAD;GAAK,WAAU;aAA2G;GAEpH,CAAA,GACJ,EAAO,WAAW,IACpB,kBAAC,GAAD;GACE,cAAa;GACb,OAAM;GACN,aAAY;GACZ,CAAA,GAEF,kBAAC,GAAD;GAAW,WAAU;GAAQ,MAAA;GAAK,WAAU;aAC1C,kBAAC,OAAD;IAAK,WAAU;cACZ,EAAO,KAAK,MACX,kBAAC,OAAD;KAEE,WAAU;eAFZ,CAIE,kBAAC,OAAD;MAAK,WAAU;gBAAf,CACE,kBAAC,GAAD,EACE,WAAW,WAAW,EAAM,cAAc,iBAAiB,yBAC3D,CAAA,EACF,kBAAC,OAAD,EAAA,UAAA,CACE,kBAAC,KAAD;OACE,WAAW,WAAW,EAAM,cAAc,oCAAoC;iBAE7E,EAAM,WAAW;OAChB,CAAA,EACJ,kBAAC,KAAD;OAAG,WAAU;iBAAb;QACG,EAAM,UAAU;QAAU;QAAU;QACpC,EAAmB,EAAM,KAAK;QAAC;QAC/B,EAAM,YAAY;QAAE;QACnB;SACA,EAAA,CAAA,CACF;SACN,kBAAC,OAAD;MAAK,WAAU;gBAAf,CACE,kBAAC,QAAD;OACE,WAAW,4DAA4D,EAAiB,EAAM,cAAc,SAAS,MAAM;iBAE1H,EAAM,cAAc,SAAS;OACzB,CAAA,EACP,kBAAC,QAAD;OACE,WAAW,4DAA4D,EAAe,EAAM,YAAY,SAAS;iBAEhH,EAAM,YAAY;OACd,CAAA,CACH;QACF;OAhCC,EAAM,GAgCP,CACN;IACE,CAAA;GACI,CAAA;EAEH,CAAA"}

package/dist/timecampus/pages/expense-tracking/ExpenseTrackingPage.js

@@ -4,72 +4,80 @@ import { StatCard as i } from "../../components/StatCard.js";
 import { LoadingSkeleton as a } from "../../components/LoadingSkeleton.js";
 import { useGetExpenseStatsQuery as o, useListExpensesQuery as s } from "../../../generated/wspace-operations.js";
 import { PageLayout as c } from "../../components/PageLayout.js";
-import { DollarSign as l, Plus as u, Receipt as d } from "lucide-react";
-import { jsx as f, jsxs as p } from "react/jsx-runtime";
+import { EmptyState as l } from "../../components/EmptyState.js";
+import { DollarSign as u, Plus as d, Receipt as f } from "lucide-react";
+import { jsx as p, jsxs as m } from "react/jsx-runtime";
 //#region src/timecampus/pages/expense-tracking/ExpenseTrackingPage.tsx
-function m() {
-	let { workspaceId: m = "" } = e(), { data: h, loading: g, error: _ } = s({ variables: { workspaceId: m } }), { data: v, loading: y, error: b } = o({ variables: { workspaceId: m } }), x = h?.expenses ?? [], S = v?.expenseStats;
-	return g && y ? /* @__PURE__ */ f(c, {
+function h() {
+	let { workspaceId: h = "" } = e(), { data: g, loading: _, error: v } = s({ variables: { workspaceId: h } }), { data: y, loading: b, error: x } = o({ variables: { workspaceId: h } }), S = g?.expenses ?? [], C = y?.expenseStats;
+	return _ && b ? /* @__PURE__ */ p(c, {
 		title: "Expense Tracking",
 		description: "Track and manage work expenses",
-		children: /* @__PURE__ */ f(a, {
+		children: /* @__PURE__ */ p(a, {
 			variant: "list",
 			count: 4
 		})
-	}) : _ && b ? /* @__PURE__ */ f(c, {
+	}) : v && x ? /* @__PURE__ */ p(c, {
 		title: "Expense Tracking",
 		description: "Track and manage work expenses",
-		children: /* @__PURE__ */ f("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 expense data. Please try again later."
 		})
-	}) : /* @__PURE__ */ p(c, {
+	}) : /* @__PURE__ */ m(c, {
 		title: "Expense Tracking",
 		description: "Track and manage work expenses",
-		actions: /* @__PURE__ */ p("button", {
+		purpose: "Capture project-related costs alongside the hours you log — receipts, categories and approvals in one place — so the bill you send a client reflects the full cost of the work, not just time.",
+		actions: /* @__PURE__ */ m("button", {
 			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__ */ f(u, { className: "h-4 w-4" }), "Add Expense"]
+			children: [/* @__PURE__ */ p(d, { className: "h-4 w-4" }), "Add Expense"]
 		}),
-		children: [/* @__PURE__ */ p("div", {
+		children: [/* @__PURE__ */ m("div", {
 			className: "grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-4",
 			children: [
-				/* @__PURE__ */ f(i, {
+				/* @__PURE__ */ p(i, {
+					featured: !0,
 					title: "Total This Month",
-					value: t(S?.totalAmount ?? 0),
-					icon: /* @__PURE__ */ f(l, { className: "h-5 w-5" })
+					value: t(C?.totalAmount ?? 0),
+					icon: /* @__PURE__ */ p(u, { className: "h-5 w-5" })
 				}),
-				/* @__PURE__ */ f(i, {
+				/* @__PURE__ */ p(i, {
 					title: "Pending",
-					value: String(S?.pendingCount ?? 0),
+					value: String(C?.pendingCount ?? 0),
 					description: "expenses awaiting approval"
 				}),
-				/* @__PURE__ */ f(i, {
+				/* @__PURE__ */ p(i, {
 					title: "Approved",
-					value: String(S?.approvedCount ?? 0),
+					value: String(C?.approvedCount ?? 0),
 					description: "expenses approved"
 				}),
-				/* @__PURE__ */ f(i, {
+				/* @__PURE__ */ p(i, {
 					title: "Average",
-					value: t(S?.averageAmount ?? 0),
-					icon: /* @__PURE__ */ f(d, { className: "h-5 w-5" }),
+					value: t(C?.averageAmount ?? 0),
+					icon: /* @__PURE__ */ p(f, { className: "h-5 w-5" }),
 					description: "per expense"
 				})
 			]
-		}), /* @__PURE__ */ f("div", {
+		}), S.length === 0 && !_ ? /* @__PURE__ */ p(l, {
+			illustration: "empty-data",
+			title: "No expenses recorded yet",
+			description: "Add your first expense to track project costs and route them for approval.",
+			action: /* @__PURE__ */ m("button", {
+				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(d, { className: "h-4 w-4" }), "Add Expense"]
+			})
+		}) : /* @__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: [x.length === 0 && !g && /* @__PURE__ */ f("div", {
-					className: "p-4 text-center text-sm text-text-secondary",
-					children: "No expenses recorded yet."
-				}), x.map((e) => /* @__PURE__ */ p("div", {
+				children: S.map((e) => /* @__PURE__ */ m("div", {
 					className: "flex items-center justify-between p-4 hover:bg-bg-sunken/50 transition-colors",
-					children: [/* @__PURE__ */ p("div", {
+					children: [/* @__PURE__ */ m("div", {
 						className: "flex items-center gap-3",
-						children: [/* @__PURE__ */ f(d, { className: "h-5 w-5 text-text-secondary" }), /* @__PURE__ */ p("div", { children: [/* @__PURE__ */ f("p", {
+						children: [/* @__PURE__ */ p(f, { className: "h-5 w-5 text-text-secondary" }), /* @__PURE__ */ m("div", { children: [/* @__PURE__ */ p("p", {
 							className: "text-sm font-medium text-text-primary",
 							children: e.description ?? "Untitled expense"
-						}), /* @__PURE__ */ p("p", {
+						}), /* @__PURE__ */ m("p", {
 							className: "text-xs text-text-secondary",
 							children: [
 								e.category,
@@ -81,22 +89,22 @@ function m() {
 								n(e.date)
 							]
 						})] })]
-					}), /* @__PURE__ */ p("div", {
+					}), /* @__PURE__ */ m("div", {
 						className: "flex items-center gap-3",
-						children: [/* @__PURE__ */ f("p", {
+						children: [/* @__PURE__ */ p("p", {
 							className: "text-sm font-medium text-text-primary",
 							children: t(e.amount)
-						}), /* @__PURE__ */ f("span", {
+						}), /* @__PURE__ */ p("span", {
 							className: `inline-flex rounded-full px-2 py-0.5 text-xs font-medium ${r(e.status)}`,
 							children: e.status
 						})]
 					})]
-				}, e.id))]
+				}, e.id))
 			})
 		})]
 	});
 }
 //#endregion
-export { m as ExpenseTrackingPage };
+export { h as ExpenseTrackingPage };
 
 //# sourceMappingURL=ExpenseTrackingPage.js.map

package/dist/timecampus/pages/expense-tracking/ExpenseTrackingPage.js.map

@@ -1 +1 @@
-{"version":3,"file":"ExpenseTrackingPage.js","names":[],"sources":["../../../../src/timecampus/pages/expense-tracking/ExpenseTrackingPage.tsx"],"sourcesContent":["import { Receipt, Plus, DollarSign } from \"lucide-react\";\nimport { PageLayout } from \"../../components/PageLayout\";\nimport { StatCard } from \"../../components/StatCard\";\nimport { LoadingSkeleton } from \"../../components/LoadingSkeleton\";\nimport {\n  getStatusColor,\n  formatCurrency,\n  formatDate,\n} from \"../../utils/helpers\";\nimport { useTimeCampus } from \"../../providers/TimeCampusProvider\";\nimport {\n  useListExpensesQuery,\n  useGetExpenseStatsQuery,\n  type ExpenseFieldsFragment,\n} from \"@/generated/wspace-operations\";\n\nexport function ExpenseTrackingPage() {\n  const { workspaceId = \"\" } = useTimeCampus();\n\n  const {\n    data: expensesData,\n    loading: expensesLoading,\n    error: expensesError,\n  } = useListExpensesQuery({\n    variables: { workspaceId },\n  });\n  const {\n    data: statsData,\n    loading: statsLoading,\n    error: statsError,\n  } = useGetExpenseStatsQuery({\n    variables: { workspaceId },\n  });\n\n  const expenses = expensesData?.expenses ?? [];\n  const stats = statsData?.expenseStats;\n\n  if (expensesLoading && statsLoading) {\n    return (\n      <PageLayout\n        title=\"Expense Tracking\"\n        description=\"Track and manage work expenses\"\n      >\n        <LoadingSkeleton variant=\"list\" count={4} />\n      </PageLayout>\n    );\n  }\n\n  if (expensesError && statsError) {\n    return (\n      <PageLayout\n        title=\"Expense Tracking\"\n        description=\"Track and manage work expenses\"\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 expense data. Please try again later.\n        </div>\n      </PageLayout>\n    );\n  }\n\n  return (\n    <PageLayout\n      title=\"Expense Tracking\"\n      description=\"Track and manage work expenses\"\n      actions={\n        <button 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\">\n          <Plus className=\"h-4 w-4\" />\n          Add Expense\n        </button>\n      }\n    >\n      <div className=\"grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-4\">\n        <StatCard\n          title=\"Total This Month\"\n          value={formatCurrency(stats?.totalAmount ?? 0)}\n          icon={<DollarSign className=\"h-5 w-5\" />}\n        />\n        <StatCard\n          title=\"Pending\"\n          value={String(stats?.pendingCount ?? 0)}\n          description=\"expenses awaiting approval\"\n        />\n        <StatCard\n          title=\"Approved\"\n          value={String(stats?.approvedCount ?? 0)}\n          description=\"expenses approved\"\n        />\n        <StatCard\n          title=\"Average\"\n          value={formatCurrency(stats?.averageAmount ?? 0)}\n          icon={<Receipt className=\"h-5 w-5\" />}\n          description=\"per expense\"\n        />\n      </div>\n\n      <div className=\"rounded-xl border border-border-seam bg-gloss-card shadow-pop\">\n        <div className=\"divide-y divide-border\">\n          {expenses.length === 0 && !expensesLoading && (\n            <div className=\"p-4 text-center text-sm text-text-secondary\">\n              No expenses recorded yet.\n            </div>\n          )}\n          {expenses.map((expense: ExpenseFieldsFragment) => (\n            <div\n              key={expense.id}\n              className=\"flex items-center justify-between p-4 hover:bg-bg-sunken/50 transition-colors\"\n            >\n              <div className=\"flex items-center gap-3\">\n                <Receipt className=\"h-5 w-5 text-text-secondary\" />\n                <div>\n                  <p className=\"text-sm font-medium text-text-primary\">\n                    {expense.description ?? \"Untitled expense\"}\n                  </p>\n                  <p className=\"text-xs text-text-secondary\">\n                    {expense.category} &middot;{\" \"}\n                    {expense.projectId ?? \"No project\"} &middot;{\" \"}\n                    {formatDate(expense.date)}\n                  </p>\n                </div>\n              </div>\n              <div className=\"flex items-center gap-3\">\n                <p className=\"text-sm font-medium text-text-primary\">\n                  {formatCurrency(expense.amount)}\n                </p>\n                <span\n                  className={`inline-flex rounded-full px-2 py-0.5 text-xs font-medium ${getStatusColor(expense.status)}`}\n                >\n                  {expense.status}\n                </span>\n              </div>\n            </div>\n          ))}\n        </div>\n      </div>\n    </PageLayout>\n  );\n}\n"],"mappings":";;;;;;;;;AAgBA,SAAgB,IAAsB;CACpC,IAAM,EAAE,iBAAc,OAAO,GAAe,EAEtC,EACJ,MAAM,GACN,SAAS,GACT,OAAO,MACL,EAAqB,EACvB,WAAW,EAAE,gBAAa,EAC3B,CAAC,EACI,EACJ,MAAM,GACN,SAAS,GACT,OAAO,MACL,EAAwB,EAC1B,WAAW,EAAE,gBAAa,EAC3B,CAAC,EAEI,IAAW,GAAc,YAAY,EAAE,EACvC,IAAQ,GAAW;AA0BzB,QAxBI,KAAmB,IAEnB,kBAAC,GAAD;EACE,OAAM;EACN,aAAY;YAEZ,kBAAC,GAAD;GAAiB,SAAQ;GAAO,OAAO;GAAK,CAAA;EACjC,CAAA,GAIb,KAAiB,IAEjB,kBAAC,GAAD;EACE,OAAM;EACN,aAAY;YAEZ,kBAAC,OAAD;GAAK,WAAU;aAAoG;GAE7G,CAAA;EACK,CAAA,GAKf,kBAAC,GAAD;EACE,OAAM;EACN,aAAY;EACZ,SACE,kBAAC,UAAD;GAAQ,WAAU;aAAlB,CACE,kBAAC,GAAD,EAAM,WAAU,WAAY,CAAA,EAAA,cAErB;;YAPb,CAUE,kBAAC,OAAD;GAAK,WAAU;aAAf;IACE,kBAAC,GAAD;KACE,OAAM;KACN,OAAO,EAAe,GAAO,eAAe,EAAE;KAC9C,MAAM,kBAAC,GAAD,EAAY,WAAU,WAAY,CAAA;KACxC,CAAA;IACF,kBAAC,GAAD;KACE,OAAM;KACN,OAAO,OAAO,GAAO,gBAAgB,EAAE;KACvC,aAAY;KACZ,CAAA;IACF,kBAAC,GAAD;KACE,OAAM;KACN,OAAO,OAAO,GAAO,iBAAiB,EAAE;KACxC,aAAY;KACZ,CAAA;IACF,kBAAC,GAAD;KACE,OAAM;KACN,OAAO,EAAe,GAAO,iBAAiB,EAAE;KAChD,MAAM,kBAAC,GAAD,EAAS,WAAU,WAAY,CAAA;KACrC,aAAY;KACZ,CAAA;IACE;MAEN,kBAAC,OAAD;GAAK,WAAU;aACb,kBAAC,OAAD;IAAK,WAAU;cAAf,CACG,EAAS,WAAW,KAAK,CAAC,KACzB,kBAAC,OAAD;KAAK,WAAU;eAA8C;KAEvD,CAAA,EAEP,EAAS,KAAK,MACb,kBAAC,OAAD;KAEE,WAAU;eAFZ,CAIE,kBAAC,OAAD;MAAK,WAAU;gBAAf,CACE,kBAAC,GAAD,EAAS,WAAU,+BAAgC,CAAA,EACnD,kBAAC,OAAD,EAAA,UAAA,CACE,kBAAC,KAAD;OAAG,WAAU;iBACV,EAAQ,eAAe;OACtB,CAAA,EACJ,kBAAC,KAAD;OAAG,WAAU;iBAAb;QACG,EAAQ;QAAS;QAAU;QAC3B,EAAQ,aAAa;QAAa;QAAU;QAC5C,EAAW,EAAQ,KAAK;QACvB;SACA,EAAA,CAAA,CACF;SACN,kBAAC,OAAD;MAAK,WAAU;gBAAf,CACE,kBAAC,KAAD;OAAG,WAAU;iBACV,EAAe,EAAQ,OAAO;OAC7B,CAAA,EACJ,kBAAC,QAAD;OACE,WAAW,4DAA4D,EAAe,EAAQ,OAAO;iBAEpG,EAAQ;OACJ,CAAA,CACH;QACF;OA1BC,EAAQ,GA0BT,CACN,CACE;;GACF,CAAA,CACK"}
+{"version":3,"file":"ExpenseTrackingPage.js","names":[],"sources":["../../../../src/timecampus/pages/expense-tracking/ExpenseTrackingPage.tsx"],"sourcesContent":["import { Receipt, Plus, DollarSign } from \"lucide-react\";\nimport { PageLayout } from \"../../components/PageLayout\";\nimport { StatCard } from \"../../components/StatCard\";\nimport { EmptyState } from \"../../components/EmptyState\";\nimport { LoadingSkeleton } from \"../../components/LoadingSkeleton\";\nimport {\n  getStatusColor,\n  formatCurrency,\n  formatDate,\n} from \"../../utils/helpers\";\nimport { useTimeCampus } from \"../../providers/TimeCampusProvider\";\nimport {\n  useListExpensesQuery,\n  useGetExpenseStatsQuery,\n  type ExpenseFieldsFragment,\n} from \"@/generated/wspace-operations\";\n\nexport function ExpenseTrackingPage() {\n  const { workspaceId = \"\" } = useTimeCampus();\n\n  const {\n    data: expensesData,\n    loading: expensesLoading,\n    error: expensesError,\n  } = useListExpensesQuery({\n    variables: { workspaceId },\n  });\n  const {\n    data: statsData,\n    loading: statsLoading,\n    error: statsError,\n  } = useGetExpenseStatsQuery({\n    variables: { workspaceId },\n  });\n\n  const expenses = expensesData?.expenses ?? [];\n  const stats = statsData?.expenseStats;\n\n  if (expensesLoading && statsLoading) {\n    return (\n      <PageLayout\n        title=\"Expense Tracking\"\n        description=\"Track and manage work expenses\"\n      >\n        <LoadingSkeleton variant=\"list\" count={4} />\n      </PageLayout>\n    );\n  }\n\n  if (expensesError && statsError) {\n    return (\n      <PageLayout\n        title=\"Expense Tracking\"\n        description=\"Track and manage work expenses\"\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 expense data. Please try again later.\n        </div>\n      </PageLayout>\n    );\n  }\n\n  return (\n    <PageLayout\n      title=\"Expense Tracking\"\n      description=\"Track and manage work expenses\"\n      purpose=\"Capture project-related costs alongside the hours you log — receipts, categories and approvals in one place — so the bill you send a client reflects the full cost of the work, not just time.\"\n      actions={\n        <button 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\">\n          <Plus className=\"h-4 w-4\" />\n          Add Expense\n        </button>\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 This Month\"\n          value={formatCurrency(stats?.totalAmount ?? 0)}\n          icon={<DollarSign className=\"h-5 w-5\" />}\n        />\n        <StatCard\n          title=\"Pending\"\n          value={String(stats?.pendingCount ?? 0)}\n          description=\"expenses awaiting approval\"\n        />\n        <StatCard\n          title=\"Approved\"\n          value={String(stats?.approvedCount ?? 0)}\n          description=\"expenses approved\"\n        />\n        <StatCard\n          title=\"Average\"\n          value={formatCurrency(stats?.averageAmount ?? 0)}\n          icon={<Receipt className=\"h-5 w-5\" />}\n          description=\"per expense\"\n        />\n      </div>\n\n      {expenses.length === 0 && !expensesLoading ? (\n        <EmptyState\n          illustration=\"empty-data\"\n          title=\"No expenses recorded yet\"\n          description=\"Add your first expense to track project costs and route them for approval.\"\n          action={\n            <button 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\">\n              <Plus className=\"h-4 w-4\" />\n              Add Expense\n            </button>\n          }\n        />\n      ) : (\n        <div className=\"rounded-xl border border-border-seam bg-gloss-card shadow-pop\">\n          <div className=\"divide-y divide-border\">\n            {expenses.map((expense: ExpenseFieldsFragment) => (\n              <div\n                key={expense.id}\n                className=\"flex items-center justify-between p-4 hover:bg-bg-sunken/50 transition-colors\"\n              >\n                <div className=\"flex items-center gap-3\">\n                  <Receipt className=\"h-5 w-5 text-text-secondary\" />\n                  <div>\n                    <p className=\"text-sm font-medium text-text-primary\">\n                      {expense.description ?? \"Untitled expense\"}\n                    </p>\n                    <p className=\"text-xs text-text-secondary\">\n                      {expense.category} &middot;{\" \"}\n                      {expense.projectId ?? \"No project\"} &middot;{\" \"}\n                      {formatDate(expense.date)}\n                    </p>\n                  </div>\n                </div>\n                <div className=\"flex items-center gap-3\">\n                  <p className=\"text-sm font-medium text-text-primary\">\n                    {formatCurrency(expense.amount)}\n                  </p>\n                  <span\n                    className={`inline-flex rounded-full px-2 py-0.5 text-xs font-medium ${getStatusColor(expense.status)}`}\n                  >\n                    {expense.status}\n                  </span>\n                </div>\n              </div>\n            ))}\n          </div>\n        </div>\n      )}\n    </PageLayout>\n  );\n}\n"],"mappings":";;;;;;;;;;AAiBA,SAAgB,IAAsB;CACpC,IAAM,EAAE,iBAAc,OAAO,GAAe,EAEtC,EACJ,MAAM,GACN,SAAS,GACT,OAAO,MACL,EAAqB,EACvB,WAAW,EAAE,gBAAa,EAC3B,CAAC,EACI,EACJ,MAAM,GACN,SAAS,GACT,OAAO,MACL,EAAwB,EAC1B,WAAW,EAAE,gBAAa,EAC3B,CAAC,EAEI,IAAW,GAAc,YAAY,EAAE,EACvC,IAAQ,GAAW;AA0BzB,QAxBI,KAAmB,IAEnB,kBAAC,GAAD;EACE,OAAM;EACN,aAAY;YAEZ,kBAAC,GAAD;GAAiB,SAAQ;GAAO,OAAO;GAAK,CAAA;EACjC,CAAA,GAIb,KAAiB,IAEjB,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;EACR,SACE,kBAAC,UAAD;GAAQ,WAAU;aAAlB,CACE,kBAAC,GAAD,EAAM,WAAU,WAAY,CAAA,EAAA,cAErB;;YARb,CAWE,kBAAC,OAAD;GAAK,WAAU;aAAf;IACE,kBAAC,GAAD;KACE,UAAA;KACA,OAAM;KACN,OAAO,EAAe,GAAO,eAAe,EAAE;KAC9C,MAAM,kBAAC,GAAD,EAAY,WAAU,WAAY,CAAA;KACxC,CAAA;IACF,kBAAC,GAAD;KACE,OAAM;KACN,OAAO,OAAO,GAAO,gBAAgB,EAAE;KACvC,aAAY;KACZ,CAAA;IACF,kBAAC,GAAD;KACE,OAAM;KACN,OAAO,OAAO,GAAO,iBAAiB,EAAE;KACxC,aAAY;KACZ,CAAA;IACF,kBAAC,GAAD;KACE,OAAM;KACN,OAAO,EAAe,GAAO,iBAAiB,EAAE;KAChD,MAAM,kBAAC,GAAD,EAAS,WAAU,WAAY,CAAA;KACrC,aAAY;KACZ,CAAA;IACE;MAEL,EAAS,WAAW,KAAK,CAAC,IACzB,kBAAC,GAAD;GACE,cAAa;GACb,OAAM;GACN,aAAY;GACZ,QACE,kBAAC,UAAD;IAAQ,WAAU;cAAlB,CACE,kBAAC,GAAD,EAAM,WAAU,WAAY,CAAA,EAAA,cAErB;;GAEX,CAAA,GAEF,kBAAC,OAAD;GAAK,WAAU;aACb,kBAAC,OAAD;IAAK,WAAU;cACZ,EAAS,KAAK,MACb,kBAAC,OAAD;KAEE,WAAU;eAFZ,CAIE,kBAAC,OAAD;MAAK,WAAU;gBAAf,CACE,kBAAC,GAAD,EAAS,WAAU,+BAAgC,CAAA,EACnD,kBAAC,OAAD,EAAA,UAAA,CACE,kBAAC,KAAD;OAAG,WAAU;iBACV,EAAQ,eAAe;OACtB,CAAA,EACJ,kBAAC,KAAD;OAAG,WAAU;iBAAb;QACG,EAAQ;QAAS;QAAU;QAC3B,EAAQ,aAAa;QAAa;QAAU;QAC5C,EAAW,EAAQ,KAAK;QACvB;SACA,EAAA,CAAA,CACF;SACN,kBAAC,OAAD;MAAK,WAAU;gBAAf,CACE,kBAAC,KAAD;OAAG,WAAU;iBACV,EAAe,EAAQ,OAAO;OAC7B,CAAA,EACJ,kBAAC,QAAD;OACE,WAAW,4DAA4D,EAAe,EAAQ,OAAO;iBAEpG,EAAQ;OACJ,CAAA,CACH;QACF;OA1BC,EAAQ,GA0BT,CACN;IACE,CAAA;GACF,CAAA,CAEG"}

package/dist/timecampus/pages/focus-score/FocusScorePage.js

@@ -3,119 +3,123 @@ import { StatCard as t } from "../../components/StatCard.js";
 import { LoadingSkeleton as n } from "../../components/LoadingSkeleton.js";
 import { useGetFocusScoreSummaryQuery as r, useGetTodayFocusScoreQuery as i, useListFocusScoresQuery as a } from "../../../generated/wspace-operations.js";
 import { PageLayout as o } from "../../components/PageLayout.js";
-import { Brain as s, Shield as c, Target as l, Zap as u } from "lucide-react";
-import { jsx as d, jsxs as f } from "react/jsx-runtime";
+import { EmptyState as s } from "../../components/EmptyState.js";
+import { Brain as c, Shield as l, Target as u, Zap as d } from "lucide-react";
+import { jsx as f, jsxs as p } from "react/jsx-runtime";
 //#region src/timecampus/pages/focus-score/FocusScorePage.tsx
-var p = {
+var m = {
 	deepWork: "bg-accent-blue",
 	consistency: "bg-status-success-text",
 	taskCompletion: "bg-accent-purple",
 	distractionResistance: "bg-status-warning-text",
 	energyManagement: "bg-accent-teal"
 };
-function m() {
-	let { workspaceId: m = "" } = e(), { data: h, loading: g, error: _ } = a({
+function h() {
+	let { workspaceId: h = "" } = e(), { data: g, loading: _, error: v } = a({
 		variables: { limit: 30 },
-		skip: !m
-	}), { data: v, loading: y, error: b } = r({ skip: !m }), { data: x, loading: S, error: C } = i({ skip: !m }), w = g || y || S, T = _ || b || C, E = x?.todayFocusScore, D = v?.focusScoreSummary, O = h?.focusScores ?? [], k = E ? [
+		skip: !h
+	}), { data: y, loading: b, error: x } = r({ skip: !h }), { data: S, loading: C, error: w } = i({ skip: !h }), T = _ || b || C, E = v || x || w, D = S?.todayFocusScore, O = y?.focusScoreSummary, k = g?.focusScores ?? [], A = D ? [
 		{
 			label: "Deep Work",
-			score: E.deepWorkScore ?? 0,
-			color: p.deepWork
+			score: D.deepWorkScore ?? 0,
+			color: m.deepWork
 		},
 		{
 			label: "Consistency",
-			score: E.consistencyScore ?? 0,
-			color: p.consistency
+			score: D.consistencyScore ?? 0,
+			color: m.consistency
 		},
 		{
 			label: "Task Completion",
-			score: E.taskCompletionScore ?? 0,
-			color: p.taskCompletion
+			score: D.taskCompletionScore ?? 0,
+			color: m.taskCompletion
 		},
 		{
 			label: "Distraction Resistance",
-			score: E.distractionResistanceScore ?? 0,
-			color: p.distractionResistance
+			score: D.distractionResistanceScore ?? 0,
+			color: m.distractionResistance
 		},
 		{
 			label: "Energy Management",
-			score: E.energyManagementScore ?? 0,
-			color: p.energyManagement
+			score: D.energyManagementScore ?? 0,
+			color: m.energyManagement
 		}
-	] : [], A = E?.overallScore == null ? "--" : `${E.overallScore}/100`, j = O.filter((e) => e.overallScore >= 70).length, M = O.reduce((e, t) => e + (t.overallScore ?? 0), 0), N = Math.floor(M / 60), P = M % 60, F = N > 0 ? `${N}h ${P}m` : `${P}m`, I = D?.trend === "up" ? 7 : D?.trend === "down" ? -5 : 0, L = D?.highestScore == null ? "--" : `${D.highestScore}`;
-	return w ? /* @__PURE__ */ d(o, {
+	] : [], j = D?.overallScore == null ? "--" : `${D.overallScore}/100`, M = k.filter((e) => e.overallScore >= 70).length, N = k.reduce((e, t) => e + (t.overallScore ?? 0), 0), P = Math.floor(N / 60), F = N % 60, I = P > 0 ? `${P}h ${F}m` : `${F}m`, L = O?.trend === "up" ? 7 : O?.trend === "down" ? -5 : 0, R = O?.highestScore == null ? "--" : `${O.highestScore}`;
+	return T ? /* @__PURE__ */ f(o, {
 		title: "Focus Score",
 		description: "Measure and improve your focus",
-		children: /* @__PURE__ */ d(n, {
+		children: /* @__PURE__ */ f(n, {
 			variant: "card",
 			count: 4
 		})
-	}) : T ? /* @__PURE__ */ d(o, {
+	}) : E ? /* @__PURE__ */ f(o, {
 		title: "Focus Score",
 		description: "Measure and improve your focus",
-		children: /* @__PURE__ */ d("div", {
+		children: /* @__PURE__ */ f("div", {
 			className: "rounded-xl border border-status-error-border/50 bg-status-error-bg/10 p-4 text-sm text-status-error-text",
 			children: "Failed to load focus score data. Please try again later."
 		})
-	}) : /* @__PURE__ */ f(o, {
+	}) : /* @__PURE__ */ p(o, {
 		title: "Focus Score",
 		description: "Measure and improve your focus",
-		children: [/* @__PURE__ */ f("div", {
+		purpose: "Get a single, honest number for how focused you were today — built from deep work, consistency, follow-through and distraction resistance — so you can see what's improving and what to work on next.",
+		children: [/* @__PURE__ */ p("div", {
 			className: "grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-4",
 			children: [
-				/* @__PURE__ */ d(t, {
+				/* @__PURE__ */ f(t, {
+					featured: !0,
 					title: "Overall Score",
-					value: A,
-					icon: /* @__PURE__ */ d(s, { className: "h-5 w-5" }),
-					trend: I === 0 ? void 0 : {
-						value: I,
+					value: j,
+					icon: /* @__PURE__ */ f(c, { className: "h-5 w-5" }),
+					trend: L === 0 ? void 0 : {
+						value: L,
 						label: "vs last week"
 					},
 					iconBgColor: "bg-status-info-bg text-status-info-text"
 				}),
-				/* @__PURE__ */ d(t, {
+				/* @__PURE__ */ f(t, {
 					title: "Focus Sessions",
-					value: String(j),
-					icon: /* @__PURE__ */ d(l, { className: "h-5 w-5" }),
+					value: String(M),
+					icon: /* @__PURE__ */ f(u, { className: "h-5 w-5" }),
 					description: "Completed today"
 				}),
-				/* @__PURE__ */ d(t, {
+				/* @__PURE__ */ f(t, {
 					title: "Total Focus Time",
-					value: F,
-					icon: /* @__PURE__ */ d(u, { className: "h-5 w-5" })
+					value: I,
+					icon: /* @__PURE__ */ f(d, { className: "h-5 w-5" })
 				}),
-				/* @__PURE__ */ d(t, {
+				/* @__PURE__ */ f(t, {
 					title: "Highest Score",
-					value: L,
-					icon: /* @__PURE__ */ d(c, { className: "h-5 w-5" }),
+					value: R,
+					icon: /* @__PURE__ */ f(l, { className: "h-5 w-5" }),
 					description: "Personal best"
 				})
 			]
-		}), /* @__PURE__ */ f("div", {
+		}), /* @__PURE__ */ p("div", {
 			className: "rounded-xl border border-border-seam bg-gloss-card shadow-pop p-6",
-			children: [/* @__PURE__ */ d("h3", {
+			children: [/* @__PURE__ */ f("h3", {
 				className: "mb-4 text-sm font-semibold text-text-primary",
 				children: "Focus Components"
-			}), k.length === 0 ? /* @__PURE__ */ d("div", {
-				className: "flex h-32 items-center justify-center text-sm text-text-secondary",
-				children: "No focus score recorded today."
-			}) : /* @__PURE__ */ d("div", {
+			}), A.length === 0 ? /* @__PURE__ */ f(s, {
+				illustration: "empty-data",
+				title: "No focus score recorded today",
+				description: "Track some focused work today and your score breakdown will appear here."
+			}) : /* @__PURE__ */ f("div", {
 				className: "space-y-4",
-				children: k.map((e) => /* @__PURE__ */ f("div", {
+				children: A.map((e) => /* @__PURE__ */ p("div", {
 					className: "space-y-1",
-					children: [/* @__PURE__ */ f("div", {
+					children: [/* @__PURE__ */ p("div", {
 						className: "flex items-center justify-between text-sm",
-						children: [/* @__PURE__ */ d("span", {
+						children: [/* @__PURE__ */ f("span", {
 							className: "font-medium text-text-primary",
 							children: e.label
-						}), /* @__PURE__ */ f("span", {
+						}), /* @__PURE__ */ p("span", {
 							className: "text-text-secondary",
 							children: [e.score, "%"]
 						})]
-					}), /* @__PURE__ */ d("div", {
+					}), /* @__PURE__ */ f("div", {
 						className: "h-2.5 w-full rounded-full bg-bg-sunken",
-						children: /* @__PURE__ */ d("div", {
+						children: /* @__PURE__ */ f("div", {
 							className: `h-2.5 rounded-full ${e.color}`,
 							style: { width: `${e.score}%` }
 						})
@@ -126,6 +130,6 @@ function m() {
 	});
 }
 //#endregion
-export { m as FocusScorePage };
+export { h as FocusScorePage };
 
 //# sourceMappingURL=FocusScorePage.js.map

package/dist/timecampus/pages/focus-score/FocusScorePage.js.map

@@ -1 +1 @@
-{"version":3,"file":"FocusScorePage.js","names":[],"sources":["../../../../src/timecampus/pages/focus-score/FocusScorePage.tsx"],"sourcesContent":["import { Brain, Target, Zap, Shield } from \"lucide-react\";\nimport { PageLayout } from \"../../components/PageLayout\";\nimport { StatCard } from \"../../components/StatCard\";\nimport { LoadingSkeleton } from \"../../components/LoadingSkeleton\";\nimport { useTimeCampus } from \"../../providers/TimeCampusProvider\";\nimport {\n  useListFocusScoresQuery,\n  useGetFocusScoreSummaryQuery,\n  useGetTodayFocusScoreQuery,\n  type FocusScoreFieldsFragment,\n} from \"@/generated/wspace-operations\";\n\nconst COMPONENT_COLORS: Record<string, string> = {\n  deepWork: \"bg-accent-blue\",\n  consistency: \"bg-status-success-text\",\n  taskCompletion: \"bg-accent-purple\",\n  distractionResistance: \"bg-status-warning-text\",\n  energyManagement: \"bg-accent-teal\",\n};\n\nexport function FocusScorePage() {\n  const { workspaceId = \"\" } = useTimeCampus();\n\n  const {\n    data: scoresData,\n    loading: scoresLoading,\n    error: scoresError,\n  } = useListFocusScoresQuery({\n    variables: { limit: 30 },\n    skip: !workspaceId,\n  });\n\n  const {\n    data: summaryData,\n    loading: summaryLoading,\n    error: summaryError,\n  } = useGetFocusScoreSummaryQuery({\n    skip: !workspaceId,\n  });\n\n  const {\n    data: todayData,\n    loading: todayLoading,\n    error: todayError,\n  } = useGetTodayFocusScoreQuery({\n    skip: !workspaceId,\n  });\n\n  const loading = scoresLoading || summaryLoading || todayLoading;\n  const error = scoresError || summaryError || todayError;\n  const today = todayData?.todayFocusScore;\n  const summary = summaryData?.focusScoreSummary;\n  const scores = scoresData?.focusScores ?? [];\n\n  // Build focus components from today's score\n  const focusComponents = today\n    ? [\n        {\n          label: \"Deep Work\",\n          score: today.deepWorkScore ?? 0,\n          color: COMPONENT_COLORS.deepWork,\n        },\n        {\n          label: \"Consistency\",\n          score: today.consistencyScore ?? 0,\n          color: COMPONENT_COLORS.consistency,\n        },\n        {\n          label: \"Task Completion\",\n          score: today.taskCompletionScore ?? 0,\n          color: COMPONENT_COLORS.taskCompletion,\n        },\n        {\n          label: \"Distraction Resistance\",\n          score: today.distractionResistanceScore ?? 0,\n          color: COMPONENT_COLORS.distractionResistance,\n        },\n        {\n          label: \"Energy Management\",\n          score: today.energyManagementScore ?? 0,\n          color: COMPONENT_COLORS.energyManagement,\n        },\n      ]\n    : [];\n\n  // Calculate stats\n  const overallScore =\n    today?.overallScore != null ? `${today.overallScore}/100` : \"--\";\n  const completedSessions = scores.filter(\n    (s: FocusScoreFieldsFragment) => s.overallScore >= 70,\n  ).length;\n  const totalFocusMinutes = scores.reduce(\n    (sum: number, s: FocusScoreFieldsFragment) => sum + (s.overallScore ?? 0),\n    0,\n  );\n  const totalFocusHours = Math.floor(totalFocusMinutes / 60);\n  const totalFocusMins = totalFocusMinutes % 60;\n  const focusTimeDisplay =\n    totalFocusHours > 0\n      ? `${totalFocusHours}h ${totalFocusMins}m`\n      : `${totalFocusMins}m`;\n  const trendValue =\n    summary?.trend === \"up\" ? 7 : summary?.trend === \"down\" ? -5 : 0;\n\n  // Longest streak from highest score\n  const highestScore =\n    summary?.highestScore != null ? `${summary.highestScore}` : \"--\";\n\n  if (loading) {\n    return (\n      <PageLayout\n        title=\"Focus Score\"\n        description=\"Measure and improve your focus\"\n      >\n        <LoadingSkeleton variant=\"card\" count={4} />\n      </PageLayout>\n    );\n  }\n\n  if (error) {\n    return (\n      <PageLayout\n        title=\"Focus Score\"\n        description=\"Measure and improve your focus\"\n      >\n        <div className=\"rounded-xl border border-status-error-border/50 bg-status-error-bg/10 p-4 text-sm text-status-error-text\">\n          Failed to load focus score data. Please try again later.\n        </div>\n      </PageLayout>\n    );\n  }\n\n  return (\n    <PageLayout\n      title=\"Focus Score\"\n      description=\"Measure and improve your focus\"\n    >\n      <div className=\"grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-4\">\n        <StatCard\n          title=\"Overall Score\"\n          value={overallScore}\n          icon={<Brain className=\"h-5 w-5\" />}\n          trend={\n            trendValue !== 0\n              ? { value: trendValue, label: \"vs last week\" }\n              : undefined\n          }\n          iconBgColor=\"bg-status-info-bg text-status-info-text\"\n        />\n        <StatCard\n          title=\"Focus Sessions\"\n          value={String(completedSessions)}\n          icon={<Target className=\"h-5 w-5\" />}\n          description=\"Completed today\"\n        />\n        <StatCard\n          title=\"Total Focus Time\"\n          value={focusTimeDisplay}\n          icon={<Zap className=\"h-5 w-5\" />}\n        />\n        <StatCard\n          title=\"Highest Score\"\n          value={highestScore}\n          icon={<Shield className=\"h-5 w-5\" />}\n          description=\"Personal best\"\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          Focus Components\n        </h3>\n        {focusComponents.length === 0 ? (\n          <div className=\"flex h-32 items-center justify-center text-sm text-text-secondary\">\n            No focus score recorded today.\n          </div>\n        ) : (\n          <div className=\"space-y-4\">\n            {focusComponents.map((component) => (\n              <div key={component.label} className=\"space-y-1\">\n                <div className=\"flex items-center justify-between text-sm\">\n                  <span className=\"font-medium text-text-primary\">\n                    {component.label}\n                  </span>\n                  <span className=\"text-text-secondary\">\n                    {component.score}%\n                  </span>\n                </div>\n                <div className=\"h-2.5 w-full rounded-full bg-bg-sunken\">\n                  <div\n                    className={`h-2.5 rounded-full ${component.color}`}\n                    style={{ width: `${component.score}%` }}\n                  />\n                </div>\n              </div>\n            ))}\n          </div>\n        )}\n      </div>\n    </PageLayout>\n  );\n}\n"],"mappings":"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"}
+{"version":3,"file":"FocusScorePage.js","names":[],"sources":["../../../../src/timecampus/pages/focus-score/FocusScorePage.tsx"],"sourcesContent":["import { Brain, Target, Zap, Shield } from \"lucide-react\";\nimport { PageLayout } from \"../../components/PageLayout\";\nimport { StatCard } from \"../../components/StatCard\";\nimport { EmptyState } from \"../../components/EmptyState\";\nimport { LoadingSkeleton } from \"../../components/LoadingSkeleton\";\nimport { useTimeCampus } from \"../../providers/TimeCampusProvider\";\nimport {\n  useListFocusScoresQuery,\n  useGetFocusScoreSummaryQuery,\n  useGetTodayFocusScoreQuery,\n  type FocusScoreFieldsFragment,\n} from \"@/generated/wspace-operations\";\n\nconst COMPONENT_COLORS: Record<string, string> = {\n  deepWork: \"bg-accent-blue\",\n  consistency: \"bg-status-success-text\",\n  taskCompletion: \"bg-accent-purple\",\n  distractionResistance: \"bg-status-warning-text\",\n  energyManagement: \"bg-accent-teal\",\n};\n\nexport function FocusScorePage() {\n  const { workspaceId = \"\" } = useTimeCampus();\n\n  const {\n    data: scoresData,\n    loading: scoresLoading,\n    error: scoresError,\n  } = useListFocusScoresQuery({\n    variables: { limit: 30 },\n    skip: !workspaceId,\n  });\n\n  const {\n    data: summaryData,\n    loading: summaryLoading,\n    error: summaryError,\n  } = useGetFocusScoreSummaryQuery({\n    skip: !workspaceId,\n  });\n\n  const {\n    data: todayData,\n    loading: todayLoading,\n    error: todayError,\n  } = useGetTodayFocusScoreQuery({\n    skip: !workspaceId,\n  });\n\n  const loading = scoresLoading || summaryLoading || todayLoading;\n  const error = scoresError || summaryError || todayError;\n  const today = todayData?.todayFocusScore;\n  const summary = summaryData?.focusScoreSummary;\n  const scores = scoresData?.focusScores ?? [];\n\n  // Build focus components from today's score\n  const focusComponents = today\n    ? [\n        {\n          label: \"Deep Work\",\n          score: today.deepWorkScore ?? 0,\n          color: COMPONENT_COLORS.deepWork,\n        },\n        {\n          label: \"Consistency\",\n          score: today.consistencyScore ?? 0,\n          color: COMPONENT_COLORS.consistency,\n        },\n        {\n          label: \"Task Completion\",\n          score: today.taskCompletionScore ?? 0,\n          color: COMPONENT_COLORS.taskCompletion,\n        },\n        {\n          label: \"Distraction Resistance\",\n          score: today.distractionResistanceScore ?? 0,\n          color: COMPONENT_COLORS.distractionResistance,\n        },\n        {\n          label: \"Energy Management\",\n          score: today.energyManagementScore ?? 0,\n          color: COMPONENT_COLORS.energyManagement,\n        },\n      ]\n    : [];\n\n  // Calculate stats\n  const overallScore =\n    today?.overallScore != null ? `${today.overallScore}/100` : \"--\";\n  const completedSessions = scores.filter(\n    (s: FocusScoreFieldsFragment) => s.overallScore >= 70,\n  ).length;\n  const totalFocusMinutes = scores.reduce(\n    (sum: number, s: FocusScoreFieldsFragment) => sum + (s.overallScore ?? 0),\n    0,\n  );\n  const totalFocusHours = Math.floor(totalFocusMinutes / 60);\n  const totalFocusMins = totalFocusMinutes % 60;\n  const focusTimeDisplay =\n    totalFocusHours > 0\n      ? `${totalFocusHours}h ${totalFocusMins}m`\n      : `${totalFocusMins}m`;\n  const trendValue =\n    summary?.trend === \"up\" ? 7 : summary?.trend === \"down\" ? -5 : 0;\n\n  // Longest streak from highest score\n  const highestScore =\n    summary?.highestScore != null ? `${summary.highestScore}` : \"--\";\n\n  if (loading) {\n    return (\n      <PageLayout\n        title=\"Focus Score\"\n        description=\"Measure and improve your focus\"\n      >\n        <LoadingSkeleton variant=\"card\" count={4} />\n      </PageLayout>\n    );\n  }\n\n  if (error) {\n    return (\n      <PageLayout\n        title=\"Focus Score\"\n        description=\"Measure and improve your focus\"\n      >\n        <div className=\"rounded-xl border border-status-error-border/50 bg-status-error-bg/10 p-4 text-sm text-status-error-text\">\n          Failed to load focus score data. Please try again later.\n        </div>\n      </PageLayout>\n    );\n  }\n\n  return (\n    <PageLayout\n      title=\"Focus Score\"\n      description=\"Measure and improve your focus\"\n      purpose=\"Get a single, honest number for how focused you were today — built from deep work, consistency, follow-through and distraction resistance — so you can see what's improving and what to work on next.\"\n    >\n      <div className=\"grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-4\">\n        <StatCard\n          featured\n          title=\"Overall Score\"\n          value={overallScore}\n          icon={<Brain className=\"h-5 w-5\" />}\n          trend={\n            trendValue !== 0\n              ? { value: trendValue, label: \"vs last week\" }\n              : undefined\n          }\n          iconBgColor=\"bg-status-info-bg text-status-info-text\"\n        />\n        <StatCard\n          title=\"Focus Sessions\"\n          value={String(completedSessions)}\n          icon={<Target className=\"h-5 w-5\" />}\n          description=\"Completed today\"\n        />\n        <StatCard\n          title=\"Total Focus Time\"\n          value={focusTimeDisplay}\n          icon={<Zap className=\"h-5 w-5\" />}\n        />\n        <StatCard\n          title=\"Highest Score\"\n          value={highestScore}\n          icon={<Shield className=\"h-5 w-5\" />}\n          description=\"Personal best\"\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          Focus Components\n        </h3>\n        {focusComponents.length === 0 ? (\n          <EmptyState\n            illustration=\"empty-data\"\n            title=\"No focus score recorded today\"\n            description=\"Track some focused work today and your score breakdown will appear here.\"\n          />\n        ) : (\n          <div className=\"space-y-4\">\n            {focusComponents.map((component) => (\n              <div key={component.label} className=\"space-y-1\">\n                <div className=\"flex items-center justify-between text-sm\">\n                  <span className=\"font-medium text-text-primary\">\n                    {component.label}\n                  </span>\n                  <span className=\"text-text-secondary\">\n                    {component.score}%\n                  </span>\n                </div>\n                <div className=\"h-2.5 w-full rounded-full bg-bg-sunken\">\n                  <div\n                    className={`h-2.5 rounded-full ${component.color}`}\n                    style={{ width: `${component.score}%` }}\n                  />\n                </div>\n              </div>\n            ))}\n          </div>\n        )}\n      </div>\n    </PageLayout>\n  );\n}\n"],"mappings":"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"}