@burdenoff/microfe-planmagnet 2026.928.3 → 2026.928.5

package/dist/planmagnet/pages/PortfoliosEditPortfolioPagePage.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PortfoliosEditPortfolioPagePage.js","names":[],"sources":["../../../src/planmagnet/pages/PortfoliosEditPortfolioPagePage.tsx"],"sourcesContent":["import { useState, useMemo } from 'react';\nimport { gql } from '@apollo/client';\nimport { useQuery, useMutation } from '@apollo/client/react';\nimport { Card, CardContent, CardHeader, CardTitle, Button, Input } from '@burdenoff/fe-libs/ui';\nimport { Save, ArrowLeft, Loader2 } from 'lucide-react';\nimport { useParams } from 'react-router';\nimport { usePlanMagnetNavigate } from '../providers/PlanMagnetProvider';\nimport { detailPath } from '../utils/rowNavigation';\nimport { throwOnError } from '../utils/mutationResult';\nimport { enumLabel } from '../controls/WorkItemControls';\nimport { PORTFOLIO_STATUSES, STRATEGIC_ALIGNMENTS } from '../controls/PortfolioControls';\n\nconst GET_PORTFOLIO = gql`\n  query GetPortfolioForEdit($id: ID!) {\n    planmagnetPortfolio(id: $id) {\n      id\n      name\n      description\n      status\n      alignment\n      alignmentLabel\n      budgetTotal\n      currency\n      fiscalPeriod\n      tags\n    }\n  }\n`;\n\nconst UPDATE_PORTFOLIO = gql`\n  mutation UpdatePortfolio($id: ID!, $input: PlanmagnetUpdatePortfolioInput!) {\n    planmagnetUpdatePortfolio(id: $id, input: $input) {\n      id\n      name\n      description\n      status\n      alignment\n      alignmentLabel\n      budgetTotal\n      currency\n      fiscalPeriod\n      tags\n      updatedAt\n    }\n  }\n`;\n\nexport function PortfoliosEditPortfolioPagePage() {\n  const navigate = usePlanMagnetNavigate();\n  const params = useParams<{ id: string }>();\n  const portfolioId = params.id ?? '';\n\n  const { data, loading, error } = useQuery<{\n    planmagnetPortfolio: {\n      id: string;\n      name: string;\n      description: string | null;\n      status: string;\n      alignment: string | null;\n      alignmentLabel: string | null;\n      budgetTotal: number | null;\n      currency: string | null;\n      fiscalPeriod: string | null;\n      tags: string[];\n    } | null;\n  }>(GET_PORTFOLIO, { variables: { id: portfolioId }, skip: !portfolioId });\n\n  const [updatePortfolio, { loading: saving }] = useMutation(UPDATE_PORTFOLIO, {\n    refetchQueries: [\n      'ListPortfolios',\n      'GetPortfolioForEdit',\n      'GetPortfolio',\n      'GetPortfolioOverview',\n    ],\n    awaitRefetchQueries: true,\n  });\n  const [saveError, setSaveError] = useState<string | null>(null);\n  const [saved, setSaved] = useState(false);\n\n  const portfolio = data?.planmagnetPortfolio;\n\n  const defaultForm = useMemo(\n    () => ({\n      name: portfolio?.name ?? '',\n      description: portfolio?.description ?? '',\n      status: portfolio?.status ?? 'ACTIVE',\n      alignment: portfolio?.alignment ?? '',\n      alignmentLabel: portfolio?.alignmentLabel ?? '',\n      budgetTotal: portfolio?.budgetTotal != null ? String(portfolio.budgetTotal) : '',\n      currency: portfolio?.currency ?? '',\n      fiscalPeriod: portfolio?.fiscalPeriod ?? '',\n      tags: portfolio?.tags?.join(', ') ?? '',\n    }),\n    [portfolio]\n  );\n\n  const [formOverrides, setFormOverrides] = useState<Record<string, string>>({});\n  const form = { ...defaultForm, ...formOverrides };\n  const setForm = (val: Record<string, string>) => setFormOverrides(val);\n\n  const statuses = (PORTFOLIO_STATUSES as readonly string[]).includes(form.status)\n    ? PORTFOLIO_STATUSES\n    : [form.status, ...PORTFOLIO_STATUSES];\n  const needsLabel = form.alignment === 'CUSTOM' && !form.alignmentLabel.trim();\n  const invalidBudget = form.budgetTotal !== '' && Number(form.budgetTotal) < 0;\n\n  const handleSave = async () => {\n    if (!portfolio || !form.name.trim() || needsLabel || invalidBudget) return;\n    const tagList = (v: string) =>\n      v\n        .split(',')\n        .map((t) => t.trim())\n        .filter(Boolean);\n    const next: Record<string, unknown> = {\n      name: form.name.trim(),\n      description: form.description.trim() || null,\n      status: form.status,\n      alignment: form.alignment || null,\n      alignmentLabel: form.alignment === 'CUSTOM' ? form.alignmentLabel.trim() : null,\n      budgetTotal: form.budgetTotal !== '' ? Number(form.budgetTotal) : null,\n      currency: form.currency.trim() || null,\n      fiscalPeriod: form.fiscalPeriod.trim() || null,\n      tags: tagList(form.tags),\n    };\n    const before: Record<string, unknown> = {\n      name: defaultForm.name,\n      description: defaultForm.description.trim() || null,\n      status: defaultForm.status,\n      alignment: defaultForm.alignment || null,\n      alignmentLabel: defaultForm.alignment === 'CUSTOM' ? defaultForm.alignmentLabel.trim() : null,\n      budgetTotal: defaultForm.budgetTotal !== '' ? Number(defaultForm.budgetTotal) : null,\n      currency: defaultForm.currency.trim() || null,\n      fiscalPeriod: defaultForm.fiscalPeriod.trim() || null,\n      tags: tagList(defaultForm.tags),\n    };\n    const input = Object.fromEntries(\n      Object.entries(next).filter(([k, v]) => JSON.stringify(v) !== JSON.stringify(before[k]))\n    );\n    setSaveError(null);\n    setSaved(false);\n    if (Object.keys(input).length === 0) {\n      setSaved(true);\n      return;\n    }\n    try {\n      await throwOnError(updatePortfolio({ variables: { id: portfolioId, input } }));\n      setSaved(true);\n    } catch (e) {\n      setSaveError(e instanceof Error ? e.message : 'The portfolio could not be saved.');\n    }\n  };\n\n  // Only before the first load: a refetch must not blank the page (it unmounts every component on it and\n  // loses their state).\n  if (loading && !data) {\n    return (\n      <div className=\"flex items-center justify-center p-12\">\n        <Loader2 className=\"h-8 w-8 animate-spin text-muted-foreground\" />\n      </div>\n    );\n  }\n\n  if (error) {\n    return <div className=\"p-6 text-destructive\">Failed to load portfolio: {error.message}</div>;\n  }\n\n  if (!portfolio) return <div className=\"p-6 text-muted-foreground\">Portfolio not found.</div>;\n\n  return (\n    <div className=\"space-y-6 p-6 max-w-4xl\">\n      <div className=\"flex items-center justify-between\">\n        <div className=\"flex items-center gap-3\">\n          <Button\n            variant=\"ghost\"\n            size=\"sm\"\n            aria-label=\"Back to the portfolio\"\n            onClick={() => navigate(detailPath('/products/portfolio-detail-page', portfolioId))}\n          >\n            <ArrowLeft className=\"h-4 w-4\" />\n          </Button>\n          <div>\n            <h1 className=\"text-2xl font-semibold\">Edit Portfolio</h1>\n            <p className=\"text-sm text-muted-foreground\">{portfolio.name}</p>\n          </div>\n        </div>\n        <Button size=\"sm\" onClick={handleSave} disabled={saving || needsLabel || invalidBudget}>\n          {saving ? (\n            <Loader2 className=\"mr-1 h-4 w-4 animate-spin\" />\n          ) : (\n            <Save className=\"mr-1 h-4 w-4\" />\n          )}\n          Save Changes\n        </Button>\n      </div>\n\n      {saved && (\n        <div role=\"status\" className=\"p-3 bg-muted text-status-success-text rounded-md text-sm\">\n          Changes saved.\n        </div>\n      )}\n      {saveError && (\n        <div role=\"alert\" className=\"p-3 rounded-md bg-destructive/10 text-destructive text-sm\">\n          {saveError}\n        </div>\n      )}\n\n      <Card>\n        <CardHeader>\n          <CardTitle>Portfolio Details</CardTitle>\n        </CardHeader>\n        <CardContent className=\"space-y-4\">\n          <div>\n            <label className=\"text-sm font-medium\">Name</label>\n            <Input\n              value={form.name}\n              onChange={(e) => setForm({ ...form, name: e.target.value })}\n              className=\"mt-1\"\n            />\n          </div>\n          <div>\n            <label className=\"text-sm font-medium\">Description</label>\n            <textarea\n              className=\"mt-1 w-full rounded-md border border-input bg-background px-3 py-2 text-sm min-h-[80px]\"\n              value={form.description}\n              onChange={(e) => setForm({ ...form, description: e.target.value })}\n            />\n          </div>\n          <div className=\"grid grid-cols-2 gap-4\">\n            <div>\n              <label htmlFor=\"portfolio-edit-status\" className=\"text-sm font-medium\">\n                Status\n              </label>\n              <select\n                id=\"portfolio-edit-status\"\n                className=\"mt-1 w-full rounded-md border border-input bg-background px-3 py-2 text-sm\"\n                value={form.status}\n                onChange={(e) => setForm({ ...form, status: e.target.value })}\n              >\n                {statuses.map((s) => (\n                  <option key={s} value={s}>\n                    {enumLabel(s)}\n                  </option>\n                ))}\n              </select>\n            </div>\n            <div>\n              <label htmlFor=\"portfolio-edit-alignment\" className=\"text-sm font-medium\">\n                Strategic Alignment\n              </label>\n              <select\n                id=\"portfolio-edit-alignment\"\n                className=\"mt-1 w-full rounded-md border border-input bg-background px-3 py-2 text-sm\"\n                value={form.alignment}\n                onChange={(e) => setForm({ ...form, alignment: e.target.value })}\n              >\n                <option value=\"\">Not set</option>\n                {STRATEGIC_ALIGNMENTS.map((a) => (\n                  <option key={a} value={a}>\n                    {a === 'CUSTOM' ? 'Custom…' : enumLabel(a)}\n                  </option>\n                ))}\n              </select>\n            </div>\n          </div>\n          {form.alignment === 'CUSTOM' && (\n            <div>\n              <label className=\"text-sm font-medium\">Custom Alignment Label</label>\n              <Input\n                value={form.alignmentLabel}\n                onChange={(e) => setForm({ ...form, alignmentLabel: e.target.value })}\n                className=\"mt-1\"\n                aria-invalid={needsLabel}\n              />\n              {needsLabel && (\n                <p role=\"alert\" className=\"text-sm text-destructive mt-1\">\n                  A custom alignment needs a label.\n                </p>\n              )}\n            </div>\n          )}\n          <div className=\"grid grid-cols-3 gap-4\">\n            <div>\n              <label className=\"text-sm font-medium\">Total Budget</label>\n              <Input\n                type=\"number\"\n                min=\"0\"\n                value={form.budgetTotal}\n                onChange={(e) => setForm({ ...form, budgetTotal: e.target.value })}\n                className=\"mt-1\"\n                aria-invalid={invalidBudget}\n              />\n            </div>\n            <div>\n              <label className=\"text-sm font-medium\">Currency</label>\n              <Input\n                value={form.currency}\n                onChange={(e) => setForm({ ...form, currency: e.target.value })}\n                className=\"mt-1\"\n              />\n            </div>\n            <div>\n              <label className=\"text-sm font-medium\">Fiscal Period</label>\n              <Input\n                value={form.fiscalPeriod}\n                onChange={(e) => setForm({ ...form, fiscalPeriod: e.target.value })}\n                className=\"mt-1\"\n              />\n            </div>\n          </div>\n          {invalidBudget && (\n            <p role=\"alert\" className=\"text-sm text-destructive\">\n              The budget cannot be negative.\n            </p>\n          )}\n          <div>\n            <label className=\"text-sm font-medium\">Tags (comma-separated)</label>\n            <Input\n              value={form.tags}\n              onChange={(e) => setForm({ ...form, tags: e.target.value })}\n              className=\"mt-1\"\n            />\n          </div>\n        </CardContent>\n      </Card>\n    </div>\n  );\n}\n"],"mappings":"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"}

package/dist/planmagnet/pages/PortfoliosPortfolioDetailPagePage.d.ts

@@ -0,0 +1,2 @@
+export declare function PortfoliosPortfolioDetailPagePage(): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=PortfoliosPortfolioDetailPagePage.d.ts.map

package/dist/planmagnet/pages/PortfoliosPortfolioDetailPagePage.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"PortfoliosPortfolioDetailPagePage.d.ts","sourceRoot":"","sources":["../../../src/planmagnet/pages/PortfoliosPortfolioDetailPagePage.tsx"],"names":[],"mappings":"AA6EA,wBAAgB,iCAAiC,4CAuQhD"}

