@burdenoff/microfe-planmagnet 2026.1002.2 → 2026.1008.1

package/dist/planmagnet/satisfaction/SatisfactionResponsesTable.js

@@ -0,0 +1,258 @@
+import { usePlanMagnetNavigate as e } from "../providers/PlanMagnetProvider.js";
+import { useTr as t } from "../../shared/hooks/useTr.js";
+import { isForbidden as n } from "../utils/graphqlErrors.js";
+import { throwOnError as r } from "../utils/mutationResult.js";
+import { ConfirmButton as i, ErrorLine as a } from "../controls/ConfirmButton.js";
+import { SCORE_SCALE as o, errorCode as s, formatUtcDay as c, releaseLabel as l, scoreCategory as u } from "./satisfaction.js";
+import { CATEGORY_CLASS as d, categoryLabel as f } from "./SatisfactionFigures.js";
+import { CUSTOMER_SATISFACTION_RESPONSES as p, DELETE_CUSTOMER_SATISFACTION_RESPONSE as m, SATISFACTION_QUERIES as h } from "./satisfactionOperations.js";
+import { detailPath as g } from "../utils/rowNavigation.js";
+import { refusalMessage as _ } from "../product/refusal.js";
+import { SatisfactionResponseDialog as v } from "./SatisfactionResponseDialog.js";
+import { useState as y } from "react";
+import { ChevronLeft as b, ChevronRight as x, Loader2 as S, Trash2 as C } from "lucide-react";
+import { useMutation as w, useQuery as T } from "@apollo/client/react";
+import { jsx as E, jsxs as D } from "react/jsx-runtime";
+import { Badge as O, Button as k, Table as A, TableBody as j, TableCell as M, TableHead as N, TableHeader as P, TableRow as F } from "@burdenoff/fe-libs/ui";
+//#region src/planmagnet/satisfaction/SatisfactionResponsesTable.tsx
+var I = 25, L = 180;
+function R({ text: e }) {
+	let n = t(), [r, i] = y(!1), a = e.length > L;
+	return /* @__PURE__ */ D("div", {
+		className: "min-w-48 max-w-md",
+		children: [/* @__PURE__ */ E("p", {
+			className: "whitespace-pre-wrap break-words text-sm",
+			children: a && !r ? `${e.slice(0, L).trimEnd()}…` : e
+		}), a && /* @__PURE__ */ E("button", {
+			type: "button",
+			className: "text-xs text-primary hover:underline",
+			"aria-expanded": r,
+			onClick: () => i((e) => !e),
+			children: r ? n("planmagnet.satisfaction.list.showLess", "Show less") : n("planmagnet.satisfaction.list.showMore", "Show more")
+		})]
+	});
+}
+function z({ label: e, onClick: t }) {
+	return /* @__PURE__ */ E("button", {
+		type: "button",
+		className: "block max-w-56 truncate text-left text-sm text-primary hover:underline",
+		onClick: t,
+		title: e,
+		children: e
+	});
+}
+function B({ response: n }) {
+	let r = t(), i = e(), a = (e) => /* @__PURE__ */ E("p", {
+		className: "text-sm text-muted-foreground",
+		children: e
+	});
+	return /* @__PURE__ */ D("div", {
+		className: "space-y-0.5",
+		children: [
+			n.product ? /* @__PURE__ */ E(z, {
+				label: n.product.name,
+				onClick: () => i(g("/products/product-detail-page", n.product?.id))
+			}) : n.productId && a(r("planmagnet.satisfaction.list.productDeleted", "Deleted product")),
+			n.release ? /* @__PURE__ */ E(z, {
+				label: l(n.release),
+				onClick: () => i(g("/products/release-detail-page", n.release?.id))
+			}) : n.releaseId && a(r("planmagnet.satisfaction.list.releaseDeleted", "Deleted release")),
+			n.project ? /* @__PURE__ */ E(z, {
+				label: n.project.name,
+				onClick: () => i(g("/projects/project-detail-page", n.project?.id))
+			}) : n.projectId && a(r("planmagnet.satisfaction.list.projectDeleted", "Deleted project"))
+		]
+	});
+}
+function V({ response: e }) {
+	let n = t();
+	return e.isAnonymous ? /* @__PURE__ */ E("span", {
+		className: "text-sm italic text-muted-foreground",
+		children: n("planmagnet.satisfaction.list.anonymous", "Anonymous")
+	}) : !e.respondentName && !e.respondentEmail ? /* @__PURE__ */ E("span", {
+		className: "text-sm text-muted-foreground",
+		children: n("planmagnet.satisfaction.list.notRecorded", "Not recorded")
+	}) : /* @__PURE__ */ D("div", {
+		className: "max-w-56 text-sm",
+		children: [e.respondentName && /* @__PURE__ */ E("p", {
+			className: "truncate",
+			children: e.respondentName
+		}), e.respondentEmail && /* @__PURE__ */ E("p", {
+			className: "truncate text-xs text-muted-foreground",
+			children: e.respondentEmail
+		})]
+	});
+}
+function H({ response: e, onDeleted: n, onFailed: a, onStale: o }) {
+	let l = t(), [u, d] = w(m, {
+		refetchQueries: h,
+		awaitRefetchQueries: !0
+	}), f = async () => {
+		try {
+			await r(u({ variables: { id: e.id } })), n();
+		} catch (e) {
+			a(_(e, l("planmagnet.satisfaction.errors.delete", "The response could not be deleted."), l("planmagnet.satisfaction.errors.forbidden", "Your role cannot change customer satisfaction responses in this workspace."))), s(e) === "NOT_FOUND" && o();
+		}
+	}, p = c(e.respondedAt);
+	return /* @__PURE__ */ E(i, {
+		label: "",
+		ariaLabel: l("planmagnet.satisfaction.actions.deleteNamed", "Delete the response of {{date}}", { date: p }),
+		variant: "outline",
+		icon: /* @__PURE__ */ E(C, { className: "h-4 w-4" }),
+		testId: "satisfaction-response-delete",
+		title: l("planmagnet.satisfaction.confirmDelete.title", "Delete this response?"),
+		description: l("planmagnet.satisfaction.confirmDelete.description", "The {{metric}} answer of {{date}} stops counting in every customer satisfaction figure. This cannot be undone here.", {
+			metric: e.metricType,
+			date: p
+		}),
+		confirmLabel: l("planmagnet.satisfaction.confirmDelete.confirm", "Delete response"),
+		cancelLabel: l("planmagnet.satisfaction.confirmDelete.cancel", "Keep it"),
+		destructive: !0,
+		disabled: d.loading,
+		onConfirm: () => void f()
+	});
+}
+function U({ workspaceId: e, filter: r, access: i, links: s, filtered: l, onNotice: m, onStale: h }) {
+	let g = t(), [_, C] = y([null]), w = _[_.length - 1], { data: L, previousData: z, loading: U, error: W } = T(p, { variables: {
+		workspaceId: e,
+		filter: r,
+		pagination: {
+			first: I,
+			...w ? { after: w } : {}
+		}
+	} }), G = (L ?? z)?.planmagnetCustomerSatisfactionResponses, K = G?.items ?? [], q = G?.totalCount ?? 0, J = (_.length - 1) * I, Y = i.canUpdate || i.canDelete;
+	return U && !G ? /* @__PURE__ */ D("div", {
+		className: "flex items-center gap-2 py-8 text-sm text-muted-foreground",
+		children: [/* @__PURE__ */ E(S, { className: "h-4 w-4 animate-spin" }), g("planmagnet.satisfaction.list.loading", "Loading responses…")]
+	}) : W && !G ? /* @__PURE__ */ E(a, { message: n(W) ? g("planmagnet.satisfaction.errors.readForbidden", "Your role cannot see customer satisfaction in this workspace.") : g("planmagnet.satisfaction.list.error", "The responses could not be loaded: {{message}}", { message: W.message }) }) : /* @__PURE__ */ D("div", {
+		className: "space-y-3",
+		"data-testid": "satisfaction-responses",
+		children: [
+			W && /* @__PURE__ */ E(a, { message: g("planmagnet.satisfaction.list.refreshError", "The list could not be refreshed: {{message}}", { message: W.message }) }),
+			K.length === 0 ? /* @__PURE__ */ E("p", {
+				className: "py-8 text-center text-sm text-muted-foreground",
+				"data-testid": "satisfaction-responses-empty",
+				children: _.length > 1 ? g("planmagnet.satisfaction.list.emptyPage", "This page has no responses left — go back to the previous page.") : l ? g("planmagnet.satisfaction.list.emptyFiltered", "No response matches these filters in this window.") : g("planmagnet.satisfaction.list.empty", "No responses in this window yet.")
+			}) : /* @__PURE__ */ E("div", {
+				className: "overflow-x-auto",
+				children: /* @__PURE__ */ D(A, { children: [/* @__PURE__ */ E(P, { children: /* @__PURE__ */ D(F, { children: [
+					/* @__PURE__ */ E(N, { children: g("planmagnet.satisfaction.list.answered", "Answered") }),
+					/* @__PURE__ */ E(N, { children: g("planmagnet.satisfaction.list.score", "Score") }),
+					/* @__PURE__ */ E(N, { children: g("planmagnet.satisfaction.list.respondent", "Respondent") }),
+					/* @__PURE__ */ E(N, { children: g("planmagnet.satisfaction.list.about", "About") }),
+					/* @__PURE__ */ E(N, { children: g("planmagnet.satisfaction.list.comment", "Comment") }),
+					/* @__PURE__ */ E(N, { children: g("planmagnet.satisfaction.list.source", "Source") }),
+					Y && /* @__PURE__ */ E(N, {
+						className: "text-right",
+						children: /* @__PURE__ */ E("span", {
+							className: "sr-only",
+							children: g("planmagnet.satisfaction.list.actions", "Actions")
+						})
+					})
+				] }) }), /* @__PURE__ */ E(j, { children: K.map((e) => {
+					let t = u(e.metricType, e.score);
+					return /* @__PURE__ */ D(F, {
+						"data-testid": "satisfaction-response-row",
+						children: [
+							/* @__PURE__ */ E(M, {
+								className: "whitespace-nowrap text-sm",
+								children: c(e.respondedAt)
+							}),
+							/* @__PURE__ */ E(M, {
+								className: "whitespace-nowrap",
+								children: /* @__PURE__ */ D("div", {
+									className: "flex items-center gap-2",
+									children: [
+										/* @__PURE__ */ E(O, {
+											variant: "outline",
+											className: "text-xs",
+											children: e.metricType
+										}),
+										/* @__PURE__ */ E("span", {
+											className: "font-medium tabular-nums",
+											children: g("planmagnet.satisfaction.list.scoreOf", "{{score}} / {{max}}", {
+												score: e.score,
+												max: o[e.metricType].max
+											})
+										}),
+										/* @__PURE__ */ E("span", {
+											className: `rounded px-1.5 py-0.5 text-xs ${d[t]}`,
+											children: f(g, t)
+										})
+									]
+								})
+							}),
+							/* @__PURE__ */ E(M, { children: /* @__PURE__ */ E(V, { response: e }) }),
+							/* @__PURE__ */ E(M, { children: /* @__PURE__ */ E(B, { response: e }) }),
+							/* @__PURE__ */ E(M, { children: e.comment ? /* @__PURE__ */ E(R, { text: e.comment }) : /* @__PURE__ */ E("span", {
+								className: "text-sm text-muted-foreground",
+								children: "—"
+							}) }),
+							/* @__PURE__ */ D(M, {
+								className: "text-xs text-muted-foreground",
+								children: [/* @__PURE__ */ E("p", { children: e.source === "IMPORT" ? g("planmagnet.satisfaction.list.sourceImport", "Imported") : g("planmagnet.satisfaction.list.sourceManual", "Entered") }), e.externalId && /* @__PURE__ */ E("p", {
+									className: "max-w-40 truncate font-mono",
+									title: e.externalId,
+									children: e.externalId
+								})]
+							}),
+							Y && /* @__PURE__ */ E(M, {
+								className: "text-right",
+								children: /* @__PURE__ */ D("div", {
+									className: "flex justify-end gap-1",
+									children: [i.canUpdate && /* @__PURE__ */ E(v, {
+										response: e,
+										links: s,
+										onSaved: () => m(g("planmagnet.satisfaction.notice.updated", "The response was saved."), "status"),
+										onStale: h
+									}), i.canDelete && /* @__PURE__ */ E(H, {
+										response: e,
+										onDeleted: () => m(g("planmagnet.satisfaction.notice.deleted", "The response was deleted. It no longer counts in any figure."), "status"),
+										onFailed: (e) => m(e, "alert"),
+										onStale: h
+									})]
+								})
+							})
+						]
+					}, e.id);
+				}) })] })
+			}),
+			(q > 0 || _.length > 1) && /* @__PURE__ */ D("div", {
+				className: "flex flex-wrap items-center justify-between gap-2",
+				children: [/* @__PURE__ */ E("p", {
+					className: "text-xs text-muted-foreground",
+					"data-testid": "satisfaction-responses-range",
+					children: K.length > 0 ? g("planmagnet.satisfaction.list.range", "Showing {{from}}–{{to}} of {{total}}", {
+						from: J + 1,
+						to: J + K.length,
+						total: q
+					}) : ""
+				}), /* @__PURE__ */ D("div", {
+					className: "flex gap-2",
+					children: [/* @__PURE__ */ D(k, {
+						size: "sm",
+						variant: "outline",
+						disabled: _.length === 1 || U,
+						onClick: () => C((e) => e.slice(0, -1)),
+						"data-testid": "satisfaction-responses-previous",
+						children: [/* @__PURE__ */ E(b, { className: "mr-1 h-4 w-4" }), g("planmagnet.satisfaction.list.previous", "Previous")]
+					}), /* @__PURE__ */ D(k, {
+						size: "sm",
+						variant: "outline",
+						disabled: !G?.pageInfo.hasNextPage || !G.pageInfo.endCursor || U,
+						onClick: () => {
+							let e = G?.pageInfo.endCursor;
+							e && C((t) => [...t, e]);
+						},
+						"data-testid": "satisfaction-responses-next",
+						children: [g("planmagnet.satisfaction.list.next", "Next"), /* @__PURE__ */ E(x, { className: "ml-1 h-4 w-4" })]
+					})]
+				})]
+			})
+		]
+	});
+}
+//#endregion
+export { U as SatisfactionResponsesTable };
+
+//# sourceMappingURL=SatisfactionResponsesTable.js.map

