npm - @burdenoff/microfe-workspaces - Versions diffs - 2026.802.1 → 2026.829.1 - Mend

@burdenoff/microfe-workspaces 2026.802.1 → 2026.829.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (55) hide show

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

@@ -1,76 +1,92 @@
-import { WidgetWrapper as e } from "../WidgetWrapper.js";
-import { ArrowRight as t, Terminal as n } from "lucide-react";
-import { jsx as r, jsxs as i } from "react/jsx-runtime";
-import { Badge as a, Button as o, IllustratedEmptyState as s } from "@burdenoff/fe-libs/ui";
+import { tWithFallback as e } from "../../../utils/i18n.js";
+import { WidgetWrapper as t } from "../WidgetWrapper.js";
+import { 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, IllustratedEmptyState as c } from "@burdenoff/fe-libs/ui";
+import { useI18n as l } from "@burdenoff/fe-libs/shared/providers/shell/I18nProvider";
 //#region src/pages/dashboard/widgets/SessionsWidget.tsx
-var c = {
+var u = {
 	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"
-}, l = new Set(["RUNNING", "ACTIVE"]);
-function u(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, {
+}, d = new Set(["RUNNING", "ACTIVE"]);
+function f(t, n) {
+	switch (n) {
+		case "RUNNING": return e(t, "dashboard.sessions.statusRunning", "running");
+		case "ACTIVE": return e(t, "dashboard.sessions.statusActive", "active");
+		case "STARTING": return e(t, "dashboard.sessions.statusStarting", "starting");
+		case "STOPPED": return e(t, "dashboard.sessions.statusStopped", "stopped");
+		case "ERROR": return e(t, "dashboard.sessions.statusError", "error");
+		default: return n.toLowerCase();
+	}
+}
+function p(t, n) {
+	if (!n) return "";
+	let r = Date.now() - new Date(n).getTime(), i = Math.floor(r / 6e4);
+	if (i < 1) return e(t, "dashboard.sessions.justNow", "just now");
+	if (i < 60) return e(t, "dashboard.sessions.minutesAgo", "{count}m", { count: i });
+	let a = Math.floor(i / 60);
+	return a < 24 ? e(t, "dashboard.sessions.hoursAgo", "{count}h", { count: a }) : new Date(n).toLocaleDateString(void 0, {
 		month: "short",
 		day: "numeric"
 	});
 }
-function d({ workspaceData: d, isLoading: f, navigate: p }) {
-	let m = d?.activeSessions ?? [];
-	return /* @__PURE__ */ r(e, {
-		title: "Active Sessions",
-		icon: /* @__PURE__ */ r(n, { className: "size-4" }),
+function m({ workspaceData: m, isLoading: h, navigate: g }) {
+	let { t: _ } = l(), v = m?.activeSessions ?? [];
+	return /* @__PURE__ */ i(t, {
+		title: e(_, "dashboard.sessions.title", "Active Sessions"),
+		icon: /* @__PURE__ */ i(r, { className: "size-4" }),
 		size: "medium",
-		isLoading: f,
-		unavailable: !d,
-		headerAction: /* @__PURE__ */ i(o, {
+		isLoading: h,
+		unavailable: !m,
+		headerAction: /* @__PURE__ */ a(s, {
 			variant: "ghost",
 			size: "sm",
 			className: "text-xs",
-			onClick: () => p("/vibecontrols/sessions"),
-			children: ["View all ", /* @__PURE__ */ r(t, { className: "ml-1 size-3" })]
+			onClick: () => g("/vibecontrols/sessions"),
+			children: [
+				e(_, "dashboard.sessions.viewAll", "View all"),
+				" ",
+				/* @__PURE__ */ i(n, { className: "ml-1 size-3" })
+			]
 		}),
-		children: m.length === 0 ? /* @__PURE__ */ r(s, {
+		children: v.length === 0 ? /* @__PURE__ */ i(c, {
 			illustration: "empty-sessions",
-			title: "No active sessions",
+			title: e(_, "dashboard.sessions.emptyTitle", "No active sessions"),
 			className: "py-6"
-		}) : /* @__PURE__ */ r("ul", {
+		}) : /* @__PURE__ */ i("ul", {
 			className: "space-y-1.5",
-			children: m.slice(0, 5).map((e) => /* @__PURE__ */ r("li", { children: /* @__PURE__ */ i("button", {
+			children: v.slice(0, 5).map((t) => /* @__PURE__ */ i("li", { children: /* @__PURE__ */ a("button", {
 				type: "button",
-				onClick: () => p(`/vibecontrols/sessions/${e.id}`),
+				onClick: () => g(`/vibecontrols/sessions/${t.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("div", {
+				children: [/* @__PURE__ */ a("div", {
 					className: "min-w-0 flex-1",
-					children: [/* @__PURE__ */ r("p", {
+					children: [/* @__PURE__ */ i("p", {
 						className: "truncate text-sm font-medium text-text-primary",
-						children: e.name || `Session ${e.id.slice(0, 8)}`
-					}), e.agent?.name ? /* @__PURE__ */ r("p", {
+						children: t.name || e(_, "dashboard.sessions.unnamedSession", "Session {id}", { id: t.id.slice(0, 8) })
+					}), t.agent?.name ? /* @__PURE__ */ i("p", {
 						className: "truncate text-[11px] text-text-secondary",
-						children: e.agent.name
+						children: t.agent.name
 					}) : null]
-				}), /* @__PURE__ */ i("div", {
+				}), /* @__PURE__ */ a("div", {
 					className: "flex flex-col items-end gap-1",
-					children: [/* @__PURE__ */ r(a, {
+					children: [/* @__PURE__ */ i(o, {
 						variant: "outline",
-						className: `text-[10px] ${c[e.status] ?? ""} ${l.has(e.status) ? "motion-safe:animate-vc-glow-pulse" : ""}`,
-						children: e.status.toLowerCase()
-					}), e.startedAt ? /* @__PURE__ */ r("span", {
+						className: `text-[10px] ${u[t.status] ?? ""} ${d.has(t.status) ? "motion-safe:animate-vc-glow-pulse" : ""}`,
+						children: f(_, t.status)
+					}), t.startedAt ? /* @__PURE__ */ i("span", {
 						className: "text-[10px] text-text-secondary",
-						children: u(e.startedAt)
+						children: p(_, t.startedAt)
 					}) : null]
 				})]
-			}) }, e.id))
+			}) }, t.id))
 		})
 	});
 }
 //#endregion
-export { d as SessionsWidget };
+export { m as SessionsWidget };
 //# sourceMappingURL=SessionsWidget.js.map

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

	@@ -1 +1 @@
1	- {"version":3,"file":"SessionsWidget.js","names":[],"sources":["../../../../src/pages/dashboard/widgets/SessionsWidget.tsx"],"sourcesContent":["import { Terminal, ArrowRight } from 'lucide-react';\nimport { Badge, Button, IllustratedEmptyState } 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\n// Live statuses get a subtle opacity pulse (reduced-motion-safe, no movement).\nconst LIVE_STATUSES = new Set(['RUNNING', 'ACTIVE']);\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 <IllustratedEmptyState\n illustration=\"empty-sessions\"\n title~~=\"~~No active sessions\"\n className=\"py-6\"\n />\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.agent?.name ? (\n <p className=\"truncate text-[11px] text-text-secondary\">{s.agent.name}</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 LIVE_STATUSES.has(s.status) ? 'motion-safe:animate-vc-glow-pulse' : ''\n }`}\n >\n {s.status~~.toLowerCase(~~)}\n </Badge>\n {s.startedAt ? (\n <span className=\"text-[10px] text-text-secondary\">\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,EAGK,IAAgB,IAAI,IAAI,CAAC,WAAW,SAAS,CAAC;~~AAEpD~~,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,GAAD;GACE,cAAa;GACb,~~OAAM~~;~~GACN~~,WAAU;GACV,CAAA,GAEF,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,OAAO,OACR,kBAAC,KAAD;MAAG,WAAU;gBAA4C,EAAE,MAAM;MAAS,CAAA,GACxE,KACA;QACN,kBAAC,OAAD;KAAK,WAAU;eAAf,CACE,kBAAC,GAAD;MACE,SAAQ;MACR,WAAW,eAAe,EAAa,EAAE,WAAW,GAAG,GACrD,EAAc,IAAI,EAAE,OAAO,GAAG,sCAAsC;gBAGrE,EAAE,OAAO~~,aAAa~~;~~MACjB~~,CAAA,EACP,EAAE,YACD,kBAAC,QAAD;MAAM,WAAU;gBACb,EAAe,EAAE,UAAU;~~MACvB~~,CAAA,GACL,KACA;OACC;OACN,~~EA9BI~~,EAAE,~~GA8BN~~,CACL;GACC,CAAA;EAEO,CAAA"}
1	+ {"version":3,"file":"SessionsWidget.js","names":[],"sources":["../../../../src/pages/dashboard/widgets/SessionsWidget.tsx"],"sourcesContent":["import { Terminal, ArrowRight } from 'lucide-react';\nimport { Badge, Button, IllustratedEmptyState } from '@burdenoff/fe-libs/ui';\nimport { useI18n } from '@burdenoff/fe-libs/shared/providers/shell/I18nProvider';\nimport type { I18nContextValue } from '@burdenoff/fe-libs/shared/providers/shell';\nimport { WidgetWrapper } from '../WidgetWrapper';\nimport { tWithFallback } from '../../../utils/i18n';\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\n// Live statuses get a subtle opacity pulse (reduced-motion-safe, no movement).\nconst LIVE_STATUSES = new Set(['RUNNING', 'ACTIVE']);\n\n/*\n Badge copy for a session status, resolved through i18n with literal\n * keys — a lookup table would force a computed key, which the key extractor\n * (fluidgrids-app/scripts/extract-i18n-keys.ts) cannot see and the seeder can\n * therefore never ship. Unknown statuses keep the previous behaviour of\n * lower-casing the raw enum value. [BOFF-5997]\n */\nfunction resolveStatusLabel(t: I18nContextValue['t'], status: string): string {\n switch (status) {\n case 'RUNNING':\n return tWithFallback(t, 'dashboard.sessions.statusRunning', 'running');\n case 'ACTIVE':\n return tWithFallback(t, 'dashboard.sessions.statusActive', 'active');\n case 'STARTING':\n return tWithFallback(t, 'dashboard.sessions.statusStarting', 'starting');\n case 'STOPPED':\n return tWithFallback(t, 'dashboard.sessions.statusStopped', 'stopped');\n case 'ERROR':\n return tWithFallback(t, 'dashboard.sessions.statusError', 'error');\n default:\n return status.toLowerCase();\n }\n}\n\nfunction formatRelative(t: I18nContextValue['t'], 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 tWithFallback(t, 'dashboard.sessions.justNow', 'just now');\n if (diffMin < 60)\n return tWithFallback(t, 'dashboard.sessions.minutesAgo', '{count}m', { count: diffMin });\n const diffHr = Math.floor(diffMin / 60);\n if (diffHr < 24)\n return tWithFallback(t, 'dashboard.sessions.hoursAgo', '{count}h', { count: diffHr });\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 { t } = useI18n();\n const sessions = workspaceData?.activeSessions ?? [];\n\n return (\n <WidgetWrapper\n title={tWithFallback(t, 'dashboard.sessions.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 {tWithFallback(t, 'dashboard.sessions.viewAll', 'View all')}{' '}\n <ArrowRight className=\"ml-1 size-3\" />\n </Button>\n }\n >\n {sessions.length === 0 ? (\n <IllustratedEmptyState\n illustration=\"empty-sessions\"\n title={tWithFallback(t, 'dashboard.sessions.emptyTitle', 'No active sessions')}\n className=\"py-6\"\n />\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 \|\|\n tWithFallback(t, 'dashboard.sessions.unnamedSession', 'Session {id}', {\n id: s.id.slice(0, 8),\n })}\n </p>\n {s.agent?.name ? (\n <p className=\"truncate text-[11px] text-text-secondary\">{s.agent.name}</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 LIVE_STATUSES.has(s.status) ? 'motion-safe:animate-vc-glow-pulse' : ''\n }`}\n >\n {resolveStatusLabel(t, s.status)}\n </Badge>\n {s.startedAt ? (\n <span className=\"text-[10px] text-text-secondary\">\n {formatRelative(t, s.startedAt)}\n </span>\n ) : null}\n </div>\n </button>\n </li>\n ))}\n </ul>\n )}\n </WidgetWrapper>\n );\n}\n"],"mappings":"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"}

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

@@ -1,84 +1,82 @@
-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";
+import { tWithFallback as e } from "../../../utils/i18n.js";
+import { WidgetWrapper as t } from "../WidgetWrapper.js";
+import { HardDrive as n } from "lucide-react";
+import { jsx as r, jsxs as i } from "react/jsx-runtime";
+import { useUpgradePrompt as a } from "@burdenoff/fe-libs/shared/hooks";
+import { useI18n as o } from "@burdenoff/fe-libs/shared/providers/shell/I18nProvider";
 //#region src/pages/dashboard/widgets/StorageWidget.tsx
-var a = 50 * 1024 * 1024, o = 5 * 1024 * 1024 * 1024;
-function s(e) {
-	if (e === 0) return "0 B";
-	let t = 1024, n = [
-		"B",
-		"KB",
-		"MB",
-		"GB",
-		"TB"
-	], r = Math.floor(Math.log(e) / Math.log(t));
-	return `${parseFloat((e / t ** +r).toFixed(1))} ${n[r]}`;
-}
-function c(e, t) {
-	let n = 1024, r = [
-		"B",
-		"KB",
-		"MB",
-		"GB",
-		"TB"
+var s = 50 * 1024 * 1024, c = 5 * 1024 * 1024 * 1024;
+function l(t) {
+	return [
+		e(t, "dashboard.storage.unitBytes", "B"),
+		e(t, "dashboard.storage.unitKilobytes", "KB"),
+		e(t, "dashboard.storage.unitMegabytes", "MB"),
+		e(t, "dashboard.storage.unitGigabytes", "GB"),
+		e(t, "dashboard.storage.unitTerabytes", "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: "size-4" }),
+function u(t, n) {
+	if (n === 0) return `0 ${e(t, "dashboard.storage.unitBytes", "B")}`;
+	let r = 1024, i = l(t), a = Math.floor(Math.log(n) / Math.log(r));
+	return `${parseFloat((n / r ** +a).toFixed(1))} ${i[a]}`;
+}
+function d(e, t, n) {
+	let r = 1024, i = l(e);
+	if (n <= 0) return u(e, t);
+	let a = Math.min(Math.floor(Math.log(n) / Math.log(r)), i.length - 1), o = t / r ** +a;
+	return `${Number.isInteger(o) ? o.toString() : o.toFixed(1)} ${i[a]}`;
+}
+function f({ workspaceData: l, isLoading: f }) {
+	let { t: p } = o(), { isFree: m } = a({ resource: "storage" }), h = l?.storageUsage, g = m ? s : c, _ = h?.usedBytes ?? 0, v = h?.totalBytes && h.totalBytes > 0 ? h.totalBytes : g, y = v > 0 ? Math.min(_ / v * 100, 100) : 0, b = y > 80 ? "bg-status-error-bg" : y > 60 ? "bg-status-warning-bg" : "bg-status-success-bg";
+	return /* @__PURE__ */ r(t, {
+		title: e(p, "dashboard.storage.title", "Storage"),
+		icon: /* @__PURE__ */ r(n, { className: "size-4" }),
 		size: "small",
-		isLoading: u,
-		children: /* @__PURE__ */ r("div", {
+		isLoading: f,
+		children: /* @__PURE__ */ i("div", {
 			className: "space-y-3",
-			children: [/* @__PURE__ */ r("div", {
+			children: [/* @__PURE__ */ i("div", {
 				className: "space-y-1.5",
 				children: [
-					/* @__PURE__ */ r("div", {
+					/* @__PURE__ */ i("div", {
 						className: "flex justify-between text-xs",
-						children: [/* @__PURE__ */ n("span", {
+						children: [/* @__PURE__ */ r("span", {
 							className: "text-text-secondary",
-							children: "Used"
+							children: e(p, "dashboard.storage.used", "Used")
 						}), /* @__PURE__ */ r("span", {
 							className: "font-medium text-text-primary",
-							children: [
-								c(m, h),
-								" / ",
-								s(h)
-							]
+							children: e(p, "dashboard.storage.usedOfTotal", "{used} / {total}", {
+								used: d(p, _, v),
+								total: u(p, v)
+							})
 						})]
 					}),
-					/* @__PURE__ */ n("div", {
+					/* @__PURE__ */ r("div", {
 						className: "h-2 w-full bg-bg-canvas rounded-full overflow-hidden",
-						children: /* @__PURE__ */ n("div", {
-							className: `h-full rounded-full ${_} transition-all duration-500`,
-							style: { width: `${g}%` }
+						children: /* @__PURE__ */ r("div", {
+							className: `h-full rounded-full ${b} transition-all duration-500`,
+							style: { width: `${y}%` }
 						})
 					}),
-					/* @__PURE__ */ n("p", {
+					/* @__PURE__ */ r("p", {
 						className: "text-[11px] text-text-secondary text-right",
-						children: `${g.toFixed(1)}% used`
+						children: e(p, "dashboard.storage.percentUsed", "{percent}% used", { percent: y.toFixed(1) })
 					})
 				]
-			}), f?.fileCount != null && /* @__PURE__ */ r("div", {
+			}), h?.fileCount != null && /* @__PURE__ */ i("div", {
 				className: "flex items-center justify-between text-xs",
-				children: [/* @__PURE__ */ n("span", {
+				children: [/* @__PURE__ */ r("span", {
 					className: "text-text-secondary",
-					children: "Total files"
-				}), /* @__PURE__ */ n("span", {
+					children: e(p, "dashboard.storage.totalFiles", "Total files")
+				}), /* @__PURE__ */ r("span", {
 					className: "font-medium text-text-primary",
-					children: f.fileCount.toLocaleString()
+					children: h.fileCount.toLocaleString()
 				})]
 			})]
 		})
 	});
 }
 //#endregion
-export { l as StorageWidget };
+export { f as StorageWidget };
 //# sourceMappingURL=StorageWidget.js.map

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

	@@ -1 +1 @@
1	- {"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"}
1	+ {"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 { useI18n } from '@burdenoff/fe-libs/shared/providers/shell/I18nProvider';\nimport type { I18nContextValue } from '@burdenoff/fe-libs/shared/providers/shell';\nimport { WidgetWrapper } from '../WidgetWrapper';\nimport { tWithFallback } from '../../../utils/i18n';\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\n/*\n Byte-size unit symbols, each translated through a literal key — an array\n * of keys indexed by magnitude would hand the translator a computed key, which\n * the extractor (fluidgrids-app/scripts/extract-i18n-keys.ts) cannot see and\n * the seeder can therefore never ship. Order is load-bearing: the index is the\n * power of 1024. [BOFF-5997]\n /\nfunction byteUnits(t: I18nContextValue['t']): string[] {\n return [\n tWithFallback(t, 'dashboard.storage.unitBytes', 'B'),\n tWithFallback(t, 'dashboard.storage.unitKilobytes', 'KB'),\n tWithFallback(t, 'dashboard.storage.unitMegabytes', 'MB'),\n tWithFallback(t, 'dashboard.storage.unitGigabytes', 'GB'),\n tWithFallback(t, 'dashboard.storage.unitTerabytes', 'TB'),\n ];\n}\n\nfunction formatBytes(t: I18nContextValue['t'], 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 ${tWithFallback(t, 'dashboard.storage.unitBytes', 'B')}`;\n }\n const k = 1024;\n const sizes = byteUnits(t);\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(t: I18nContextValue['t'], bytes: number, totalBytes: number): string {\n const k = 1024;\n const sizes = byteUnits(t);\n if (totalBytes <= 0) return formatBytes(t, 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 { t } = useI18n();\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={tWithFallback(t, 'dashboard.storage.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\">\n {tWithFallback(t, 'dashboard.storage.used', 'Used')}\n </span>\n <span className=\"font-medium text-text-primary\">\n {tWithFallback(t, 'dashboard.storage.usedOfTotal', '{used} / {total}', {\n used: formatBytesAs(t, usedBytes, totalBytes),\n total: formatBytes(t, totalBytes),\n })}\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 {tWithFallback(t, 'dashboard.storage.percentUsed', '{percent}% used', {\n percent: percentage.toFixed(1),\n })}\n </p>\n </div>\n {storage?.fileCount != null && (\n <div className=\"flex items-center justify-between text-xs\">\n <span className=\"text-text-secondary\">\n {tWithFallback(t, 'dashboard.storage.totalFiles', 'Total files')}\n </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":";;;;;;;AAQA,IAAM,IAAwB,KAAK,OAAO,MACpC,IAAwB,IAAI,OAAO,OAAO;AAShD,SAAS,EAAU,GAAoC;AACrD,QAAO;EACL,EAAc,GAAG,+BAA+B,IAAI;EACpD,EAAc,GAAG,mCAAmC,KAAK;EACzD,EAAc,GAAG,mCAAmC,KAAK;EACzD,EAAc,GAAG,mCAAmC,KAAK;EACzD,EAAc,GAAG,mCAAmC,KAAK;EAC1D;;AAGH,SAAS,EAAY,GAA0B,GAAuB;AACpE,KAAI,MAAU,EAGZ,QAAO,KAAK,EAAc,GAAG,+BAA+B,IAAI;CAElE,IAAM,IAAI,MACJ,IAAQ,EAAU,EAAE,EACpB,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,GAA0B,GAAe,GAA4B;CAC1F,IAAM,IAAI,MACJ,IAAQ,EAAU,EAAE;AAC1B,KAAI,KAAc,EAAG,QAAO,EAAY,GAAG,EAAM;CACjD,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,SAAM,GAAS,EACjB,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,OAAO,EAAc,GAAG,2BAA2B,UAAU;EAC7D,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;iBACb,EAAc,GAAG,0BAA0B,OAAO;OAC9C,CAAA,EACP,kBAAC,QAAD;OAAM,WAAU;iBACb,EAAc,GAAG,iCAAiC,oBAAoB;QACrE,MAAM,EAAc,GAAG,GAAW,EAAW;QAC7C,OAAO,EAAY,GAAG,EAAW;QAClC,CAAC;OACG,CAAA,CACH;;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,EAAc,GAAG,iCAAiC,mBAAmB,EACpE,SAAS,EAAW,QAAQ,EAAE,EAC/B,CAAC;MACA,CAAA;KACA;OACL,GAAS,aAAa,QACrB,kBAAC,OAAD;IAAK,WAAU;cAAf,CACE,kBAAC,QAAD;KAAM,WAAU;eACb,EAAc,GAAG,gCAAgC,cAAc;KAC3D,CAAA,EACP,kBAAC,QAAD;KAAM,WAAU;eACb,EAAQ,UAAU,gBAAgB;KAC9B,CAAA,CACH;MAEJ;;EACQ,CAAA"}

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

@@ -1,9 +1,11 @@
-import { WidgetWrapper as e } from "../WidgetWrapper.js";
-import { ArrowRight as t, Tags as n } from "lucide-react";
-import { jsx as r, jsxs as i } from "react/jsx-runtime";
-import { Badge as a, Button as o, IllustratedEmptyState as s } from "@burdenoff/fe-libs/ui";
+import { tWithFallback as e } from "../../../utils/i18n.js";
+import { WidgetWrapper as t } from "../WidgetWrapper.js";
+import { ArrowRight as n, Tags as r } from "lucide-react";
+import { jsx as i, jsxs as a } from "react/jsx-runtime";
+import { Badge as o, Button as s, IllustratedEmptyState as c } from "@burdenoff/fe-libs/ui";
+import { useI18n as l } from "@burdenoff/fe-libs/shared/providers/shell/I18nProvider";
 //#region src/pages/dashboard/widgets/TagCloudWidget.tsx
-var c = [
+var u = [
 	"bg-status-info-bg-subtle text-status-info-text border-border-default",
 	"bg-status-success-bg-subtle text-status-success-text border-border-default",
 	"bg-accent-purple-subtle text-accent-purple border-border-default",
@@ -13,48 +15,44 @@ var c = [
 	"bg-accent-orange-subtle text-accent-orange border-border-default",
 	"bg-accent-rose-subtle text-accent-rose border-border-default"
 ];
-function l({ workspaceData: l, isLoading: u, navigate: d }) {
-	let f = l?.tags.items ?? [], p = l?.tags.total ?? 0;
-	return /* @__PURE__ */ r(e, {
-		title: "Tags",
-		icon: /* @__PURE__ */ r(n, { className: "size-4" }),
+function d({ workspaceData: d, isLoading: f, navigate: p }) {
+	let { t: m } = l(), h = d?.tags.items ?? [], g = d?.tags.total ?? 0;
+	return /* @__PURE__ */ i(t, {
+		title: e(m, "dashboard.tagCloud.title", "Tags"),
+		icon: /* @__PURE__ */ i(r, { className: "size-4" }),
 		size: "small",
-		isLoading: u,
-		unavailable: !l,
-		headerAction: /* @__PURE__ */ r(o, {
+		isLoading: f,
+		unavailable: !d,
+		headerAction: /* @__PURE__ */ i(s, {
 			variant: "ghost",
 			size: "sm",
 			className: "text-xs",
-			onClick: () => d("/tags"),
-			children: /* @__PURE__ */ r(t, { className: "size-3" })
+			onClick: () => p("/tags"),
+			children: /* @__PURE__ */ i(n, { className: "size-3" })
 		}),
-		children: f.length === 0 ? /* @__PURE__ */ r(s, {
+		children: h.length === 0 ? /* @__PURE__ */ i(c, {
 			illustration: "empty-generic",
-			title: "No tags created yet",
-			description: "Tags help you label and filter projects and content across the workspace.",
+			title: e(m, "dashboard.tagCloud.emptyTitle", "No tags created yet"),
+			description: e(m, "dashboard.tagCloud.emptyDescription", "Tags help you label and filter projects and content across the workspace."),
 			className: "py-4"
-		}) : /* @__PURE__ */ i("div", {
+		}) : /* @__PURE__ */ a("div", {
 			className: "space-y-2",
-			children: [/* @__PURE__ */ r("div", {
+			children: [/* @__PURE__ */ i("div", {
 				className: "flex flex-wrap gap-1.5",
-				children: f.slice(0, 12).map((e, t) => /* @__PURE__ */ r(a, {
+				children: h.slice(0, 12).map((e, t) => /* @__PURE__ */ i(o, {
 					variant: "outline",
-					className: `text-[11px] cursor-pointer hover:opacity-80 transition-opacity ${c[t % c.length]}`,
-					onClick: () => d("/tags"),
+					className: `text-[11px] cursor-pointer hover:opacity-80 transition-opacity ${u[t % u.length]}`,
+					onClick: () => p("/tags"),
 					children: e.label
 				}, e.id))
-			}), p > 12 && /* @__PURE__ */ i("p", {
+			}), g > 12 && /* @__PURE__ */ i("p", {
 				className: "text-[11px] text-text-secondary text-center",
-				children: [
-					"+",
-					p - 12,
-					" more tags"
-				]
+				children: e(m, "dashboard.tagCloud.more", "+{count} more tags", { count: g - 12 })
 			})]
 		})
 	});
 }
 //#endregion
-export { l as TagCloudWidget };
+export { d as TagCloudWidget };
 //# sourceMappingURL=TagCloudWidget.js.map

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

	@@ -1 +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, IllustratedEmptyState } 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 <IllustratedEmptyState\n illustration=\"empty-generic\"\n title~~=\"~~No tags created yet\"\n description~~=\"~~Tags help you label and filter projects and content across the workspace~~.\"~~\n className=\"py-4\"\n />\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-text-secondary 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,GAAD;GACE,cAAa;GACb,~~OAAM~~;~~GACN~~,~~aAAY~~;~~GACZ~~,WAAU;GACV,CAAA,GAEF,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;KAA2D;KAAE~~,IAAQ;~~KAAG;KAAc;MAEpF~~;;EAEM,CAAA"}
1	+ {"version":3,"file":"TagCloudWidget.js","names":[],"sources":["../../../../src/pages/dashboard/widgets/TagCloudWidget.tsx"],"sourcesContent":["import { Tags, ArrowRight } from 'lucide-react';\nimport { Badge, Button, IllustratedEmptyState } from '@burdenoff/fe-libs/ui';\nimport { useI18n } from '@burdenoff/fe-libs/shared/providers/shell/I18nProvider';\nimport { WidgetWrapper } from '../WidgetWrapper';\nimport type { WidgetProps } from '../types';\nimport { tWithFallback } from '../../../utils/i18n';\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 { t } = useI18n();\n const tags = workspaceData?.tags.items ?? [];\n const total = workspaceData?.tags.total ?? 0;\n\n return (\n <WidgetWrapper\n title={tWithFallback(t, 'dashboard.tagCloud.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 <IllustratedEmptyState\n illustration=\"empty-generic\"\n title={tWithFallback(t, 'dashboard.tagCloud.emptyTitle', 'No tags created yet')}\n description={tWithFallback(\n t,\n 'dashboard.tagCloud.emptyDescription',\n 'Tags help you label and filter projects and content across the workspace.'\n )}\n className=\"py-4\"\n />\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-text-secondary text-center\">\n {tWithFallback(t, 'dashboard.tagCloud.more', '+{count} more tags', {\n count: total - 12,\n })}\n </p>\n )}\n </div>\n )}\n </WidgetWrapper>\n );\n}\n"],"mappings":";;;;;;;AAOA,IAAM,IAAY;CAChB;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACD;AAED,SAAgB,EAAe,EAAE,kBAAe,cAAW,eAAyB;CAClF,IAAM,EAAE,SAAM,GAAS,EACjB,IAAO,GAAe,KAAK,SAAS,EAAE,EACtC,IAAQ,GAAe,KAAK,SAAS;AAE3C,QACE,kBAAC,GAAD;EACE,OAAO,EAAc,GAAG,4BAA4B,OAAO;EAC3D,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,GAAD;GACE,cAAa;GACb,OAAO,EAAc,GAAG,iCAAiC,sBAAsB;GAC/E,aAAa,EACX,GACA,uCACA,4EACD;GACD,WAAU;GACV,CAAA,GAEF,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;cACV,EAAc,GAAG,2BAA2B,sBAAsB,EACjE,OAAO,IAAQ,IAChB,CAAC;IACA,CAAA,CAEF;;EAEM,CAAA"}