package/dist/planmagnet/pages/PortfoliosPortfolioDetailPagePage.js

@@ -0,0 +1,335 @@
+import { usePlanMagnetNavigate as e } from "../providers/PlanMagnetProvider.js";
+import { PersonName as t } from "../people/People.js";
+import { enumLabel as n } from "../controls/WorkItemControls.js";
+import { detailPath as r } from "../utils/rowNavigation.js";
+import { PortfolioHeaderActions as i } from "../controls/PortfolioControls.js";
+import { AlertTriangle as a, Briefcase as o, Clock as s, Loader2 as c, Target as l } from "lucide-react";
+import { useParams as u } from "react-router";
+import { gql as d } from "@apollo/client";
+import { useQuery as f } from "@apollo/client/react";
+import { jsx as p, jsxs as m } from "react/jsx-runtime";
+import { Badge as h, Card as g, CardContent as _, CardHeader as v, CardTitle as y } from "@burdenoff/fe-libs/ui";
+//#region src/planmagnet/pages/PortfoliosPortfolioDetailPagePage.tsx
+var b = d`
+  query GetPortfolio($id: ID!) {
+    planmagnetPortfolio(id: $id) {
+      id
+      workspaceId
+      name
+      description
+      status
+      alignment
+      alignmentLabel
+      ownerId
+      budgetTotal
+      currency
+      fiscalPeriod
+      tags
+      createdAt
+      updatedAt
+      programs {
+        id
+        name
+        status
+      }
+      projects {
+        id
+        name
+        status
+      }
+    }
+  }
+`, x = d`
+  query GetPortfolioOverview($portfolioId: ID!) {
+    planmagnetPortfolioOverview(portfolioId: $portfolioId) {
+      portfolioId
+      totalPrograms
+      totalProjects
+      projectsByStatus
+      totalBudget
+      totalSpent
+      budgetUtilization
+      healthScore
+      atRiskCount
+      overdueMilestones
+    }
+  }
+`;
+function S() {
+	let d = e(), S = u().id ?? "", { data: C, loading: w, error: T } = f(b, {
+		variables: { id: S },
+		skip: !S
+	}), { data: E } = f(x, {
+		variables: { portfolioId: S },
+		skip: !S
+	});
+	if (w && !C) return /* @__PURE__ */ p("div", {
+		className: "flex items-center justify-center p-12",
+		children: /* @__PURE__ */ p(c, { className: "h-8 w-8 animate-spin text-muted-foreground" })
+	});
+	if (T) return /* @__PURE__ */ m("div", {
+		className: "p-6 text-destructive",
+		children: ["Failed to load portfolio: ", T.message]
+	});
+	let D = C?.planmagnetPortfolio;
+	if (!D) return /* @__PURE__ */ p("div", {
+		className: "p-6 text-muted-foreground",
+		children: "Portfolio not found."
+	});
+	let O = E?.planmagnetPortfolioOverview ?? null;
+	return /* @__PURE__ */ m("div", {
+		className: "space-y-6 p-6",
+		children: [
+			/* @__PURE__ */ m("div", {
+				className: "flex items-center justify-between",
+				children: [/* @__PURE__ */ m("div", { children: [/* @__PURE__ */ m("div", {
+					className: "flex items-center gap-2",
+					children: [
+						/* @__PURE__ */ p(o, { className: "h-5 w-5 text-primary" }),
+						/* @__PURE__ */ p("h1", {
+							className: "text-2xl font-semibold",
+							children: D.name
+						}),
+						/* @__PURE__ */ p(h, {
+							variant: "outline",
+							className: "text-xs",
+							children: n(D.status)
+						})
+					]
+				}), D.alignment && /* @__PURE__ */ p("p", {
+					className: "text-sm text-muted-foreground mt-1",
+					children: D.alignment === "CUSTOM" ? D.alignmentLabel ?? "Custom alignment" : n(D.alignment)
+				})] }), /* @__PURE__ */ p(i, {
+					portfolioId: D.id,
+					name: D.name,
+					status: D.status
+				})]
+			}),
+			/* @__PURE__ */ m("div", {
+				className: "grid grid-cols-2 md:grid-cols-4 gap-4",
+				children: [
+					/* @__PURE__ */ p(g, { children: /* @__PURE__ */ m(_, {
+						className: "pt-4 text-center",
+						children: [
+							/* @__PURE__ */ p(o, { className: "h-5 w-5 mx-auto text-primary" }),
+							/* @__PURE__ */ p("p", {
+								className: "text-2xl font-bold mt-1",
+								children: O?.totalPrograms ?? D.programs.length
+							}),
+							/* @__PURE__ */ p("p", {
+								className: "text-xs text-muted-foreground",
+								children: "Programs"
+							})
+						]
+					}) }),
+					/* @__PURE__ */ p(g, { children: /* @__PURE__ */ m(_, {
+						className: "pt-4 text-center",
+						children: [
+							/* @__PURE__ */ p(l, { className: "h-5 w-5 mx-auto text-primary" }),
+							/* @__PURE__ */ p("p", {
+								className: "text-2xl font-bold mt-1",
+								children: O?.totalProjects ?? D.projects.length
+							}),
+							/* @__PURE__ */ p("p", {
+								className: "text-xs text-muted-foreground",
+								children: "Projects"
+							})
+						]
+					}) }),
+					/* @__PURE__ */ p(g, { children: /* @__PURE__ */ m(_, {
+						className: "pt-4 text-center",
+						children: [
+							/* @__PURE__ */ p(a, { className: "h-5 w-5 mx-auto text-destructive" }),
+							/* @__PURE__ */ p("p", {
+								className: "text-2xl font-bold mt-1",
+								children: O?.atRiskCount ?? 0
+							}),
+							/* @__PURE__ */ p("p", {
+								className: "text-xs text-muted-foreground",
+								children: "At Risk"
+							})
+						]
+					}) }),
+					/* @__PURE__ */ p(g, { children: /* @__PURE__ */ m(_, {
+						className: "pt-4 text-center",
+						children: [
+							/* @__PURE__ */ p(s, { className: "h-5 w-5 mx-auto text-status-warning-text" }),
+							/* @__PURE__ */ p("p", {
+								className: "text-2xl font-bold mt-1",
+								children: O?.overdueMilestones ?? 0
+							}),
+							/* @__PURE__ */ p("p", {
+								className: "text-xs text-muted-foreground",
+								children: "Overdue Milestones"
+							})
+						]
+					}) })
+				]
+			}),
+			/* @__PURE__ */ m("div", {
+				className: "grid grid-cols-1 lg:grid-cols-3 gap-6",
+				children: [/* @__PURE__ */ m("div", {
+					className: "lg:col-span-2 space-y-6",
+					children: [
+						/* @__PURE__ */ m(g, { children: [/* @__PURE__ */ p(v, { children: /* @__PURE__ */ p(y, { children: "Overview" }) }), /* @__PURE__ */ m(_, {
+							className: "space-y-4",
+							children: [/* @__PURE__ */ p("p", {
+								className: "text-sm",
+								children: D.description ?? "No description provided."
+							}), O ? /* @__PURE__ */ m("div", {
+								className: "grid grid-cols-2 gap-4",
+								children: [
+									/* @__PURE__ */ m("div", {
+										className: "p-3 bg-muted rounded-md",
+										children: [/* @__PURE__ */ p("p", {
+											className: "text-xs text-muted-foreground",
+											children: "Budget Utilization"
+										}), /* @__PURE__ */ p("p", {
+											className: "text-lg font-semibold mt-1",
+											children: O.budgetUtilization == null ? "No budget data" : `${O.budgetUtilization.toFixed(0)}%`
+										})]
+									}),
+									/* @__PURE__ */ m("div", {
+										className: "p-3 bg-muted rounded-md",
+										children: [/* @__PURE__ */ p("p", {
+											className: "text-xs text-muted-foreground",
+											children: "Health Score"
+										}), /* @__PURE__ */ p("p", {
+											className: "text-lg font-semibold mt-1",
+											children: O.healthScore == null ? "No projects yet" : O.healthScore.toFixed(0)
+										})]
+									}),
+									/* @__PURE__ */ m("div", {
+										className: "p-3 bg-muted rounded-md",
+										children: [/* @__PURE__ */ p("p", {
+											className: "text-xs text-muted-foreground",
+											children: "Total Spent"
+										}), /* @__PURE__ */ p("p", {
+											className: "text-lg font-semibold mt-1",
+											children: O.totalSpent == null ? "N/A" : O.totalSpent.toLocaleString()
+										})]
+									}),
+									/* @__PURE__ */ m("div", {
+										className: "p-3 bg-muted rounded-md",
+										children: [/* @__PURE__ */ p("p", {
+											className: "text-xs text-muted-foreground",
+											children: "Projects by Status"
+										}), /* @__PURE__ */ p("p", {
+											className: "text-sm mt-1",
+											children: Object.keys(O.projectsByStatus).length > 0 ? Object.entries(O.projectsByStatus).map(([e, t]) => `${n(e)}: ${t}`).join(", ") : "No projects yet"
+										})]
+									})
+								]
+							}) : /* @__PURE__ */ p("p", {
+								className: "text-sm text-muted-foreground",
+								children: "Loading overview…"
+							})]
+						})] }),
+						/* @__PURE__ */ m(g, { children: [/* @__PURE__ */ p(v, { children: /* @__PURE__ */ m(y, { children: [
+							"Programs (",
+							D.programs.length,
+							")"
+						] }) }), /* @__PURE__ */ m(_, {
+							className: "space-y-2",
+							children: [D.programs.length === 0 && /* @__PURE__ */ p("p", {
+								className: "text-sm text-muted-foreground",
+								children: "No programs are linked to this portfolio yet."
+							}), D.programs.map((e) => /* @__PURE__ */ m("button", {
+								type: "button",
+								className: "flex w-full items-center justify-between rounded-md border p-3 text-left hover:bg-muted",
+								onClick: () => d(r("/products/program-detail-page", e.id)),
+								children: [/* @__PURE__ */ p("span", {
+									className: "text-sm font-medium",
+									children: e.name
+								}), /* @__PURE__ */ p(h, {
+									variant: "outline",
+									className: "text-xs",
+									children: n(e.status)
+								})]
+							}, e.id))]
+						})] }),
+						/* @__PURE__ */ m(g, { children: [/* @__PURE__ */ p(v, { children: /* @__PURE__ */ m(y, { children: [
+							"Projects (",
+							D.projects.length,
+							")"
+						] }) }), /* @__PURE__ */ m(_, {
+							className: "space-y-2",
+							children: [D.projects.length === 0 && /* @__PURE__ */ p("p", {
+								className: "text-sm text-muted-foreground",
+								children: "No projects are linked to this portfolio yet."
+							}), D.projects.map((e) => /* @__PURE__ */ m("button", {
+								type: "button",
+								className: "flex w-full items-center justify-between rounded-md border p-3 text-left hover:bg-muted",
+								onClick: () => d(r("/projects/project-detail-page", e.id)),
+								children: [/* @__PURE__ */ p("span", {
+									className: "text-sm font-medium",
+									children: e.name
+								}), /* @__PURE__ */ p(h, {
+									variant: "outline",
+									className: "text-xs",
+									children: n(e.status)
+								})]
+							}, e.id))]
+						})] })
+					]
+				}), /* @__PURE__ */ m("div", {
+					className: "space-y-6",
+					children: [/* @__PURE__ */ m(g, { children: [/* @__PURE__ */ p(v, { children: /* @__PURE__ */ p(y, { children: "Details" }) }), /* @__PURE__ */ m(_, {
+						className: "space-y-2 text-sm",
+						children: [
+							/* @__PURE__ */ m("div", {
+								className: "flex justify-between",
+								children: [/* @__PURE__ */ p("span", {
+									className: "text-muted-foreground",
+									children: "Owner"
+								}), /* @__PURE__ */ p(t, { id: D.ownerId })]
+							}),
+							/* @__PURE__ */ m("div", {
+								className: "flex justify-between",
+								children: [/* @__PURE__ */ p("span", {
+									className: "text-muted-foreground",
+									children: "Budget"
+								}), /* @__PURE__ */ p("span", {
+									className: "font-medium",
+									children: D.budgetTotal == null ? "Not set" : `${D.currency ?? ""} ${D.budgetTotal.toLocaleString()}`.trim()
+								})]
+							}),
+							/* @__PURE__ */ m("div", {
+								className: "flex justify-between",
+								children: [/* @__PURE__ */ p("span", {
+									className: "text-muted-foreground",
+									children: "Fiscal Period"
+								}), /* @__PURE__ */ p("span", { children: D.fiscalPeriod ?? "Not set" })]
+							}),
+							/* @__PURE__ */ m("div", {
+								className: "flex justify-between",
+								children: [/* @__PURE__ */ p("span", {
+									className: "text-muted-foreground",
+									children: "Created"
+								}), /* @__PURE__ */ p("span", { children: new Date(D.createdAt).toLocaleDateString() })]
+							}),
+							/* @__PURE__ */ m("div", {
+								className: "flex justify-between",
+								children: [/* @__PURE__ */ p("span", {
+									className: "text-muted-foreground",
+									children: "Updated"
+								}), /* @__PURE__ */ p("span", { children: new Date(D.updatedAt).toLocaleDateString() })]
+							})
+						]
+					})] }), D.tags.length > 0 && /* @__PURE__ */ m(g, { children: [/* @__PURE__ */ p(v, { children: /* @__PURE__ */ p(y, { children: "Tags" }) }), /* @__PURE__ */ p(_, {
+						className: "flex flex-wrap gap-1",
+						children: D.tags.map((e) => /* @__PURE__ */ p(h, {
+							variant: "outline",
+							className: "text-xs",
+							children: e
+						}, e))
+					})] })]
+				})]
+			})
+		]
+	});
+}
+//#endregion
+export { S as PortfoliosPortfolioDetailPagePage };
+
+//# sourceMappingURL=PortfoliosPortfolioDetailPagePage.js.map