package/dist/planmagnet/satisfaction/SatisfactionResponsesTable.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SatisfactionResponsesTable.js","names":[],"sources":["../../../src/planmagnet/satisfaction/SatisfactionResponsesTable.tsx"],"sourcesContent":["import { useState } from 'react';\nimport { useMutation, useQuery } from '@apollo/client/react';\nimport {\n  Badge,\n  Button,\n  Table,\n  TableBody,\n  TableCell,\n  TableHead,\n  TableHeader,\n  TableRow,\n} from '@burdenoff/fe-libs/ui';\nimport { ChevronLeft, ChevronRight, Loader2, Trash2 } from 'lucide-react';\nimport { useTr } from '../../shared/hooks/useTr';\nimport { ConfirmButton, ErrorLine } from '../controls/ConfirmButton';\nimport { usePlanMagnetNavigate } from '../providers/PlanMagnetProvider';\nimport { refusalMessage } from '../product/refusal';\nimport { isForbidden } from '../utils/graphqlErrors';\nimport { throwOnError } from '../utils/mutationResult';\nimport { detailPath } from '../utils/rowNavigation';\nimport { CATEGORY_CLASS, categoryLabel } from './SatisfactionFigures';\nimport { SatisfactionResponseDialog } from './SatisfactionResponseDialog';\nimport {\n  SCORE_SCALE,\n  errorCode,\n  formatUtcDay,\n  releaseLabel,\n  scoreCategory,\n  type SatisfactionMetricType,\n  type SatisfactionWindowInput,\n} from './satisfaction';\nimport type { FormLinks } from './satisfactionForm';\nimport {\n  CUSTOMER_SATISFACTION_RESPONSES,\n  DELETE_CUSTOMER_SATISFACTION_RESPONSE,\n  SATISFACTION_QUERIES,\n  type CustomerSatisfactionResponsesData,\n  type SatisfactionResponse,\n} from './satisfactionOperations';\nimport type { SatisfactionAccess } from './useSatisfactionAccess';\n\n/**\n * The responses behind the figures, newest answer first, a page at a time — the same window and filters as the figures\n * above them, so the list and the numbers always agree. Product managers edit and delete from here; viewers read.\n */\n\nconst PAGE_SIZE = 25;\n/** Longer comments are cut here until \"Show more\". */\nconst COMMENT_PREVIEW = 180;\n\nexport interface ResponsesFilter {\n  productId?: string;\n  releaseId?: string;\n  projectId?: string;\n  metricType?: SatisfactionMetricType;\n  window: SatisfactionWindowInput;\n}\n\nfunction Comment({ text }: { text: string }) {\n  const tr = useTr();\n  const [expanded, setExpanded] = useState(false);\n  const long = text.length > COMMENT_PREVIEW;\n  return (\n    <div className=\"min-w-48 max-w-md\">\n      <p className=\"whitespace-pre-wrap break-words text-sm\">\n        {long && !expanded ? `${text.slice(0, COMMENT_PREVIEW).trimEnd()}…` : text}\n      </p>\n      {long && (\n        <button\n          type=\"button\"\n          className=\"text-xs text-primary hover:underline\"\n          aria-expanded={expanded}\n          onClick={() => setExpanded((v) => !v)}\n        >\n          {expanded\n            ? tr('planmagnet.satisfaction.list.showLess', 'Show less')\n            : tr('planmagnet.satisfaction.list.showMore', 'Show more')}\n        </button>\n      )}\n    </div>\n  );\n}\n\nfunction LinkButton({ label, onClick }: { label: string; onClick: () => void }) {\n  return (\n    <button\n      type=\"button\"\n      className=\"block max-w-56 truncate text-left text-sm text-primary hover:underline\"\n      onClick={onClick}\n      title={label}\n    >\n      {label}\n    </button>\n  );\n}\n\nfunction About({ response }: { response: SatisfactionResponse }) {\n  const tr = useTr();\n  const navigate = usePlanMagnetNavigate();\n  const deleted = (text: string) => <p className=\"text-sm text-muted-foreground\">{text}</p>;\n  return (\n    <div className=\"space-y-0.5\">\n      {response.product ? (\n        <LinkButton\n          label={response.product.name}\n          onClick={() =>\n            navigate(detailPath('/products/product-detail-page', response.product?.id))\n          }\n        />\n      ) : (\n        response.productId &&\n        deleted(tr('planmagnet.satisfaction.list.productDeleted', 'Deleted product'))\n      )}\n      {response.release ? (\n        <LinkButton\n          label={releaseLabel(response.release)}\n          onClick={() =>\n            navigate(detailPath('/products/release-detail-page', response.release?.id))\n          }\n        />\n      ) : (\n        response.releaseId &&\n        deleted(tr('planmagnet.satisfaction.list.releaseDeleted', 'Deleted release'))\n      )}\n      {response.project ? (\n        <LinkButton\n          label={response.project.name}\n          onClick={() =>\n            navigate(detailPath('/projects/project-detail-page', response.project?.id))\n          }\n        />\n      ) : (\n        response.projectId &&\n        deleted(tr('planmagnet.satisfaction.list.projectDeleted', 'Deleted project'))\n      )}\n    </div>\n  );\n}\n\nfunction Respondent({ response }: { response: SatisfactionResponse }) {\n  const tr = useTr();\n  if (response.isAnonymous) {\n    return (\n      <span className=\"text-sm italic text-muted-foreground\">\n        {tr('planmagnet.satisfaction.list.anonymous', 'Anonymous')}\n      </span>\n    );\n  }\n  if (!response.respondentName && !response.respondentEmail) {\n    return (\n      <span className=\"text-sm text-muted-foreground\">\n        {tr('planmagnet.satisfaction.list.notRecorded', 'Not recorded')}\n      </span>\n    );\n  }\n  return (\n    <div className=\"max-w-56 text-sm\">\n      {response.respondentName && <p className=\"truncate\">{response.respondentName}</p>}\n      {response.respondentEmail && (\n        <p className=\"truncate text-xs text-muted-foreground\">{response.respondentEmail}</p>\n      )}\n    </div>\n  );\n}\n\nfunction DeleteResponse({\n  response,\n  onDeleted,\n  onFailed,\n  onStale,\n}: {\n  response: SatisfactionResponse;\n  onDeleted: () => void;\n  onFailed: (message: string) => void;\n  onStale: () => void;\n}) {\n  const tr = useTr();\n  const [remove, removeState] = useMutation(DELETE_CUSTOMER_SATISFACTION_RESPONSE, {\n    refetchQueries: SATISFACTION_QUERIES,\n    awaitRefetchQueries: true,\n  });\n  const onConfirm = async () => {\n    try {\n      await throwOnError(remove({ variables: { id: response.id } }));\n      onDeleted();\n    } catch (e) {\n      onFailed(\n        refusalMessage(\n          e,\n          tr('planmagnet.satisfaction.errors.delete', 'The response could not be deleted.'),\n          tr(\n            'planmagnet.satisfaction.errors.forbidden',\n            'Your role cannot change customer satisfaction responses in this workspace.'\n          )\n        )\n      );\n      if (errorCode(e) === 'NOT_FOUND') onStale();\n    }\n  };\n  const date = formatUtcDay(response.respondedAt);\n  return (\n    <ConfirmButton\n      label=\"\"\n      ariaLabel={tr(\n        'planmagnet.satisfaction.actions.deleteNamed',\n        'Delete the response of {{date}}',\n        {\n          date,\n        }\n      )}\n      variant=\"outline\"\n      icon={<Trash2 className=\"h-4 w-4\" />}\n      testId=\"satisfaction-response-delete\"\n      title={tr('planmagnet.satisfaction.confirmDelete.title', 'Delete this response?')}\n      description={tr(\n        'planmagnet.satisfaction.confirmDelete.description',\n        'The {{metric}} answer of {{date}} stops counting in every customer satisfaction figure. This cannot be undone here.',\n        { metric: response.metricType, date }\n      )}\n      confirmLabel={tr('planmagnet.satisfaction.confirmDelete.confirm', 'Delete response')}\n      cancelLabel={tr('planmagnet.satisfaction.confirmDelete.cancel', 'Keep it')}\n      destructive\n      disabled={removeState.loading}\n      onConfirm={() => void onConfirm()}\n    />\n  );\n}\n\nexport function SatisfactionResponsesTable({\n  workspaceId,\n  filter,\n  access,\n  links,\n  filtered,\n  onNotice,\n  onStale,\n}: {\n  workspaceId: string;\n  filter: ResponsesFilter;\n  access: SatisfactionAccess;\n  /** A new response's starting links (the page's filters). */\n  links: FormLinks;\n  /** True when any product / release / project / metric filter is set — for the empty-state wording. */\n  filtered: boolean;\n  onNotice: (message: string, tone: 'status' | 'alert') => void;\n  onStale: () => void;\n}) {\n  const tr = useTr();\n  // Cursors of the pages visited so far; the last one is the page on screen (null = the first page).\n  const [cursors, setCursors] = useState<(string | null)[]>([null]);\n  const after = cursors[cursors.length - 1];\n  const { data, previousData, loading, error } = useQuery<CustomerSatisfactionResponsesData>(\n    CUSTOMER_SATISFACTION_RESPONSES,\n    {\n      variables: {\n        workspaceId,\n        filter,\n        pagination: { first: PAGE_SIZE, ...(after ? { after } : {}) },\n      },\n    }\n  );\n  // Paging keeps the current rows on screen until the next page arrives.\n  const list = (data ?? previousData)?.planmagnetCustomerSatisfactionResponses;\n  const items = list?.items ?? [];\n  const total = list?.totalCount ?? 0;\n  const firstIndex = (cursors.length - 1) * PAGE_SIZE;\n  const writes = access.canUpdate || access.canDelete;\n\n  if (loading && !list) {\n    return (\n      <div className=\"flex items-center gap-2 py-8 text-sm text-muted-foreground\">\n        <Loader2 className=\"h-4 w-4 animate-spin\" />\n        {tr('planmagnet.satisfaction.list.loading', 'Loading responses…')}\n      </div>\n    );\n  }\n  if (error && !list) {\n    return (\n      <ErrorLine\n        message={\n          isForbidden(error)\n            ? tr(\n                'planmagnet.satisfaction.errors.readForbidden',\n                'Your role cannot see customer satisfaction in this workspace.'\n              )\n            : tr(\n                'planmagnet.satisfaction.list.error',\n                'The responses could not be loaded: {{message}}',\n                {\n                  message: error.message,\n                }\n              )\n        }\n      />\n    );\n  }\n\n  return (\n    <div className=\"space-y-3\" data-testid=\"satisfaction-responses\">\n      {error && (\n        <ErrorLine\n          message={tr(\n            'planmagnet.satisfaction.list.refreshError',\n            'The list could not be refreshed: {{message}}',\n            { message: error.message }\n          )}\n        />\n      )}\n      {items.length === 0 ? (\n        <p\n          className=\"py-8 text-center text-sm text-muted-foreground\"\n          data-testid=\"satisfaction-responses-empty\"\n        >\n          {cursors.length > 1\n            ? tr(\n                'planmagnet.satisfaction.list.emptyPage',\n                'This page has no responses left — go back to the previous page.'\n              )\n            : filtered\n              ? tr(\n                  'planmagnet.satisfaction.list.emptyFiltered',\n                  'No response matches these filters in this window.'\n                )\n              : tr('planmagnet.satisfaction.list.empty', 'No responses in this window yet.')}\n        </p>\n      ) : (\n        <div className=\"overflow-x-auto\">\n          <Table>\n            <TableHeader>\n              <TableRow>\n                <TableHead>{tr('planmagnet.satisfaction.list.answered', 'Answered')}</TableHead>\n                <TableHead>{tr('planmagnet.satisfaction.list.score', 'Score')}</TableHead>\n                <TableHead>{tr('planmagnet.satisfaction.list.respondent', 'Respondent')}</TableHead>\n                <TableHead>{tr('planmagnet.satisfaction.list.about', 'About')}</TableHead>\n                <TableHead>{tr('planmagnet.satisfaction.list.comment', 'Comment')}</TableHead>\n                <TableHead>{tr('planmagnet.satisfaction.list.source', 'Source')}</TableHead>\n                {writes && (\n                  <TableHead className=\"text-right\">\n                    <span className=\"sr-only\">\n                      {tr('planmagnet.satisfaction.list.actions', 'Actions')}\n                    </span>\n                  </TableHead>\n                )}\n              </TableRow>\n            </TableHeader>\n            <TableBody>\n              {items.map((response) => {\n                const category = scoreCategory(response.metricType, response.score);\n                return (\n                  <TableRow key={response.id} data-testid=\"satisfaction-response-row\">\n                    <TableCell className=\"whitespace-nowrap text-sm\">\n                      {formatUtcDay(response.respondedAt)}\n                    </TableCell>\n                    <TableCell className=\"whitespace-nowrap\">\n                      <div className=\"flex items-center gap-2\">\n                        <Badge variant=\"outline\" className=\"text-xs\">\n                          {response.metricType}\n                        </Badge>\n                        <span className=\"font-medium tabular-nums\">\n                          {tr('planmagnet.satisfaction.list.scoreOf', '{{score}} / {{max}}', {\n                            score: response.score,\n                            max: SCORE_SCALE[response.metricType].max,\n                          })}\n                        </span>\n                        <span\n                          className={`rounded px-1.5 py-0.5 text-xs ${CATEGORY_CLASS[category]}`}\n                        >\n                          {categoryLabel(tr, category)}\n                        </span>\n                      </div>\n                    </TableCell>\n                    <TableCell>\n                      <Respondent response={response} />\n                    </TableCell>\n                    <TableCell>\n                      <About response={response} />\n                    </TableCell>\n                    <TableCell>\n                      {response.comment ? (\n                        <Comment text={response.comment} />\n                      ) : (\n                        <span className=\"text-sm text-muted-foreground\">—</span>\n                      )}\n                    </TableCell>\n                    <TableCell className=\"text-xs text-muted-foreground\">\n                      <p>\n                        {response.source === 'IMPORT'\n                          ? tr('planmagnet.satisfaction.list.sourceImport', 'Imported')\n                          : tr('planmagnet.satisfaction.list.sourceManual', 'Entered')}\n                      </p>\n                      {response.externalId && (\n                        <p className=\"max-w-40 truncate font-mono\" title={response.externalId}>\n                          {response.externalId}\n                        </p>\n                      )}\n                    </TableCell>\n                    {writes && (\n                      <TableCell className=\"text-right\">\n                        <div className=\"flex justify-end gap-1\">\n                          {access.canUpdate && (\n                            <SatisfactionResponseDialog\n                              response={response}\n                              links={links}\n                              onSaved={() =>\n                                onNotice(\n                                  tr(\n                                    'planmagnet.satisfaction.notice.updated',\n                                    'The response was saved.'\n                                  ),\n                                  'status'\n                                )\n                              }\n                              onStale={onStale}\n                            />\n                          )}\n                          {access.canDelete && (\n                            <DeleteResponse\n                              response={response}\n                              onDeleted={() =>\n                                onNotice(\n                                  tr(\n                                    'planmagnet.satisfaction.notice.deleted',\n                                    'The response was deleted. It no longer counts in any figure.'\n                                  ),\n                                  'status'\n                                )\n                              }\n                              onFailed={(message) => onNotice(message, 'alert')}\n                              onStale={onStale}\n                            />\n                          )}\n                        </div>\n                      </TableCell>\n                    )}\n                  </TableRow>\n                );\n              })}\n            </TableBody>\n          </Table>\n        </div>\n      )}\n\n      {(total > 0 || cursors.length > 1) && (\n        <div className=\"flex flex-wrap items-center justify-between gap-2\">\n          <p className=\"text-xs text-muted-foreground\" data-testid=\"satisfaction-responses-range\">\n            {items.length > 0\n              ? tr('planmagnet.satisfaction.list.range', 'Showing {{from}}–{{to}} of {{total}}', {\n                  from: firstIndex + 1,\n                  to: firstIndex + items.length,\n                  total,\n                })\n              : ''}\n          </p>\n          <div className=\"flex gap-2\">\n            <Button\n              size=\"sm\"\n              variant=\"outline\"\n              disabled={cursors.length === 1 || loading}\n              onClick={() => setCursors((c) => c.slice(0, -1))}\n              data-testid=\"satisfaction-responses-previous\"\n            >\n              <ChevronLeft className=\"mr-1 h-4 w-4\" />\n              {tr('planmagnet.satisfaction.list.previous', 'Previous')}\n            </Button>\n            <Button\n              size=\"sm\"\n              variant=\"outline\"\n              disabled={!list?.pageInfo.hasNextPage || !list.pageInfo.endCursor || loading}\n              onClick={() => {\n                const next = list?.pageInfo.endCursor;\n                if (next) setCursors((c) => [...c, next]);\n              }}\n              data-testid=\"satisfaction-responses-next\"\n            >\n              {tr('planmagnet.satisfaction.list.next', 'Next')}\n              <ChevronRight className=\"ml-1 h-4 w-4\" />\n            </Button>\n          </div>\n        </div>\n      )}\n    </div>\n  );\n}\n"],"mappings":"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"}

