@burdenoff/microfe-workspaces 2026.519.1 → 2026.528.1

package/dist/pages/dashboard/widgets/SessionsWidget.js

@@ -0,0 +1,78 @@
+import { WidgetWrapper as e } from "../WidgetWrapper.js";
+import { Activity as t, ArrowRight as n, Terminal as r } from "lucide-react";
+import { jsx as i, jsxs as a } from "react/jsx-runtime";
+import { Badge as o, Button as s } from "@burdenoff/fe-libs/ui";
+//#region src/pages/dashboard/widgets/SessionsWidget.tsx
+var c = {
+	RUNNING: "bg-status-success-bg text-status-success-text",
+	ACTIVE: "bg-status-success-bg text-status-success-text",
+	STARTING: "bg-status-warning-bg text-status-warning-text",
+	STOPPED: "bg-text-tertiary/20 text-text-tertiary",
+	ERROR: "bg-status-error-bg text-status-error-text"
+};
+function l(e) {
+	if (!e) return "";
+	let t = Date.now() - new Date(e).getTime(), n = Math.floor(t / 6e4);
+	if (n < 1) return "just now";
+	if (n < 60) return `${n}m`;
+	let r = Math.floor(n / 60);
+	return r < 24 ? `${r}h` : new Date(e).toLocaleDateString(void 0, {
+		month: "short",
+		day: "numeric"
+	});
+}
+function u({ workspaceData: u, isLoading: d, navigate: f }) {
+	let p = u?.activeSessions ?? [];
+	return /* @__PURE__ */ i(e, {
+		title: "Active Sessions",
+		icon: /* @__PURE__ */ i(r, { className: "size-4" }),
+		size: "medium",
+		isLoading: d,
+		unavailable: !u,
+		headerAction: /* @__PURE__ */ a(s, {
+			variant: "ghost",
+			size: "sm",
+			className: "text-xs",
+			onClick: () => f("/vibecontrols/sessions"),
+			children: ["View all ", /* @__PURE__ */ i(n, { className: "ml-1 size-3" })]
+		}),
+		children: p.length === 0 ? /* @__PURE__ */ a("div", {
+			className: "text-center py-4",
+			children: [/* @__PURE__ */ i(t, { className: "mx-auto mb-2 size-5 text-muted-foreground" }), /* @__PURE__ */ i("p", {
+				className: "text-sm text-muted-foreground",
+				children: "No active sessions"
+			})]
+		}) : /* @__PURE__ */ i("ul", {
+			className: "space-y-1.5",
+			children: p.slice(0, 5).map((e) => /* @__PURE__ */ i("li", { children: /* @__PURE__ */ a("button", {
+				type: "button",
+				onClick: () => f(`/vibecontrols/sessions/${e.id}`),
+				className: "flex w-full items-center justify-between gap-2 rounded-md p-2 text-left transition-colors hover:bg-accent/5",
+				children: [/* @__PURE__ */ a("div", {
+					className: "min-w-0 flex-1",
+					children: [/* @__PURE__ */ i("p", {
+						className: "truncate text-sm font-medium text-text-primary",
+						children: e.name || `Session ${e.id.slice(0, 8)}`
+					}), e.agentName ? /* @__PURE__ */ i("p", {
+						className: "truncate text-[11px] text-muted-foreground",
+						children: e.agentName
+					}) : null]
+				}), /* @__PURE__ */ a("div", {
+					className: "flex flex-col items-end gap-1",
+					children: [/* @__PURE__ */ i(o, {
+						variant: "outline",
+						className: `text-[10px] ${c[e.status] ?? ""}`,
+						children: e.status.toLowerCase()
+					}), e.startedAt ? /* @__PURE__ */ i("span", {
+						className: "text-[10px] text-muted-foreground",
+						children: l(e.startedAt)
+					}) : null]
+				})]
+			}) }, e.id))
+		})
+	});
+}
+//#endregion
+export { u as SessionsWidget };
+
+//# sourceMappingURL=SessionsWidget.js.map

package/dist/pages/dashboard/widgets/SessionsWidget.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SessionsWidget.js","names":[],"sources":["../../../../src/pages/dashboard/widgets/SessionsWidget.tsx"],"sourcesContent":["import { Terminal, ArrowRight, Activity } from 'lucide-react';\nimport { Badge, Button } from '@burdenoff/fe-libs/ui';\nimport { WidgetWrapper } from '../WidgetWrapper';\nimport type { WidgetProps } from '../types';\n\nconst STATUS_BADGE: Record<string, string> = {\n  RUNNING: 'bg-status-success-bg text-status-success-text',\n  ACTIVE: 'bg-status-success-bg text-status-success-text',\n  STARTING: 'bg-status-warning-bg text-status-warning-text',\n  STOPPED: 'bg-text-tertiary/20 text-text-tertiary',\n  ERROR: 'bg-status-error-bg text-status-error-text',\n};\n\nfunction formatRelative(dateString: string | null | undefined): string {\n  if (!dateString) return '';\n  const diffMs = Date.now() - new Date(dateString).getTime();\n  const diffMin = Math.floor(diffMs / 60000);\n  if (diffMin < 1) return 'just now';\n  if (diffMin < 60) return `${diffMin}m`;\n  const diffHr = Math.floor(diffMin / 60);\n  if (diffHr < 24) return `${diffHr}h`;\n  return new Date(dateString).toLocaleDateString(undefined, {\n    month: 'short',\n    day: 'numeric',\n  });\n}\n\nexport function SessionsWidget({ workspaceData, isLoading, navigate }: WidgetProps) {\n  const sessions = workspaceData?.activeSessions ?? [];\n\n  return (\n    <WidgetWrapper\n      title=\"Active Sessions\"\n      icon={<Terminal className=\"size-4\" />}\n      size=\"medium\"\n      isLoading={isLoading}\n      unavailable={!workspaceData}\n      headerAction={\n        <Button\n          variant=\"ghost\"\n          size=\"sm\"\n          className=\"text-xs\"\n          onClick={() => navigate('/vibecontrols/sessions')}\n        >\n          View all <ArrowRight className=\"ml-1 size-3\" />\n        </Button>\n      }\n    >\n      {sessions.length === 0 ? (\n        <div className=\"text-center py-4\">\n          <Activity className=\"mx-auto mb-2 size-5 text-muted-foreground\" />\n          <p className=\"text-sm text-muted-foreground\">No active sessions</p>\n        </div>\n      ) : (\n        <ul className=\"space-y-1.5\">\n          {sessions.slice(0, 5).map((s) => (\n            <li key={s.id}>\n              <button\n                type=\"button\"\n                onClick={() => navigate(`/vibecontrols/sessions/${s.id}`)}\n                className=\"flex w-full items-center justify-between gap-2 rounded-md p-2 text-left transition-colors hover:bg-accent/5\"\n              >\n                <div className=\"min-w-0 flex-1\">\n                  <p className=\"truncate text-sm font-medium text-text-primary\">\n                    {s.name || `Session ${s.id.slice(0, 8)}`}\n                  </p>\n                  {s.agentName ? (\n                    <p className=\"truncate text-[11px] text-muted-foreground\">{s.agentName}</p>\n                  ) : null}\n                </div>\n                <div className=\"flex flex-col items-end gap-1\">\n                  <Badge\n                    variant=\"outline\"\n                    className={`text-[10px] ${STATUS_BADGE[s.status] ?? ''}`}\n                  >\n                    {s.status.toLowerCase()}\n                  </Badge>\n                  {s.startedAt ? (\n                    <span className=\"text-[10px] text-muted-foreground\">\n                      {formatRelative(s.startedAt)}\n                    </span>\n                  ) : null}\n                </div>\n              </button>\n            </li>\n          ))}\n        </ul>\n      )}\n    </WidgetWrapper>\n  );\n}\n"],"mappings":";;;;;AAKA,IAAM,IAAuC;CAC3C,SAAS;CACT,QAAQ;CACR,UAAU;CACV,SAAS;CACT,OAAO;CACR;AAED,SAAS,EAAe,GAA+C;AACrE,KAAI,CAAC,EAAY,QAAO;CACxB,IAAM,IAAS,KAAK,KAAK,GAAG,IAAI,KAAK,EAAW,CAAC,SAAS,EACpD,IAAU,KAAK,MAAM,IAAS,IAAM;AAC1C,KAAI,IAAU,EAAG,QAAO;AACxB,KAAI,IAAU,GAAI,QAAO,GAAG,EAAQ;CACpC,IAAM,IAAS,KAAK,MAAM,IAAU,GAAG;AAEvC,QADI,IAAS,KAAW,GAAG,EAAO,KAC3B,IAAI,KAAK,EAAW,CAAC,mBAAmB,KAAA,GAAW;EACxD,OAAO;EACP,KAAK;EACN,CAAC;;AAGJ,SAAgB,EAAe,EAAE,kBAAe,cAAW,eAAyB;CAClF,IAAM,IAAW,GAAe,kBAAkB,EAAE;AAEpD,QACE,kBAAC,GAAD;EACE,OAAM;EACN,MAAM,kBAAC,GAAD,EAAU,WAAU,UAAW,CAAA;EACrC,MAAK;EACM;EACX,aAAa,CAAC;EACd,cACE,kBAAC,GAAD;GACE,SAAQ;GACR,MAAK;GACL,WAAU;GACV,eAAe,EAAS,yBAAyB;aAJnD,CAKC,aACU,kBAAC,GAAD,EAAY,WAAU,eAAgB,CAAA,CACxC;;YAGV,EAAS,WAAW,IACnB,kBAAC,OAAD;GAAK,WAAU;aAAf,CACE,kBAAC,GAAD,EAAU,WAAU,6CAA8C,CAAA,EAClE,kBAAC,KAAD;IAAG,WAAU;cAAgC;IAAsB,CAAA,CAC/D;OAEN,kBAAC,MAAD;GAAI,WAAU;aACX,EAAS,MAAM,GAAG,EAAE,CAAC,KAAK,MACzB,kBAAC,MAAD,EAAA,UACE,kBAAC,UAAD;IACE,MAAK;IACL,eAAe,EAAS,0BAA0B,EAAE,KAAK;IACzD,WAAU;cAHZ,CAKE,kBAAC,OAAD;KAAK,WAAU;eAAf,CACE,kBAAC,KAAD;MAAG,WAAU;gBACV,EAAE,QAAQ,WAAW,EAAE,GAAG,MAAM,GAAG,EAAE;MACpC,CAAA,EACH,EAAE,YACD,kBAAC,KAAD;MAAG,WAAU;gBAA8C,EAAE;MAAc,CAAA,GACzE,KACA;QACN,kBAAC,OAAD;KAAK,WAAU;eAAf,CACE,kBAAC,GAAD;MACE,SAAQ;MACR,WAAW,eAAe,EAAa,EAAE,WAAW;gBAEnD,EAAE,OAAO,aAAa;MACjB,CAAA,EACP,EAAE,YACD,kBAAC,QAAD;MAAM,WAAU;gBACb,EAAe,EAAE,UAAU;MACvB,CAAA,GACL,KACA;OACC;OACN,EA5BI,EAAE,GA4BN,CACL;GACC,CAAA;EAEO,CAAA"}