package/dist/planmagnet/pages/PortfoliosPortfolioDetailPagePage.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PortfoliosPortfolioDetailPagePage.js","names":[],"sources":["../../../src/planmagnet/pages/PortfoliosPortfolioDetailPagePage.tsx"],"sourcesContent":["import { gql } from '@apollo/client';\nimport { useQuery } from '@apollo/client/react';\nimport { Card, CardContent, CardHeader, CardTitle, Badge } from '@burdenoff/fe-libs/ui';\nimport { Briefcase, Target, AlertTriangle, Clock, Loader2 } from 'lucide-react';\nimport { useParams } from 'react-router';\nimport { usePlanMagnetNavigate } from '../providers/PlanMagnetProvider';\nimport { detailPath } from '../utils/rowNavigation';\nimport { PersonName } from '../people/People';\nimport { enumLabel } from '../controls/WorkItemControls';\nimport { PortfolioHeaderActions } from '../controls/PortfolioControls';\n\nconst GET_PORTFOLIO = gql`\n  query GetPortfolio($id: ID!) {\n    planmagnetPortfolio(id: $id) {\n      id\n      workspaceId\n      name\n      description\n      status\n      alignment\n      alignmentLabel\n      ownerId\n      budgetTotal\n      currency\n      fiscalPeriod\n      tags\n      createdAt\n      updatedAt\n      programs {\n        id\n        name\n        status\n      }\n      projects {\n        id\n        name\n        status\n      }\n    }\n  }\n`;\n\nconst GET_PORTFOLIO_OVERVIEW = gql`\n  query GetPortfolioOverview($portfolioId: ID!) {\n    planmagnetPortfolioOverview(portfolioId: $portfolioId) {\n      portfolioId\n      totalPrograms\n      totalProjects\n      projectsByStatus\n      totalBudget\n      totalSpent\n      budgetUtilization\n      healthScore\n      atRiskCount\n      overdueMilestones\n    }\n  }\n`;\n\ninterface RelatedNode {\n  id: string;\n  name: string;\n  status: string;\n}\n\ninterface OverviewNode {\n  totalPrograms: number;\n  totalProjects: number;\n  projectsByStatus: Record<string, number>;\n  totalBudget: number | null;\n  totalSpent: number | null;\n  budgetUtilization: number | null;\n  healthScore: number | null;\n  atRiskCount: number;\n  overdueMilestones: number;\n}\n\nexport function PortfoliosPortfolioDetailPagePage() {\n  const navigate = usePlanMagnetNavigate();\n  const params = useParams<{ id: string }>();\n  const portfolioId = params.id ?? '';\n\n  const { data, loading, error } = useQuery<{\n    planmagnetPortfolio: {\n      id: string;\n      name: string;\n      description: string | null;\n      status: string;\n      alignment: string | null;\n      alignmentLabel: string | null;\n      ownerId: string;\n      budgetTotal: number | null;\n      currency: string | null;\n      fiscalPeriod: string | null;\n      tags: string[];\n      createdAt: string;\n      updatedAt: string;\n      programs: RelatedNode[];\n      projects: RelatedNode[];\n    } | null;\n  }>(GET_PORTFOLIO, { variables: { id: portfolioId }, skip: !portfolioId });\n\n  const { data: overviewData } = useQuery<{ planmagnetPortfolioOverview: OverviewNode }>(\n    GET_PORTFOLIO_OVERVIEW,\n    { variables: { portfolioId }, skip: !portfolioId }\n  );\n\n  // Only before the first load: a refetch must not blank the page (it unmounts every component on it and\n  // loses their state).\n  if (loading && !data) {\n    return (\n      <div className=\"flex items-center justify-center p-12\">\n        <Loader2 className=\"h-8 w-8 animate-spin text-muted-foreground\" />\n      </div>\n    );\n  }\n\n  if (error) {\n    return <div className=\"p-6 text-destructive\">Failed to load portfolio: {error.message}</div>;\n  }\n\n  const portfolio = data?.planmagnetPortfolio;\n  if (!portfolio) return <div className=\"p-6 text-muted-foreground\">Portfolio not found.</div>;\n\n  const overview = overviewData?.planmagnetPortfolioOverview ?? null;\n\n  return (\n    <div className=\"space-y-6 p-6\">\n      <div className=\"flex items-center justify-between\">\n        <div>\n          <div className=\"flex items-center gap-2\">\n            <Briefcase className=\"h-5 w-5 text-primary\" />\n            <h1 className=\"text-2xl font-semibold\">{portfolio.name}</h1>\n            <Badge variant=\"outline\" className=\"text-xs\">\n              {enumLabel(portfolio.status)}\n            </Badge>\n          </div>\n          {portfolio.alignment && (\n            <p className=\"text-sm text-muted-foreground mt-1\">\n              {portfolio.alignment === 'CUSTOM'\n                ? (portfolio.alignmentLabel ?? 'Custom alignment')\n                : enumLabel(portfolio.alignment)}\n            </p>\n          )}\n        </div>\n        <PortfolioHeaderActions\n          portfolioId={portfolio.id}\n          name={portfolio.name}\n          status={portfolio.status}\n        />\n      </div>\n\n      <div className=\"grid grid-cols-2 md:grid-cols-4 gap-4\">\n        <Card>\n          <CardContent className=\"pt-4 text-center\">\n            <Briefcase className=\"h-5 w-5 mx-auto text-primary\" />\n            <p className=\"text-2xl font-bold mt-1\">\n              {overview?.totalPrograms ?? portfolio.programs.length}\n            </p>\n            <p className=\"text-xs text-muted-foreground\">Programs</p>\n          </CardContent>\n        </Card>\n        <Card>\n          <CardContent className=\"pt-4 text-center\">\n            <Target className=\"h-5 w-5 mx-auto text-primary\" />\n            <p className=\"text-2xl font-bold mt-1\">\n              {overview?.totalProjects ?? portfolio.projects.length}\n            </p>\n            <p className=\"text-xs text-muted-foreground\">Projects</p>\n          </CardContent>\n        </Card>\n        <Card>\n          <CardContent className=\"pt-4 text-center\">\n            <AlertTriangle className=\"h-5 w-5 mx-auto text-destructive\" />\n            <p className=\"text-2xl font-bold mt-1\">{overview?.atRiskCount ?? 0}</p>\n            <p className=\"text-xs text-muted-foreground\">At Risk</p>\n          </CardContent>\n        </Card>\n        <Card>\n          <CardContent className=\"pt-4 text-center\">\n            <Clock className=\"h-5 w-5 mx-auto text-status-warning-text\" />\n            <p className=\"text-2xl font-bold mt-1\">{overview?.overdueMilestones ?? 0}</p>\n            <p className=\"text-xs text-muted-foreground\">Overdue Milestones</p>\n          </CardContent>\n        </Card>\n      </div>\n\n      <div className=\"grid grid-cols-1 lg:grid-cols-3 gap-6\">\n        <div className=\"lg:col-span-2 space-y-6\">\n          <Card>\n            <CardHeader>\n              <CardTitle>Overview</CardTitle>\n            </CardHeader>\n            <CardContent className=\"space-y-4\">\n              <p className=\"text-sm\">{portfolio.description ?? 'No description provided.'}</p>\n              {overview ? (\n                <div className=\"grid grid-cols-2 gap-4\">\n                  <div className=\"p-3 bg-muted rounded-md\">\n                    <p className=\"text-xs text-muted-foreground\">Budget Utilization</p>\n                    <p className=\"text-lg font-semibold mt-1\">\n                      {overview.budgetUtilization != null\n                        ? `${overview.budgetUtilization.toFixed(0)}%`\n                        : 'No budget data'}\n                    </p>\n                  </div>\n                  <div className=\"p-3 bg-muted rounded-md\">\n                    <p className=\"text-xs text-muted-foreground\">Health Score</p>\n                    <p className=\"text-lg font-semibold mt-1\">\n                      {overview.healthScore != null\n                        ? overview.healthScore.toFixed(0)\n                        : 'No projects yet'}\n                    </p>\n                  </div>\n                  <div className=\"p-3 bg-muted rounded-md\">\n                    <p className=\"text-xs text-muted-foreground\">Total Spent</p>\n                    <p className=\"text-lg font-semibold mt-1\">\n                      {overview.totalSpent != null ? overview.totalSpent.toLocaleString() : 'N/A'}\n                    </p>\n                  </div>\n                  <div className=\"p-3 bg-muted rounded-md\">\n                    <p className=\"text-xs text-muted-foreground\">Projects by Status</p>\n                    <p className=\"text-sm mt-1\">\n                      {Object.keys(overview.projectsByStatus).length > 0\n                        ? Object.entries(overview.projectsByStatus)\n                            .map(([status, count]) => `${enumLabel(status)}: ${count}`)\n                            .join(', ')\n                        : 'No projects yet'}\n                    </p>\n                  </div>\n                </div>\n              ) : (\n                <p className=\"text-sm text-muted-foreground\">Loading overview…</p>\n              )}\n            </CardContent>\n          </Card>\n\n          <Card>\n            <CardHeader>\n              <CardTitle>Programs ({portfolio.programs.length})</CardTitle>\n            </CardHeader>\n            <CardContent className=\"space-y-2\">\n              {portfolio.programs.length === 0 && (\n                <p className=\"text-sm text-muted-foreground\">\n                  No programs are linked to this portfolio yet.\n                </p>\n              )}\n              {portfolio.programs.map((program) => (\n                <button\n                  key={program.id}\n                  type=\"button\"\n                  className=\"flex w-full items-center justify-between rounded-md border p-3 text-left hover:bg-muted\"\n                  onClick={() => navigate(detailPath('/products/program-detail-page', program.id))}\n                >\n                  <span className=\"text-sm font-medium\">{program.name}</span>\n                  <Badge variant=\"outline\" className=\"text-xs\">\n                    {enumLabel(program.status)}\n                  </Badge>\n                </button>\n              ))}\n            </CardContent>\n          </Card>\n\n          <Card>\n            <CardHeader>\n              <CardTitle>Projects ({portfolio.projects.length})</CardTitle>\n            </CardHeader>\n            <CardContent className=\"space-y-2\">\n              {portfolio.projects.length === 0 && (\n                <p className=\"text-sm text-muted-foreground\">\n                  No projects are linked to this portfolio yet.\n                </p>\n              )}\n              {portfolio.projects.map((project) => (\n                <button\n                  key={project.id}\n                  type=\"button\"\n                  className=\"flex w-full items-center justify-between rounded-md border p-3 text-left hover:bg-muted\"\n                  onClick={() => navigate(detailPath('/projects/project-detail-page', project.id))}\n                >\n                  <span className=\"text-sm font-medium\">{project.name}</span>\n                  <Badge variant=\"outline\" className=\"text-xs\">\n                    {enumLabel(project.status)}\n                  </Badge>\n                </button>\n              ))}\n            </CardContent>\n          </Card>\n        </div>\n\n        <div className=\"space-y-6\">\n          <Card>\n            <CardHeader>\n              <CardTitle>Details</CardTitle>\n            </CardHeader>\n            <CardContent className=\"space-y-2 text-sm\">\n              <div className=\"flex justify-between\">\n                <span className=\"text-muted-foreground\">Owner</span>\n                <PersonName id={portfolio.ownerId} />\n              </div>\n              <div className=\"flex justify-between\">\n                <span className=\"text-muted-foreground\">Budget</span>\n                <span className=\"font-medium\">\n                  {portfolio.budgetTotal != null\n                    ? `${portfolio.currency ?? ''} ${portfolio.budgetTotal.toLocaleString()}`.trim()\n                    : 'Not set'}\n                </span>\n              </div>\n              <div className=\"flex justify-between\">\n                <span className=\"text-muted-foreground\">Fiscal Period</span>\n                <span>{portfolio.fiscalPeriod ?? 'Not set'}</span>\n              </div>\n              <div className=\"flex justify-between\">\n                <span className=\"text-muted-foreground\">Created</span>\n                <span>{new Date(portfolio.createdAt).toLocaleDateString()}</span>\n              </div>\n              <div className=\"flex justify-between\">\n                <span className=\"text-muted-foreground\">Updated</span>\n                <span>{new Date(portfolio.updatedAt).toLocaleDateString()}</span>\n              </div>\n            </CardContent>\n          </Card>\n\n          {portfolio.tags.length > 0 && (\n            <Card>\n              <CardHeader>\n                <CardTitle>Tags</CardTitle>\n              </CardHeader>\n              <CardContent className=\"flex flex-wrap gap-1\">\n                {portfolio.tags.map((tag) => (\n                  <Badge key={tag} variant=\"outline\" className=\"text-xs\">\n                    {tag}\n                  </Badge>\n                ))}\n              </CardContent>\n            </Card>\n          )}\n        </div>\n      </div>\n    </div>\n  );\n}\n"],"mappings":"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"}

package/dist/planmagnet/pages/PortfoliosPortfoliosPagePage.d.ts

@@ -0,0 +1,2 @@
+export declare function PortfoliosPortfoliosPagePage(): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=PortfoliosPortfoliosPagePage.d.ts.map

package/dist/planmagnet/pages/PortfoliosPortfoliosPagePage.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"PortfoliosPortfoliosPagePage.d.ts","sourceRoot":"","sources":["../../../src/planmagnet/pages/PortfoliosPortfoliosPagePage.tsx"],"names":[],"mappings":"AA4DA,wBAAgB,4BAA4B,4CAuI3C"}