package/dist/planmagnet/satisfaction/SatisfactionSummaryCard.d.ts

@@ -0,0 +1,6 @@
+import { SatisfactionScope } from './satisfaction';
+
+export declare function SatisfactionSummaryCard({ scope }: {
+    scope: SatisfactionScope;
+}): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=SatisfactionSummaryCard.d.ts.map

package/dist/planmagnet/satisfaction/SatisfactionSummaryCard.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SatisfactionSummaryCard.d.ts","sourceRoot":"","sources":["../../../src/planmagnet/satisfaction/SatisfactionSummaryCard.tsx"],"names":[],"mappings":"AAOA,OAAO,EAGL,KAAK,iBAAiB,EAEvB,MAAM,gBAAgB,CAAC;AAcxB,wBAAgB,uBAAuB,CAAC,EAAE,KAAK,EAAE,EAAE;IAAE,KAAK,EAAE,iBAAiB,CAAA;CAAE,2CAkE9E"}

package/dist/planmagnet/satisfaction/SatisfactionSummaryCard.js

@@ -0,0 +1,56 @@
+import { usePlanMagnet as e, usePlanMagnetNavigate as t } from "../providers/PlanMagnetProvider.js";
+import { useTr as n } from "../../shared/hooks/useTr.js";
+import { isForbidden as r } from "../utils/graphqlErrors.js";
+import { DEFAULT_WINDOW_PRESET as i, satisfactionPageLink as a } from "./satisfaction.js";
+import { CompactSatisfactionFigures as o } from "./SatisfactionFigures.js";
+import { CUSTOMER_SATISFACTION_SUMMARY as s } from "./satisfactionOperations.js";
+import { ArrowRight as c, Loader2 as l, Smile as u } from "lucide-react";
+import { useQuery as d } from "@apollo/client/react";
+import { jsx as f, jsxs as p } from "react/jsx-runtime";
+import { Button as m, Card as h, CardContent as g, CardHeader as _, CardTitle as v } from "@burdenoff/fe-libs/ui";
+//#region src/planmagnet/satisfaction/SatisfactionSummaryCard.tsx
+var y = { preset: i };
+function b({ scope: i }) {
+	let b = n(), x = i.releaseId ? b("planmagnet.satisfaction.card.releaseScope", "Responses about this release.") : i.productId ? b("planmagnet.satisfaction.card.productScope", "Responses about this product, and about its releases that name no product of their own.") : b("planmagnet.satisfaction.card.projectScope", "Responses about this project."), { workspaceId: S } = e(), C = t(), { data: w, loading: T, error: E } = d(s, {
+		variables: {
+			workspaceId: S ?? "",
+			filter: {
+				...i,
+				window: y
+			}
+		},
+		skip: !S
+	}), D = w?.planmagnetCustomerSatisfaction;
+	return /* @__PURE__ */ p(h, {
+		"data-testid": "satisfaction-summary-card",
+		children: [/* @__PURE__ */ p(_, {
+			className: "flex flex-row items-start justify-between gap-2 space-y-0",
+			children: [/* @__PURE__ */ p("div", { children: [/* @__PURE__ */ p(v, {
+				className: "flex items-center gap-2",
+				children: [/* @__PURE__ */ f(u, {
+					className: "h-4 w-4",
+					"aria-hidden": !0
+				}), b("planmagnet.satisfaction.card.title", "Customer satisfaction")]
+			}), /* @__PURE__ */ f("p", {
+				className: "mt-1 text-xs text-muted-foreground",
+				children: x
+			})] }), /* @__PURE__ */ p(m, {
+				size: "sm",
+				variant: "ghost",
+				onClick: () => C(a(i)),
+				"data-testid": "satisfaction-summary-open",
+				children: [b("planmagnet.satisfaction.card.open", "Responses"), /* @__PURE__ */ f(c, { className: "ml-1 h-4 w-4" })]
+			})]
+		}), /* @__PURE__ */ f(g, { children: T && !D ? /* @__PURE__ */ p("p", {
+			className: "flex items-center gap-2 text-sm text-muted-foreground",
+			children: [/* @__PURE__ */ f(l, { className: "h-4 w-4 animate-spin" }), b("planmagnet.satisfaction.loading", "Loading…")]
+		}) : E && !D ? /* @__PURE__ */ f("p", {
+			className: "text-sm text-status-error-text",
+			children: r(E) ? b("planmagnet.satisfaction.errors.readForbidden", "Your role cannot see customer satisfaction in this workspace.") : b("planmagnet.satisfaction.errors.load", "Customer satisfaction could not be loaded: {{message}}", { message: E.message })
+		}) : D ? /* @__PURE__ */ f(o, { summary: D }) : null })]
+	});
+}
+//#endregion
+export { b as SatisfactionSummaryCard };
+
+//# sourceMappingURL=SatisfactionSummaryCard.js.map

