@burdenoff/microfe-timecampus 2026.624.1 → 2026.625.1

package/dist/timecampus/pages/pomodoro/PomodoroAnalyticsPage.js

@@ -1,46 +1,46 @@
 import { useTimeCampus as e } from "../../providers/TimeCampusProvider.js";
-import { PageLayout as t } from "../../components/PageLayout.js";
-import { StatCard as n } from "../../components/StatCard.js";
-import { LoadingSkeleton as r } from "../../components/LoadingSkeleton.js";
-import { useGetPomodoroStatsQuery as i, useListPomodoroSessionsQuery as a } from "../../../generated/wspace-operations.js";
+import { StatCard as t } from "../../components/StatCard.js";
+import { LoadingSkeleton as n } from "../../components/LoadingSkeleton.js";
+import { useGetPomodoroStatsQuery as r, useListPomodoroSessionsQuery as i } from "../../../generated/wspace-operations.js";
+import { PageLayout as a } from "../../components/PageLayout.js";
 import { BarChart3 as o, Target as s } from "lucide-react";
 import { jsx as c, jsxs as l } from "react/jsx-runtime";
 //#region src/timecampus/pages/pomodoro/PomodoroAnalyticsPage.tsx
 function u() {
-	let { workspaceId: u = "" } = e(), { data: d, loading: f, error: p } = i({
+	let { workspaceId: u = "" } = e(), { data: d, loading: f, error: p } = r({
 		variables: { workspaceId: u },
 		skip: !u
-	}), { data: m, loading: h } = a({
+	}), { data: m, loading: h } = i({
 		variables: {
 			workspaceId: u,
 			limit: 50
 		},
 		skip: !u
 	}), g = d?.pomodoroStats, _ = m?.pomodoroSessions ?? [];
-	if (f || h) return /* @__PURE__ */ c(t, {
+	if (f || h) return /* @__PURE__ */ c(a, {
 		title: "Pomodoro Analytics",
 		description: "Track your focus sessions and productivity",
-		children: /* @__PURE__ */ c(r, {
+		children: /* @__PURE__ */ c(n, {
 			variant: "card",
 			count: 4
 		})
 	});
-	if (p) return /* @__PURE__ */ c(t, {
+	if (p) return /* @__PURE__ */ c(a, {
 		title: "Pomodoro Analytics",
 		description: "Track your focus sessions and productivity",
 		children: /* @__PURE__ */ c("div", {
-			className: "rounded-lg border border-red-200 bg-red-50 p-4 text-sm text-red-600 dark:border-red-800 dark:bg-red-900/20 dark:text-red-400",
+			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 pomodoro analytics. Please try again later."
 		})
 	});
 	let v = Math.floor((g?.totalFocusMinutes ?? 0) / 60), y = (g?.totalFocusMinutes ?? 0) % 60, b = g?.totalSessions ? (g.totalSessions / 30).toFixed(1) : "0", x = _.filter((e) => e.completed).length;
-	return /* @__PURE__ */ l(t, {
+	return /* @__PURE__ */ l(a, {
 		title: "Pomodoro Analytics",
 		description: "Track your focus sessions and productivity",
 		children: [/* @__PURE__ */ l("div", {
 			className: "grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-4",
 			children: [
-				/* @__PURE__ */ c(n, {
+				/* @__PURE__ */ c(t, {
 					title: "Total Sessions",
 					value: String(g?.totalSessions ?? 0),
 					trend: {
@@ -48,7 +48,7 @@ function u() {
 						label: "completion rate"
 					}
 				}),
-				/* @__PURE__ */ c(n, {
+				/* @__PURE__ */ c(t, {
 					title: "Total Focus Time",
 					value: `${v}h ${y}m`,
 					trend: {
@@ -56,12 +56,12 @@ function u() {
 						label: "avg min/session"
 					}
 				}),
-				/* @__PURE__ */ c(n, {
+				/* @__PURE__ */ c(t, {
 					title: "Avg. Sessions/Day",
 					value: b,
 					description: `Target: ${g?.totalSessions ?? 0} total`
 				}),
-				/* @__PURE__ */ c(n, {
+				/* @__PURE__ */ c(t, {
 					title: "Completion Rate",
 					value: `${g?.completionRate ?? 0}%`,
 					icon: /* @__PURE__ */ c(s, { className: "h-5 w-5" }),
@@ -74,7 +74,7 @@ function u() {
 		}), /* @__PURE__ */ l("div", {
 			className: "grid grid-cols-1 gap-6 lg:grid-cols-2",
 			children: [/* @__PURE__ */ l("div", {
-				className: "rounded-xl border border-border-subtle bg-bg-surface p-6",
+				className: "rounded-xl border border-border-seam bg-gloss-card shadow-pop p-6",
 				children: [/* @__PURE__ */ l("div", {
 					className: "mb-4 flex items-center gap-2",
 					children: [/* @__PURE__ */ c(o, { className: "h-5 w-5 text-primary" }), /* @__PURE__ */ c("h3", {
@@ -89,7 +89,7 @@ function u() {
 					})
 				})]
 			}), /* @__PURE__ */ l("div", {
-				className: "rounded-xl border border-border-subtle bg-bg-surface p-6",
+				className: "rounded-xl border border-border-seam bg-gloss-card shadow-pop p-6",
 				children: [/* @__PURE__ */ l("div", {
 					className: "mb-4 flex items-center gap-2",
 					children: [/* @__PURE__ */ c(o, { className: "h-5 w-5 text-primary" }), /* @__PURE__ */ c("h3", {

package/dist/timecampus/pages/pomodoro/PomodoroAnalyticsPage.js.map

@@ -1 +1 @@
-{"version":3,"file":"PomodoroAnalyticsPage.js","names":[],"sources":["../../../../src/timecampus/pages/pomodoro/PomodoroAnalyticsPage.tsx"],"sourcesContent":["import { BarChart3, Target } 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  useGetPomodoroStatsQuery,\n  useListPomodoroSessionsQuery,\n  type PomodoroSessionFieldsFragment,\n} from \"@/generated/wspace-operations\";\n\nexport function PomodoroAnalyticsPage() {\n  const { workspaceId = \"\" } = useTimeCampus();\n\n  const {\n    data: statsData,\n    loading: statsLoading,\n    error: statsError,\n  } = useGetPomodoroStatsQuery({\n    variables: { workspaceId },\n    skip: !workspaceId,\n  });\n\n  const { data: sessionsData, loading: sessionsLoading } =\n    useListPomodoroSessionsQuery({\n      variables: { workspaceId, limit: 50 },\n      skip: !workspaceId,\n    });\n\n  const stats = statsData?.pomodoroStats;\n  const sessions = sessionsData?.pomodoroSessions ?? [];\n\n  if (statsLoading || sessionsLoading) {\n    return (\n      <PageLayout\n        title=\"Pomodoro Analytics\"\n        description=\"Track your focus sessions and productivity\"\n      >\n        <LoadingSkeleton variant=\"card\" count={4} />\n      </PageLayout>\n    );\n  }\n\n  if (statsError) {\n    return (\n      <PageLayout\n        title=\"Pomodoro Analytics\"\n        description=\"Track your focus sessions and productivity\"\n      >\n        <div className=\"rounded-lg border border-red-200 bg-red-50 p-4 text-sm text-red-600 dark:border-red-800 dark:bg-red-900/20 dark:text-red-400\">\n          Failed to load pomodoro analytics. Please try again later.\n        </div>\n      </PageLayout>\n    );\n  }\n\n  const totalFocusH = Math.floor((stats?.totalFocusMinutes ?? 0) / 60);\n  const totalFocusM = (stats?.totalFocusMinutes ?? 0) % 60;\n  const avgSessions = stats?.totalSessions\n    ? (stats.totalSessions / 30).toFixed(1)\n    : \"0\";\n  const completedCount = sessions.filter(\n    (s: PomodoroSessionFieldsFragment) => s.completed,\n  ).length;\n\n  return (\n    <PageLayout\n      title=\"Pomodoro Analytics\"\n      description=\"Track your focus sessions and productivity\"\n    >\n      <div className=\"grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-4\">\n        <StatCard\n          title=\"Total Sessions\"\n          value={String(stats?.totalSessions ?? 0)}\n          trend={{\n            value: stats?.completionRate ?? 0,\n            label: \"completion rate\",\n          }}\n        />\n        <StatCard\n          title=\"Total Focus Time\"\n          value={`${totalFocusH}h ${totalFocusM}m`}\n          trend={{\n            value: stats?.averageSessionMinutes ?? 0,\n            label: \"avg min/session\",\n          }}\n        />\n        <StatCard\n          title=\"Avg. Sessions/Day\"\n          value={avgSessions}\n          description={`Target: ${stats?.totalSessions ?? 0} total`}\n        />\n        <StatCard\n          title=\"Completion Rate\"\n          value={`${stats?.completionRate ?? 0}%`}\n          icon={<Target className=\"h-5 w-5\" />}\n          trend={{ value: stats?.streakDays ?? 0, label: \"day streak\" }}\n        />\n      </div>\n\n      <div className=\"grid grid-cols-1 gap-6 lg:grid-cols-2\">\n        <div className=\"rounded-xl border border-border-subtle bg-bg-surface p-6\">\n          <div className=\"mb-4 flex items-center gap-2\">\n            <BarChart3 className=\"h-5 w-5 text-primary\" />\n            <h3 className=\"text-sm font-semibold text-text-primary\">\n              Sessions per Day\n            </h3>\n          </div>\n          <div className=\"flex h-48 items-center justify-center rounded-lg border border-dashed border-border-subtle\">\n            <p className=\"text-sm text-text-secondary\">\n              {sessions.length > 0\n                ? `${completedCount} completed out of ${sessions.length} sessions`\n                : \"No session data available\"}\n            </p>\n          </div>\n        </div>\n        <div className=\"rounded-xl border border-border-subtle bg-bg-surface p-6\">\n          <div className=\"mb-4 flex items-center gap-2\">\n            <BarChart3 className=\"h-5 w-5 text-primary\" />\n            <h3 className=\"text-sm font-semibold text-text-primary\">\n              Focus Distribution\n            </h3>\n          </div>\n          <div className=\"flex h-48 items-center justify-center rounded-lg border border-dashed border-border-subtle\">\n            <p className=\"text-sm text-text-secondary\">\n              {stats\n                ? `${stats.streakDays} day streak · ${stats.averageSessionMinutes}m avg session`\n                : \"No data available\"}\n            </p>\n          </div>\n        </div>\n      </div>\n    </PageLayout>\n  );\n}\n"],"mappings":";;;;;;;;AAWA,SAAgB,IAAwB;CACtC,IAAM,EAAE,iBAAc,OAAO,GAAe,EAEtC,EACJ,MAAM,GACN,SAAS,GACT,OAAO,MACL,EAAyB;EAC3B,WAAW,EAAE,gBAAa;EAC1B,MAAM,CAAC;EACR,CAAC,EAEI,EAAE,MAAM,GAAc,SAAS,MACnC,EAA6B;EAC3B,WAAW;GAAE;GAAa,OAAO;GAAI;EACrC,MAAM,CAAC;EACR,CAAC,EAEE,IAAQ,GAAW,eACnB,IAAW,GAAc,oBAAoB,EAAE;AAErD,KAAI,KAAgB,EAClB,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;aAA+H;GAExI,CAAA;EACK,CAAA;CAIjB,IAAM,IAAc,KAAK,OAAO,GAAO,qBAAqB,KAAK,GAAG,EAC9D,KAAe,GAAO,qBAAqB,KAAK,IAChD,IAAc,GAAO,iBACtB,EAAM,gBAAgB,IAAI,QAAQ,EAAE,GACrC,KACE,IAAiB,EAAS,QAC7B,MAAqC,EAAE,UACzC,CAAC;AAEF,QACE,kBAAC,GAAD;EACE,OAAM;EACN,aAAY;YAFd,CAIE,kBAAC,OAAD;GAAK,WAAU;aAAf;IACE,kBAAC,GAAD;KACE,OAAM;KACN,OAAO,OAAO,GAAO,iBAAiB,EAAE;KACxC,OAAO;MACL,OAAO,GAAO,kBAAkB;MAChC,OAAO;MACR;KACD,CAAA;IACF,kBAAC,GAAD;KACE,OAAM;KACN,OAAO,GAAG,EAAY,IAAI,EAAY;KACtC,OAAO;MACL,OAAO,GAAO,yBAAyB;MACvC,OAAO;MACR;KACD,CAAA;IACF,kBAAC,GAAD;KACE,OAAM;KACN,OAAO;KACP,aAAa,WAAW,GAAO,iBAAiB,EAAE;KAClD,CAAA;IACF,kBAAC,GAAD;KACE,OAAM;KACN,OAAO,GAAG,GAAO,kBAAkB,EAAE;KACrC,MAAM,kBAAC,GAAD,EAAQ,WAAU,WAAY,CAAA;KACpC,OAAO;MAAE,OAAO,GAAO,cAAc;MAAG,OAAO;MAAc;KAC7D,CAAA;IACE;MAEN,kBAAC,OAAD;GAAK,WAAU;aAAf,CACE,kBAAC,OAAD;IAAK,WAAU;cAAf,CACE,kBAAC,OAAD;KAAK,WAAU;eAAf,CACE,kBAAC,GAAD,EAAW,WAAU,wBAAyB,CAAA,EAC9C,kBAAC,MAAD;MAAI,WAAU;gBAA0C;MAEnD,CAAA,CACD;QACN,kBAAC,OAAD;KAAK,WAAU;eACb,kBAAC,KAAD;MAAG,WAAU;gBACV,EAAS,SAAS,IACf,GAAG,EAAe,oBAAoB,EAAS,OAAO,aACtD;MACF,CAAA;KACA,CAAA,CACF;OACN,kBAAC,OAAD;IAAK,WAAU;cAAf,CACE,kBAAC,OAAD;KAAK,WAAU;eAAf,CACE,kBAAC,GAAD,EAAW,WAAU,wBAAyB,CAAA,EAC9C,kBAAC,MAAD;MAAI,WAAU;gBAA0C;MAEnD,CAAA,CACD;QACN,kBAAC,OAAD;KAAK,WAAU;eACb,kBAAC,KAAD;MAAG,WAAU;gBACV,IACG,GAAG,EAAM,WAAW,gBAAgB,EAAM,sBAAsB,iBAChE;MACF,CAAA;KACA,CAAA,CACF;MACF;KACK"}
+{"version":3,"file":"PomodoroAnalyticsPage.js","names":[],"sources":["../../../../src/timecampus/pages/pomodoro/PomodoroAnalyticsPage.tsx"],"sourcesContent":["import { BarChart3, Target } 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  useGetPomodoroStatsQuery,\n  useListPomodoroSessionsQuery,\n  type PomodoroSessionFieldsFragment,\n} from \"@/generated/wspace-operations\";\n\nexport function PomodoroAnalyticsPage() {\n  const { workspaceId = \"\" } = useTimeCampus();\n\n  const {\n    data: statsData,\n    loading: statsLoading,\n    error: statsError,\n  } = useGetPomodoroStatsQuery({\n    variables: { workspaceId },\n    skip: !workspaceId,\n  });\n\n  const { data: sessionsData, loading: sessionsLoading } =\n    useListPomodoroSessionsQuery({\n      variables: { workspaceId, limit: 50 },\n      skip: !workspaceId,\n    });\n\n  const stats = statsData?.pomodoroStats;\n  const sessions = sessionsData?.pomodoroSessions ?? [];\n\n  if (statsLoading || sessionsLoading) {\n    return (\n      <PageLayout\n        title=\"Pomodoro Analytics\"\n        description=\"Track your focus sessions and productivity\"\n      >\n        <LoadingSkeleton variant=\"card\" count={4} />\n      </PageLayout>\n    );\n  }\n\n  if (statsError) {\n    return (\n      <PageLayout\n        title=\"Pomodoro Analytics\"\n        description=\"Track your focus sessions and productivity\"\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 pomodoro analytics. Please try again later.\n        </div>\n      </PageLayout>\n    );\n  }\n\n  const totalFocusH = Math.floor((stats?.totalFocusMinutes ?? 0) / 60);\n  const totalFocusM = (stats?.totalFocusMinutes ?? 0) % 60;\n  const avgSessions = stats?.totalSessions\n    ? (stats.totalSessions / 30).toFixed(1)\n    : \"0\";\n  const completedCount = sessions.filter(\n    (s: PomodoroSessionFieldsFragment) => s.completed,\n  ).length;\n\n  return (\n    <PageLayout\n      title=\"Pomodoro Analytics\"\n      description=\"Track your focus sessions and productivity\"\n    >\n      <div className=\"grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-4\">\n        <StatCard\n          title=\"Total Sessions\"\n          value={String(stats?.totalSessions ?? 0)}\n          trend={{\n            value: stats?.completionRate ?? 0,\n            label: \"completion rate\",\n          }}\n        />\n        <StatCard\n          title=\"Total Focus Time\"\n          value={`${totalFocusH}h ${totalFocusM}m`}\n          trend={{\n            value: stats?.averageSessionMinutes ?? 0,\n            label: \"avg min/session\",\n          }}\n        />\n        <StatCard\n          title=\"Avg. Sessions/Day\"\n          value={avgSessions}\n          description={`Target: ${stats?.totalSessions ?? 0} total`}\n        />\n        <StatCard\n          title=\"Completion Rate\"\n          value={`${stats?.completionRate ?? 0}%`}\n          icon={<Target className=\"h-5 w-5\" />}\n          trend={{ value: stats?.streakDays ?? 0, label: \"day streak\" }}\n        />\n      </div>\n\n      <div className=\"grid grid-cols-1 gap-6 lg:grid-cols-2\">\n        <div className=\"rounded-xl border border-border-seam bg-gloss-card shadow-pop p-6\">\n          <div className=\"mb-4 flex items-center gap-2\">\n            <BarChart3 className=\"h-5 w-5 text-primary\" />\n            <h3 className=\"text-sm font-semibold text-text-primary\">\n              Sessions per Day\n            </h3>\n          </div>\n          <div className=\"flex h-48 items-center justify-center rounded-lg border border-dashed border-border-subtle\">\n            <p className=\"text-sm text-text-secondary\">\n              {sessions.length > 0\n                ? `${completedCount} completed out of ${sessions.length} sessions`\n                : \"No session data available\"}\n            </p>\n          </div>\n        </div>\n        <div className=\"rounded-xl border border-border-seam bg-gloss-card shadow-pop p-6\">\n          <div className=\"mb-4 flex items-center gap-2\">\n            <BarChart3 className=\"h-5 w-5 text-primary\" />\n            <h3 className=\"text-sm font-semibold text-text-primary\">\n              Focus Distribution\n            </h3>\n          </div>\n          <div className=\"flex h-48 items-center justify-center rounded-lg border border-dashed border-border-subtle\">\n            <p className=\"text-sm text-text-secondary\">\n              {stats\n                ? `${stats.streakDays} day streak · ${stats.averageSessionMinutes}m avg session`\n                : \"No data available\"}\n            </p>\n          </div>\n        </div>\n      </div>\n    </PageLayout>\n  );\n}\n"],"mappings":";;;;;;;;AAWA,SAAgB,IAAwB;CACtC,IAAM,EAAE,iBAAc,OAAO,GAAe,EAEtC,EACJ,MAAM,GACN,SAAS,GACT,OAAO,MACL,EAAyB;EAC3B,WAAW,EAAE,gBAAa;EAC1B,MAAM,CAAC;EACR,CAAC,EAEI,EAAE,MAAM,GAAc,SAAS,MACnC,EAA6B;EAC3B,WAAW;GAAE;GAAa,OAAO;GAAI;EACrC,MAAM,CAAC;EACR,CAAC,EAEE,IAAQ,GAAW,eACnB,IAAW,GAAc,oBAAoB,EAAE;AAErD,KAAI,KAAgB,EAClB,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,IAAc,KAAK,OAAO,GAAO,qBAAqB,KAAK,GAAG,EAC9D,KAAe,GAAO,qBAAqB,KAAK,IAChD,IAAc,GAAO,iBACtB,EAAM,gBAAgB,IAAI,QAAQ,EAAE,GACrC,KACE,IAAiB,EAAS,QAC7B,MAAqC,EAAE,UACzC,CAAC;AAEF,QACE,kBAAC,GAAD;EACE,OAAM;EACN,aAAY;YAFd,CAIE,kBAAC,OAAD;GAAK,WAAU;aAAf;IACE,kBAAC,GAAD;KACE,OAAM;KACN,OAAO,OAAO,GAAO,iBAAiB,EAAE;KACxC,OAAO;MACL,OAAO,GAAO,kBAAkB;MAChC,OAAO;MACR;KACD,CAAA;IACF,kBAAC,GAAD;KACE,OAAM;KACN,OAAO,GAAG,EAAY,IAAI,EAAY;KACtC,OAAO;MACL,OAAO,GAAO,yBAAyB;MACvC,OAAO;MACR;KACD,CAAA;IACF,kBAAC,GAAD;KACE,OAAM;KACN,OAAO;KACP,aAAa,WAAW,GAAO,iBAAiB,EAAE;KAClD,CAAA;IACF,kBAAC,GAAD;KACE,OAAM;KACN,OAAO,GAAG,GAAO,kBAAkB,EAAE;KACrC,MAAM,kBAAC,GAAD,EAAQ,WAAU,WAAY,CAAA;KACpC,OAAO;MAAE,OAAO,GAAO,cAAc;MAAG,OAAO;MAAc;KAC7D,CAAA;IACE;MAEN,kBAAC,OAAD;GAAK,WAAU;aAAf,CACE,kBAAC,OAAD;IAAK,WAAU;cAAf,CACE,kBAAC,OAAD;KAAK,WAAU;eAAf,CACE,kBAAC,GAAD,EAAW,WAAU,wBAAyB,CAAA,EAC9C,kBAAC,MAAD;MAAI,WAAU;gBAA0C;MAEnD,CAAA,CACD;QACN,kBAAC,OAAD;KAAK,WAAU;eACb,kBAAC,KAAD;MAAG,WAAU;gBACV,EAAS,SAAS,IACf,GAAG,EAAe,oBAAoB,EAAS,OAAO,aACtD;MACF,CAAA;KACA,CAAA,CACF;OACN,kBAAC,OAAD;IAAK,WAAU;cAAf,CACE,kBAAC,OAAD;KAAK,WAAU;eAAf,CACE,kBAAC,GAAD,EAAW,WAAU,wBAAyB,CAAA,EAC9C,kBAAC,MAAD;MAAI,WAAU;gBAA0C;MAEnD,CAAA,CACD;QACN,kBAAC,OAAD;KAAK,WAAU;eACb,kBAAC,KAAD;MAAG,WAAU;gBACV,IACG,GAAG,EAAM,WAAW,gBAAgB,EAAM,sBAAsB,iBAChE;MACF,CAAA;KACA,CAAA,CACF;MACF;KACK"}

package/dist/timecampus/pages/pomodoro/PomodoroPage.js

@@ -1,20 +1,20 @@
 import { useTimeCampus as e } from "../../providers/TimeCampusProvider.js";
-import { PageLayout as t } from "../../components/PageLayout.js";
-import { StatCard as n } from "../../components/StatCard.js";
-import { LoadingSkeleton as r } from "../../components/LoadingSkeleton.js";
-import { useCompletePomodoroSessionMutation as i, useGetActivePomodoroSessionQuery as a, useGetPomodoroStatsQuery as o, useStartPomodoroSessionMutation as s } from "../../../generated/wspace-operations.js";
+import { StatCard as t } from "../../components/StatCard.js";
+import { LoadingSkeleton as n } from "../../components/LoadingSkeleton.js";
+import { useCompletePomodoroSessionMutation as r, useGetActivePomodoroSessionQuery as i, useGetPomodoroStatsQuery as a, useStartPomodoroSessionMutation as o } from "../../../generated/wspace-operations.js";
+import { PageLayout as s } from "../../components/PageLayout.js";
 import { useCallback as c, useEffect as l, useState as u } from "react";
 import { Pause as d, Play as f, RotateCcw as p, SkipForward as m } from "lucide-react";
 import { jsx as h, jsxs as g } from "react/jsx-runtime";
 //#region src/timecampus/pages/pomodoro/PomodoroPage.tsx
 function _() {
-	let { workspaceId: _ = "" } = e(), { data: v, loading: y, error: b } = o({
+	let { workspaceId: _ = "" } = e(), { data: v, loading: y, error: b } = a({
 		variables: { workspaceId: _ },
 		skip: !_
-	}), { data: x, loading: S, error: C } = a({
+	}), { data: x, loading: S, error: C } = i({
 		variables: { workspaceId: _ },
 		skip: !_
-	}), [w] = s(), [T] = i(), E = v?.pomodoroStats, D = x?.activePomodoroSession, [O, k] = u(1500), [A, j] = u(!1);
+	}), [w] = o(), [T] = r(), E = v?.pomodoroStats, D = x?.activePomodoroSession, [O, k] = u(1500), [A, j] = u(!1);
 	l(() => {
 		if (D && !D.completed) {
 			let e = Math.floor((Date.now() - new Date(D.startTime).getTime()) / 1e3), t = D.duration ?? 1500, n = Math.max(0, t - e);
@@ -63,35 +63,35 @@ function _() {
 	]), F = () => {
 		j(!1), k(1500);
 	};
-	if (y || S) return /* @__PURE__ */ h(t, {
+	if (y || S) return /* @__PURE__ */ h(s, {
 		title: "Pomodoro Timer",
 		description: "Focus with the Pomodoro Technique",
-		children: /* @__PURE__ */ h(r, {
+		children: /* @__PURE__ */ h(n, {
 			variant: "card",
 			count: 3
 		})
 	});
-	if (b || C) return /* @__PURE__ */ h(t, {
+	if (b || C) return /* @__PURE__ */ h(s, {
 		title: "Pomodoro Timer",
 		description: "Focus with the Pomodoro Technique",
 		children: /* @__PURE__ */ h("div", {
-			className: "rounded-lg border border-red-200 bg-red-50 p-4 text-sm text-red-600 dark:border-red-800 dark:bg-red-900/20 dark:text-red-400",
+			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 pomodoro data. Please try again later."
 		})
 	});
 	let I = Math.floor((E?.totalFocusMinutes ?? 0) / 60), L = (E?.totalFocusMinutes ?? 0) % 60;
-	return /* @__PURE__ */ g(t, {
+	return /* @__PURE__ */ g(s, {
 		title: "Pomodoro Timer",
 		description: "Focus with the Pomodoro Technique",
 		children: [/* @__PURE__ */ g("div", {
 			className: "grid grid-cols-1 gap-4 sm:grid-cols-3",
 			children: [
-				/* @__PURE__ */ h(n, {
+				/* @__PURE__ */ h(t, {
 					title: "Sessions Today",
 					value: String(E?.completedSessions ?? 0),
 					description: `Total: ${E?.totalSessions ?? 0} sessions`
 				}),
-				/* @__PURE__ */ h(n, {
+				/* @__PURE__ */ h(t, {
 					title: "Focus Time",
 					value: `${I}h ${L}m`,
 					trend: {
@@ -99,7 +99,7 @@ function _() {
 						label: "completion rate"
 					}
 				}),
-				/* @__PURE__ */ h(n, {
+				/* @__PURE__ */ h(t, {
 					title: "Current Streak",
 					value: `${E?.streakDays ?? 0} days`,
 					description: `Avg: ${E?.averageSessionMinutes ?? 0}m per session`
@@ -108,7 +108,7 @@ function _() {
 		}), /* @__PURE__ */ h("div", {
 			className: "mx-auto max-w-md",
 			children: /* @__PURE__ */ g("div", {
-				className: "rounded-xl border border-border-subtle bg-bg-surface p-8 text-center",
+				className: "rounded-xl border border-border-seam bg-gloss-card shadow-pop p-8 text-center",
 				children: [
 					/* @__PURE__ */ h("div", {
 						className: "mb-2",

package/dist/timecampus/pages/pomodoro/PomodoroPage.js.map

@@ -1 +1 @@
-{"version":3,"file":"PomodoroPage.js","names":[],"sources":["../../../../src/timecampus/pages/pomodoro/PomodoroPage.tsx"],"sourcesContent":["import { useState, useEffect, useCallback } from \"react\";\nimport { Play, Pause, SkipForward, RotateCcw } 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  useGetActivePomodoroSessionQuery,\n  useGetPomodoroStatsQuery,\n  useStartPomodoroSessionMutation,\n  useCompletePomodoroSessionMutation,\n} from \"@/generated/wspace-operations\";\n\nexport function PomodoroPage() {\n  const { workspaceId = \"\" } = useTimeCampus();\n\n  const {\n    data: statsData,\n    loading: statsLoading,\n    error: statsError,\n  } = useGetPomodoroStatsQuery({\n    variables: { workspaceId },\n    skip: !workspaceId,\n  });\n\n  const {\n    data: activeData,\n    loading: activeLoading,\n    error: activeError,\n  } = useGetActivePomodoroSessionQuery({\n    variables: { workspaceId },\n    skip: !workspaceId,\n  });\n\n  const [startSession] = useStartPomodoroSessionMutation();\n  const [completeSession] = useCompletePomodoroSessionMutation();\n\n  const stats = statsData?.pomodoroStats;\n  const activeSession = activeData?.activePomodoroSession;\n\n  const [timerSeconds, setTimerSeconds] = useState(25 * 60);\n  const [isRunning, setIsRunning] = useState(false);\n\n  useEffect(() => {\n    if (activeSession && !activeSession.completed) {\n      const elapsed = Math.floor(\n        (Date.now() - new Date(activeSession.startTime).getTime()) / 1000,\n      );\n      const duration = activeSession.duration ?? 25 * 60;\n      const remaining = Math.max(0, duration - elapsed);\n      setTimerSeconds(remaining);\n      setIsRunning(remaining > 0);\n    }\n  }, [activeSession]);\n\n  useEffect(() => {\n    if (!isRunning || timerSeconds <= 0) return;\n    const interval = setInterval(() => {\n      setTimerSeconds((prev) => {\n        if (prev <= 1) {\n          setIsRunning(false);\n          return 0;\n        }\n        return prev - 1;\n      });\n    }, 1000);\n    return () => clearInterval(interval);\n  }, [isRunning, timerSeconds]);\n\n  const formatTimer = (seconds: number) => {\n    const m = Math.floor(seconds / 60);\n    const s = seconds % 60;\n    return `${String(m).padStart(2, \"0\")}:${String(s).padStart(2, \"0\")}`;\n  };\n\n  const handleStart = useCallback(async () => {\n    if (!workspaceId) return;\n    if (activeSession && !activeSession.completed) {\n      setIsRunning(true);\n      return;\n    }\n    await startSession({\n      variables: { input: { workspaceId, type: \"FOCUS\" as never } },\n      refetchQueries: [\"GetActivePomodoroSession\", \"GetPomodoroStats\"],\n    });\n    setTimerSeconds(25 * 60);\n    setIsRunning(true);\n  }, [workspaceId, activeSession, startSession]);\n\n  const handleComplete = useCallback(async () => {\n    if (!activeSession || !workspaceId) return;\n    await completeSession({\n      variables: { id: activeSession.id, workspaceId },\n      refetchQueries: [\"GetActivePomodoroSession\", \"GetPomodoroStats\"],\n    });\n    setIsRunning(false);\n    setTimerSeconds(25 * 60);\n  }, [activeSession, workspaceId, completeSession]);\n\n  const handleReset = () => {\n    setIsRunning(false);\n    setTimerSeconds(25 * 60);\n  };\n\n  if (statsLoading || activeLoading) {\n    return (\n      <PageLayout\n        title=\"Pomodoro Timer\"\n        description=\"Focus with the Pomodoro Technique\"\n      >\n        <LoadingSkeleton variant=\"card\" count={3} />\n      </PageLayout>\n    );\n  }\n\n  if (statsError || activeError) {\n    return (\n      <PageLayout\n        title=\"Pomodoro Timer\"\n        description=\"Focus with the Pomodoro Technique\"\n      >\n        <div className=\"rounded-lg border border-red-200 bg-red-50 p-4 text-sm text-red-600 dark:border-red-800 dark:bg-red-900/20 dark:text-red-400\">\n          Failed to load pomodoro data. Please try again later.\n        </div>\n      </PageLayout>\n    );\n  }\n\n  const totalFocusH = Math.floor((stats?.totalFocusMinutes ?? 0) / 60);\n  const totalFocusM = (stats?.totalFocusMinutes ?? 0) % 60;\n\n  return (\n    <PageLayout\n      title=\"Pomodoro Timer\"\n      description=\"Focus with the Pomodoro Technique\"\n    >\n      <div className=\"grid grid-cols-1 gap-4 sm:grid-cols-3\">\n        <StatCard\n          title=\"Sessions Today\"\n          value={String(stats?.completedSessions ?? 0)}\n          description={`Total: ${stats?.totalSessions ?? 0} sessions`}\n        />\n        <StatCard\n          title=\"Focus Time\"\n          value={`${totalFocusH}h ${totalFocusM}m`}\n          trend={{\n            value: stats?.completionRate ?? 0,\n            label: \"completion rate\",\n          }}\n        />\n        <StatCard\n          title=\"Current Streak\"\n          value={`${stats?.streakDays ?? 0} days`}\n          description={`Avg: ${stats?.averageSessionMinutes ?? 0}m per session`}\n        />\n      </div>\n\n      <div className=\"mx-auto max-w-md\">\n        <div className=\"rounded-xl border border-border-subtle bg-bg-surface p-8 text-center\">\n          <div className=\"mb-2\">\n            <span className=\"inline-flex rounded-full bg-action-primary-bg/10 px-3 py-1 text-xs font-medium text-primary\">\n              {activeSession ? \"Focus Session\" : \"Ready\"}\n            </span>\n          </div>\n          <p className=\"text-7xl font-mono font-bold text-text-primary\">\n            {formatTimer(timerSeconds)}\n          </p>\n          <p className=\"mt-2 text-sm text-text-secondary\">\n            {stats\n              ? `${stats.completedSessions} of ${stats.totalSessions} sessions`\n              : \"No sessions yet\"}\n          </p>\n          <div className=\"mt-6 flex items-center justify-center gap-3\">\n            {!isRunning ? (\n              <button\n                onClick={handleStart}\n                className=\"inline-flex items-center gap-2 rounded-md bg-action-primary-bg px-6 py-3 text-sm font-medium text-action-primary-text hover:bg-action-primary-bg/90\"\n              >\n                <Play className=\"h-4 w-4\" />\n                Start\n              </button>\n            ) : (\n              <button\n                onClick={() => setIsRunning(false)}\n                className=\"inline-flex items-center gap-2 rounded-md bg-action-primary-bg px-6 py-3 text-sm font-medium text-action-primary-text hover:bg-action-primary-bg/90\"\n              >\n                <Pause className=\"h-4 w-4\" />\n                Pause\n              </button>\n            )}\n            <button\n              onClick={handleComplete}\n              className=\"inline-flex items-center gap-2 rounded-md border border-border-subtle px-4 py-3 text-sm font-medium text-text-primary hover:bg-bg-sunken/50\"\n            >\n              <SkipForward className=\"h-4 w-4\" />\n              Skip\n            </button>\n            <button\n              onClick={handleReset}\n              className=\"inline-flex items-center gap-2 rounded-md border border-border-subtle px-4 py-3 text-sm font-medium text-text-primary hover:bg-bg-sunken/50\"\n            >\n              <RotateCcw className=\"h-4 w-4\" />\n              Reset\n            </button>\n          </div>\n        </div>\n      </div>\n    </PageLayout>\n  );\n}\n"],"mappings":"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"}
+{"version":3,"file":"PomodoroPage.js","names":[],"sources":["../../../../src/timecampus/pages/pomodoro/PomodoroPage.tsx"],"sourcesContent":["import { useState, useEffect, useCallback } from \"react\";\nimport { Play, Pause, SkipForward, RotateCcw } 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  useGetActivePomodoroSessionQuery,\n  useGetPomodoroStatsQuery,\n  useStartPomodoroSessionMutation,\n  useCompletePomodoroSessionMutation,\n} from \"@/generated/wspace-operations\";\n\nexport function PomodoroPage() {\n  const { workspaceId = \"\" } = useTimeCampus();\n\n  const {\n    data: statsData,\n    loading: statsLoading,\n    error: statsError,\n  } = useGetPomodoroStatsQuery({\n    variables: { workspaceId },\n    skip: !workspaceId,\n  });\n\n  const {\n    data: activeData,\n    loading: activeLoading,\n    error: activeError,\n  } = useGetActivePomodoroSessionQuery({\n    variables: { workspaceId },\n    skip: !workspaceId,\n  });\n\n  const [startSession] = useStartPomodoroSessionMutation();\n  const [completeSession] = useCompletePomodoroSessionMutation();\n\n  const stats = statsData?.pomodoroStats;\n  const activeSession = activeData?.activePomodoroSession;\n\n  const [timerSeconds, setTimerSeconds] = useState(25 * 60);\n  const [isRunning, setIsRunning] = useState(false);\n\n  useEffect(() => {\n    if (activeSession && !activeSession.completed) {\n      const elapsed = Math.floor(\n        (Date.now() - new Date(activeSession.startTime).getTime()) / 1000,\n      );\n      const duration = activeSession.duration ?? 25 * 60;\n      const remaining = Math.max(0, duration - elapsed);\n      setTimerSeconds(remaining);\n      setIsRunning(remaining > 0);\n    }\n  }, [activeSession]);\n\n  useEffect(() => {\n    if (!isRunning || timerSeconds <= 0) return;\n    const interval = setInterval(() => {\n      setTimerSeconds((prev) => {\n        if (prev <= 1) {\n          setIsRunning(false);\n          return 0;\n        }\n        return prev - 1;\n      });\n    }, 1000);\n    return () => clearInterval(interval);\n  }, [isRunning, timerSeconds]);\n\n  const formatTimer = (seconds: number) => {\n    const m = Math.floor(seconds / 60);\n    const s = seconds % 60;\n    return `${String(m).padStart(2, \"0\")}:${String(s).padStart(2, \"0\")}`;\n  };\n\n  const handleStart = useCallback(async () => {\n    if (!workspaceId) return;\n    if (activeSession && !activeSession.completed) {\n      setIsRunning(true);\n      return;\n    }\n    await startSession({\n      variables: { input: { workspaceId, type: \"FOCUS\" as never } },\n      refetchQueries: [\"GetActivePomodoroSession\", \"GetPomodoroStats\"],\n    });\n    setTimerSeconds(25 * 60);\n    setIsRunning(true);\n  }, [workspaceId, activeSession, startSession]);\n\n  const handleComplete = useCallback(async () => {\n    if (!activeSession || !workspaceId) return;\n    await completeSession({\n      variables: { id: activeSession.id, workspaceId },\n      refetchQueries: [\"GetActivePomodoroSession\", \"GetPomodoroStats\"],\n    });\n    setIsRunning(false);\n    setTimerSeconds(25 * 60);\n  }, [activeSession, workspaceId, completeSession]);\n\n  const handleReset = () => {\n    setIsRunning(false);\n    setTimerSeconds(25 * 60);\n  };\n\n  if (statsLoading || activeLoading) {\n    return (\n      <PageLayout\n        title=\"Pomodoro Timer\"\n        description=\"Focus with the Pomodoro Technique\"\n      >\n        <LoadingSkeleton variant=\"card\" count={3} />\n      </PageLayout>\n    );\n  }\n\n  if (statsError || activeError) {\n    return (\n      <PageLayout\n        title=\"Pomodoro Timer\"\n        description=\"Focus with the Pomodoro Technique\"\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 pomodoro data. Please try again later.\n        </div>\n      </PageLayout>\n    );\n  }\n\n  const totalFocusH = Math.floor((stats?.totalFocusMinutes ?? 0) / 60);\n  const totalFocusM = (stats?.totalFocusMinutes ?? 0) % 60;\n\n  return (\n    <PageLayout\n      title=\"Pomodoro Timer\"\n      description=\"Focus with the Pomodoro Technique\"\n    >\n      <div className=\"grid grid-cols-1 gap-4 sm:grid-cols-3\">\n        <StatCard\n          title=\"Sessions Today\"\n          value={String(stats?.completedSessions ?? 0)}\n          description={`Total: ${stats?.totalSessions ?? 0} sessions`}\n        />\n        <StatCard\n          title=\"Focus Time\"\n          value={`${totalFocusH}h ${totalFocusM}m`}\n          trend={{\n            value: stats?.completionRate ?? 0,\n            label: \"completion rate\",\n          }}\n        />\n        <StatCard\n          title=\"Current Streak\"\n          value={`${stats?.streakDays ?? 0} days`}\n          description={`Avg: ${stats?.averageSessionMinutes ?? 0}m per session`}\n        />\n      </div>\n\n      <div className=\"mx-auto max-w-md\">\n        <div className=\"rounded-xl border border-border-seam bg-gloss-card shadow-pop p-8 text-center\">\n          <div className=\"mb-2\">\n            <span className=\"inline-flex rounded-full bg-action-primary-bg/10 px-3 py-1 text-xs font-medium text-primary\">\n              {activeSession ? \"Focus Session\" : \"Ready\"}\n            </span>\n          </div>\n          <p className=\"text-7xl font-mono font-bold text-text-primary\">\n            {formatTimer(timerSeconds)}\n          </p>\n          <p className=\"mt-2 text-sm text-text-secondary\">\n            {stats\n              ? `${stats.completedSessions} of ${stats.totalSessions} sessions`\n              : \"No sessions yet\"}\n          </p>\n          <div className=\"mt-6 flex items-center justify-center gap-3\">\n            {!isRunning ? (\n              <button\n                onClick={handleStart}\n                className=\"inline-flex items-center gap-2 rounded-md bg-action-primary-bg px-6 py-3 text-sm font-medium text-action-primary-text hover:bg-action-primary-bg/90\"\n              >\n                <Play className=\"h-4 w-4\" />\n                Start\n              </button>\n            ) : (\n              <button\n                onClick={() => setIsRunning(false)}\n                className=\"inline-flex items-center gap-2 rounded-md bg-action-primary-bg px-6 py-3 text-sm font-medium text-action-primary-text hover:bg-action-primary-bg/90\"\n              >\n                <Pause className=\"h-4 w-4\" />\n                Pause\n              </button>\n            )}\n            <button\n              onClick={handleComplete}\n              className=\"inline-flex items-center gap-2 rounded-md border border-border-subtle px-4 py-3 text-sm font-medium text-text-primary hover:bg-bg-sunken/50\"\n            >\n              <SkipForward className=\"h-4 w-4\" />\n              Skip\n            </button>\n            <button\n              onClick={handleReset}\n              className=\"inline-flex items-center gap-2 rounded-md border border-border-subtle px-4 py-3 text-sm font-medium text-text-primary hover:bg-bg-sunken/50\"\n            >\n              <RotateCcw className=\"h-4 w-4\" />\n              Reset\n            </button>\n          </div>\n        </div>\n      </div>\n    </PageLayout>\n  );\n}\n"],"mappings":"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"}

package/dist/timecampus/pages/pomodoro/PomodoroSettingsPage.js

@@ -1,16 +1,16 @@
 import { useTimeCampus as e } from "../../providers/TimeCampusProvider.js";
-import { PageLayout as t } from "../../components/PageLayout.js";
-import { LoadingSkeleton as n } from "../../components/LoadingSkeleton.js";
-import { useGetPomodoroSettingsQuery as r, useUpdatePomodoroSettingsMutation as i } from "../../../generated/wspace-operations.js";
+import { LoadingSkeleton as t } from "../../components/LoadingSkeleton.js";
+import { useGetPomodoroSettingsQuery as n, useUpdatePomodoroSettingsMutation as r } from "../../../generated/wspace-operations.js";
+import { PageLayout as i } from "../../components/PageLayout.js";
 import { useCallback as a, useEffect as o, useState as s } from "react";
 import { Settings as c } from "lucide-react";
 import { jsx as l, jsxs as u } from "react/jsx-runtime";
 //#region src/timecampus/pages/pomodoro/PomodoroSettingsPage.tsx
 function d() {
-	let { workspaceId: d = "" } = e(), { data: f, loading: p, error: m } = r({
+	let { workspaceId: d = "" } = e(), { data: f, loading: p, error: m } = n({
 		variables: { workspaceId: d },
 		skip: !d
-	}), [h, { loading: g }] = i(), _ = f?.pomodoroSettings, [v, y] = s(25), [b, x] = s(5), [S, C] = s(15), [w, T] = s(!0), [E, D] = s(!0), [O, k] = s(!1);
+	}), [h, { loading: g }] = r(), _ = f?.pomodoroSettings, [v, y] = s(25), [b, x] = s(5), [S, C] = s(15), [w, T] = s(!0), [E, D] = s(!0), [O, k] = s(!1);
 	o(() => {
 		_ && (y(_.focusDuration), x(_.shortBreakDuration), C(_.longBreakDuration), T(_.soundEnabled), D(_.notificationsEnabled), k(_.autoStartBreaks));
 	}, [_]);
@@ -37,25 +37,25 @@ function d() {
 		O,
 		h
 	]);
-	return p ? /* @__PURE__ */ l(t, {
+	return p ? /* @__PURE__ */ l(i, {
 		title: "Pomodoro Settings",
 		description: "Configure your Pomodoro timer preferences",
-		children: /* @__PURE__ */ l(n, { variant: "detail" })
-	}) : m ? /* @__PURE__ */ l(t, {
+		children: /* @__PURE__ */ l(t, { variant: "detail" })
+	}) : m ? /* @__PURE__ */ l(i, {
 		title: "Pomodoro Settings",
 		description: "Configure your Pomodoro timer preferences",
 		children: /* @__PURE__ */ l("div", {
-			className: "rounded-lg border border-red-200 bg-red-50 p-4 text-sm text-red-600 dark:border-red-800 dark:bg-red-900/20 dark:text-red-400",
+			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 settings. Please try again later."
 		})
-	}) : /* @__PURE__ */ l(t, {
+	}) : /* @__PURE__ */ l(i, {
 		title: "Pomodoro Settings",
 		description: "Configure your Pomodoro timer preferences",
 		children: /* @__PURE__ */ u("div", {
 			className: "mx-auto max-w-2xl space-y-6",
 			children: [
 				/* @__PURE__ */ u("div", {
-					className: "rounded-xl border border-border-subtle bg-bg-surface p-6",
+					className: "rounded-xl border border-border-seam bg-gloss-card shadow-pop p-6",
 					children: [/* @__PURE__ */ u("h3", {
 						className: "mb-4 flex items-center gap-2 text-sm font-semibold text-text-primary",
 						children: [/* @__PURE__ */ l(c, { className: "h-4 w-4" }), "Timer Durations"]
@@ -111,7 +111,7 @@ function d() {
 					})]
 				}),
 				/* @__PURE__ */ u("div", {
-					className: "rounded-xl border border-border-subtle bg-bg-surface p-6",
+					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: "Notifications"

package/dist/timecampus/pages/pomodoro/PomodoroSettingsPage.js.map

@@ -1 +1 @@
-{"version":3,"file":"PomodoroSettingsPage.js","names":[],"sources":["../../../../src/timecampus/pages/pomodoro/PomodoroSettingsPage.tsx"],"sourcesContent":["import { useState, useEffect, useCallback } from \"react\";\nimport { Settings } from \"lucide-react\";\nimport { PageLayout } from \"../../components/PageLayout\";\nimport { LoadingSkeleton } from \"../../components/LoadingSkeleton\";\nimport { useTimeCampus } from \"../../providers/TimeCampusProvider\";\nimport {\n  useGetPomodoroSettingsQuery,\n  useUpdatePomodoroSettingsMutation,\n} from \"@/generated/wspace-operations\";\n\nexport function PomodoroSettingsPage() {\n  const { workspaceId = \"\" } = useTimeCampus();\n\n  const { data, loading, error } = useGetPomodoroSettingsQuery({\n    variables: { workspaceId },\n    skip: !workspaceId,\n  });\n\n  const [updateSettings, { loading: saving }] =\n    useUpdatePomodoroSettingsMutation();\n\n  const settings = data?.pomodoroSettings;\n\n  const [focusDuration, setFocusDuration] = useState(25);\n  const [shortBreak, setShortBreak] = useState(5);\n  const [longBreak, setLongBreak] = useState(15);\n  const [soundEnabled, setSoundEnabled] = useState(true);\n  const [notificationsEnabled, setNotificationsEnabled] = useState(true);\n  const [autoStartBreaks, setAutoStartBreaks] = useState(false);\n\n  useEffect(() => {\n    if (settings) {\n      setFocusDuration(settings.focusDuration);\n      setShortBreak(settings.shortBreakDuration);\n      setLongBreak(settings.longBreakDuration);\n      setSoundEnabled(settings.soundEnabled);\n      setNotificationsEnabled(settings.notificationsEnabled);\n      setAutoStartBreaks(settings.autoStartBreaks);\n    }\n  }, [settings]);\n\n  const handleSave = useCallback(async () => {\n    if (!workspaceId) return;\n    await updateSettings({\n      variables: {\n        input: {\n          workspaceId,\n          focusDuration,\n          shortBreakDuration: shortBreak,\n          longBreakDuration: longBreak,\n          soundEnabled,\n          notificationsEnabled,\n          autoStartBreaks,\n        },\n      },\n      refetchQueries: [\"GetPomodoroSettings\"],\n    });\n  }, [\n    workspaceId,\n    focusDuration,\n    shortBreak,\n    longBreak,\n    soundEnabled,\n    notificationsEnabled,\n    autoStartBreaks,\n    updateSettings,\n  ]);\n\n  if (loading) {\n    return (\n      <PageLayout\n        title=\"Pomodoro Settings\"\n        description=\"Configure your Pomodoro timer preferences\"\n      >\n        <LoadingSkeleton variant=\"detail\" />\n      </PageLayout>\n    );\n  }\n\n  if (error) {\n    return (\n      <PageLayout\n        title=\"Pomodoro Settings\"\n        description=\"Configure your Pomodoro timer preferences\"\n      >\n        <div className=\"rounded-lg border border-red-200 bg-red-50 p-4 text-sm text-red-600 dark:border-red-800 dark:bg-red-900/20 dark:text-red-400\">\n          Failed to load settings. Please try again later.\n        </div>\n      </PageLayout>\n    );\n  }\n\n  return (\n    <PageLayout\n      title=\"Pomodoro Settings\"\n      description=\"Configure your Pomodoro timer preferences\"\n    >\n      <div className=\"mx-auto max-w-2xl space-y-6\">\n        <div className=\"rounded-xl border border-border-subtle bg-bg-surface p-6\">\n          <h3 className=\"mb-4 flex items-center gap-2 text-sm font-semibold text-text-primary\">\n            <Settings className=\"h-4 w-4\" />\n            Timer Durations\n          </h3>\n          <div className=\"space-y-4\">\n            <div className=\"flex items-center justify-between\">\n              <div>\n                <p className=\"text-sm font-medium text-text-primary\">\n                  Focus Duration\n                </p>\n                <p className=\"text-xs text-text-secondary\">\n                  Length of each focus session\n                </p>\n              </div>\n              <input\n                type=\"number\"\n                value={focusDuration}\n                onChange={(e) => setFocusDuration(Number(e.target.value))}\n                className=\"w-20 rounded-md border border-border-subtle bg-bg-surface px-3 py-1.5 text-sm text-text-primary text-right\"\n              />\n            </div>\n            <div className=\"flex items-center justify-between\">\n              <div>\n                <p className=\"text-sm font-medium text-text-primary\">\n                  Short Break\n                </p>\n                <p className=\"text-xs text-text-secondary\">\n                  Break between focus sessions\n                </p>\n              </div>\n              <input\n                type=\"number\"\n                value={shortBreak}\n                onChange={(e) => setShortBreak(Number(e.target.value))}\n                className=\"w-20 rounded-md border border-border-subtle bg-bg-surface px-3 py-1.5 text-sm text-text-primary text-right\"\n              />\n            </div>\n            <div className=\"flex items-center justify-between\">\n              <div>\n                <p className=\"text-sm font-medium text-text-primary\">\n                  Long Break\n                </p>\n                <p className=\"text-xs text-text-secondary\">\n                  After every 4 focus sessions\n                </p>\n              </div>\n              <input\n                type=\"number\"\n                value={longBreak}\n                onChange={(e) => setLongBreak(Number(e.target.value))}\n                className=\"w-20 rounded-md border border-border-subtle bg-bg-surface px-3 py-1.5 text-sm text-text-primary text-right\"\n              />\n            </div>\n          </div>\n        </div>\n\n        <div className=\"rounded-xl border border-border-subtle bg-bg-surface p-6\">\n          <h3 className=\"mb-4 text-sm font-semibold text-text-primary\">\n            Notifications\n          </h3>\n          <div className=\"space-y-3\">\n            <label className=\"flex items-center justify-between\">\n              <span className=\"text-sm text-text-primary\">Sound alerts</span>\n              <input\n                type=\"checkbox\"\n                checked={soundEnabled}\n                onChange={(e) => setSoundEnabled(e.target.checked)}\n                className=\"h-4 w-4 rounded border-border-subtle\"\n              />\n            </label>\n            <label className=\"flex items-center justify-between\">\n              <span className=\"text-sm text-text-primary\">\n                Desktop notifications\n              </span>\n              <input\n                type=\"checkbox\"\n                checked={notificationsEnabled}\n                onChange={(e) => setNotificationsEnabled(e.target.checked)}\n                className=\"h-4 w-4 rounded border-border-subtle\"\n              />\n            </label>\n            <label className=\"flex items-center justify-between\">\n              <span className=\"text-sm text-text-primary\">Auto-start breaks</span>\n              <input\n                type=\"checkbox\"\n                checked={autoStartBreaks}\n                onChange={(e) => setAutoStartBreaks(e.target.checked)}\n                className=\"h-4 w-4 rounded border-border-subtle\"\n              />\n            </label>\n          </div>\n        </div>\n\n        <div className=\"flex justify-end\">\n          <button\n            onClick={handleSave}\n            disabled={saving}\n            className=\"rounded-md bg-action-primary-bg px-4 py-2 text-sm font-medium text-action-primary-text hover:bg-action-primary-bg/90 disabled:opacity-50\"\n          >\n            {saving ? \"Saving...\" : \"Save Settings\"}\n          </button>\n        </div>\n      </div>\n    </PageLayout>\n  );\n}\n"],"mappings":"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"}
+{"version":3,"file":"PomodoroSettingsPage.js","names":[],"sources":["../../../../src/timecampus/pages/pomodoro/PomodoroSettingsPage.tsx"],"sourcesContent":["import { useState, useEffect, useCallback } from \"react\";\nimport { Settings } from \"lucide-react\";\nimport { PageLayout } from \"../../components/PageLayout\";\nimport { LoadingSkeleton } from \"../../components/LoadingSkeleton\";\nimport { useTimeCampus } from \"../../providers/TimeCampusProvider\";\nimport {\n  useGetPomodoroSettingsQuery,\n  useUpdatePomodoroSettingsMutation,\n} from \"@/generated/wspace-operations\";\n\nexport function PomodoroSettingsPage() {\n  const { workspaceId = \"\" } = useTimeCampus();\n\n  const { data, loading, error } = useGetPomodoroSettingsQuery({\n    variables: { workspaceId },\n    skip: !workspaceId,\n  });\n\n  const [updateSettings, { loading: saving }] =\n    useUpdatePomodoroSettingsMutation();\n\n  const settings = data?.pomodoroSettings;\n\n  const [focusDuration, setFocusDuration] = useState(25);\n  const [shortBreak, setShortBreak] = useState(5);\n  const [longBreak, setLongBreak] = useState(15);\n  const [soundEnabled, setSoundEnabled] = useState(true);\n  const [notificationsEnabled, setNotificationsEnabled] = useState(true);\n  const [autoStartBreaks, setAutoStartBreaks] = useState(false);\n\n  useEffect(() => {\n    if (settings) {\n      setFocusDuration(settings.focusDuration);\n      setShortBreak(settings.shortBreakDuration);\n      setLongBreak(settings.longBreakDuration);\n      setSoundEnabled(settings.soundEnabled);\n      setNotificationsEnabled(settings.notificationsEnabled);\n      setAutoStartBreaks(settings.autoStartBreaks);\n    }\n  }, [settings]);\n\n  const handleSave = useCallback(async () => {\n    if (!workspaceId) return;\n    await updateSettings({\n      variables: {\n        input: {\n          workspaceId,\n          focusDuration,\n          shortBreakDuration: shortBreak,\n          longBreakDuration: longBreak,\n          soundEnabled,\n          notificationsEnabled,\n          autoStartBreaks,\n        },\n      },\n      refetchQueries: [\"GetPomodoroSettings\"],\n    });\n  }, [\n    workspaceId,\n    focusDuration,\n    shortBreak,\n    longBreak,\n    soundEnabled,\n    notificationsEnabled,\n    autoStartBreaks,\n    updateSettings,\n  ]);\n\n  if (loading) {\n    return (\n      <PageLayout\n        title=\"Pomodoro Settings\"\n        description=\"Configure your Pomodoro timer preferences\"\n      >\n        <LoadingSkeleton variant=\"detail\" />\n      </PageLayout>\n    );\n  }\n\n  if (error) {\n    return (\n      <PageLayout\n        title=\"Pomodoro Settings\"\n        description=\"Configure your Pomodoro timer preferences\"\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 settings. Please try again later.\n        </div>\n      </PageLayout>\n    );\n  }\n\n  return (\n    <PageLayout\n      title=\"Pomodoro Settings\"\n      description=\"Configure your Pomodoro timer preferences\"\n    >\n      <div className=\"mx-auto max-w-2xl space-y-6\">\n        <div className=\"rounded-xl border border-border-seam bg-gloss-card shadow-pop p-6\">\n          <h3 className=\"mb-4 flex items-center gap-2 text-sm font-semibold text-text-primary\">\n            <Settings className=\"h-4 w-4\" />\n            Timer Durations\n          </h3>\n          <div className=\"space-y-4\">\n            <div className=\"flex items-center justify-between\">\n              <div>\n                <p className=\"text-sm font-medium text-text-primary\">\n                  Focus Duration\n                </p>\n                <p className=\"text-xs text-text-secondary\">\n                  Length of each focus session\n                </p>\n              </div>\n              <input\n                type=\"number\"\n                value={focusDuration}\n                onChange={(e) => setFocusDuration(Number(e.target.value))}\n                className=\"w-20 rounded-md border border-border-subtle bg-bg-surface px-3 py-1.5 text-sm text-text-primary text-right\"\n              />\n            </div>\n            <div className=\"flex items-center justify-between\">\n              <div>\n                <p className=\"text-sm font-medium text-text-primary\">\n                  Short Break\n                </p>\n                <p className=\"text-xs text-text-secondary\">\n                  Break between focus sessions\n                </p>\n              </div>\n              <input\n                type=\"number\"\n                value={shortBreak}\n                onChange={(e) => setShortBreak(Number(e.target.value))}\n                className=\"w-20 rounded-md border border-border-subtle bg-bg-surface px-3 py-1.5 text-sm text-text-primary text-right\"\n              />\n            </div>\n            <div className=\"flex items-center justify-between\">\n              <div>\n                <p className=\"text-sm font-medium text-text-primary\">\n                  Long Break\n                </p>\n                <p className=\"text-xs text-text-secondary\">\n                  After every 4 focus sessions\n                </p>\n              </div>\n              <input\n                type=\"number\"\n                value={longBreak}\n                onChange={(e) => setLongBreak(Number(e.target.value))}\n                className=\"w-20 rounded-md border border-border-subtle bg-bg-surface px-3 py-1.5 text-sm text-text-primary text-right\"\n              />\n            </div>\n          </div>\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            Notifications\n          </h3>\n          <div className=\"space-y-3\">\n            <label className=\"flex items-center justify-between\">\n              <span className=\"text-sm text-text-primary\">Sound alerts</span>\n              <input\n                type=\"checkbox\"\n                checked={soundEnabled}\n                onChange={(e) => setSoundEnabled(e.target.checked)}\n                className=\"h-4 w-4 rounded border-border-subtle\"\n              />\n            </label>\n            <label className=\"flex items-center justify-between\">\n              <span className=\"text-sm text-text-primary\">\n                Desktop notifications\n              </span>\n              <input\n                type=\"checkbox\"\n                checked={notificationsEnabled}\n                onChange={(e) => setNotificationsEnabled(e.target.checked)}\n                className=\"h-4 w-4 rounded border-border-subtle\"\n              />\n            </label>\n            <label className=\"flex items-center justify-between\">\n              <span className=\"text-sm text-text-primary\">\n                Auto-start breaks\n              </span>\n              <input\n                type=\"checkbox\"\n                checked={autoStartBreaks}\n                onChange={(e) => setAutoStartBreaks(e.target.checked)}\n                className=\"h-4 w-4 rounded border-border-subtle\"\n              />\n            </label>\n          </div>\n        </div>\n\n        <div className=\"flex justify-end\">\n          <button\n            onClick={handleSave}\n            disabled={saving}\n            className=\"rounded-md bg-action-primary-bg px-4 py-2 text-sm font-medium text-action-primary-text hover:bg-action-primary-bg/90 disabled:opacity-50\"\n          >\n            {saving ? \"Saving...\" : \"Save Settings\"}\n          </button>\n        </div>\n      </div>\n    </PageLayout>\n  );\n}\n"],"mappings":"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"}

package/dist/timecampus/pages/projects/ProjectCreatePage.js

@@ -1,12 +1,12 @@
-import { PageLayout as e } from "../../components/PageLayout.js";
-import { useCreateProjectMutation as t } from "../../../generated/wspace-operations.js";
+import { useCreateProjectMutation as e } from "../../../generated/wspace-operations.js";
+import { PageLayout as t } from "../../components/PageLayout.js";
 import { useState as n } from "react";
 import { ArrowLeft as r } from "lucide-react";
 import { jsx as i, jsxs as a } from "react/jsx-runtime";
 //#region src/timecampus/pages/projects/ProjectCreatePage.tsx
 function o() {
-	let [o, s] = n(""), [c, l] = n(""), [u, d] = n(""), [f, p] = n(""), [m, h] = n(""), [g, { loading: _, error: v }] = t();
-	return /* @__PURE__ */ i(e, {
+	let [o, s] = n(""), [c, l] = n(""), [u, d] = n(""), [f, p] = n(""), [m, h] = n(""), [g, { loading: _, error: v }] = e();
+	return /* @__PURE__ */ i(t, {
 		title: "Create Project",
 		description: "Set up a new project for time tracking",
 		actions: /* @__PURE__ */ a("button", {
@@ -14,9 +14,9 @@ function o() {
 			children: [/* @__PURE__ */ i(r, { className: "h-4 w-4" }), "Back to Projects"]
 		}),
 		children: /* @__PURE__ */ a("div", {
-			className: "mx-auto max-w-2xl rounded-xl border border-border-subtle bg-bg-surface p-6",
+			className: "mx-auto max-w-2xl rounded-xl border border-border-seam bg-gloss-card shadow-pop p-6",
 			children: [v && /* @__PURE__ */ i("div", {
-				className: "mb-4 rounded-lg border border-red-200 bg-red-50 p-3 text-sm text-red-700 dark:border-red-900 dark:bg-red-950/50 dark:text-red-400",
+				className: "mb-4 rounded-lg border border-status-error-bg/40 bg-status-error-bg p-3 text-sm text-status-error-text",
 				children: "Failed to create project. Please try again."
 			}), /* @__PURE__ */ a("div", {
 				className: "space-y-4",

package/dist/timecampus/pages/projects/ProjectCreatePage.js.map

@@ -1 +1 @@
-{"version":3,"file":"ProjectCreatePage.js","names":[],"sources":["../../../../src/timecampus/pages/projects/ProjectCreatePage.tsx"],"sourcesContent":["import { useState } from \"react\";\nimport { ArrowLeft } from \"lucide-react\";\nimport { PageLayout } from \"../../components/PageLayout\";\nimport { useCreateProjectMutation } from \"@/generated/wspace-operations\";\n\nexport function ProjectCreatePage() {\n  const [name, setName] = useState(\"\");\n  const [clientId, setClientId] = useState(\"\");\n  const [description, setDescription] = useState(\"\");\n  const [estimatedHours, setEstimatedHours] = useState(\"\");\n  const [hourlyRate, setHourlyRate] = useState(\"\");\n\n  const [createProject, { loading: creating, error }] =\n    useCreateProjectMutation();\n\n  const handleSubmit = async () => {\n    if (!name.trim()) return;\n    await createProject({\n      variables: {\n        input: {\n          name: name.trim(),\n          description: description.trim() || undefined,\n          clientId: clientId.trim() || undefined,\n          estimatedHours: estimatedHours ? Number(estimatedHours) : undefined,\n          hourlyRate: hourlyRate ? Number(hourlyRate) : undefined,\n        },\n      },\n    });\n  };\n\n  return (\n    <PageLayout\n      title=\"Create Project\"\n      description=\"Set up a new project for time tracking\"\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          <ArrowLeft className=\"h-4 w-4\" />\n          Back to Projects\n        </button>\n      }\n    >\n      <div className=\"mx-auto max-w-2xl rounded-xl border border-border-subtle bg-bg-surface p-6\">\n        {error && (\n          <div className=\"mb-4 rounded-lg border border-red-200 bg-red-50 p-3 text-sm text-red-700 dark:border-red-900 dark:bg-red-950/50 dark:text-red-400\">\n            Failed to create project. Please try again.\n          </div>\n        )}\n        <div className=\"space-y-4\">\n          <div>\n            <label className=\"block text-sm font-medium text-text-primary\">\n              Project Name\n            </label>\n            <input\n              type=\"text\"\n              placeholder=\"Enter project name\"\n              value={name}\n              onChange={(e) => setName(e.target.value)}\n              className=\"mt-1 w-full rounded-md border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary placeholder:text-text-secondary\"\n            />\n          </div>\n          <div>\n            <label className=\"block text-sm font-medium text-text-primary\">\n              Client\n            </label>\n            <input\n              type=\"text\"\n              placeholder=\"Client name\"\n              value={clientId}\n              onChange={(e) => setClientId(e.target.value)}\n              className=\"mt-1 w-full rounded-md border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary placeholder:text-text-secondary\"\n            />\n          </div>\n          <div>\n            <label className=\"block text-sm font-medium text-text-primary\">\n              Description\n            </label>\n            <textarea\n              placeholder=\"Project description\"\n              rows={3}\n              value={description}\n              onChange={(e) => setDescription(e.target.value)}\n              className=\"mt-1 w-full rounded-md border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary placeholder:text-text-secondary\"\n            />\n          </div>\n          <div className=\"grid grid-cols-2 gap-4\">\n            <div>\n              <label className=\"block text-sm font-medium text-text-primary\">\n                Estimated Hours\n              </label>\n              <input\n                type=\"number\"\n                placeholder=\"0\"\n                value={estimatedHours}\n                onChange={(e) => setEstimatedHours(e.target.value)}\n                className=\"mt-1 w-full rounded-md border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary\"\n              />\n            </div>\n            <div>\n              <label className=\"block text-sm font-medium text-text-primary\">\n                Hourly Rate\n              </label>\n              <input\n                type=\"number\"\n                placeholder=\"0.00\"\n                value={hourlyRate}\n                onChange={(e) => setHourlyRate(e.target.value)}\n                className=\"mt-1 w-full rounded-md border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary\"\n              />\n            </div>\n          </div>\n          <div className=\"flex justify-end gap-2 pt-4\">\n            <button className=\"rounded-md border border-border-subtle px-4 py-2 text-sm font-medium text-text-primary hover:bg-bg-sunken/50\">\n              Cancel\n            </button>\n            <button\n              onClick={handleSubmit}\n              disabled={creating || !name.trim()}\n              className=\"rounded-md bg-action-primary-bg px-4 py-2 text-sm font-medium text-action-primary-text hover:bg-action-primary-bg/90 disabled:opacity-50\"\n            >\n              {creating ? \"Creating...\" : \"Create Project\"}\n            </button>\n          </div>\n        </div>\n      </div>\n    </PageLayout>\n  );\n}\n"],"mappings":";;;;;;AAKA,SAAgB,IAAoB;CAClC,IAAM,CAAC,GAAM,KAAW,EAAS,GAAG,EAC9B,CAAC,GAAU,KAAe,EAAS,GAAG,EACtC,CAAC,GAAa,KAAkB,EAAS,GAAG,EAC5C,CAAC,GAAgB,KAAqB,EAAS,GAAG,EAClD,CAAC,GAAY,KAAiB,EAAS,GAAG,EAE1C,CAAC,GAAe,EAAE,SAAS,GAAU,cACzC,GAA0B;AAiB5B,QACE,kBAAC,GAAD;EACE,OAAM;EACN,aAAY;EACZ,SACE,kBAAC,UAAD;GAAQ,WAAU;aAAlB,CACE,kBAAC,GAAD,EAAW,WAAU,WAAY,CAAA,EAAA,mBAE1B;;YAGX,kBAAC,OAAD;GAAK,WAAU;aAAf,CACG,KACC,kBAAC,OAAD;IAAK,WAAU;cAAoI;IAE7I,CAAA,EAER,kBAAC,OAAD;IAAK,WAAU;cAAf;KACE,kBAAC,OAAD,EAAA,UAAA,CACE,kBAAC,SAAD;MAAO,WAAU;gBAA8C;MAEvD,CAAA,EACR,kBAAC,SAAD;MACE,MAAK;MACL,aAAY;MACZ,OAAO;MACP,WAAW,MAAM,EAAQ,EAAE,OAAO,MAAM;MACxC,WAAU;MACV,CAAA,CACE,EAAA,CAAA;KACN,kBAAC,OAAD,EAAA,UAAA,CACE,kBAAC,SAAD;MAAO,WAAU;gBAA8C;MAEvD,CAAA,EACR,kBAAC,SAAD;MACE,MAAK;MACL,aAAY;MACZ,OAAO;MACP,WAAW,MAAM,EAAY,EAAE,OAAO,MAAM;MAC5C,WAAU;MACV,CAAA,CACE,EAAA,CAAA;KACN,kBAAC,OAAD,EAAA,UAAA,CACE,kBAAC,SAAD;MAAO,WAAU;gBAA8C;MAEvD,CAAA,EACR,kBAAC,YAAD;MACE,aAAY;MACZ,MAAM;MACN,OAAO;MACP,WAAW,MAAM,EAAe,EAAE,OAAO,MAAM;MAC/C,WAAU;MACV,CAAA,CACE,EAAA,CAAA;KACN,kBAAC,OAAD;MAAK,WAAU;gBAAf,CACE,kBAAC,OAAD,EAAA,UAAA,CACE,kBAAC,SAAD;OAAO,WAAU;iBAA8C;OAEvD,CAAA,EACR,kBAAC,SAAD;OACE,MAAK;OACL,aAAY;OACZ,OAAO;OACP,WAAW,MAAM,EAAkB,EAAE,OAAO,MAAM;OAClD,WAAU;OACV,CAAA,CACE,EAAA,CAAA,EACN,kBAAC,OAAD,EAAA,UAAA,CACE,kBAAC,SAAD;OAAO,WAAU;iBAA8C;OAEvD,CAAA,EACR,kBAAC,SAAD;OACE,MAAK;OACL,aAAY;OACZ,OAAO;OACP,WAAW,MAAM,EAAc,EAAE,OAAO,MAAM;OAC9C,WAAU;OACV,CAAA,CACE,EAAA,CAAA,CACF;;KACN,kBAAC,OAAD;MAAK,WAAU;gBAAf,CACE,kBAAC,UAAD;OAAQ,WAAU;iBAA+G;OAExH,CAAA,EACT,kBAAC,UAAD;OACE,SApGS,YAAY;AAC1B,UAAK,MAAM,IAChB,MAAM,EAAc,EAClB,WAAW,EACT,OAAO;SACL,MAAM,EAAK,MAAM;SACjB,aAAa,EAAY,MAAM,IAAI,KAAA;SACnC,UAAU,EAAS,MAAM,IAAI,KAAA;SAC7B,gBAAgB,IAAiB,OAAO,EAAe,GAAG,KAAA;SAC1D,YAAY,IAAa,OAAO,EAAW,GAAG,KAAA;SAC/C,EACF,EACF,CAAC;;OAyFQ,UAAU,KAAY,CAAC,EAAK,MAAM;OAClC,WAAU;iBAET,IAAW,gBAAgB;OACrB,CAAA,CACL;;KACF;MACF;;EACK,CAAA"}
+{"version":3,"file":"ProjectCreatePage.js","names":[],"sources":["../../../../src/timecampus/pages/projects/ProjectCreatePage.tsx"],"sourcesContent":["import { useState } from \"react\";\nimport { ArrowLeft } from \"lucide-react\";\nimport { PageLayout } from \"../../components/PageLayout\";\nimport { useCreateProjectMutation } from \"@/generated/wspace-operations\";\n\nexport function ProjectCreatePage() {\n  const [name, setName] = useState(\"\");\n  const [clientId, setClientId] = useState(\"\");\n  const [description, setDescription] = useState(\"\");\n  const [estimatedHours, setEstimatedHours] = useState(\"\");\n  const [hourlyRate, setHourlyRate] = useState(\"\");\n\n  const [createProject, { loading: creating, error }] =\n    useCreateProjectMutation();\n\n  const handleSubmit = async () => {\n    if (!name.trim()) return;\n    await createProject({\n      variables: {\n        input: {\n          name: name.trim(),\n          description: description.trim() || undefined,\n          clientId: clientId.trim() || undefined,\n          estimatedHours: estimatedHours ? Number(estimatedHours) : undefined,\n          hourlyRate: hourlyRate ? Number(hourlyRate) : undefined,\n        },\n      },\n    });\n  };\n\n  return (\n    <PageLayout\n      title=\"Create Project\"\n      description=\"Set up a new project for time tracking\"\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          <ArrowLeft className=\"h-4 w-4\" />\n          Back to Projects\n        </button>\n      }\n    >\n      <div className=\"mx-auto max-w-2xl rounded-xl border border-border-seam bg-gloss-card shadow-pop p-6\">\n        {error && (\n          <div className=\"mb-4 rounded-lg border border-status-error-bg/40 bg-status-error-bg p-3 text-sm text-status-error-text\">\n            Failed to create project. Please try again.\n          </div>\n        )}\n        <div className=\"space-y-4\">\n          <div>\n            <label className=\"block text-sm font-medium text-text-primary\">\n              Project Name\n            </label>\n            <input\n              type=\"text\"\n              placeholder=\"Enter project name\"\n              value={name}\n              onChange={(e) => setName(e.target.value)}\n              className=\"mt-1 w-full rounded-md border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary placeholder:text-text-secondary\"\n            />\n          </div>\n          <div>\n            <label className=\"block text-sm font-medium text-text-primary\">\n              Client\n            </label>\n            <input\n              type=\"text\"\n              placeholder=\"Client name\"\n              value={clientId}\n              onChange={(e) => setClientId(e.target.value)}\n              className=\"mt-1 w-full rounded-md border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary placeholder:text-text-secondary\"\n            />\n          </div>\n          <div>\n            <label className=\"block text-sm font-medium text-text-primary\">\n              Description\n            </label>\n            <textarea\n              placeholder=\"Project description\"\n              rows={3}\n              value={description}\n              onChange={(e) => setDescription(e.target.value)}\n              className=\"mt-1 w-full rounded-md border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary placeholder:text-text-secondary\"\n            />\n          </div>\n          <div className=\"grid grid-cols-2 gap-4\">\n            <div>\n              <label className=\"block text-sm font-medium text-text-primary\">\n                Estimated Hours\n              </label>\n              <input\n                type=\"number\"\n                placeholder=\"0\"\n                value={estimatedHours}\n                onChange={(e) => setEstimatedHours(e.target.value)}\n                className=\"mt-1 w-full rounded-md border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary\"\n              />\n            </div>\n            <div>\n              <label className=\"block text-sm font-medium text-text-primary\">\n                Hourly Rate\n              </label>\n              <input\n                type=\"number\"\n                placeholder=\"0.00\"\n                value={hourlyRate}\n                onChange={(e) => setHourlyRate(e.target.value)}\n                className=\"mt-1 w-full rounded-md border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary\"\n              />\n            </div>\n          </div>\n          <div className=\"flex justify-end gap-2 pt-4\">\n            <button className=\"rounded-md border border-border-subtle px-4 py-2 text-sm font-medium text-text-primary hover:bg-bg-sunken/50\">\n              Cancel\n            </button>\n            <button\n              onClick={handleSubmit}\n              disabled={creating || !name.trim()}\n              className=\"rounded-md bg-action-primary-bg px-4 py-2 text-sm font-medium text-action-primary-text hover:bg-action-primary-bg/90 disabled:opacity-50\"\n            >\n              {creating ? \"Creating...\" : \"Create Project\"}\n            </button>\n          </div>\n        </div>\n      </div>\n    </PageLayout>\n  );\n}\n"],"mappings":";;;;;;AAKA,SAAgB,IAAoB;CAClC,IAAM,CAAC,GAAM,KAAW,EAAS,GAAG,EAC9B,CAAC,GAAU,KAAe,EAAS,GAAG,EACtC,CAAC,GAAa,KAAkB,EAAS,GAAG,EAC5C,CAAC,GAAgB,KAAqB,EAAS,GAAG,EAClD,CAAC,GAAY,KAAiB,EAAS,GAAG,EAE1C,CAAC,GAAe,EAAE,SAAS,GAAU,cACzC,GAA0B;AAiB5B,QACE,kBAAC,GAAD;EACE,OAAM;EACN,aAAY;EACZ,SACE,kBAAC,UAAD;GAAQ,WAAU;aAAlB,CACE,kBAAC,GAAD,EAAW,WAAU,WAAY,CAAA,EAAA,mBAE1B;;YAGX,kBAAC,OAAD;GAAK,WAAU;aAAf,CACG,KACC,kBAAC,OAAD;IAAK,WAAU;cAAyG;IAElH,CAAA,EAER,kBAAC,OAAD;IAAK,WAAU;cAAf;KACE,kBAAC,OAAD,EAAA,UAAA,CACE,kBAAC,SAAD;MAAO,WAAU;gBAA8C;MAEvD,CAAA,EACR,kBAAC,SAAD;MACE,MAAK;MACL,aAAY;MACZ,OAAO;MACP,WAAW,MAAM,EAAQ,EAAE,OAAO,MAAM;MACxC,WAAU;MACV,CAAA,CACE,EAAA,CAAA;KACN,kBAAC,OAAD,EAAA,UAAA,CACE,kBAAC,SAAD;MAAO,WAAU;gBAA8C;MAEvD,CAAA,EACR,kBAAC,SAAD;MACE,MAAK;MACL,aAAY;MACZ,OAAO;MACP,WAAW,MAAM,EAAY,EAAE,OAAO,MAAM;MAC5C,WAAU;MACV,CAAA,CACE,EAAA,CAAA;KACN,kBAAC,OAAD,EAAA,UAAA,CACE,kBAAC,SAAD;MAAO,WAAU;gBAA8C;MAEvD,CAAA,EACR,kBAAC,YAAD;MACE,aAAY;MACZ,MAAM;MACN,OAAO;MACP,WAAW,MAAM,EAAe,EAAE,OAAO,MAAM;MAC/C,WAAU;MACV,CAAA,CACE,EAAA,CAAA;KACN,kBAAC,OAAD;MAAK,WAAU;gBAAf,CACE,kBAAC,OAAD,EAAA,UAAA,CACE,kBAAC,SAAD;OAAO,WAAU;iBAA8C;OAEvD,CAAA,EACR,kBAAC,SAAD;OACE,MAAK;OACL,aAAY;OACZ,OAAO;OACP,WAAW,MAAM,EAAkB,EAAE,OAAO,MAAM;OAClD,WAAU;OACV,CAAA,CACE,EAAA,CAAA,EACN,kBAAC,OAAD,EAAA,UAAA,CACE,kBAAC,SAAD;OAAO,WAAU;iBAA8C;OAEvD,CAAA,EACR,kBAAC,SAAD;OACE,MAAK;OACL,aAAY;OACZ,OAAO;OACP,WAAW,MAAM,EAAc,EAAE,OAAO,MAAM;OAC9C,WAAU;OACV,CAAA,CACE,EAAA,CAAA,CACF;;KACN,kBAAC,OAAD;MAAK,WAAU;gBAAf,CACE,kBAAC,UAAD;OAAQ,WAAU;iBAA+G;OAExH,CAAA,EACT,kBAAC,UAAD;OACE,SApGS,YAAY;AAC1B,UAAK,MAAM,IAChB,MAAM,EAAc,EAClB,WAAW,EACT,OAAO;SACL,MAAM,EAAK,MAAM;SACjB,aAAa,EAAY,MAAM,IAAI,KAAA;SACnC,UAAU,EAAS,MAAM,IAAI,KAAA;SAC7B,gBAAgB,IAAiB,OAAO,EAAe,GAAG,KAAA;SAC1D,YAAY,IAAa,OAAO,EAAW,GAAG,KAAA;SAC/C,EACF,EACF,CAAC;;OAyFQ,UAAU,KAAY,CAAC,EAAK,MAAM;OAClC,WAAU;iBAET,IAAW,gBAAgB;OACrB,CAAA,CACL;;KACF;MACF;;EACK,CAAA"}

package/dist/timecampus/pages/projects/ProjectDetailPage.js

@@ -1,54 +1,54 @@
 import { formatCurrency as e, formatHours as t } from "../../utils/helpers.js";
-import { PageLayout as n } from "../../components/PageLayout.js";
-import { StatCard as r } from "../../components/StatCard.js";
-import { LoadingSkeleton as i } from "../../components/LoadingSkeleton.js";
-import { useGetProjectQuery as a, useGetProjectStatsQuery as o } from "../../../generated/wspace-operations.js";
+import { StatCard as n } from "../../components/StatCard.js";
+import { LoadingSkeleton as r } from "../../components/LoadingSkeleton.js";
+import { useGetProjectQuery as i, useGetProjectStatsQuery as a } from "../../../generated/wspace-operations.js";
+import { PageLayout as o } from "../../components/PageLayout.js";
 import { Clock as s, FolderOpen as c, TrendingUp as l, Users as u } from "lucide-react";
 import { useParams as d } from "react-router-dom";
 import { jsx as f, jsxs as p } from "react/jsx-runtime";
 //#region src/timecampus/pages/projects/ProjectDetailPage.tsx
 function m() {
-	let { projectId: m } = d(), { data: h, loading: g, error: _ } = a({
+	let { projectId: m } = d(), { data: h, loading: g, error: _ } = i({
 		variables: { id: m },
 		skip: !m
-	}), { data: v, loading: y } = o({
+	}), { data: v, loading: y } = a({
 		variables: { id: m },
 		skip: !m
 	}), b = h?.project, x = v?.projectStats;
-	return _ ? /* @__PURE__ */ f(n, {
+	return _ ? /* @__PURE__ */ f(o, {
 		title: "Project Details",
 		description: `Project ID: ${m}`,
 		children: /* @__PURE__ */ f("div", {
-			className: "rounded-xl border border-red-200 bg-red-50 p-6 text-sm text-red-700 dark:border-red-900 dark:bg-red-950/50 dark:text-red-400",
+			className: "rounded-xl border border-status-error-bg/40 bg-status-error-bg p-6 text-sm text-status-error-text",
 			children: "Failed to load project details. Please try again later."
 		})
-	}) : g || y ? /* @__PURE__ */ f(n, {
+	}) : g || y ? /* @__PURE__ */ f(o, {
 		title: "Project Details",
 		description: `Project ID: ${m}`,
-		children: /* @__PURE__ */ f(i, { variant: "detail" })
-	}) : /* @__PURE__ */ p(n, {
+		children: /* @__PURE__ */ f(r, { variant: "detail" })
+	}) : /* @__PURE__ */ p(o, {
 		title: b?.name ?? "Project Details",
 		description: b?.description ?? `Project ID: ${m}`,
 		children: [/* @__PURE__ */ p("div", {
 			className: "grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-4",
 			children: [
-				/* @__PURE__ */ f(r, {
+				/* @__PURE__ */ f(n, {
 					title: "Tracked Hours",
 					value: t(x?.totalHours ?? b?.trackedHours ?? 0),
 					icon: /* @__PURE__ */ f(s, { className: "h-5 w-5" })
 				}),
-				/* @__PURE__ */ f(r, {
+				/* @__PURE__ */ f(n, {
 					title: "Tasks",
 					value: `${x?.completedTasks ?? 0} / ${x?.totalTasks ?? 0}`,
 					icon: /* @__PURE__ */ f(u, { className: "h-5 w-5" }),
 					description: "completed / total"
 				}),
-				/* @__PURE__ */ f(r, {
+				/* @__PURE__ */ f(n, {
 					title: "Progress",
 					value: x?.totalTasks ? `${Math.round((x?.completedTasks ?? 0) / x.totalTasks * 100)}%` : "0%",
 					icon: /* @__PURE__ */ f(l, { className: "h-5 w-5" })
 				}),
-				/* @__PURE__ */ f(r, {
+				/* @__PURE__ */ f(n, {
 					title: "Budget Used",
 					value: e(x?.budgetUsed ?? 0, b?.currency ?? "USD"),
 					icon: /* @__PURE__ */ f(c, { className: "h-5 w-5" }),
@@ -58,7 +58,7 @@ function m() {
 		}), /* @__PURE__ */ p("div", {
 			className: "grid grid-cols-1 gap-6 lg:grid-cols-2",
 			children: [/* @__PURE__ */ p("div", {
-				className: "rounded-xl border border-border-subtle bg-bg-surface p-6",
+				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: "Recent Activity"
@@ -70,7 +70,7 @@ function m() {
 					})
 				})]
 			}), /* @__PURE__ */ p("div", {
-				className: "rounded-xl border border-border-subtle bg-bg-surface p-6",
+				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: "Time Distribution"

package/dist/timecampus/pages/projects/ProjectDetailPage.js.map

@@ -1 +1 @@
-{"version":3,"file":"ProjectDetailPage.js","names":[],"sources":["../../../../src/timecampus/pages/projects/ProjectDetailPage.tsx"],"sourcesContent":["import { useParams } from \"react-router-dom\";\nimport { FolderOpen, Clock, Users, TrendingUp } from \"lucide-react\";\nimport { PageLayout } from \"../../components/PageLayout\";\nimport { StatCard } from \"../../components/StatCard\";\nimport { LoadingSkeleton } from \"../../components/LoadingSkeleton\";\nimport { formatHours, formatCurrency } from \"../../utils/helpers\";\nimport {\n  useGetProjectQuery,\n  useGetProjectStatsQuery,\n} from \"@/generated/wspace-operations\";\n\nexport function ProjectDetailPage() {\n  const { projectId } = useParams<{ projectId: string }>();\n\n  const {\n    data: projectData,\n    loading: projectLoading,\n    error: projectError,\n  } = useGetProjectQuery({\n    variables: { id: projectId! },\n    skip: !projectId,\n  });\n\n  const { data: statsData, loading: statsLoading } = useGetProjectStatsQuery({\n    variables: { id: projectId! },\n    skip: !projectId,\n  });\n\n  const project = projectData?.project;\n  const stats = statsData?.projectStats;\n\n  if (projectError) {\n    return (\n      <PageLayout\n        title=\"Project Details\"\n        description={`Project ID: ${projectId}`}\n      >\n        <div className=\"rounded-xl border border-red-200 bg-red-50 p-6 text-sm text-red-700 dark:border-red-900 dark:bg-red-950/50 dark:text-red-400\">\n          Failed to load project details. Please try again later.\n        </div>\n      </PageLayout>\n    );\n  }\n\n  if (projectLoading || statsLoading) {\n    return (\n      <PageLayout\n        title=\"Project Details\"\n        description={`Project ID: ${projectId}`}\n      >\n        <LoadingSkeleton variant=\"detail\" />\n      </PageLayout>\n    );\n  }\n\n  return (\n    <PageLayout\n      title={project?.name ?? \"Project Details\"}\n      description={project?.description ?? `Project ID: ${projectId}`}\n    >\n      <div className=\"grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-4\">\n        <StatCard\n          title=\"Tracked Hours\"\n          value={formatHours(stats?.totalHours ?? project?.trackedHours ?? 0)}\n          icon={<Clock className=\"h-5 w-5\" />}\n        />\n        <StatCard\n          title=\"Tasks\"\n          value={`${stats?.completedTasks ?? 0} / ${stats?.totalTasks ?? 0}`}\n          icon={<Users className=\"h-5 w-5\" />}\n          description=\"completed / total\"\n        />\n        <StatCard\n          title=\"Progress\"\n          value={\n            stats?.totalTasks\n              ? `${Math.round(((stats?.completedTasks ?? 0) / stats.totalTasks) * 100)}%`\n              : \"0%\"\n          }\n          icon={<TrendingUp className=\"h-5 w-5\" />}\n        />\n        <StatCard\n          title=\"Budget Used\"\n          value={formatCurrency(\n            stats?.budgetUsed ?? 0,\n            project?.currency ?? \"USD\",\n          )}\n          icon={<FolderOpen className=\"h-5 w-5\" />}\n          description={\n            stats?.budgetRemaining != null\n              ? `${formatCurrency(stats.budgetRemaining, project?.currency ?? \"USD\")} remaining`\n              : undefined\n          }\n        />\n      </div>\n\n      <div className=\"grid grid-cols-1 gap-6 lg:grid-cols-2\">\n        <div className=\"rounded-xl border border-border-subtle bg-bg-surface p-6\">\n          <h3 className=\"mb-4 text-sm font-semibold text-text-primary\">\n            Recent Activity\n          </h3>\n          <div className=\"flex h-48 items-center justify-center rounded-lg border border-dashed border-border-subtle\">\n            <p className=\"text-sm text-text-secondary\">\n              Activity timeline will render here\n            </p>\n          </div>\n        </div>\n        <div className=\"rounded-xl border border-border-subtle bg-bg-surface p-6\">\n          <h3 className=\"mb-4 text-sm font-semibold text-text-primary\">\n            Time Distribution\n          </h3>\n          <div className=\"flex h-48 items-center justify-center rounded-lg border border-dashed border-border-subtle\">\n            <p className=\"text-sm text-text-secondary\">\n              Chart will render here\n            </p>\n          </div>\n        </div>\n      </div>\n    </PageLayout>\n  );\n}\n"],"mappings":";;;;;;;;;AAWA,SAAgB,IAAoB;CAClC,IAAM,EAAE,iBAAc,GAAkC,EAElD,EACJ,MAAM,GACN,SAAS,GACT,OAAO,MACL,EAAmB;EACrB,WAAW,EAAE,IAAI,GAAY;EAC7B,MAAM,CAAC;EACR,CAAC,EAEI,EAAE,MAAM,GAAW,SAAS,MAAiB,EAAwB;EACzE,WAAW,EAAE,IAAI,GAAY;EAC7B,MAAM,CAAC;EACR,CAAC,EAEI,IAAU,GAAa,SACvB,IAAQ,GAAW;AA0BzB,QAxBI,IAEA,kBAAC,GAAD;EACE,OAAM;EACN,aAAa,eAAe;YAE5B,kBAAC,OAAD;GAAK,WAAU;aAA+H;GAExI,CAAA;EACK,CAAA,GAIb,KAAkB,IAElB,kBAAC,GAAD;EACE,OAAM;EACN,aAAa,eAAe;YAE5B,kBAAC,GAAD,EAAiB,SAAQ,UAAW,CAAA;EACzB,CAAA,GAKf,kBAAC,GAAD;EACE,OAAO,GAAS,QAAQ;EACxB,aAAa,GAAS,eAAe,eAAe;YAFtD,CAIE,kBAAC,OAAD;GAAK,WAAU;aAAf;IACE,kBAAC,GAAD;KACE,OAAM;KACN,OAAO,EAAY,GAAO,cAAc,GAAS,gBAAgB,EAAE;KACnE,MAAM,kBAAC,GAAD,EAAO,WAAU,WAAY,CAAA;KACnC,CAAA;IACF,kBAAC,GAAD;KACE,OAAM;KACN,OAAO,GAAG,GAAO,kBAAkB,EAAE,KAAK,GAAO,cAAc;KAC/D,MAAM,kBAAC,GAAD,EAAO,WAAU,WAAY,CAAA;KACnC,aAAY;KACZ,CAAA;IACF,kBAAC,GAAD;KACE,OAAM;KACN,OACE,GAAO,aACH,GAAG,KAAK,OAAQ,GAAO,kBAAkB,KAAK,EAAM,aAAc,IAAI,CAAC,KACvE;KAEN,MAAM,kBAAC,GAAD,EAAY,WAAU,WAAY,CAAA;KACxC,CAAA;IACF,kBAAC,GAAD;KACE,OAAM;KACN,OAAO,EACL,GAAO,cAAc,GACrB,GAAS,YAAY,MACtB;KACD,MAAM,kBAAC,GAAD,EAAY,WAAU,WAAY,CAAA;KACxC,aACE,GAAO,mBAAmB,OAEtB,KAAA,IADA,GAAG,EAAe,EAAM,iBAAiB,GAAS,YAAY,MAAM,CAAC;KAG3E,CAAA;IACE;MAEN,kBAAC,OAAD;GAAK,WAAU;aAAf,CACE,kBAAC,OAAD;IAAK,WAAU;cAAf,CACE,kBAAC,MAAD;KAAI,WAAU;eAA+C;KAExD,CAAA,EACL,kBAAC,OAAD;KAAK,WAAU;eACb,kBAAC,KAAD;MAAG,WAAU;gBAA8B;MAEvC,CAAA;KACA,CAAA,CACF;OACN,kBAAC,OAAD;IAAK,WAAU;cAAf,CACE,kBAAC,MAAD;KAAI,WAAU;eAA+C;KAExD,CAAA,EACL,kBAAC,OAAD;KAAK,WAAU;eACb,kBAAC,KAAD;MAAG,WAAU;gBAA8B;MAEvC,CAAA;KACA,CAAA,CACF;MACF;KACK"}
+{"version":3,"file":"ProjectDetailPage.js","names":[],"sources":["../../../../src/timecampus/pages/projects/ProjectDetailPage.tsx"],"sourcesContent":["import { useParams } from \"react-router-dom\";\nimport { FolderOpen, Clock, Users, TrendingUp } from \"lucide-react\";\nimport { PageLayout } from \"../../components/PageLayout\";\nimport { StatCard } from \"../../components/StatCard\";\nimport { LoadingSkeleton } from \"../../components/LoadingSkeleton\";\nimport { formatHours, formatCurrency } from \"../../utils/helpers\";\nimport {\n  useGetProjectQuery,\n  useGetProjectStatsQuery,\n} from \"@/generated/wspace-operations\";\n\nexport function ProjectDetailPage() {\n  const { projectId } = useParams<{ projectId: string }>();\n\n  const {\n    data: projectData,\n    loading: projectLoading,\n    error: projectError,\n  } = useGetProjectQuery({\n    variables: { id: projectId! },\n    skip: !projectId,\n  });\n\n  const { data: statsData, loading: statsLoading } = useGetProjectStatsQuery({\n    variables: { id: projectId! },\n    skip: !projectId,\n  });\n\n  const project = projectData?.project;\n  const stats = statsData?.projectStats;\n\n  if (projectError) {\n    return (\n      <PageLayout\n        title=\"Project Details\"\n        description={`Project ID: ${projectId}`}\n      >\n        <div className=\"rounded-xl border border-status-error-bg/40 bg-status-error-bg p-6 text-sm text-status-error-text\">\n          Failed to load project details. Please try again later.\n        </div>\n      </PageLayout>\n    );\n  }\n\n  if (projectLoading || statsLoading) {\n    return (\n      <PageLayout\n        title=\"Project Details\"\n        description={`Project ID: ${projectId}`}\n      >\n        <LoadingSkeleton variant=\"detail\" />\n      </PageLayout>\n    );\n  }\n\n  return (\n    <PageLayout\n      title={project?.name ?? \"Project Details\"}\n      description={project?.description ?? `Project ID: ${projectId}`}\n    >\n      <div className=\"grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-4\">\n        <StatCard\n          title=\"Tracked Hours\"\n          value={formatHours(stats?.totalHours ?? project?.trackedHours ?? 0)}\n          icon={<Clock className=\"h-5 w-5\" />}\n        />\n        <StatCard\n          title=\"Tasks\"\n          value={`${stats?.completedTasks ?? 0} / ${stats?.totalTasks ?? 0}`}\n          icon={<Users className=\"h-5 w-5\" />}\n          description=\"completed / total\"\n        />\n        <StatCard\n          title=\"Progress\"\n          value={\n            stats?.totalTasks\n              ? `${Math.round(((stats?.completedTasks ?? 0) / stats.totalTasks) * 100)}%`\n              : \"0%\"\n          }\n          icon={<TrendingUp className=\"h-5 w-5\" />}\n        />\n        <StatCard\n          title=\"Budget Used\"\n          value={formatCurrency(\n            stats?.budgetUsed ?? 0,\n            project?.currency ?? \"USD\",\n          )}\n          icon={<FolderOpen className=\"h-5 w-5\" />}\n          description={\n            stats?.budgetRemaining != null\n              ? `${formatCurrency(stats.budgetRemaining, project?.currency ?? \"USD\")} remaining`\n              : undefined\n          }\n        />\n      </div>\n\n      <div className=\"grid grid-cols-1 gap-6 lg:grid-cols-2\">\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            Recent Activity\n          </h3>\n          <div className=\"flex h-48 items-center justify-center rounded-lg border border-dashed border-border-subtle\">\n            <p className=\"text-sm text-text-secondary\">\n              Activity timeline will render here\n            </p>\n          </div>\n        </div>\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            Time Distribution\n          </h3>\n          <div className=\"flex h-48 items-center justify-center rounded-lg border border-dashed border-border-subtle\">\n            <p className=\"text-sm text-text-secondary\">\n              Chart will render here\n            </p>\n          </div>\n        </div>\n      </div>\n    </PageLayout>\n  );\n}\n"],"mappings":";;;;;;;;;AAWA,SAAgB,IAAoB;CAClC,IAAM,EAAE,iBAAc,GAAkC,EAElD,EACJ,MAAM,GACN,SAAS,GACT,OAAO,MACL,EAAmB;EACrB,WAAW,EAAE,IAAI,GAAY;EAC7B,MAAM,CAAC;EACR,CAAC,EAEI,EAAE,MAAM,GAAW,SAAS,MAAiB,EAAwB;EACzE,WAAW,EAAE,IAAI,GAAY;EAC7B,MAAM,CAAC;EACR,CAAC,EAEI,IAAU,GAAa,SACvB,IAAQ,GAAW;AA0BzB,QAxBI,IAEA,kBAAC,GAAD;EACE,OAAM;EACN,aAAa,eAAe;YAE5B,kBAAC,OAAD;GAAK,WAAU;aAAoG;GAE7G,CAAA;EACK,CAAA,GAIb,KAAkB,IAElB,kBAAC,GAAD;EACE,OAAM;EACN,aAAa,eAAe;YAE5B,kBAAC,GAAD,EAAiB,SAAQ,UAAW,CAAA;EACzB,CAAA,GAKf,kBAAC,GAAD;EACE,OAAO,GAAS,QAAQ;EACxB,aAAa,GAAS,eAAe,eAAe;YAFtD,CAIE,kBAAC,OAAD;GAAK,WAAU;aAAf;IACE,kBAAC,GAAD;KACE,OAAM;KACN,OAAO,EAAY,GAAO,cAAc,GAAS,gBAAgB,EAAE;KACnE,MAAM,kBAAC,GAAD,EAAO,WAAU,WAAY,CAAA;KACnC,CAAA;IACF,kBAAC,GAAD;KACE,OAAM;KACN,OAAO,GAAG,GAAO,kBAAkB,EAAE,KAAK,GAAO,cAAc;KAC/D,MAAM,kBAAC,GAAD,EAAO,WAAU,WAAY,CAAA;KACnC,aAAY;KACZ,CAAA;IACF,kBAAC,GAAD;KACE,OAAM;KACN,OACE,GAAO,aACH,GAAG,KAAK,OAAQ,GAAO,kBAAkB,KAAK,EAAM,aAAc,IAAI,CAAC,KACvE;KAEN,MAAM,kBAAC,GAAD,EAAY,WAAU,WAAY,CAAA;KACxC,CAAA;IACF,kBAAC,GAAD;KACE,OAAM;KACN,OAAO,EACL,GAAO,cAAc,GACrB,GAAS,YAAY,MACtB;KACD,MAAM,kBAAC,GAAD,EAAY,WAAU,WAAY,CAAA;KACxC,aACE,GAAO,mBAAmB,OAEtB,KAAA,IADA,GAAG,EAAe,EAAM,iBAAiB,GAAS,YAAY,MAAM,CAAC;KAG3E,CAAA;IACE;MAEN,kBAAC,OAAD;GAAK,WAAU;aAAf,CACE,kBAAC,OAAD;IAAK,WAAU;cAAf,CACE,kBAAC,MAAD;KAAI,WAAU;eAA+C;KAExD,CAAA,EACL,kBAAC,OAAD;KAAK,WAAU;eACb,kBAAC,KAAD;MAAG,WAAU;gBAA8B;MAEvC,CAAA;KACA,CAAA,CACF;OACN,kBAAC,OAAD;IAAK,WAAU;cAAf,CACE,kBAAC,MAAD;KAAI,WAAU;eAA+C;KAExD,CAAA,EACL,kBAAC,OAAD;KAAK,WAAU;eACb,kBAAC,KAAD;MAAG,WAAU;gBAA8B;MAEvC,CAAA;KACA,CAAA,CACF;MACF;KACK"}