package/dist/planmagnet/pages/PortfoliosPortfoliosPagePage.js

@@ -0,0 +1,154 @@
+import { usePlanMagnet as e, usePlanMagnetNavigate as t } from "../providers/PlanMagnetProvider.js";
+import { PersonName as n } from "../people/People.js";
+import { enumLabel as r } from "../controls/WorkItemControls.js";
+import { detailPath as i, rowLinkProps as a } from "../utils/rowNavigation.js";
+import { PORTFOLIO_STATUSES as o } from "../controls/PortfolioControls.js";
+import { useState as s } from "react";
+import { Briefcase as c, Loader2 as l, Plus as u } from "lucide-react";
+import { gql as d } from "@apollo/client";
+import { useQuery as f } from "@apollo/client/react";
+import { jsx as p, jsxs as m } from "react/jsx-runtime";
+import { Badge as h, Button as g, Card as _, CardContent as v, CardHeader as y, CardTitle as b, Input as x } from "@burdenoff/fe-libs/ui";
+//#region src/planmagnet/pages/PortfoliosPortfoliosPagePage.tsx
+var S = d`
+  query ListPortfolios(
+    $workspaceId: ID!
+    $filter: PlanmagnetPortfolioFilter
+    $pagination: PlanmagnetPaginationInput
+  ) {
+    planmagnetPortfolios(workspaceId: $workspaceId, filter: $filter, pagination: $pagination) {
+      items {
+        id
+        name
+        description
+        status
+        alignment
+        alignmentLabel
+        ownerId
+        budgetTotal
+        currency
+        fiscalPeriod
+        tags
+        updatedAt
+      }
+      totalCount
+    }
+  }
+`;
+function C() {
+	let d = t(), { workspaceId: C } = e(), [w, T] = s("all"), [E, D] = s(""), { data: O, loading: k, error: A } = f(S, {
+		variables: {
+			workspaceId: C,
+			pagination: { first: 50 },
+			filter: {
+				...w === "all" ? {} : { status: w },
+				...E.trim() ? { search: E.trim() } : {}
+			}
+		},
+		skip: !C
+	});
+	if (k && !O) return /* @__PURE__ */ p("div", {
+		className: "flex items-center justify-center p-12",
+		children: /* @__PURE__ */ p(l, { className: "h-8 w-8 animate-spin text-muted-foreground" })
+	});
+	if (A) return /* @__PURE__ */ m("div", {
+		className: "p-6 text-destructive",
+		children: ["Failed to load portfolios: ", A.message]
+	});
+	let j = O?.planmagnetPortfolios.items ?? [], M = O?.planmagnetPortfolios.totalCount ?? 0, N = ["all", ...o];
+	return /* @__PURE__ */ m("div", {
+		className: "space-y-6 p-6",
+		children: [
+			/* @__PURE__ */ m("div", {
+				className: "flex items-center justify-between",
+				children: [/* @__PURE__ */ m("div", { children: [/* @__PURE__ */ p("h1", {
+					className: "text-2xl font-semibold",
+					children: "Portfolios"
+				}), /* @__PURE__ */ m("p", {
+					className: "text-sm text-muted-foreground",
+					children: [
+						M,
+						" portfolio",
+						M === 1 ? "" : "s",
+						" across the workspace"
+					]
+				})] }), /* @__PURE__ */ m(g, {
+					size: "sm",
+					onClick: () => d("/products/create-portfolio-page"),
+					children: [/* @__PURE__ */ p(u, { className: "mr-1 h-4 w-4" }), "New Portfolio"]
+				})]
+			}),
+			/* @__PURE__ */ m("div", {
+				className: "flex flex-wrap items-center gap-4",
+				children: [/* @__PURE__ */ p(x, {
+					"aria-label": "Search portfolios",
+					placeholder: "Search by name…",
+					value: E,
+					onChange: (e) => D(e.target.value),
+					className: "max-w-xs"
+				}), /* @__PURE__ */ p("div", {
+					className: "flex items-center gap-2 flex-wrap",
+					children: N.map((e) => /* @__PURE__ */ p("button", {
+						type: "button",
+						"aria-pressed": w === e,
+						onClick: () => T(e),
+						className: `px-2 py-1 text-xs rounded-md capitalize ${w === e ? "bg-primary text-primary-foreground" : "bg-muted text-muted-foreground"}`,
+						children: e === "all" ? "All" : r(e)
+					}, e))
+				})]
+			}),
+			/* @__PURE__ */ p("div", {
+				className: "grid grid-cols-1 md:grid-cols-2 gap-4",
+				children: j.map((e) => /* @__PURE__ */ m(_, {
+					...a(() => d(i("/products/portfolio-detail-page", e.id)), e.name),
+					children: [/* @__PURE__ */ p(y, {
+						className: "pb-2",
+						children: /* @__PURE__ */ m("div", {
+							className: "flex items-center justify-between gap-2",
+							children: [/* @__PURE__ */ m(b, {
+								className: "text-base flex items-center gap-2",
+								children: [/* @__PURE__ */ p(c, { className: "h-4 w-4 text-primary" }), e.name]
+							}), /* @__PURE__ */ p(h, {
+								variant: "outline",
+								className: "text-xs",
+								children: r(e.status)
+							})]
+						})
+					}), /* @__PURE__ */ m(v, {
+						className: "space-y-3",
+						children: [
+							/* @__PURE__ */ p("p", {
+								className: "text-sm text-muted-foreground",
+								children: e.description ?? "No description"
+							}),
+							/* @__PURE__ */ m("div", {
+								className: "flex items-center gap-2 flex-wrap",
+								children: [e.alignment && /* @__PURE__ */ p(h, {
+									variant: "secondary",
+									className: "text-xs",
+									children: e.alignment === "CUSTOM" ? e.alignmentLabel ?? "Custom" : r(e.alignment)
+								}), e.fiscalPeriod && /* @__PURE__ */ p(h, {
+									variant: "outline",
+									className: "text-xs",
+									children: e.fiscalPeriod
+								})]
+							}),
+							/* @__PURE__ */ m("div", {
+								className: "flex items-center justify-between text-xs text-muted-foreground border-t pt-2",
+								children: [/* @__PURE__ */ m("span", { children: ["Owner: ", /* @__PURE__ */ p(n, { id: e.ownerId })] }), /* @__PURE__ */ p("span", { children: e.budgetTotal == null ? "No budget set" : `${e.currency ?? ""} ${e.budgetTotal.toLocaleString()}`.trim() })]
+							})
+						]
+					})]
+				}, e.id))
+			}),
+			j.length === 0 && /* @__PURE__ */ p("p", {
+				className: "text-center text-muted-foreground py-8",
+				children: w !== "all" || E ? "No portfolios match the selected filters." : "No portfolios yet. Create one to group programs and projects for executive oversight."
+			})
+		]
+	});
+}
+//#endregion
+export { C as PortfoliosPortfoliosPagePage };
+
+//# sourceMappingURL=PortfoliosPortfoliosPagePage.js.map