package/dist/planmagnet/satisfaction/SatisfactionSummaryCard.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SatisfactionSummaryCard.js","names":[],"sources":["../../../src/planmagnet/satisfaction/SatisfactionSummaryCard.tsx"],"sourcesContent":["import { useQuery } from '@apollo/client/react';\nimport { Button, Card, CardContent, CardHeader, CardTitle } from '@burdenoff/fe-libs/ui';\nimport { ArrowRight, Loader2, Smile } from 'lucide-react';\nimport { useTr } from '../../shared/hooks/useTr';\nimport { usePlanMagnet, usePlanMagnetNavigate } from '../providers/PlanMagnetProvider';\nimport { isForbidden } from '../utils/graphqlErrors';\nimport { CompactSatisfactionFigures } from './SatisfactionFigures';\nimport {\n  DEFAULT_WINDOW_PRESET,\n  satisfactionPageLink,\n  type SatisfactionScope,\n  type SatisfactionWindowInput,\n} from './satisfaction';\nimport {\n  CUSTOMER_SATISFACTION_SUMMARY,\n  type CustomerSatisfactionSummaryData,\n} from './satisfactionOperations';\n\n/**\n * CSAT and NPS for one scope, as a card on another page — the product page (responses about the product, and about\n * its releases that name no product of their own) and the release page (responses about that release). Its own query:\n * a role that cannot read customer satisfaction, or any failure here, leaves the rest of the page alone.\n */\n\nconst DEFAULT_WINDOW: SatisfactionWindowInput = { preset: DEFAULT_WINDOW_PRESET };\n\nexport function SatisfactionSummaryCard({ scope }: { scope: SatisfactionScope }) {\n  const tr = useTr();\n  const description = scope.releaseId\n    ? tr('planmagnet.satisfaction.card.releaseScope', 'Responses about this release.')\n    : scope.productId\n      ? tr(\n          'planmagnet.satisfaction.card.productScope',\n          'Responses about this product, and about its releases that name no product of their own.'\n        )\n      : tr('planmagnet.satisfaction.card.projectScope', 'Responses about this project.');\n  const { workspaceId } = usePlanMagnet();\n  const navigate = usePlanMagnetNavigate();\n  const { data, loading, error } = useQuery<CustomerSatisfactionSummaryData>(\n    CUSTOMER_SATISFACTION_SUMMARY,\n    {\n      variables: { workspaceId: workspaceId ?? '', filter: { ...scope, window: DEFAULT_WINDOW } },\n      skip: !workspaceId,\n    }\n  );\n  const summary = data?.planmagnetCustomerSatisfaction;\n\n  return (\n    <Card data-testid=\"satisfaction-summary-card\">\n      <CardHeader className=\"flex flex-row items-start justify-between gap-2 space-y-0\">\n        <div>\n          <CardTitle className=\"flex items-center gap-2\">\n            <Smile className=\"h-4 w-4\" aria-hidden={true} />\n            {tr('planmagnet.satisfaction.card.title', 'Customer satisfaction')}\n          </CardTitle>\n          <p className=\"mt-1 text-xs text-muted-foreground\">{description}</p>\n        </div>\n        <Button\n          size=\"sm\"\n          variant=\"ghost\"\n          onClick={() => navigate(satisfactionPageLink(scope))}\n          data-testid=\"satisfaction-summary-open\"\n        >\n          {tr('planmagnet.satisfaction.card.open', 'Responses')}\n          <ArrowRight className=\"ml-1 h-4 w-4\" />\n        </Button>\n      </CardHeader>\n      <CardContent>\n        {loading && !summary ? (\n          <p className=\"flex items-center gap-2 text-sm text-muted-foreground\">\n            <Loader2 className=\"h-4 w-4 animate-spin\" />\n            {tr('planmagnet.satisfaction.loading', 'Loading…')}\n          </p>\n        ) : error && !summary ? (\n          <p className=\"text-sm text-status-error-text\">\n            {isForbidden(error)\n              ? tr(\n                  'planmagnet.satisfaction.errors.readForbidden',\n                  'Your role cannot see customer satisfaction in this workspace.'\n                )\n              : tr(\n                  'planmagnet.satisfaction.errors.load',\n                  'Customer satisfaction could not be loaded: {{message}}',\n                  { message: error.message }\n                )}\n          </p>\n        ) : summary ? (\n          <CompactSatisfactionFigures summary={summary} />\n        ) : null}\n      </CardContent>\n    </Card>\n  );\n}\n"],"mappings":";;;;;;;;;;;AAwBA,IAAM,IAA0C,EAAE,QAAQ,GAAuB;AAEjF,SAAgB,EAAwB,EAAE,YAAuC;CAC/E,IAAM,IAAK,GAAO,EACZ,IAAc,EAAM,YACtB,EAAG,6CAA6C,gCAAgC,GAChF,EAAM,YACJ,EACE,6CACA,0FACD,GACD,EAAG,6CAA6C,gCAAgC,EAChF,EAAE,mBAAgB,GAAe,EACjC,IAAW,GAAuB,EAClC,EAAE,SAAM,YAAS,aAAU,EAC/B,GACA;EACE,WAAW;GAAE,aAAa,KAAe;GAAI,QAAQ;IAAE,GAAG;IAAO,QAAQ;IAAgB;GAAE;EAC3F,MAAM,CAAC;EACR,CACF,EACK,IAAU,GAAM;AAEtB,QACE,kBAAC,GAAD;EAAM,eAAY;YAAlB,CACE,kBAAC,GAAD;GAAY,WAAU;aAAtB,CACE,kBAAC,OAAD,EAAA,UAAA,CACE,kBAAC,GAAD;IAAW,WAAU;cAArB,CACE,kBAAC,GAAD;KAAO,WAAU;KAAU,eAAa;KAAQ,CAAA,EAC/C,EAAG,sCAAsC,wBAAwB,CACxD;OACZ,kBAAC,KAAD;IAAG,WAAU;cAAsC;IAAgB,CAAA,CAC/D,EAAA,CAAA,EACN,kBAAC,GAAD;IACE,MAAK;IACL,SAAQ;IACR,eAAe,EAAS,EAAqB,EAAM,CAAC;IACpD,eAAY;cAJd,CAMG,EAAG,qCAAqC,YAAY,EACrD,kBAAC,GAAD,EAAY,WAAU,gBAAiB,CAAA,CAChC;MACE;MACb,kBAAC,GAAD,EAAA,UACG,KAAW,CAAC,IACX,kBAAC,KAAD;GAAG,WAAU;aAAb,CACE,kBAAC,GAAD,EAAS,WAAU,wBAAyB,CAAA,EAC3C,EAAG,mCAAmC,WAAW,CAChD;OACF,KAAS,CAAC,IACZ,kBAAC,KAAD;GAAG,WAAU;aACV,EAAY,EAAM,GACf,EACE,gDACA,gEACD,GACD,EACE,uCACA,0DACA,EAAE,SAAS,EAAM,SAAS,CAC3B;GACH,CAAA,GACF,IACF,kBAAC,GAAD,EAAqC,YAAW,CAAA,GAC9C,MACQ,CAAA,CACT"}