package/dist/pages/dashboard/widgets/StorageWidget.js

@@ -1,8 +1,10 @@
 import { WidgetWrapper as e } from "../WidgetWrapper.js";
 import { HardDrive as t } from "lucide-react";
 import { jsx as n, jsxs as r } from "react/jsx-runtime";
+import { useUpgradePrompt as i } from "@burdenoff/fe-libs/shared/hooks";
 //#region src/pages/dashboard/widgets/StorageWidget.tsx
-function i(e) {
+var a = 50 * 1024 * 1024, o = 5 * 1024 * 1024 * 1024;
+function s(e) {
 	if (e === 0) return "0 B";
 	let t = 1024, n = [
 		"B",
@@ -13,14 +15,26 @@ function i(e) {
 	], r = Math.floor(Math.log(e) / Math.log(t));
 	return `${parseFloat((e / t ** +r).toFixed(1))} ${n[r]}`;
 }
-function a({ workspaceData: a, isLoading: o }) {
-	let s = a?.storageUsage, c = s?.usedBytes ?? 0, l = s?.totalBytes ?? 0, u = l > 0 ? Math.min(c / l * 100, 100) : 0, d = u > 80 ? "bg-status-error-bg" : u > 60 ? "bg-status-warning-bg" : "bg-status-success-bg";
+function c(e, t) {
+	let n = 1024, r = [
+		"B",
+		"KB",
+		"MB",
+		"GB",
+		"TB"
+	];
+	if (t <= 0) return s(e);
+	let i = Math.min(Math.floor(Math.log(t) / Math.log(n)), r.length - 1), a = e / n ** +i;
+	return `${Number.isInteger(a) ? a.toString() : a.toFixed(1)} ${r[i]}`;
+}
+function l({ workspaceData: l, isLoading: u }) {
+	let { isFree: d } = i({ resource: "storage" }), f = l?.storageUsage, p = d ? a : o, m = f?.usedBytes ?? 0, h = f?.totalBytes && f.totalBytes > 0 ? f.totalBytes : p, g = h > 0 ? Math.min(m / h * 100, 100) : 0, _ = g > 80 ? "bg-status-error-bg" : g > 60 ? "bg-status-warning-bg" : "bg-status-success-bg";
 	return /* @__PURE__ */ n(e, {
 		title: "Storage",
-		icon: /* @__PURE__ */ n(t, { className: "h-4 w-4" }),
+		icon: /* @__PURE__ */ n(t, { className: "size-4" }),
 		size: "small",
-		isLoading: o,
-		children: s ? /* @__PURE__ */ r("div", {
+		isLoading: u,
+		children: /* @__PURE__ */ r("div", {
 			className: "space-y-3",
 			children: [/* @__PURE__ */ r("div", {
 				className: "space-y-1.5",
@@ -28,42 +42,43 @@ function a({ workspaceData: a, isLoading: o }) {
 					/* @__PURE__ */ r("div", {
 						className: "flex justify-between text-xs",
 						children: [/* @__PURE__ */ n("span", {
-							className: "text-muted-foreground",
+							className: "text-text-secondary",
 							children: "Used"
 						}), /* @__PURE__ */ r("span", {
 							className: "font-medium text-text-primary",
-							children: [i(c), l > 0 ? ` / ${i(l)}` : ""]
+							children: [
+								c(m, h),
+								" / ",
+								s(h)
+							]
 						})]
 					}),
 					/* @__PURE__ */ n("div", {
-						className: "h-2 w-full bg-muted rounded-full overflow-hidden",
+						className: "h-2 w-full bg-bg-canvas rounded-full overflow-hidden",
 						children: /* @__PURE__ */ n("div", {
-							className: `h-full rounded-full ${d} transition-all duration-500`,
-							style: { width: `${u}%` }
+							className: `h-full rounded-full ${_} transition-all duration-500`,
+							style: { width: `${g}%` }
 						})
 					}),
 					/* @__PURE__ */ n("p", {
-						className: "text-[11px] text-muted-foreground text-right",
-						children: l > 0 ? `${u.toFixed(1)}% used` : "Limit unavailable"
+						className: "text-[11px] text-text-secondary text-right",
+						children: `${g.toFixed(1)}% used`
 					})
 				]
-			}), s?.fileCount != null && /* @__PURE__ */ r("div", {
+			}), f?.fileCount != null && /* @__PURE__ */ r("div", {
 				className: "flex items-center justify-between text-xs",
 				children: [/* @__PURE__ */ n("span", {
-					className: "text-muted-foreground",
+					className: "text-text-secondary",
 					children: "Total files"
 				}), /* @__PURE__ */ n("span", {
 					className: "font-medium text-text-primary",
-					children: s.fileCount.toLocaleString()
+					children: f.fileCount.toLocaleString()
 				})]
 			})]
-		}) : /* @__PURE__ */ n("p", {
-			className: "text-xs text-muted-foreground",
-			children: "Storage metrics are unavailable."
 		})
 	});
 }
 //#endregion
-export { a as StorageWidget };
+export { l as StorageWidget };
 
 //# sourceMappingURL=StorageWidget.js.map

package/dist/pages/dashboard/widgets/StorageWidget.js.map

@@ -1 +1 @@
-{"version":3,"file":"StorageWidget.js","names":[],"sources":["../../../../src/pages/dashboard/widgets/StorageWidget.tsx"],"sourcesContent":["import { HardDrive } from 'lucide-react';\nimport { WidgetWrapper } from '../WidgetWrapper';\nimport type { WidgetProps } from '../types';\n\nfunction formatBytes(bytes: number): string {\n  if (bytes === 0) return '0 B';\n  const k = 1024;\n  const sizes = ['B', 'KB', 'MB', 'GB', 'TB'];\n  const i = Math.floor(Math.log(bytes) / Math.log(k));\n  return `${parseFloat((bytes / Math.pow(k, i)).toFixed(1))} ${sizes[i]}`;\n}\n\nexport function StorageWidget({ workspaceData, isLoading }: WidgetProps) {\n  const storage = workspaceData?.storageUsage;\n\n  const usedBytes = storage?.usedBytes ?? 0;\n  const totalBytes = storage?.totalBytes ?? 0;\n  const percentage = totalBytes > 0 ? Math.min((usedBytes / totalBytes) * 100, 100) : 0;\n  const barColor =\n    percentage > 80\n      ? 'bg-status-error-bg'\n      : percentage > 60\n        ? 'bg-status-warning-bg'\n        : 'bg-status-success-bg';\n\n  return (\n    <WidgetWrapper\n      title=\"Storage\"\n      icon={<HardDrive className=\"h-4 w-4\" />}\n      size=\"small\"\n      isLoading={isLoading}\n    >\n      {storage ? (\n        <div className=\"space-y-3\">\n          <div className=\"space-y-1.5\">\n            <div className=\"flex justify-between text-xs\">\n              <span className=\"text-muted-foreground\">Used</span>\n              <span className=\"font-medium text-text-primary\">\n                {formatBytes(usedBytes)}\n                {totalBytes > 0 ? ` / ${formatBytes(totalBytes)}` : ''}\n              </span>\n            </div>\n            <div className=\"h-2 w-full bg-muted rounded-full overflow-hidden\">\n              <div\n                className={`h-full rounded-full ${barColor} transition-all duration-500`}\n                style={{ width: `${percentage}%` }}\n              />\n            </div>\n            <p className=\"text-[11px] text-muted-foreground text-right\">\n              {totalBytes > 0 ? `${percentage.toFixed(1)}% used` : 'Limit unavailable'}\n            </p>\n          </div>\n          {storage?.fileCount != null && (\n            <div className=\"flex items-center justify-between text-xs\">\n              <span className=\"text-muted-foreground\">Total files</span>\n              <span className=\"font-medium text-text-primary\">\n                {storage.fileCount.toLocaleString()}\n              </span>\n            </div>\n          )}\n        </div>\n      ) : (\n        <p className=\"text-xs text-muted-foreground\">Storage metrics are unavailable.</p>\n      )}\n    </WidgetWrapper>\n  );\n}\n"],"mappings":";;;;AAIA,SAAS,EAAY,GAAuB;AAC1C,KAAI,MAAU,EAAG,QAAO;CACxB,IAAM,IAAI,MACJ,IAAQ;EAAC;EAAK;EAAM;EAAM;EAAM;EAAK,EACrC,IAAI,KAAK,MAAM,KAAK,IAAI,EAAM,GAAG,KAAK,IAAI,EAAE,CAAC;AACnD,QAAO,GAAG,YAAY,IAAiB,MAAG,GAAI,QAAQ,EAAE,CAAC,CAAC,GAAG,EAAM;;AAGrE,SAAgB,EAAc,EAAE,kBAAe,gBAA0B;CACvE,IAAM,IAAU,GAAe,cAEzB,IAAY,GAAS,aAAa,GAClC,IAAa,GAAS,cAAc,GACpC,IAAa,IAAa,IAAI,KAAK,IAAK,IAAY,IAAc,KAAK,IAAI,GAAG,GAC9E,IACJ,IAAa,KACT,uBACA,IAAa,KACX,yBACA;AAER,QACE,kBAAC,GAAD;EACE,OAAM;EACN,MAAM,kBAAC,GAAD,EAAW,WAAU,WAAY,CAAA;EACvC,MAAK;EACM;YAEV,IACC,kBAAC,OAAD;GAAK,WAAU;aAAf,CACE,kBAAC,OAAD;IAAK,WAAU;cAAf;KACE,kBAAC,OAAD;MAAK,WAAU;gBAAf,CACE,kBAAC,QAAD;OAAM,WAAU;iBAAwB;OAAW,CAAA,EACnD,kBAAC,QAAD;OAAM,WAAU;iBAAhB,CACG,EAAY,EAAU,EACtB,IAAa,IAAI,MAAM,EAAY,EAAW,KAAK,GAC/C;SACH;;KACN,kBAAC,OAAD;MAAK,WAAU;gBACb,kBAAC,OAAD;OACE,WAAW,uBAAuB,EAAS;OAC3C,OAAO,EAAE,OAAO,GAAG,EAAW,IAAI;OAClC,CAAA;MACE,CAAA;KACN,kBAAC,KAAD;MAAG,WAAU;gBACV,IAAa,IAAI,GAAG,EAAW,QAAQ,EAAE,CAAC,UAAU;MACnD,CAAA;KACA;OACL,GAAS,aAAa,QACrB,kBAAC,OAAD;IAAK,WAAU;cAAf,CACE,kBAAC,QAAD;KAAM,WAAU;eAAwB;KAAkB,CAAA,EAC1D,kBAAC,QAAD;KAAM,WAAU;eACb,EAAQ,UAAU,gBAAgB;KAC9B,CAAA,CACH;MAEJ;OAEN,kBAAC,KAAD;GAAG,WAAU;aAAgC;GAAoC,CAAA;EAErE,CAAA"}
+{"version":3,"file":"StorageWidget.js","names":[],"sources":["../../../../src/pages/dashboard/widgets/StorageWidget.tsx"],"sourcesContent":["import { HardDrive } from 'lucide-react';\nimport { useUpgradePrompt } from '@burdenoff/fe-libs/shared/hooks';\nimport { WidgetWrapper } from '../WidgetWrapper';\nimport type { WidgetProps } from '../types';\n\nconst FREE_TIER_TOTAL_BYTES = 50 * 1024 * 1024; // 50 MB\nconst PAID_TIER_TOTAL_BYTES = 5 * 1024 * 1024 * 1024; // 5 GB\n\nfunction formatBytes(bytes: number): string {\n  if (bytes === 0) {\n    // For 0 we want to render the unit the user will see for the total\n    // (e.g. \"0 MB / 50 MB\"), so let the caller pick a unit explicitly.\n    return '0 B';\n  }\n  const k = 1024;\n  const sizes = ['B', 'KB', 'MB', 'GB', 'TB'];\n  const i = Math.floor(Math.log(bytes) / Math.log(k));\n  return `${parseFloat((bytes / Math.pow(k, i)).toFixed(1))} ${sizes[i]}`;\n}\n\n/**\n * Pick the display unit of the *total* so the \"used / total\" line is\n * consistent (e.g. \"0 MB / 50 MB\" not \"0 B / 50 MB\").\n */\nfunction formatBytesAs(bytes: number, totalBytes: number): string {\n  const k = 1024;\n  const sizes = ['B', 'KB', 'MB', 'GB', 'TB'];\n  if (totalBytes <= 0) return formatBytes(bytes);\n  const totalIdx = Math.min(Math.floor(Math.log(totalBytes) / Math.log(k)), sizes.length - 1);\n  const value = bytes / Math.pow(k, totalIdx);\n  // Render as integer when exact (e.g. 0, 50); else one decimal.\n  const rendered = Number.isInteger(value) ? value.toString() : value.toFixed(1);\n  return `${rendered} ${sizes[totalIdx]}`;\n}\n\nexport function StorageWidget({ workspaceData, isLoading }: WidgetProps) {\n  const { isFree } = useUpgradePrompt({ resource: 'storage' });\n  const storage = workspaceData?.storageUsage;\n\n  // Fall back to plan-tier defaults when the backend hasn't reported usage\n  // yet. Storage is core, so \"metrics unavailable\" is not an acceptable UX.\n  const fallbackTotalBytes = isFree ? FREE_TIER_TOTAL_BYTES : PAID_TIER_TOTAL_BYTES;\n  const usedBytes = storage?.usedBytes ?? 0;\n  const totalBytes =\n    storage?.totalBytes && storage.totalBytes > 0 ? storage.totalBytes : fallbackTotalBytes;\n  const percentage = totalBytes > 0 ? Math.min((usedBytes / totalBytes) * 100, 100) : 0;\n  const barColor =\n    percentage > 80\n      ? 'bg-status-error-bg'\n      : percentage > 60\n        ? 'bg-status-warning-bg'\n        : 'bg-status-success-bg';\n\n  return (\n    <WidgetWrapper\n      title=\"Storage\"\n      icon={<HardDrive className=\"size-4\" />}\n      size=\"small\"\n      isLoading={isLoading}\n    >\n      <div className=\"space-y-3\">\n        <div className=\"space-y-1.5\">\n          <div className=\"flex justify-between text-xs\">\n            <span className=\"text-text-secondary\">Used</span>\n            <span className=\"font-medium text-text-primary\">\n              {formatBytesAs(usedBytes, totalBytes)} / {formatBytes(totalBytes)}\n            </span>\n          </div>\n          <div className=\"h-2 w-full bg-bg-canvas rounded-full overflow-hidden\">\n            <div\n              className={`h-full rounded-full ${barColor} transition-all duration-500`}\n              style={{ width: `${percentage}%` }}\n            />\n          </div>\n          <p className=\"text-[11px] text-text-secondary text-right\">\n            {`${percentage.toFixed(1)}% used`}\n          </p>\n        </div>\n        {storage?.fileCount != null && (\n          <div className=\"flex items-center justify-between text-xs\">\n            <span className=\"text-text-secondary\">Total files</span>\n            <span className=\"font-medium text-text-primary\">\n              {storage.fileCount.toLocaleString()}\n            </span>\n          </div>\n        )}\n      </div>\n    </WidgetWrapper>\n  );\n}\n"],"mappings":";;;;;AAKA,IAAM,IAAwB,KAAK,OAAO,MACpC,IAAwB,IAAI,OAAO,OAAO;AAEhD,SAAS,EAAY,GAAuB;AAC1C,KAAI,MAAU,EAGZ,QAAO;CAET,IAAM,IAAI,MACJ,IAAQ;EAAC;EAAK;EAAM;EAAM;EAAM;EAAK,EACrC,IAAI,KAAK,MAAM,KAAK,IAAI,EAAM,GAAG,KAAK,IAAI,EAAE,CAAC;AACnD,QAAO,GAAG,YAAY,IAAiB,MAAG,GAAI,QAAQ,EAAE,CAAC,CAAC,GAAG,EAAM;;AAOrE,SAAS,EAAc,GAAe,GAA4B;CAChE,IAAM,IAAI,MACJ,IAAQ;EAAC;EAAK;EAAM;EAAM;EAAM;EAAK;AAC3C,KAAI,KAAc,EAAG,QAAO,EAAY,EAAM;CAC9C,IAAM,IAAW,KAAK,IAAI,KAAK,MAAM,KAAK,IAAI,EAAW,GAAG,KAAK,IAAI,EAAE,CAAC,EAAE,EAAM,SAAS,EAAE,EACrF,IAAQ,IAAiB,MAAG;AAGlC,QAAO,GADU,OAAO,UAAU,EAAM,GAAG,EAAM,UAAU,GAAG,EAAM,QAAQ,EAAE,CAC3D,GAAG,EAAM;;AAG9B,SAAgB,EAAc,EAAE,kBAAe,gBAA0B;CACvE,IAAM,EAAE,cAAW,EAAiB,EAAE,UAAU,WAAW,CAAC,EACtD,IAAU,GAAe,cAIzB,IAAqB,IAAS,IAAwB,GACtD,IAAY,GAAS,aAAa,GAClC,IACJ,GAAS,cAAc,EAAQ,aAAa,IAAI,EAAQ,aAAa,GACjE,IAAa,IAAa,IAAI,KAAK,IAAK,IAAY,IAAc,KAAK,IAAI,GAAG,GAC9E,IACJ,IAAa,KACT,uBACA,IAAa,KACX,yBACA;AAER,QACE,kBAAC,GAAD;EACE,OAAM;EACN,MAAM,kBAAC,GAAD,EAAW,WAAU,UAAW,CAAA;EACtC,MAAK;EACM;YAEX,kBAAC,OAAD;GAAK,WAAU;aAAf,CACE,kBAAC,OAAD;IAAK,WAAU;cAAf;KACE,kBAAC,OAAD;MAAK,WAAU;gBAAf,CACE,kBAAC,QAAD;OAAM,WAAU;iBAAsB;OAAW,CAAA,EACjD,kBAAC,QAAD;OAAM,WAAU;iBAAhB;QACG,EAAc,GAAW,EAAW;QAAC;QAAI,EAAY,EAAW;QAC5D;SACH;;KACN,kBAAC,OAAD;MAAK,WAAU;gBACb,kBAAC,OAAD;OACE,WAAW,uBAAuB,EAAS;OAC3C,OAAO,EAAE,OAAO,GAAG,EAAW,IAAI;OAClC,CAAA;MACE,CAAA;KACN,kBAAC,KAAD;MAAG,WAAU;gBACV,GAAG,EAAW,QAAQ,EAAE,CAAC;MACxB,CAAA;KACA;OACL,GAAS,aAAa,QACrB,kBAAC,OAAD;IAAK,WAAU;cAAf,CACE,kBAAC,QAAD;KAAM,WAAU;eAAsB;KAAkB,CAAA,EACxD,kBAAC,QAAD;KAAM,WAAU;eACb,EAAQ,UAAU,gBAAgB;KAC9B,CAAA,CACH;MAEJ;;EACQ,CAAA"}

package/dist/pages/dashboard/widgets/TagCloudWidget.js

@@ -17,7 +17,7 @@ function c({ workspaceData: c, isLoading: l, navigate: u }) {
 	let d = c?.tags.items ?? [], f = c?.tags.total ?? 0;
 	return /* @__PURE__ */ r(e, {
 		title: "Tags",
-		icon: /* @__PURE__ */ r(n, { className: "h-4 w-4" }),
+		icon: /* @__PURE__ */ r(n, { className: "size-4" }),
 		size: "small",
 		isLoading: l,
 		unavailable: !c,
@@ -26,7 +26,7 @@ function c({ workspaceData: c, isLoading: l, navigate: u }) {
 			size: "sm",
 			className: "text-xs",
 			onClick: () => u("/tags"),
-			children: /* @__PURE__ */ r(t, { className: "h-3 w-3" })
+			children: /* @__PURE__ */ r(t, { className: "size-3" })
 		}),
 		children: d.length === 0 ? /* @__PURE__ */ r("div", {
 			className: "text-center py-3",

package/dist/pages/dashboard/widgets/TagCloudWidget.js.map

@@ -1 +1 @@
-{"version":3,"file":"TagCloudWidget.js","names":[],"sources":["../../../../src/pages/dashboard/widgets/TagCloudWidget.tsx"],"sourcesContent":["import { Tags, ArrowRight } from 'lucide-react';\nimport { Badge, Button } from '@burdenoff/fe-libs/ui';\nimport { WidgetWrapper } from '../WidgetWrapper';\nimport type { WidgetProps } from '../types';\n\nconst tagColors = [\n  'bg-status-info-bg-subtle text-status-info-text border-border-default',\n  'bg-status-success-bg-subtle text-status-success-text border-border-default',\n  'bg-accent-purple-subtle text-accent-purple border-border-default',\n  'bg-status-warning-bg-subtle text-status-warning-text border-border-default',\n  'bg-accent-pink-subtle text-accent-pink border-border-default',\n  'bg-accent-cyan-subtle text-accent-cyan border-border-default',\n  'bg-accent-orange-subtle text-accent-orange border-border-default',\n  'bg-accent-rose-subtle text-accent-rose border-border-default',\n];\n\nexport function TagCloudWidget({ workspaceData, isLoading, navigate }: WidgetProps) {\n  const tags = workspaceData?.tags.items ?? [];\n  const total = workspaceData?.tags.total ?? 0;\n\n  return (\n    <WidgetWrapper\n      title=\"Tags\"\n      icon={<Tags className=\"h-4 w-4\" />}\n      size=\"small\"\n      isLoading={isLoading}\n      unavailable={!workspaceData}\n      headerAction={\n        <Button variant=\"ghost\" size=\"sm\" className=\"text-xs\" onClick={() => navigate('/tags')}>\n          <ArrowRight className=\"h-3 w-3\" />\n        </Button>\n      }\n    >\n      {tags.length === 0 ? (\n        <div className=\"text-center py-3\">\n          <p className=\"text-xs text-muted-foreground\">No tags created yet</p>\n        </div>\n      ) : (\n        <div className=\"space-y-2\">\n          <div className=\"flex flex-wrap gap-1.5\">\n            {tags.slice(0, 12).map((tag, idx) => (\n              <Badge\n                key={tag.id}\n                variant=\"outline\"\n                className={`text-[11px] cursor-pointer hover:opacity-80 transition-opacity ${tagColors[idx % tagColors.length]}`}\n                onClick={() => navigate('/tags')}\n              >\n                {tag.label}\n              </Badge>\n            ))}\n          </div>\n          {total > 12 && (\n            <p className=\"text-[11px] text-muted-foreground text-center\">+{total - 12} more tags</p>\n          )}\n        </div>\n      )}\n    </WidgetWrapper>\n  );\n}\n"],"mappings":";;;;;AAKA,IAAM,IAAY;CAChB;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACD;AAED,SAAgB,EAAe,EAAE,kBAAe,cAAW,eAAyB;CAClF,IAAM,IAAO,GAAe,KAAK,SAAS,EAAE,EACtC,IAAQ,GAAe,KAAK,SAAS;AAE3C,QACE,kBAAC,GAAD;EACE,OAAM;EACN,MAAM,kBAAC,GAAD,EAAM,WAAU,WAAY,CAAA;EAClC,MAAK;EACM;EACX,aAAa,CAAC;EACd,cACE,kBAAC,GAAD;GAAQ,SAAQ;GAAQ,MAAK;GAAK,WAAU;GAAU,eAAe,EAAS,QAAQ;aACpF,kBAAC,GAAD,EAAY,WAAU,WAAY,CAAA;GAC3B,CAAA;YAGV,EAAK,WAAW,IACf,kBAAC,OAAD;GAAK,WAAU;aACb,kBAAC,KAAD;IAAG,WAAU;cAAgC;IAAuB,CAAA;GAChE,CAAA,GAEN,kBAAC,OAAD;GAAK,WAAU;aAAf,CACE,kBAAC,OAAD;IAAK,WAAU;cACZ,EAAK,MAAM,GAAG,GAAG,CAAC,KAAK,GAAK,MAC3B,kBAAC,GAAD;KAEE,SAAQ;KACR,WAAW,kEAAkE,EAAU,IAAM,EAAU;KACvG,eAAe,EAAS,QAAQ;eAE/B,EAAI;KACC,EAND,EAAI,GAMH,CACR;IACE,CAAA,EACL,IAAQ,MACP,kBAAC,KAAD;IAAG,WAAU;cAAb;KAA6D;KAAE,IAAQ;KAAG;KAAc;MAEtF;;EAEM,CAAA"}
+{"version":3,"file":"TagCloudWidget.js","names":[],"sources":["../../../../src/pages/dashboard/widgets/TagCloudWidget.tsx"],"sourcesContent":["import { Tags, ArrowRight } from 'lucide-react';\nimport { Badge, Button } from '@burdenoff/fe-libs/ui';\nimport { WidgetWrapper } from '../WidgetWrapper';\nimport type { WidgetProps } from '../types';\n\nconst tagColors = [\n  'bg-status-info-bg-subtle text-status-info-text border-border-default',\n  'bg-status-success-bg-subtle text-status-success-text border-border-default',\n  'bg-accent-purple-subtle text-accent-purple border-border-default',\n  'bg-status-warning-bg-subtle text-status-warning-text border-border-default',\n  'bg-accent-pink-subtle text-accent-pink border-border-default',\n  'bg-accent-cyan-subtle text-accent-cyan border-border-default',\n  'bg-accent-orange-subtle text-accent-orange border-border-default',\n  'bg-accent-rose-subtle text-accent-rose border-border-default',\n];\n\nexport function TagCloudWidget({ workspaceData, isLoading, navigate }: WidgetProps) {\n  const tags = workspaceData?.tags.items ?? [];\n  const total = workspaceData?.tags.total ?? 0;\n\n  return (\n    <WidgetWrapper\n      title=\"Tags\"\n      icon={<Tags className=\"size-4\" />}\n      size=\"small\"\n      isLoading={isLoading}\n      unavailable={!workspaceData}\n      headerAction={\n        <Button variant=\"ghost\" size=\"sm\" className=\"text-xs\" onClick={() => navigate('/tags')}>\n          <ArrowRight className=\"size-3\" />\n        </Button>\n      }\n    >\n      {tags.length === 0 ? (\n        <div className=\"text-center py-3\">\n          <p className=\"text-xs text-muted-foreground\">No tags created yet</p>\n        </div>\n      ) : (\n        <div className=\"space-y-2\">\n          <div className=\"flex flex-wrap gap-1.5\">\n            {tags.slice(0, 12).map((tag, idx) => (\n              <Badge\n                key={tag.id}\n                variant=\"outline\"\n                className={`text-[11px] cursor-pointer hover:opacity-80 transition-opacity ${tagColors[idx % tagColors.length]}`}\n                onClick={() => navigate('/tags')}\n              >\n                {tag.label}\n              </Badge>\n            ))}\n          </div>\n          {total > 12 && (\n            <p className=\"text-[11px] text-muted-foreground text-center\">+{total - 12} more tags</p>\n          )}\n        </div>\n      )}\n    </WidgetWrapper>\n  );\n}\n"],"mappings":";;;;;AAKA,IAAM,IAAY;CAChB;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACD;AAED,SAAgB,EAAe,EAAE,kBAAe,cAAW,eAAyB;CAClF,IAAM,IAAO,GAAe,KAAK,SAAS,EAAE,EACtC,IAAQ,GAAe,KAAK,SAAS;AAE3C,QACE,kBAAC,GAAD;EACE,OAAM;EACN,MAAM,kBAAC,GAAD,EAAM,WAAU,UAAW,CAAA;EACjC,MAAK;EACM;EACX,aAAa,CAAC;EACd,cACE,kBAAC,GAAD;GAAQ,SAAQ;GAAQ,MAAK;GAAK,WAAU;GAAU,eAAe,EAAS,QAAQ;aACpF,kBAAC,GAAD,EAAY,WAAU,UAAW,CAAA;GAC1B,CAAA;YAGV,EAAK,WAAW,IACf,kBAAC,OAAD;GAAK,WAAU;aACb,kBAAC,KAAD;IAAG,WAAU;cAAgC;IAAuB,CAAA;GAChE,CAAA,GAEN,kBAAC,OAAD;GAAK,WAAU;aAAf,CACE,kBAAC,OAAD;IAAK,WAAU;cACZ,EAAK,MAAM,GAAG,GAAG,CAAC,KAAK,GAAK,MAC3B,kBAAC,GAAD;KAEE,SAAQ;KACR,WAAW,kEAAkE,EAAU,IAAM,EAAU;KACvG,eAAe,EAAS,QAAQ;eAE/B,EAAI;KACC,EAND,EAAI,GAMH,CACR;IACE,CAAA,EACL,IAAQ,MACP,kBAAC,KAAD;IAAG,WAAU;cAAb;KAA6D;KAAE,IAAQ;KAAG;KAAc;MAEtF;;EAEM,CAAA"}

package/dist/pages/dashboard/widgets/TipsWidget.js

@@ -1,67 +1,126 @@
 import { WidgetWrapper as e } from "../WidgetWrapper.js";
-import { BookOpen as t, ExternalLink as n, Lightbulb as r, Rocket as i, Shield as a, Workflow as o } from "lucide-react";
-import { jsx as s, jsxs as c } from "react/jsx-runtime";
+import { BookOpen as t, ExternalLink as n, Lightbulb as r, Newspaper as i, Puzzle as a, Rocket as o, Shield as s, Sparkles as c, Users as l, Workflow as u } from "lucide-react";
+import { jsx as d, jsxs as f } from "react/jsx-runtime";
 //#region src/pages/dashboard/widgets/TipsWidget.tsx
-var l = [
+var p = [
+	{
+		icon: t,
+		title: "Read the docs",
+		description: "Guides, references, and tutorials at docs.vibecontrols.com.",
+		href: "https://docs.vibecontrols.com",
+		external: !0,
+		color: "text-accent-blue"
+	},
+	{
+		icon: l,
+		title: "Join the community",
+		description: "Ask questions, share workflows, and chat with the team.",
+		href: "https://community.vibecontrols.com",
+		external: !0,
+		color: "text-accent-purple"
+	},
+	{
+		icon: a,
+		title: "Browse plugins",
+		description: "50+ plugins for terminals, AI, tunnels, sandboxes, and more.",
+		href: "/vibecontrols/plugins",
+		color: "text-status-success-text"
+	},
 	{
 		icon: i,
+		title: "Latest from the blog",
+		description: "Product updates, deep dives, and engineering posts.",
+		href: "https://vibecontrols.com/blog",
+		external: !0,
+		color: "text-status-warning-text"
+	},
+	{
+		icon: c,
+		title: "Feature previews",
+		description: "Try opt-in features before they ship to everyone.",
+		href: "/feature-previews",
+		color: "text-accent-pink"
+	}
+], m = [
+	{
+		icon: o,
 		title: "Create your first workspace",
 		description: "Organize your team with a dedicated workspace.",
-		path: "/workspaces/list",
+		href: "/workspaces/list",
 		color: "text-accent-blue"
 	},
 	{
-		icon: o,
+		icon: u,
 		title: "Automate with workflows",
 		description: "Build automation workflows to streamline your processes.",
-		path: "/workflows",
+		href: "/workflows",
 		color: "text-status-success-text"
 	},
 	{
-		icon: a,
+		icon: s,
 		title: "Set up permissions",
 		description: "Configure role-based access for your workspace members.",
-		path: "/rbac",
+		href: "/rbac",
 		color: "text-accent-purple"
 	},
 	{
 		icon: t,
 		title: "Explore the API",
 		description: "Check out our developer portal for API documentation.",
-		path: "/devportal",
+		href: "/devportal",
 		color: "text-status-warning-text"
 	}
 ];
-function u({ navigate: t, isLoading: i }) {
-	return /* @__PURE__ */ s(e, {
+function h(e) {
+	return e === "vibecontrols" ? p : m;
+}
+function g({ navigate: t, isLoading: i, productId: a }) {
+	let o = h(a);
+	return /* @__PURE__ */ d(e, {
 		title: "Tips & Resources",
-		icon: /* @__PURE__ */ s(r, { className: "h-4 w-4" }),
+		icon: /* @__PURE__ */ d(r, { className: "size-4" }),
 		size: "small",
 		isLoading: i,
-		children: /* @__PURE__ */ s("div", {
+		children: /* @__PURE__ */ d("div", {
 			className: "space-y-2",
-			children: l.map((e) => /* @__PURE__ */ c("div", {
-				className: "flex items-start gap-2 p-1.5 rounded hover:bg-accent/5 cursor-pointer transition-colors",
-				onClick: () => t(e.path),
+			children: o.map((e) => e.external ? /* @__PURE__ */ f("a", {
+				href: e.href,
+				target: "_blank",
+				rel: "noopener noreferrer",
+				className: "w-full flex items-start gap-2 p-1.5 rounded hover:bg-accent/5 transition-colors text-left",
 				children: [
-					/* @__PURE__ */ s(e.icon, { className: `h-4 w-4 mt-0.5 shrink-0 ${e.color}` }),
-					/* @__PURE__ */ c("div", {
+					/* @__PURE__ */ d(e.icon, { className: `size-4 mt-0.5 shrink-0 ${e.color}` }),
+					/* @__PURE__ */ f("div", {
 						className: "min-w-0",
-						children: [/* @__PURE__ */ s("p", {
+						children: [/* @__PURE__ */ d("p", {
 							className: "text-xs font-medium text-text-primary leading-tight",
 							children: e.title
-						}), /* @__PURE__ */ s("p", {
+						}), /* @__PURE__ */ d("p", {
 							className: "text-[11px] text-muted-foreground leading-tight mt-0.5",
 							children: e.description
 						})]
 					}),
-					/* @__PURE__ */ s(n, { className: "h-3 w-3 text-muted-foreground shrink-0 mt-0.5" })
+					/* @__PURE__ */ d(n, { className: "size-3 text-muted-foreground shrink-0 mt-0.5" })
 				]
+			}, e.title) : /* @__PURE__ */ f("button", {
+				type: "button",
+				className: "w-full flex items-start gap-2 p-1.5 rounded hover:bg-accent/5 cursor-pointer transition-colors text-left",
+				onClick: () => t(e.href),
+				children: [/* @__PURE__ */ d(e.icon, { className: `size-4 mt-0.5 shrink-0 ${e.color}` }), /* @__PURE__ */ f("div", {
+					className: "min-w-0",
+					children: [/* @__PURE__ */ d("p", {
+						className: "text-xs font-medium text-text-primary leading-tight",
+						children: e.title
+					}), /* @__PURE__ */ d("p", {
+						className: "text-[11px] text-muted-foreground leading-tight mt-0.5",
+						children: e.description
+					})]
+				})]
 			}, e.title))
 		})
 	});
 }
 //#endregion
-export { u as TipsWidget };
+export { g as TipsWidget };
 
 //# sourceMappingURL=TipsWidget.js.map

package/dist/pages/dashboard/widgets/TipsWidget.js.map

@@ -1 +1 @@
-{"version":3,"file":"TipsWidget.js","names":[],"sources":["../../../../src/pages/dashboard/widgets/TipsWidget.tsx"],"sourcesContent":["import { Lightbulb, ExternalLink, BookOpen, Rocket, Shield, Workflow } from 'lucide-react';\nimport { WidgetWrapper } from '../WidgetWrapper';\nimport type { WidgetProps } from '../types';\n\nconst TIPS = [\n  {\n    icon: Rocket,\n    title: 'Create your first workspace',\n    description: 'Organize your team with a dedicated workspace.',\n    path: '/workspaces/list',\n    color: 'text-accent-blue',\n  },\n  {\n    icon: Workflow,\n    title: 'Automate with workflows',\n    description: 'Build automation workflows to streamline your processes.',\n    path: '/workflows',\n    color: 'text-status-success-text',\n  },\n  {\n    icon: Shield,\n    title: 'Set up permissions',\n    description: 'Configure role-based access for your workspace members.',\n    path: '/rbac',\n    color: 'text-accent-purple',\n  },\n  {\n    icon: BookOpen,\n    title: 'Explore the API',\n    description: 'Check out our developer portal for API documentation.',\n    path: '/devportal',\n    color: 'text-status-warning-text',\n  },\n];\n\nexport function TipsWidget({ navigate, isLoading }: WidgetProps) {\n  return (\n    <WidgetWrapper\n      title=\"Tips & Resources\"\n      icon={<Lightbulb className=\"h-4 w-4\" />}\n      size=\"small\"\n      isLoading={isLoading}\n    >\n      <div className=\"space-y-2\">\n        {TIPS.map((tip) => (\n          <div\n            key={tip.title}\n            className=\"flex items-start gap-2 p-1.5 rounded hover:bg-accent/5 cursor-pointer transition-colors\"\n            onClick={() => navigate(tip.path)}\n          >\n            <tip.icon className={`h-4 w-4 mt-0.5 shrink-0 ${tip.color}`} />\n            <div className=\"min-w-0\">\n              <p className=\"text-xs font-medium text-text-primary leading-tight\">{tip.title}</p>\n              <p className=\"text-[11px] text-muted-foreground leading-tight mt-0.5\">\n                {tip.description}\n              </p>\n            </div>\n            <ExternalLink className=\"h-3 w-3 text-muted-foreground shrink-0 mt-0.5\" />\n          </div>\n        ))}\n      </div>\n    </WidgetWrapper>\n  );\n}\n"],"mappings":";;;;AAIA,IAAM,IAAO;CACX;EACE,MAAM;EACN,OAAO;EACP,aAAa;EACb,MAAM;EACN,OAAO;EACR;CACD;EACE,MAAM;EACN,OAAO;EACP,aAAa;EACb,MAAM;EACN,OAAO;EACR;CACD;EACE,MAAM;EACN,OAAO;EACP,aAAa;EACb,MAAM;EACN,OAAO;EACR;CACD;EACE,MAAM;EACN,OAAO;EACP,aAAa;EACb,MAAM;EACN,OAAO;EACR;CACF;AAED,SAAgB,EAAW,EAAE,aAAU,gBAA0B;AAC/D,QACE,kBAAC,GAAD;EACE,OAAM;EACN,MAAM,kBAAC,GAAD,EAAW,WAAU,WAAY,CAAA;EACvC,MAAK;EACM;YAEX,kBAAC,OAAD;GAAK,WAAU;aACZ,EAAK,KAAK,MACT,kBAAC,OAAD;IAEE,WAAU;IACV,eAAe,EAAS,EAAI,KAAK;cAHnC;KAKE,kBAAC,EAAI,MAAL,EAAU,WAAW,2BAA2B,EAAI,SAAW,CAAA;KAC/D,kBAAC,OAAD;MAAK,WAAU;gBAAf,CACE,kBAAC,KAAD;OAAG,WAAU;iBAAuD,EAAI;OAAU,CAAA,EAClF,kBAAC,KAAD;OAAG,WAAU;iBACV,EAAI;OACH,CAAA,CACA;;KACN,kBAAC,GAAD,EAAc,WAAU,iDAAkD,CAAA;KACtE;MAZC,EAAI,MAYL,CACN;GACE,CAAA;EACQ,CAAA"}
+{"version":3,"file":"TipsWidget.js","names":[],"sources":["../../../../src/pages/dashboard/widgets/TipsWidget.tsx"],"sourcesContent":["import type { LucideIcon } from 'lucide-react';\nimport {\n  Lightbulb,\n  ExternalLink,\n  BookOpen,\n  Rocket,\n  Shield,\n  Workflow,\n  Users,\n  Puzzle,\n  Newspaper,\n  Sparkles,\n} from 'lucide-react';\nimport { WidgetWrapper } from '../WidgetWrapper';\nimport type { WidgetProps } from '../types';\n\ninterface Tip {\n  icon: LucideIcon;\n  title: string;\n  description: string;\n  href: string;\n  external?: boolean;\n  color: string;\n}\n\nconst VIBECONTROLS_TIPS: Tip[] = [\n  {\n    icon: BookOpen,\n    title: 'Read the docs',\n    description: 'Guides, references, and tutorials at docs.vibecontrols.com.',\n    href: 'https://docs.vibecontrols.com',\n    external: true,\n    color: 'text-accent-blue',\n  },\n  {\n    icon: Users,\n    title: 'Join the community',\n    description: 'Ask questions, share workflows, and chat with the team.',\n    href: 'https://community.vibecontrols.com',\n    external: true,\n    color: 'text-accent-purple',\n  },\n  {\n    icon: Puzzle,\n    title: 'Browse plugins',\n    description: '50+ plugins for terminals, AI, tunnels, sandboxes, and more.',\n    href: '/vibecontrols/plugins',\n    color: 'text-status-success-text',\n  },\n  {\n    icon: Newspaper,\n    title: 'Latest from the blog',\n    description: 'Product updates, deep dives, and engineering posts.',\n    href: 'https://vibecontrols.com/blog',\n    external: true,\n    color: 'text-status-warning-text',\n  },\n  {\n    icon: Sparkles,\n    title: 'Feature previews',\n    description: 'Try opt-in features before they ship to everyone.',\n    href: '/feature-previews',\n    color: 'text-accent-pink',\n  },\n];\n\nconst WORKSPACES_TIPS: Tip[] = [\n  {\n    icon: Rocket,\n    title: 'Create your first workspace',\n    description: 'Organize your team with a dedicated workspace.',\n    href: '/workspaces/list',\n    color: 'text-accent-blue',\n  },\n  {\n    icon: Workflow,\n    title: 'Automate with workflows',\n    description: 'Build automation workflows to streamline your processes.',\n    href: '/workflows',\n    color: 'text-status-success-text',\n  },\n  {\n    icon: Shield,\n    title: 'Set up permissions',\n    description: 'Configure role-based access for your workspace members.',\n    href: '/rbac',\n    color: 'text-accent-purple',\n  },\n  {\n    icon: BookOpen,\n    title: 'Explore the API',\n    description: 'Check out our developer portal for API documentation.',\n    href: '/devportal',\n    color: 'text-status-warning-text',\n  },\n];\n\nfunction pickTips(productId?: string): Tip[] {\n  if (productId === 'vibecontrols') return VIBECONTROLS_TIPS;\n  return WORKSPACES_TIPS;\n}\n\nexport function TipsWidget({ navigate, isLoading, productId }: WidgetProps) {\n  const tips = pickTips(productId);\n\n  return (\n    <WidgetWrapper\n      title=\"Tips & Resources\"\n      icon={<Lightbulb className=\"size-4\" />}\n      size=\"small\"\n      isLoading={isLoading}\n    >\n      <div className=\"space-y-2\">\n        {tips.map((tip) =>\n          tip.external ? (\n            <a\n              key={tip.title}\n              href={tip.href}\n              target=\"_blank\"\n              rel=\"noopener noreferrer\"\n              className=\"w-full flex items-start gap-2 p-1.5 rounded hover:bg-accent/5 transition-colors text-left\"\n            >\n              <tip.icon className={`size-4 mt-0.5 shrink-0 ${tip.color}`} />\n              <div className=\"min-w-0\">\n                <p className=\"text-xs font-medium text-text-primary leading-tight\">{tip.title}</p>\n                <p className=\"text-[11px] text-muted-foreground leading-tight mt-0.5\">\n                  {tip.description}\n                </p>\n              </div>\n              <ExternalLink className=\"size-3 text-muted-foreground shrink-0 mt-0.5\" />\n            </a>\n          ) : (\n            <button\n              key={tip.title}\n              type=\"button\"\n              className=\"w-full flex items-start gap-2 p-1.5 rounded hover:bg-accent/5 cursor-pointer transition-colors text-left\"\n              onClick={() => navigate(tip.href)}\n            >\n              <tip.icon className={`size-4 mt-0.5 shrink-0 ${tip.color}`} />\n              <div className=\"min-w-0\">\n                <p className=\"text-xs font-medium text-text-primary leading-tight\">{tip.title}</p>\n                <p className=\"text-[11px] text-muted-foreground leading-tight mt-0.5\">\n                  {tip.description}\n                </p>\n              </div>\n            </button>\n          )\n        )}\n      </div>\n    </WidgetWrapper>\n  );\n}\n"],"mappings":";;;;AAyBA,IAAM,IAA2B;CAC/B;EACE,MAAM;EACN,OAAO;EACP,aAAa;EACb,MAAM;EACN,UAAU;EACV,OAAO;EACR;CACD;EACE,MAAM;EACN,OAAO;EACP,aAAa;EACb,MAAM;EACN,UAAU;EACV,OAAO;EACR;CACD;EACE,MAAM;EACN,OAAO;EACP,aAAa;EACb,MAAM;EACN,OAAO;EACR;CACD;EACE,MAAM;EACN,OAAO;EACP,aAAa;EACb,MAAM;EACN,UAAU;EACV,OAAO;EACR;CACD;EACE,MAAM;EACN,OAAO;EACP,aAAa;EACb,MAAM;EACN,OAAO;EACR;CACF,EAEK,IAAyB;CAC7B;EACE,MAAM;EACN,OAAO;EACP,aAAa;EACb,MAAM;EACN,OAAO;EACR;CACD;EACE,MAAM;EACN,OAAO;EACP,aAAa;EACb,MAAM;EACN,OAAO;EACR;CACD;EACE,MAAM;EACN,OAAO;EACP,aAAa;EACb,MAAM;EACN,OAAO;EACR;CACD;EACE,MAAM;EACN,OAAO;EACP,aAAa;EACb,MAAM;EACN,OAAO;EACR;CACF;AAED,SAAS,EAAS,GAA2B;AAE3C,QADI,MAAc,iBAAuB,IAClC;;AAGT,SAAgB,EAAW,EAAE,aAAU,cAAW,gBAA0B;CAC1E,IAAM,IAAO,EAAS,EAAU;AAEhC,QACE,kBAAC,GAAD;EACE,OAAM;EACN,MAAM,kBAAC,GAAD,EAAW,WAAU,UAAW,CAAA;EACtC,MAAK;EACM;YAEX,kBAAC,OAAD;GAAK,WAAU;aACZ,EAAK,KAAK,MACT,EAAI,WACF,kBAAC,KAAD;IAEE,MAAM,EAAI;IACV,QAAO;IACP,KAAI;IACJ,WAAU;cALZ;KAOE,kBAAC,EAAI,MAAL,EAAU,WAAW,0BAA0B,EAAI,SAAW,CAAA;KAC9D,kBAAC,OAAD;MAAK,WAAU;gBAAf,CACE,kBAAC,KAAD;OAAG,WAAU;iBAAuD,EAAI;OAAU,CAAA,EAClF,kBAAC,KAAD;OAAG,WAAU;iBACV,EAAI;OACH,CAAA,CACA;;KACN,kBAAC,GAAD,EAAc,WAAU,gDAAiD,CAAA;KACvE;MAdG,EAAI,MAcP,GAEJ,kBAAC,UAAD;IAEE,MAAK;IACL,WAAU;IACV,eAAe,EAAS,EAAI,KAAK;cAJnC,CAME,kBAAC,EAAI,MAAL,EAAU,WAAW,0BAA0B,EAAI,SAAW,CAAA,EAC9D,kBAAC,OAAD;KAAK,WAAU;eAAf,CACE,kBAAC,KAAD;MAAG,WAAU;gBAAuD,EAAI;MAAU,CAAA,EAClF,kBAAC,KAAD;MAAG,WAAU;gBACV,EAAI;MACH,CAAA,CACA;OACC;MAZF,EAAI,MAYF,CAEZ;GACG,CAAA;EACQ,CAAA"}

package/dist/pages/dashboard/widgets/UpcomingEventsWidget.js

@@ -24,7 +24,7 @@ function l({ workspaceData: l, isLoading: u, navigate: d }) {
 	let f = l?.upcomingEvents ?? [];
 	return /* @__PURE__ */ i(e, {
 		title: "Upcoming Events",
-		icon: /* @__PURE__ */ i(n, { className: "h-4 w-4" }),
+		icon: /* @__PURE__ */ i(n, { className: "size-4" }),
 		size: "medium",
 		isLoading: u,
 		unavailable: !l,
@@ -33,7 +33,7 @@ function l({ workspaceData: l, isLoading: u, navigate: d }) {
 			size: "sm",
 			className: "text-xs",
 			onClick: () => d("/calendar"),
-			children: ["View all ", /* @__PURE__ */ i(t, { className: "ml-1 h-3 w-3" })]
+			children: ["View all ", /* @__PURE__ */ i(t, { className: "ml-1 size-3" })]
 		}),
 		children: f.length === 0 ? /* @__PURE__ */ a("div", {
 			className: "text-center py-4",
@@ -49,13 +49,14 @@ function l({ workspaceData: l, isLoading: u, navigate: d }) {
 			})]
 		}) : /* @__PURE__ */ i("div", {
 			className: "space-y-2",
-			children: f.map((e) => /* @__PURE__ */ a("div", {
-				className: "flex items-start gap-3 p-2 rounded-md hover:bg-accent/5 cursor-pointer transition-colors",
+			children: f.map((e) => /* @__PURE__ */ a("button", {
+				type: "button",
+				className: "w-full flex items-start gap-3 p-2 rounded-md hover:bg-accent/5 cursor-pointer transition-colors text-left",
 				onClick: () => d("/calendar"),
 				children: [
 					/* @__PURE__ */ i("div", {
 						className: "rounded-md bg-accent-pink-subtle text-accent-pink p-1.5 shrink-0",
-						children: /* @__PURE__ */ i(r, { className: "h-3.5 w-3.5" })
+						children: /* @__PURE__ */ i(r, { className: "size-3.5" })
 					}),
 					/* @__PURE__ */ a("div", {
 						className: "min-w-0 flex-1",

package/dist/pages/dashboard/widgets/UpcomingEventsWidget.js.map

@@ -1 +1 @@
-{"version":3,"file":"UpcomingEventsWidget.js","names":[],"sources":["../../../../src/pages/dashboard/widgets/UpcomingEventsWidget.tsx"],"sourcesContent":["import { Calendar, ArrowRight, Clock } from 'lucide-react';\nimport { Badge, Button } from '@burdenoff/fe-libs/ui';\nimport { WidgetWrapper } from '../WidgetWrapper';\nimport type { WidgetProps } from '../types';\n\nfunction formatEventDate(dateStr: string): string {\n  const d = new Date(dateStr);\n  const now = new Date();\n  const isToday = d.toDateString() === now.toDateString();\n  const tomorrow = new Date(now);\n  tomorrow.setDate(tomorrow.getDate() + 1);\n  const isTomorrow = d.toDateString() === tomorrow.toDateString();\n\n  if (isToday)\n    return `Today at ${d.toLocaleTimeString([], { hour: '2-digit', minute: '2-digit' })}`;\n  if (isTomorrow)\n    return `Tomorrow at ${d.toLocaleTimeString([], { hour: '2-digit', minute: '2-digit' })}`;\n  return d.toLocaleDateString([], {\n    month: 'short',\n    day: 'numeric',\n    hour: '2-digit',\n    minute: '2-digit',\n  });\n}\n\nexport function UpcomingEventsWidget({ workspaceData, isLoading, navigate }: WidgetProps) {\n  const events = workspaceData?.upcomingEvents ?? [];\n\n  return (\n    <WidgetWrapper\n      title=\"Upcoming Events\"\n      icon={<Calendar className=\"h-4 w-4\" />}\n      size=\"medium\"\n      isLoading={isLoading}\n      unavailable={!workspaceData}\n      headerAction={\n        <Button variant=\"ghost\" size=\"sm\" className=\"text-xs\" onClick={() => navigate('/calendar')}>\n          View all <ArrowRight className=\"ml-1 h-3 w-3\" />\n        </Button>\n      }\n    >\n      {events.length === 0 ? (\n        <div className=\"text-center py-4\">\n          <p className=\"text-sm text-muted-foreground\">No upcoming events</p>\n          <Button\n            variant=\"outline\"\n            size=\"sm\"\n            className=\"mt-2\"\n            onClick={() => navigate('/calendar')}\n          >\n            Schedule an event\n          </Button>\n        </div>\n      ) : (\n        <div className=\"space-y-2\">\n          {events.map((event) => (\n            <div\n              key={event.id}\n              className=\"flex items-start gap-3 p-2 rounded-md hover:bg-accent/5 cursor-pointer transition-colors\"\n              onClick={() => navigate('/calendar')}\n            >\n              <div className=\"rounded-md bg-accent-pink-subtle text-accent-pink p-1.5 shrink-0\">\n                <Clock className=\"h-3.5 w-3.5\" />\n              </div>\n              <div className=\"min-w-0 flex-1\">\n                <p className=\"text-sm font-medium text-text-primary truncate\">{event.title}</p>\n                <p className=\"text-xs text-muted-foreground\">{formatEventDate(event.startTime)}</p>\n              </div>\n              {event.allDay && (\n                <Badge variant=\"secondary\" className=\"text-[10px] shrink-0\">\n                  All day\n                </Badge>\n              )}\n            </div>\n          ))}\n        </div>\n      )}\n    </WidgetWrapper>\n  );\n}\n"],"mappings":";;;;;AAKA,SAAS,EAAgB,GAAyB;CAChD,IAAM,IAAI,IAAI,KAAK,EAAQ,EACrB,oBAAM,IAAI,MAAM,EAChB,IAAU,EAAE,cAAc,KAAK,EAAI,cAAc,EACjD,IAAW,IAAI,KAAK,EAAI;AAC9B,GAAS,QAAQ,EAAS,SAAS,GAAG,EAAE;CACxC,IAAM,IAAa,EAAE,cAAc,KAAK,EAAS,cAAc;AAM/D,QAJI,IACK,YAAY,EAAE,mBAAmB,EAAE,EAAE;EAAE,MAAM;EAAW,QAAQ;EAAW,CAAC,KACjF,IACK,eAAe,EAAE,mBAAmB,EAAE,EAAE;EAAE,MAAM;EAAW,QAAQ;EAAW,CAAC,KACjF,EAAE,mBAAmB,EAAE,EAAE;EAC9B,OAAO;EACP,KAAK;EACL,MAAM;EACN,QAAQ;EACT,CAAC;;AAGJ,SAAgB,EAAqB,EAAE,kBAAe,cAAW,eAAyB;CACxF,IAAM,IAAS,GAAe,kBAAkB,EAAE;AAElD,QACE,kBAAC,GAAD;EACE,OAAM;EACN,MAAM,kBAAC,GAAD,EAAU,WAAU,WAAY,CAAA;EACtC,MAAK;EACM;EACX,aAAa,CAAC;EACd,cACE,kBAAC,GAAD;GAAQ,SAAQ;GAAQ,MAAK;GAAK,WAAU;GAAU,eAAe,EAAS,YAAY;aAA1F,CAA4F,aACjF,kBAAC,GAAD,EAAY,WAAU,gBAAiB,CAAA,CACzC;;YAGV,EAAO,WAAW,IACjB,kBAAC,OAAD;GAAK,WAAU;aAAf,CACE,kBAAC,KAAD;IAAG,WAAU;cAAgC;IAAsB,CAAA,EACnE,kBAAC,GAAD;IACE,SAAQ;IACR,MAAK;IACL,WAAU;IACV,eAAe,EAAS,YAAY;cACrC;IAEQ,CAAA,CACL;OAEN,kBAAC,OAAD;GAAK,WAAU;aACZ,EAAO,KAAK,MACX,kBAAC,OAAD;IAEE,WAAU;IACV,eAAe,EAAS,YAAY;cAHtC;KAKE,kBAAC,OAAD;MAAK,WAAU;gBACb,kBAAC,GAAD,EAAO,WAAU,eAAgB,CAAA;MAC7B,CAAA;KACN,kBAAC,OAAD;MAAK,WAAU;gBAAf,CACE,kBAAC,KAAD;OAAG,WAAU;iBAAkD,EAAM;OAAU,CAAA,EAC/E,kBAAC,KAAD;OAAG,WAAU;iBAAiC,EAAgB,EAAM,UAAU;OAAK,CAAA,CAC/E;;KACL,EAAM,UACL,kBAAC,GAAD;MAAO,SAAQ;MAAY,WAAU;gBAAuB;MAEpD,CAAA;KAEN;MAhBC,EAAM,GAgBP,CACN;GACE,CAAA;EAEM,CAAA"}
+{"version":3,"file":"UpcomingEventsWidget.js","names":[],"sources":["../../../../src/pages/dashboard/widgets/UpcomingEventsWidget.tsx"],"sourcesContent":["import { Calendar, ArrowRight, Clock } from 'lucide-react';\nimport { Badge, Button } from '@burdenoff/fe-libs/ui';\nimport { WidgetWrapper } from '../WidgetWrapper';\nimport type { WidgetProps } from '../types';\n\nfunction formatEventDate(dateStr: string): string {\n  const d = new Date(dateStr);\n  const now = new Date();\n  const isToday = d.toDateString() === now.toDateString();\n  const tomorrow = new Date(now);\n  tomorrow.setDate(tomorrow.getDate() + 1);\n  const isTomorrow = d.toDateString() === tomorrow.toDateString();\n\n  if (isToday)\n    return `Today at ${d.toLocaleTimeString([], { hour: '2-digit', minute: '2-digit' })}`;\n  if (isTomorrow)\n    return `Tomorrow at ${d.toLocaleTimeString([], { hour: '2-digit', minute: '2-digit' })}`;\n  return d.toLocaleDateString([], {\n    month: 'short',\n    day: 'numeric',\n    hour: '2-digit',\n    minute: '2-digit',\n  });\n}\n\nexport function UpcomingEventsWidget({ workspaceData, isLoading, navigate }: WidgetProps) {\n  const events = workspaceData?.upcomingEvents ?? [];\n\n  return (\n    <WidgetWrapper\n      title=\"Upcoming Events\"\n      icon={<Calendar className=\"size-4\" />}\n      size=\"medium\"\n      isLoading={isLoading}\n      unavailable={!workspaceData}\n      headerAction={\n        <Button variant=\"ghost\" size=\"sm\" className=\"text-xs\" onClick={() => navigate('/calendar')}>\n          View all <ArrowRight className=\"ml-1 size-3\" />\n        </Button>\n      }\n    >\n      {events.length === 0 ? (\n        <div className=\"text-center py-4\">\n          <p className=\"text-sm text-muted-foreground\">No upcoming events</p>\n          <Button\n            variant=\"outline\"\n            size=\"sm\"\n            className=\"mt-2\"\n            onClick={() => navigate('/calendar')}\n          >\n            Schedule an event\n          </Button>\n        </div>\n      ) : (\n        <div className=\"space-y-2\">\n          {events.map((event) => (\n            <button\n              key={event.id}\n              type=\"button\"\n              className=\"w-full flex items-start gap-3 p-2 rounded-md hover:bg-accent/5 cursor-pointer transition-colors text-left\"\n              onClick={() => navigate('/calendar')}\n            >\n              <div className=\"rounded-md bg-accent-pink-subtle text-accent-pink p-1.5 shrink-0\">\n                <Clock className=\"size-3.5\" />\n              </div>\n              <div className=\"min-w-0 flex-1\">\n                <p className=\"text-sm font-medium text-text-primary truncate\">{event.title}</p>\n                <p className=\"text-xs text-muted-foreground\">{formatEventDate(event.startTime)}</p>\n              </div>\n              {event.allDay && (\n                <Badge variant=\"secondary\" className=\"text-[10px] shrink-0\">\n                  All day\n                </Badge>\n              )}\n            </button>\n          ))}\n        </div>\n      )}\n    </WidgetWrapper>\n  );\n}\n"],"mappings":";;;;;AAKA,SAAS,EAAgB,GAAyB;CAChD,IAAM,IAAI,IAAI,KAAK,EAAQ,EACrB,oBAAM,IAAI,MAAM,EAChB,IAAU,EAAE,cAAc,KAAK,EAAI,cAAc,EACjD,IAAW,IAAI,KAAK,EAAI;AAC9B,GAAS,QAAQ,EAAS,SAAS,GAAG,EAAE;CACxC,IAAM,IAAa,EAAE,cAAc,KAAK,EAAS,cAAc;AAM/D,QAJI,IACK,YAAY,EAAE,mBAAmB,EAAE,EAAE;EAAE,MAAM;EAAW,QAAQ;EAAW,CAAC,KACjF,IACK,eAAe,EAAE,mBAAmB,EAAE,EAAE;EAAE,MAAM;EAAW,QAAQ;EAAW,CAAC,KACjF,EAAE,mBAAmB,EAAE,EAAE;EAC9B,OAAO;EACP,KAAK;EACL,MAAM;EACN,QAAQ;EACT,CAAC;;AAGJ,SAAgB,EAAqB,EAAE,kBAAe,cAAW,eAAyB;CACxF,IAAM,IAAS,GAAe,kBAAkB,EAAE;AAElD,QACE,kBAAC,GAAD;EACE,OAAM;EACN,MAAM,kBAAC,GAAD,EAAU,WAAU,UAAW,CAAA;EACrC,MAAK;EACM;EACX,aAAa,CAAC;EACd,cACE,kBAAC,GAAD;GAAQ,SAAQ;GAAQ,MAAK;GAAK,WAAU;GAAU,eAAe,EAAS,YAAY;aAA1F,CAA4F,aACjF,kBAAC,GAAD,EAAY,WAAU,eAAgB,CAAA,CACxC;;YAGV,EAAO,WAAW,IACjB,kBAAC,OAAD;GAAK,WAAU;aAAf,CACE,kBAAC,KAAD;IAAG,WAAU;cAAgC;IAAsB,CAAA,EACnE,kBAAC,GAAD;IACE,SAAQ;IACR,MAAK;IACL,WAAU;IACV,eAAe,EAAS,YAAY;cACrC;IAEQ,CAAA,CACL;OAEN,kBAAC,OAAD;GAAK,WAAU;aACZ,EAAO,KAAK,MACX,kBAAC,UAAD;IAEE,MAAK;IACL,WAAU;IACV,eAAe,EAAS,YAAY;cAJtC;KAME,kBAAC,OAAD;MAAK,WAAU;gBACb,kBAAC,GAAD,EAAO,WAAU,YAAa,CAAA;MAC1B,CAAA;KACN,kBAAC,OAAD;MAAK,WAAU;gBAAf,CACE,kBAAC,KAAD;OAAG,WAAU;iBAAkD,EAAM;OAAU,CAAA,EAC/E,kBAAC,KAAD;OAAG,WAAU;iBAAiC,EAAgB,EAAM,UAAU;OAAK,CAAA,CAC/E;;KACL,EAAM,UACL,kBAAC,GAAD;MAAO,SAAQ;MAAY,WAAU;gBAAuB;MAEpD,CAAA;KAEH;MAjBF,EAAM,GAiBJ,CACT;GACE,CAAA;EAEM,CAAA"}

package/dist/pages/dashboard/widgets/VibesWidget.js

@@ -0,0 +1,64 @@
+import { WidgetWrapper as e } from "../WidgetWrapper.js";
+import { ArrowRight as t, Plus as n, Sparkles as r } from "lucide-react";
+import { jsx as i, jsxs as a } from "react/jsx-runtime";
+import { Button as o } from "@burdenoff/fe-libs/ui";
+//#region src/pages/dashboard/widgets/VibesWidget.tsx
+function s(e) {
+	let t = Date.now() - new Date(e).getTime(), n = Math.floor(t / 6e4);
+	if (n < 1) return "just now";
+	if (n < 60) return `${n}m ago`;
+	let r = Math.floor(n / 60);
+	if (r < 24) return `${r}h ago`;
+	let i = Math.floor(r / 24);
+	return i < 7 ? `${i}d ago` : new Date(e).toLocaleDateString(void 0, {
+		month: "short",
+		day: "numeric"
+	});
+}
+function c({ workspaceData: c, isLoading: l, navigate: u }) {
+	let d = c?.recentVibes ?? [];
+	return /* @__PURE__ */ i(e, {
+		title: "Recent Vibes",
+		icon: /* @__PURE__ */ i(r, { className: "size-4" }),
+		size: "medium",
+		isLoading: l,
+		unavailable: !c,
+		headerAction: /* @__PURE__ */ a(o, {
+			variant: "ghost",
+			size: "sm",
+			className: "text-xs",
+			onClick: () => u("/vibecontrols/vibes"),
+			children: ["View all ", /* @__PURE__ */ i(t, { className: "ml-1 size-3" })]
+		}),
+		children: d.length === 0 ? /* @__PURE__ */ a("div", {
+			className: "text-center py-4",
+			children: [/* @__PURE__ */ i("p", {
+				className: "text-sm text-muted-foreground mb-2",
+				children: "No vibes yet"
+			}), /* @__PURE__ */ a(o, {
+				variant: "outline",
+				size: "sm",
+				onClick: () => u("/vibecontrols/vibes/new"),
+				children: [/* @__PURE__ */ i(n, { className: "mr-1.5 size-3.5" }), " Create your first vibe"]
+			})]
+		}) : /* @__PURE__ */ i("ul", {
+			className: "space-y-1.5",
+			children: d.slice(0, 5).map((e) => /* @__PURE__ */ i("li", { children: /* @__PURE__ */ a("button", {
+				type: "button",
+				onClick: () => u(`/vibecontrols/vibes/${e.id}`),
+				className: "flex w-full items-center justify-between gap-2 rounded-md p-2 text-left transition-colors hover:bg-accent/5",
+				children: [/* @__PURE__ */ i("span", {
+					className: "truncate text-sm font-medium text-text-primary",
+					children: e.name
+				}), /* @__PURE__ */ i("span", {
+					className: "shrink-0 text-[11px] text-muted-foreground",
+					children: s(e.updatedAt)
+				})]
+			}) }, e.id))
+		})
+	});
+}
+//#endregion
+export { c as VibesWidget };
+
+//# sourceMappingURL=VibesWidget.js.map

package/dist/pages/dashboard/widgets/VibesWidget.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"VibesWidget.js","names":[],"sources":["../../../../src/pages/dashboard/widgets/VibesWidget.tsx"],"sourcesContent":["import { Sparkles, ArrowRight, Plus } from 'lucide-react';\nimport { Button } from '@burdenoff/fe-libs/ui';\nimport { WidgetWrapper } from '../WidgetWrapper';\nimport type { WidgetProps } from '../types';\n\nfunction formatRelative(dateString: string): string {\n  const diffMs = Date.now() - new Date(dateString).getTime();\n  const diffMin = Math.floor(diffMs / 60000);\n  if (diffMin < 1) return 'just now';\n  if (diffMin < 60) return `${diffMin}m ago`;\n  const diffHr = Math.floor(diffMin / 60);\n  if (diffHr < 24) return `${diffHr}h ago`;\n  const diffDay = Math.floor(diffHr / 24);\n  if (diffDay < 7) return `${diffDay}d ago`;\n  return new Date(dateString).toLocaleDateString(undefined, {\n    month: 'short',\n    day: 'numeric',\n  });\n}\n\nexport function VibesWidget({ workspaceData, isLoading, navigate }: WidgetProps) {\n  const vibes = workspaceData?.recentVibes ?? [];\n\n  return (\n    <WidgetWrapper\n      title=\"Recent Vibes\"\n      icon={<Sparkles className=\"size-4\" />}\n      size=\"medium\"\n      isLoading={isLoading}\n      unavailable={!workspaceData}\n      headerAction={\n        <Button\n          variant=\"ghost\"\n          size=\"sm\"\n          className=\"text-xs\"\n          onClick={() => navigate('/vibecontrols/vibes')}\n        >\n          View all <ArrowRight className=\"ml-1 size-3\" />\n        </Button>\n      }\n    >\n      {vibes.length === 0 ? (\n        <div className=\"text-center py-4\">\n          <p className=\"text-sm text-muted-foreground mb-2\">No vibes yet</p>\n          <Button variant=\"outline\" size=\"sm\" onClick={() => navigate('/vibecontrols/vibes/new')}>\n            <Plus className=\"mr-1.5 size-3.5\" /> Create your first vibe\n          </Button>\n        </div>\n      ) : (\n        <ul className=\"space-y-1.5\">\n          {vibes.slice(0, 5).map((vibe) => (\n            <li key={vibe.id}>\n              <button\n                type=\"button\"\n                onClick={() => navigate(`/vibecontrols/vibes/${vibe.id}`)}\n                className=\"flex w-full items-center justify-between gap-2 rounded-md p-2 text-left transition-colors hover:bg-accent/5\"\n              >\n                <span className=\"truncate text-sm font-medium text-text-primary\">{vibe.name}</span>\n                <span className=\"shrink-0 text-[11px] text-muted-foreground\">\n                  {formatRelative(vibe.updatedAt)}\n                </span>\n              </button>\n            </li>\n          ))}\n        </ul>\n      )}\n    </WidgetWrapper>\n  );\n}\n"],"mappings":";;;;;AAKA,SAAS,EAAe,GAA4B;CAClD,IAAM,IAAS,KAAK,KAAK,GAAG,IAAI,KAAK,EAAW,CAAC,SAAS,EACpD,IAAU,KAAK,MAAM,IAAS,IAAM;AAC1C,KAAI,IAAU,EAAG,QAAO;AACxB,KAAI,IAAU,GAAI,QAAO,GAAG,EAAQ;CACpC,IAAM,IAAS,KAAK,MAAM,IAAU,GAAG;AACvC,KAAI,IAAS,GAAI,QAAO,GAAG,EAAO;CAClC,IAAM,IAAU,KAAK,MAAM,IAAS,GAAG;AAEvC,QADI,IAAU,IAAU,GAAG,EAAQ,SAC5B,IAAI,KAAK,EAAW,CAAC,mBAAmB,KAAA,GAAW;EACxD,OAAO;EACP,KAAK;EACN,CAAC;;AAGJ,SAAgB,EAAY,EAAE,kBAAe,cAAW,eAAyB;CAC/E,IAAM,IAAQ,GAAe,eAAe,EAAE;AAE9C,QACE,kBAAC,GAAD;EACE,OAAM;EACN,MAAM,kBAAC,GAAD,EAAU,WAAU,UAAW,CAAA;EACrC,MAAK;EACM;EACX,aAAa,CAAC;EACd,cACE,kBAAC,GAAD;GACE,SAAQ;GACR,MAAK;GACL,WAAU;GACV,eAAe,EAAS,sBAAsB;aAJhD,CAKC,aACU,kBAAC,GAAD,EAAY,WAAU,eAAgB,CAAA,CACxC;;YAGV,EAAM,WAAW,IAChB,kBAAC,OAAD;GAAK,WAAU;aAAf,CACE,kBAAC,KAAD;IAAG,WAAU;cAAqC;IAAgB,CAAA,EAClE,kBAAC,GAAD;IAAQ,SAAQ;IAAU,MAAK;IAAK,eAAe,EAAS,0BAA0B;cAAtF,CACE,kBAAC,GAAD,EAAM,WAAU,mBAAoB,CAAA,EAAA,0BAC7B;MACL;OAEN,kBAAC,MAAD;GAAI,WAAU;aACX,EAAM,MAAM,GAAG,EAAE,CAAC,KAAK,MACtB,kBAAC,MAAD,EAAA,UACE,kBAAC,UAAD;IACE,MAAK;IACL,eAAe,EAAS,uBAAuB,EAAK,KAAK;IACzD,WAAU;cAHZ,CAKE,kBAAC,QAAD;KAAM,WAAU;eAAkD,EAAK;KAAY,CAAA,EACnF,kBAAC,QAAD;KAAM,WAAU;eACb,EAAe,EAAK,UAAU;KAC1B,CAAA,CACA;OACN,EAXI,EAAK,GAWT,CACL;GACC,CAAA;EAEO,CAAA"}

package/dist/pages/dashboard/widgets/WelcomeWidget.js

@@ -21,7 +21,7 @@ function l({ workspaceData: l, globalData: u, isLoading: d }) {
 	let f = u?.currentUser, p = f?.firstName || f?.name?.split(" ")[0] || "there", m = (/* @__PURE__ */ new Date()).getHours(), h = m < 12 ? "Good morning" : m < 18 ? "Good afternoon" : "Good evening", g = l?.workspaces.total ?? 0, _ = l?.projects.total ?? 0, v = l?.groups.totalCount ?? 0, y = l?.recentActivities.length ?? 0;
 	return /* @__PURE__ */ o(e, {
 		title: "Dashboard",
-		icon: /* @__PURE__ */ o(i, { className: "h-4 w-4" }),
+		icon: /* @__PURE__ */ o(i, { className: "size-4" }),
 		size: "large",
 		isLoading: d,
 		children: /* @__PURE__ */ s("div", {
@@ -41,22 +41,22 @@ function l({ workspaceData: l, globalData: u, isLoading: d }) {
 				className: "grid grid-cols-2 sm:grid-cols-4 gap-3",
 				children: [
 					/* @__PURE__ */ o(c, {
-						icon: /* @__PURE__ */ o(n, { className: "h-4 w-4" }),
+						icon: /* @__PURE__ */ o(n, { className: "size-4" }),
 						label: "Workspaces",
 						value: g
 					}),
 					/* @__PURE__ */ o(c, {
-						icon: /* @__PURE__ */ o(r, { className: "h-4 w-4" }),
+						icon: /* @__PURE__ */ o(r, { className: "size-4" }),
 						label: "Projects",
 						value: _
 					}),
 					/* @__PURE__ */ o(c, {
-						icon: /* @__PURE__ */ o(a, { className: "h-4 w-4" }),
+						icon: /* @__PURE__ */ o(a, { className: "size-4" }),
 						label: "Groups",
 						value: v
 					}),
 					/* @__PURE__ */ o(c, {
-						icon: /* @__PURE__ */ o(t, { className: "h-4 w-4" }),
+						icon: /* @__PURE__ */ o(t, { className: "size-4" }),
 						label: "Recent Activity",
 						value: y
 					})