package/dist/planmagnet/pages/PortfoliosPortfoliosPagePage.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PortfoliosPortfoliosPagePage.js","names":[],"sources":["../../../src/planmagnet/pages/PortfoliosPortfoliosPagePage.tsx"],"sourcesContent":["import { useState } from 'react';\nimport { gql } from '@apollo/client';\nimport { useQuery } from '@apollo/client/react';\nimport {\n  Card,\n  CardContent,\n  CardHeader,\n  CardTitle,\n  Badge,\n  Button,\n  Input,\n} from '@burdenoff/fe-libs/ui';\nimport { Briefcase, Plus, Loader2 } from 'lucide-react';\nimport { usePlanMagnet, usePlanMagnetNavigate } from '../providers/PlanMagnetProvider';\nimport { rowLinkProps, detailPath } from '../utils/rowNavigation';\nimport { PersonName } from '../people/People';\nimport { enumLabel } from '../controls/WorkItemControls';\nimport { PORTFOLIO_STATUSES } from '../controls/PortfolioControls';\n\nconst LIST_PORTFOLIOS = gql`\n  query ListPortfolios(\n    $workspaceId: ID!\n    $filter: PlanmagnetPortfolioFilter\n    $pagination: PlanmagnetPaginationInput\n  ) {\n    planmagnetPortfolios(workspaceId: $workspaceId, filter: $filter, pagination: $pagination) {\n      items {\n        id\n        name\n        description\n        status\n        alignment\n        alignmentLabel\n        ownerId\n        budgetTotal\n        currency\n        fiscalPeriod\n        tags\n        updatedAt\n      }\n      totalCount\n    }\n  }\n`;\n\ninterface PortfolioNode {\n  id: string;\n  name: string;\n  description: string | null;\n  status: string;\n  alignment: string | null;\n  alignmentLabel: string | null;\n  ownerId: string;\n  budgetTotal: number | null;\n  currency: string | null;\n  fiscalPeriod: string | null;\n  tags: string[];\n  updatedAt: string;\n}\n\nexport function PortfoliosPortfoliosPagePage() {\n  const navigate = usePlanMagnetNavigate();\n  const { workspaceId } = usePlanMagnet();\n  const [statusFilter, setStatusFilter] = useState<string>('all');\n  const [search, setSearch] = useState('');\n\n  const { data, loading, error } = useQuery<{\n    planmagnetPortfolios: { items: PortfolioNode[]; totalCount: number };\n  }>(LIST_PORTFOLIOS, {\n    variables: {\n      workspaceId,\n      pagination: { first: 50 },\n      filter: {\n        ...(statusFilter !== 'all' ? { status: statusFilter } : {}),\n        ...(search.trim() ? { search: search.trim() } : {}),\n      },\n    },\n    skip: !workspaceId,\n  });\n\n  // Only before the first load: a refetch must not blank the page (it unmounts every component on it and\n  // loses their state).\n  if (loading && !data) {\n    return (\n      <div className=\"flex items-center justify-center p-12\">\n        <Loader2 className=\"h-8 w-8 animate-spin text-muted-foreground\" />\n      </div>\n    );\n  }\n\n  if (error) {\n    return <div className=\"p-6 text-destructive\">Failed to load portfolios: {error.message}</div>;\n  }\n\n  const portfolios = data?.planmagnetPortfolios.items ?? [];\n  const totalCount = data?.planmagnetPortfolios.totalCount ?? 0;\n  const statuses = ['all', ...PORTFOLIO_STATUSES];\n\n  return (\n    <div className=\"space-y-6 p-6\">\n      <div className=\"flex items-center justify-between\">\n        <div>\n          <h1 className=\"text-2xl font-semibold\">Portfolios</h1>\n          <p className=\"text-sm text-muted-foreground\">\n            {totalCount} portfolio{totalCount === 1 ? '' : 's'} across the workspace\n          </p>\n        </div>\n        <Button size=\"sm\" onClick={() => navigate('/products/create-portfolio-page')}>\n          <Plus className=\"mr-1 h-4 w-4\" />\n          New Portfolio\n        </Button>\n      </div>\n\n      <div className=\"flex flex-wrap items-center gap-4\">\n        <Input\n          aria-label=\"Search portfolios\"\n          placeholder=\"Search by name…\"\n          value={search}\n          onChange={(e) => setSearch(e.target.value)}\n          className=\"max-w-xs\"\n        />\n        <div className=\"flex items-center gap-2 flex-wrap\">\n          {statuses.map((s) => (\n            <button\n              key={s}\n              type=\"button\"\n              aria-pressed={statusFilter === s}\n              onClick={() => setStatusFilter(s)}\n              className={`px-2 py-1 text-xs rounded-md capitalize ${statusFilter === s ? 'bg-primary text-primary-foreground' : 'bg-muted text-muted-foreground'}`}\n            >\n              {s === 'all' ? 'All' : enumLabel(s)}\n            </button>\n          ))}\n        </div>\n      </div>\n\n      <div className=\"grid grid-cols-1 md:grid-cols-2 gap-4\">\n        {portfolios.map((pf) => (\n          <Card\n            key={pf.id}\n            {...rowLinkProps(\n              () => navigate(detailPath('/products/portfolio-detail-page', pf.id)),\n              pf.name\n            )}\n          >\n            <CardHeader className=\"pb-2\">\n              <div className=\"flex items-center justify-between gap-2\">\n                <CardTitle className=\"text-base flex items-center gap-2\">\n                  <Briefcase className=\"h-4 w-4 text-primary\" />\n                  {pf.name}\n                </CardTitle>\n                <Badge variant=\"outline\" className=\"text-xs\">\n                  {enumLabel(pf.status)}\n                </Badge>\n              </div>\n            </CardHeader>\n            <CardContent className=\"space-y-3\">\n              <p className=\"text-sm text-muted-foreground\">{pf.description ?? 'No description'}</p>\n              <div className=\"flex items-center gap-2 flex-wrap\">\n                {pf.alignment && (\n                  <Badge variant=\"secondary\" className=\"text-xs\">\n                    {pf.alignment === 'CUSTOM'\n                      ? (pf.alignmentLabel ?? 'Custom')\n                      : enumLabel(pf.alignment)}\n                  </Badge>\n                )}\n                {pf.fiscalPeriod && (\n                  <Badge variant=\"outline\" className=\"text-xs\">\n                    {pf.fiscalPeriod}\n                  </Badge>\n                )}\n              </div>\n              <div className=\"flex items-center justify-between text-xs text-muted-foreground border-t pt-2\">\n                <span>\n                  Owner: <PersonName id={pf.ownerId} />\n                </span>\n                <span>\n                  {pf.budgetTotal != null\n                    ? `${pf.currency ?? ''} ${pf.budgetTotal.toLocaleString()}`.trim()\n                    : 'No budget set'}\n                </span>\n              </div>\n            </CardContent>\n          </Card>\n        ))}\n      </div>\n      {portfolios.length === 0 && (\n        <p className=\"text-center text-muted-foreground py-8\">\n          {statusFilter !== 'all' || search\n            ? 'No portfolios match the selected filters.'\n            : 'No portfolios yet. Create one to group programs and projects for executive oversight.'}\n        </p>\n      )}\n    </div>\n  );\n}\n"],"mappings":"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"}

package/dist/planmagnet/pages/ProductsFeatureDetailPagePage.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ProductsFeatureDetailPagePage.d.ts","sourceRoot":"","sources":["../../../src/planmagnet/pages/ProductsFeatureDetailPagePage.tsx"],"names":[],"mappings":"AAyEA,wBAAgB,6BAA6B,4CA8Q5C"}
+{"version":3,"file":"ProductsFeatureDetailPagePage.d.ts","sourceRoot":"","sources":["../../../src/planmagnet/pages/ProductsFeatureDetailPagePage.tsx"],"names":[],"mappings":"AA0EA,wBAAgB,6BAA6B,4CAmQ5C"}