package/dist/planmagnet/satisfaction/SatisfactionWindowPicker.d.ts

@@ -0,0 +1,16 @@
+import { WindowChoice } from './satisfaction';
+import { SatisfactionWindowEcho } from './satisfactionOperations';
+
+/**
+ * The window a satisfaction figure covers: the trailing 30 / 90 / 180 / 365 days (90 by default), or custom days.
+ * Custom days are whole UTC days, both included — the same days the service counts. Switching to custom starts from
+ * the days the figures currently cover, so nothing jumps.
+ */
+export declare function SatisfactionWindowPicker({ value, onChange, current, idPrefix, }: {
+    value: WindowChoice;
+    onChange: (next: WindowChoice) => void;
+    /** The window the figures on screen cover, as the service resolved it. */
+    current: SatisfactionWindowEcho | null;
+    idPrefix?: string;
+}): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=SatisfactionWindowPicker.d.ts.map

package/dist/planmagnet/satisfaction/SatisfactionWindowPicker.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SatisfactionWindowPicker.d.ts","sourceRoot":"","sources":["../../../src/planmagnet/satisfaction/SatisfactionWindowPicker.tsx"],"names":[],"mappings":"AAGA,OAAO,EAKL,KAAK,YAAY,EAElB,MAAM,gBAAgB,CAAC;AACxB,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,0BAA0B,CAAC;AAEvE;;;;GAIG;AACH,wBAAgB,wBAAwB,CAAC,EACvC,KAAK,EACL,QAAQ,EACR,OAAO,EACP,QAAgC,GACjC,EAAE;IACD,KAAK,EAAE,YAAY,CAAC;IACpB,QAAQ,EAAE,CAAC,IAAI,EAAE,YAAY,KAAK,IAAI,CAAC;IACvC,0EAA0E;IAC1E,OAAO,EAAE,sBAAsB,GAAG,IAAI,CAAC;IACvC,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB,2CAyFA"}

package/dist/planmagnet/satisfaction/SatisfactionWindowPicker.js

@@ -0,0 +1,102 @@
+import { useTr as e } from "../../shared/hooks/useTr.js";
+import { WINDOW_PRESETS as t, isCalendarDay as n, presetDays as r, utcDay as i } from "./satisfaction.js";
+import { windowPresetLabel as a } from "./SatisfactionFigures.js";
+import { jsx as o, jsxs as s } from "react/jsx-runtime";
+import { Input as c } from "@burdenoff/fe-libs/ui";
+//#region src/planmagnet/satisfaction/SatisfactionWindowPicker.tsx
+function l({ value: l, onChange: u, current: d, idPrefix: f = "satisfaction-window" }) {
+	let p = e(), m = l.preset === "CUSTOM", h = m && (!n(l.from) || !n(l.to)), g = m && !h && l.from > l.to, _ = (e) => {
+		if (e !== "CUSTOM") {
+			u({
+				preset: e,
+				from: l.from,
+				to: l.to
+			});
+			return;
+		}
+		if (l.preset === "CUSTOM") return;
+		let t = d ? i(d.from) : null, n = d ? i(d.to) : null;
+		u({
+			preset: "CUSTOM",
+			...t && n ? {
+				from: t,
+				to: n
+			} : r("LAST_90_DAYS", /* @__PURE__ */ new Date())
+		});
+	};
+	return /* @__PURE__ */ s("div", {
+		className: "flex flex-wrap items-center gap-2",
+		"data-testid": "satisfaction-window",
+		children: [
+			/* @__PURE__ */ o("div", {
+				className: "flex flex-wrap items-center gap-1 rounded-md border p-0.5",
+				role: "group",
+				"aria-label": p("planmagnet.satisfaction.window.label", "Time window"),
+				children: t.map((e) => /* @__PURE__ */ o("button", {
+					type: "button",
+					"aria-pressed": l.preset === e,
+					onClick: () => _(e),
+					"data-testid": `satisfaction-window-${e}`,
+					className: `rounded px-2.5 py-1 text-xs ${l.preset === e ? "bg-primary text-primary-foreground" : "text-muted-foreground hover:bg-muted"}`,
+					children: a(p, e)
+				}, e))
+			}),
+			m && /* @__PURE__ */ s("div", {
+				className: "flex items-center gap-1.5",
+				children: [
+					/* @__PURE__ */ o("label", {
+						htmlFor: `${f}-from`,
+						className: "sr-only",
+						children: p("planmagnet.satisfaction.window.from", "From")
+					}),
+					/* @__PURE__ */ o(c, {
+						id: `${f}-from`,
+						type: "date",
+						className: "h-8 w-40",
+						value: l.from,
+						max: l.to || void 0,
+						onChange: (e) => u({
+							...l,
+							from: e.target.value
+						}),
+						"data-testid": "satisfaction-window-from"
+					}),
+					/* @__PURE__ */ o("span", {
+						className: "text-sm text-muted-foreground",
+						children: "–"
+					}),
+					/* @__PURE__ */ o("label", {
+						htmlFor: `${f}-to`,
+						className: "sr-only",
+						children: p("planmagnet.satisfaction.window.to", "To")
+					}),
+					/* @__PURE__ */ o(c, {
+						id: `${f}-to`,
+						type: "date",
+						className: "h-8 w-40",
+						value: l.to,
+						min: l.from || void 0,
+						onChange: (e) => u({
+							...l,
+							to: e.target.value
+						}),
+						"data-testid": "satisfaction-window-to"
+					}),
+					/* @__PURE__ */ o("span", {
+						className: "text-xs text-muted-foreground",
+						children: p("planmagnet.satisfaction.window.utcNote", "UTC days")
+					})
+				]
+			}),
+			(g || h) && /* @__PURE__ */ o("p", {
+				role: "alert",
+				className: "text-xs text-status-error-text",
+				children: g ? p("planmagnet.satisfaction.window.reversed", "“From” must be on or before “To”. The figures still show the last valid window.") : p("planmagnet.satisfaction.window.incomplete", "Pick both days. The figures still show the last valid window.")
+			})
+		]
+	});
+}
+//#endregion
+export { l as SatisfactionWindowPicker };
+
+//# sourceMappingURL=SatisfactionWindowPicker.js.map

package/dist/planmagnet/satisfaction/SatisfactionWindowPicker.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SatisfactionWindowPicker.js","names":[],"sources":["../../../src/planmagnet/satisfaction/SatisfactionWindowPicker.tsx"],"sourcesContent":["import { Input } from '@burdenoff/fe-libs/ui';\nimport { useTr } from '../../shared/hooks/useTr';\nimport { windowPresetLabel } from './SatisfactionFigures';\nimport {\n  WINDOW_PRESETS,\n  isCalendarDay,\n  presetDays,\n  utcDay,\n  type WindowChoice,\n  type WindowPreset,\n} from './satisfaction';\nimport type { SatisfactionWindowEcho } from './satisfactionOperations';\n\n/**\n * The window a satisfaction figure covers: the trailing 30 / 90 / 180 / 365 days (90 by default), or custom days.\n * Custom days are whole UTC days, both included — the same days the service counts. Switching to custom starts from\n * the days the figures currently cover, so nothing jumps.\n */\nexport function SatisfactionWindowPicker({\n  value,\n  onChange,\n  current,\n  idPrefix = 'satisfaction-window',\n}: {\n  value: WindowChoice;\n  onChange: (next: WindowChoice) => void;\n  /** The window the figures on screen cover, as the service resolved it. */\n  current: SatisfactionWindowEcho | null;\n  idPrefix?: string;\n}) {\n  const tr = useTr();\n  const custom = value.preset === 'CUSTOM';\n  const incomplete = custom && (!isCalendarDay(value.from) || !isCalendarDay(value.to));\n  const reversed = custom && !incomplete && value.from > value.to;\n\n  const choose = (preset: WindowPreset) => {\n    if (preset !== 'CUSTOM') {\n      onChange({ preset, from: value.from, to: value.to });\n      return;\n    }\n    if (value.preset === 'CUSTOM') return;\n    const from = current ? utcDay(current.from) : null;\n    const to = current ? utcDay(current.to) : null;\n    const seed = from && to ? { from, to } : presetDays('LAST_90_DAYS', new Date());\n    onChange({ preset: 'CUSTOM', ...seed });\n  };\n\n  return (\n    <div className=\"flex flex-wrap items-center gap-2\" data-testid=\"satisfaction-window\">\n      <div\n        className=\"flex flex-wrap items-center gap-1 rounded-md border p-0.5\"\n        role=\"group\"\n        aria-label={tr('planmagnet.satisfaction.window.label', 'Time window')}\n      >\n        {WINDOW_PRESETS.map((preset) => (\n          <button\n            key={preset}\n            type=\"button\"\n            aria-pressed={value.preset === preset}\n            onClick={() => choose(preset)}\n            data-testid={`satisfaction-window-${preset}`}\n            className={`rounded px-2.5 py-1 text-xs ${\n              value.preset === preset\n                ? 'bg-primary text-primary-foreground'\n                : 'text-muted-foreground hover:bg-muted'\n            }`}\n          >\n            {windowPresetLabel(tr, preset)}\n          </button>\n        ))}\n      </div>\n      {custom && (\n        <div className=\"flex items-center gap-1.5\">\n          <label htmlFor={`${idPrefix}-from`} className=\"sr-only\">\n            {tr('planmagnet.satisfaction.window.from', 'From')}\n          </label>\n          <Input\n            id={`${idPrefix}-from`}\n            type=\"date\"\n            className=\"h-8 w-40\"\n            value={value.from}\n            max={value.to || undefined}\n            onChange={(e) => onChange({ ...value, from: e.target.value })}\n            data-testid=\"satisfaction-window-from\"\n          />\n          <span className=\"text-sm text-muted-foreground\">–</span>\n          <label htmlFor={`${idPrefix}-to`} className=\"sr-only\">\n            {tr('planmagnet.satisfaction.window.to', 'To')}\n          </label>\n          <Input\n            id={`${idPrefix}-to`}\n            type=\"date\"\n            className=\"h-8 w-40\"\n            value={value.to}\n            min={value.from || undefined}\n            onChange={(e) => onChange({ ...value, to: e.target.value })}\n            data-testid=\"satisfaction-window-to\"\n          />\n          <span className=\"text-xs text-muted-foreground\">\n            {tr('planmagnet.satisfaction.window.utcNote', 'UTC days')}\n          </span>\n        </div>\n      )}\n      {(reversed || incomplete) && (\n        <p role=\"alert\" className=\"text-xs text-status-error-text\">\n          {reversed\n            ? tr(\n                'planmagnet.satisfaction.window.reversed',\n                '“From” must be on or before “To”. The figures still show the last valid window.'\n              )\n            : tr(\n                'planmagnet.satisfaction.window.incomplete',\n                'Pick both days. The figures still show the last valid window.'\n              )}\n        </p>\n      )}\n    </div>\n  );\n}\n"],"mappings":";;;;;;AAkBA,SAAgB,EAAyB,EACvC,UACA,aACA,YACA,cAAW,yBAOV;CACD,IAAM,IAAK,GAAO,EACZ,IAAS,EAAM,WAAW,UAC1B,IAAa,MAAW,CAAC,EAAc,EAAM,KAAK,IAAI,CAAC,EAAc,EAAM,GAAG,GAC9E,IAAW,KAAU,CAAC,KAAc,EAAM,OAAO,EAAM,IAEvD,KAAU,MAAyB;AACvC,MAAI,MAAW,UAAU;AACvB,KAAS;IAAE;IAAQ,MAAM,EAAM;IAAM,IAAI,EAAM;IAAI,CAAC;AACpD;;AAEF,MAAI,EAAM,WAAW,SAAU;EAC/B,IAAM,IAAO,IAAU,EAAO,EAAQ,KAAK,GAAG,MACxC,IAAK,IAAU,EAAO,EAAQ,GAAG,GAAG;AAE1C,IAAS;GAAE,QAAQ;GAAU,GADhB,KAAQ,IAAK;IAAE;IAAM;IAAI,GAAG,EAAW,gCAAgB,IAAI,MAAM,CAAC;GACzC,CAAC;;AAGzC,QACE,kBAAC,OAAD;EAAK,WAAU;EAAoC,eAAY;YAA/D;GACE,kBAAC,OAAD;IACE,WAAU;IACV,MAAK;IACL,cAAY,EAAG,wCAAwC,cAAc;cAEpE,EAAe,KAAK,MACnB,kBAAC,UAAD;KAEE,MAAK;KACL,gBAAc,EAAM,WAAW;KAC/B,eAAe,EAAO,EAAO;KAC7B,eAAa,uBAAuB;KACpC,WAAW,+BACT,EAAM,WAAW,IACb,uCACA;eAGL,EAAkB,GAAI,EAAO;KACvB,EAZF,EAYE,CACT;IACE,CAAA;GACL,KACC,kBAAC,OAAD;IAAK,WAAU;cAAf;KACE,kBAAC,SAAD;MAAO,SAAS,GAAG,EAAS;MAAQ,WAAU;gBAC3C,EAAG,uCAAuC,OAAO;MAC5C,CAAA;KACR,kBAAC,GAAD;MACE,IAAI,GAAG,EAAS;MAChB,MAAK;MACL,WAAU;MACV,OAAO,EAAM;MACb,KAAK,EAAM,MAAM,KAAA;MACjB,WAAW,MAAM,EAAS;OAAE,GAAG;OAAO,MAAM,EAAE,OAAO;OAAO,CAAC;MAC7D,eAAY;MACZ,CAAA;KACF,kBAAC,QAAD;MAAM,WAAU;gBAAgC;MAAQ,CAAA;KACxD,kBAAC,SAAD;MAAO,SAAS,GAAG,EAAS;MAAM,WAAU;gBACzC,EAAG,qCAAqC,KAAK;MACxC,CAAA;KACR,kBAAC,GAAD;MACE,IAAI,GAAG,EAAS;MAChB,MAAK;MACL,WAAU;MACV,OAAO,EAAM;MACb,KAAK,EAAM,QAAQ,KAAA;MACnB,WAAW,MAAM,EAAS;OAAE,GAAG;OAAO,IAAI,EAAE,OAAO;OAAO,CAAC;MAC3D,eAAY;MACZ,CAAA;KACF,kBAAC,QAAD;MAAM,WAAU;gBACb,EAAG,0CAA0C,WAAW;MACpD,CAAA;KACH;;IAEN,KAAY,MACZ,kBAAC,KAAD;IAAG,MAAK;IAAQ,WAAU;cACvB,IACG,EACE,2CACA,kFACD,GACD,EACE,6CACA,gEACD;IACH,CAAA;GAEF"}