@massdriver/backstage-plugin 1.0.0

package/dist/features/environment/CompareDeploymentsDialog/SelectStep.esm.js

@@ -0,0 +1,216 @@
+import { jsx, jsxs } from 'react/jsx-runtime';
+import Box from '@massdriver/ui/Box';
+import Typography from '@massdriver/ui/Typography';
+import IconButton from '@massdriver/ui/IconButton';
+import Tooltip from '@massdriver/ui/Tooltip';
+import Button from '@massdriver/ui/Button';
+import Select, { MenuItem } from '@massdriver/ui/Select';
+import stylin from '@massdriver/ui/stylin';
+import CompareArrowsIcon from '@massdriver/ui/icons/CompareArrowsIcon';
+import SwapHorizIcon from '@massdriver/ui/icons/SwapHorizIcon';
+import VersionBadge from '../../../components/VersionBadge.esm.js';
+import { truncateDeploymentId, formatDeploymentStatus } from '../InstanceDrawer/helpers.esm.js';
+
+const optionLabel = (deployment, fallbackId, position) => {
+  const short = truncateDeploymentId(deployment?.id ?? fallbackId);
+  return position != null ? `#${position} \xB7 ${short}` : short;
+};
+const SelectStep = ({
+  source,
+  target,
+  deployments,
+  positionMap,
+  onSourceChange,
+  onTargetChange,
+  onSwap,
+  onCompare
+}) => {
+  const sameSelected = Boolean(source && target && source.id === target.id);
+  const canCompare = Boolean(source && target && !sameSelected);
+  const canSwap = Boolean(source) && Boolean(target);
+  const find = (id) => deployments.find((deployment) => deployment.id === id) ?? null;
+  const renderOptions = (excludeId) => deployments.map((deployment) => /* @__PURE__ */ jsx(
+    MenuItem,
+    {
+      value: deployment.id,
+      disabled: deployment.id === excludeId,
+      children: /* @__PURE__ */ jsxs(OptionRow, { children: [
+        /* @__PURE__ */ jsxs(OptionMain, { children: [
+          /* @__PURE__ */ jsx(Position, { children: positionMap.get(deployment.id) ?? "" }),
+          /* @__PURE__ */ jsx(OptionId, { title: deployment.id, children: truncateDeploymentId(deployment.id) }),
+          deployment.version ? /* @__PURE__ */ jsx(VersionBadge, { version: deployment.version }) : null
+        ] }),
+        /* @__PURE__ */ jsx(OptionStatus, { children: formatDeploymentStatus(deployment.action, deployment.status) })
+      ] })
+    },
+    deployment.id
+  ));
+  return /* @__PURE__ */ jsx(Root, { children: /* @__PURE__ */ jsxs(Center, { children: [
+    /* @__PURE__ */ jsx(IconBadge, { children: /* @__PURE__ */ jsx(CompareArrowsIcon, {}) }),
+    /* @__PURE__ */ jsxs(Heading, { children: [
+      /* @__PURE__ */ jsx(Typography, { variant: "h4", component: "h2", children: "Compare Deployments" }),
+      /* @__PURE__ */ jsx(Typography, { variant: "body1", color: "text.secondary", children: "Pick two deployments to see how their parameters and version differ." })
+    ] }),
+    /* @__PURE__ */ jsxs(PickerRow, { children: [
+      /* @__PURE__ */ jsx(PickerSlot, { children: /* @__PURE__ */ jsx(
+        Select,
+        {
+          fullWidth: true,
+          displayEmpty: true,
+          value: source?.id ?? "",
+          onChange: (event) => onSourceChange(find(event.target.value)),
+          renderValue: (value) => value ? optionLabel(find(value), value, positionMap.get(value)) : "Pick a deployment\u2026",
+          children: renderOptions(target?.id)
+        }
+      ) }),
+      /* @__PURE__ */ jsx(
+        Tooltip,
+        {
+          title: canSwap ? "Swap deployments" : "Pick both first",
+          arrow: true,
+          children: /* @__PURE__ */ jsx("span", { children: /* @__PURE__ */ jsx(
+            SwapButton,
+            {
+              size: "medium",
+              onClick: onSwap,
+              disabled: !canSwap,
+              "aria-label": "Swap deployments",
+              children: /* @__PURE__ */ jsx(SwapHorizIcon, {})
+            }
+          ) })
+        }
+      ),
+      /* @__PURE__ */ jsx(PickerSlot, { children: /* @__PURE__ */ jsx(
+        Select,
+        {
+          fullWidth: true,
+          displayEmpty: true,
+          value: target?.id ?? "",
+          onChange: (event) => onTargetChange(find(event.target.value)),
+          renderValue: (value) => value ? optionLabel(find(value), value, positionMap.get(value)) : "Pick a deployment\u2026",
+          children: renderOptions(source?.id)
+        }
+      ) })
+    ] }),
+    sameSelected ? /* @__PURE__ */ jsx(WarnLine, { variant: "caption", children: "Pick two different deployments to compare." }) : /* @__PURE__ */ jsx(Spacer, {}),
+    /* @__PURE__ */ jsx(
+      CompareButton,
+      {
+        variant: "contained",
+        size: "large",
+        onClick: onCompare,
+        disabled: !canCompare,
+        children: "Compare"
+      }
+    )
+  ] }) });
+};
+const Root = stylin(Box)(({ theme }) => ({
+  flex: 1,
+  display: "flex",
+  alignItems: "center",
+  justifyContent: "center",
+  padding: theme.spacing(4)
+}));
+const Center = stylin(Box)(({ theme }) => ({
+  width: "100%",
+  maxWidth: theme.spacing(90),
+  display: "flex",
+  flexDirection: "column",
+  alignItems: "center",
+  gap: theme.spacing(3)
+}));
+const IconBadge = stylin(Box)(({ theme }) => ({
+  display: "flex",
+  alignItems: "center",
+  justifyContent: "center",
+  width: theme.spacing(7),
+  height: theme.spacing(7),
+  borderRadius: "50%",
+  backgroundColor: theme.palette.action.selected,
+  color: theme.palette.primary.main,
+  "& > svg": { fontSize: 32 }
+}));
+const Heading = stylin(Box)(({ theme }) => ({
+  display: "flex",
+  flexDirection: "column",
+  alignItems: "center",
+  textAlign: "center",
+  gap: theme.spacing(1),
+  maxWidth: theme.spacing(75)
+}));
+const PickerRow = stylin(Box)(({ theme }) => ({
+  width: "100%",
+  display: "flex",
+  alignItems: "center",
+  gap: theme.spacing(1.5),
+  marginTop: theme.spacing(2),
+  [theme.breakpoints.down("sm")]: {
+    flexDirection: "column"
+  }
+}));
+const PickerSlot = stylin(Box)({
+  flex: 1,
+  minWidth: 0,
+  width: "100%"
+});
+const OptionRow = stylin(Box)(({ theme }) => ({
+  display: "flex",
+  alignItems: "center",
+  justifyContent: "space-between",
+  gap: theme.spacing(1.5),
+  width: "100%",
+  minWidth: 0
+}));
+const OptionMain = stylin(Box)(({ theme }) => ({
+  display: "flex",
+  alignItems: "center",
+  gap: theme.spacing(1),
+  minWidth: 0
+}));
+const Position = stylin("span")(({ theme }) => ({
+  fontFamily: theme.typography.fontFamilyMono,
+  fontSize: theme.typography.body2.fontSize,
+  fontWeight: theme.typography.fontWeightBold,
+  color: theme.palette.text.secondary
+}));
+const OptionId = stylin("span")(({ theme }) => ({
+  fontFamily: theme.typography.fontFamilyMono,
+  fontSize: theme.typography.body2.fontSize,
+  fontWeight: theme.typography.fontWeightBold,
+  color: theme.palette.text.primary,
+  whiteSpace: "nowrap",
+  overflow: "hidden",
+  textOverflow: "ellipsis"
+}));
+const OptionStatus = stylin("span")(({ theme }) => ({
+  fontSize: theme.typography.caption.fontSize,
+  color: theme.palette.text.secondary,
+  whiteSpace: "nowrap",
+  flexShrink: 0
+}));
+const SwapButton = stylin(IconButton)(({ theme }) => ({
+  color: theme.palette.text.secondary,
+  border: `1px solid ${theme.palette.divider}`,
+  backgroundColor: theme.palette.background.paper,
+  flexShrink: 0,
+  "&:hover": {
+    color: theme.palette.primary.main,
+    borderColor: theme.palette.primary.main,
+    backgroundColor: theme.palette.background.paper
+  }
+}));
+const WarnLine = stylin(Typography)(({ theme }) => ({
+  color: theme.palette.warning.main,
+  marginTop: theme.spacing(0.5)
+}));
+const Spacer = stylin(Box)(({ theme }) => ({
+  height: theme.spacing(2)
+}));
+const CompareButton = stylin(Button)(({ theme }) => ({
+  minWidth: theme.spacing(24),
+  marginTop: theme.spacing(1)
+}));
+
+export { SelectStep, SelectStep as default };
+//# sourceMappingURL=SelectStep.esm.js.map

package/dist/features/environment/CompareDeploymentsDialog/SelectStep.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SelectStep.esm.js","sources":["../../../../src/features/environment/CompareDeploymentsDialog/SelectStep.tsx"],"sourcesContent":["import Box from '@massdriver/ui/Box';\nimport Typography from '@massdriver/ui/Typography';\nimport IconButton from '@massdriver/ui/IconButton';\nimport Tooltip from '@massdriver/ui/Tooltip';\nimport Button from '@massdriver/ui/Button';\nimport Select, { MenuItem } from '@massdriver/ui/Select';\nimport stylin from '@massdriver/ui/stylin';\nimport CompareArrowsIcon from '@massdriver/ui/icons/CompareArrowsIcon';\nimport SwapHorizIcon from '@massdriver/ui/icons/SwapHorizIcon';\nimport VersionBadge from '../../../components/VersionBadge';\nimport {\n  formatDeploymentStatus,\n  truncateDeploymentId,\n} from '../InstanceDrawer/helpers';\nimport type { Deployment } from '../InstanceDrawer/types';\n\n// `deployment` can be null when a held selection is no longer in the list\n// (e.g. the deployment aged out of the capped fetch) — fall back to the raw id.\nconst optionLabel = (\n  deployment: Deployment | null,\n  fallbackId: string,\n  position?: number,\n): string => {\n  const short = truncateDeploymentId(deployment?.id ?? fallbackId);\n  return position != null ? `#${position} · ${short}` : short;\n};\n\n/**\n * Step 1 of the deployment compare flow: pick two deployments. Simplified from\n * the web app's infinite-scroll pickers to plain Selects — the dialog already\n * fetches the instance's (capped) deployment list into memory.\n */\nexport const SelectStep = ({\n  source,\n  target,\n  deployments,\n  positionMap,\n  onSourceChange,\n  onTargetChange,\n  onSwap,\n  onCompare,\n}: {\n  source: Deployment | null;\n  target: Deployment | null;\n  deployments: Deployment[];\n  positionMap: Map<string, number>;\n  onSourceChange: (deployment: Deployment | null) => void;\n  onTargetChange: (deployment: Deployment | null) => void;\n  onSwap: () => void;\n  onCompare: () => void;\n}) => {\n  const sameSelected = Boolean(source && target && source.id === target.id);\n  const canCompare = Boolean(source && target && !sameSelected);\n  const canSwap = Boolean(source) && Boolean(target);\n\n  const find = (id: string) =>\n    deployments.find(deployment => deployment.id === id) ?? null;\n\n  const renderOptions = (excludeId?: string) =>\n    deployments.map(deployment => (\n      <MenuItem\n        key={deployment.id}\n        value={deployment.id}\n        disabled={deployment.id === excludeId}\n      >\n        <OptionRow>\n          <OptionMain>\n            <Position>{positionMap.get(deployment.id) ?? ''}</Position>\n            <OptionId title={deployment.id}>\n              {truncateDeploymentId(deployment.id)}\n            </OptionId>\n            {deployment.version ? (\n              <VersionBadge version={deployment.version} />\n            ) : null}\n          </OptionMain>\n          <OptionStatus>\n            {formatDeploymentStatus(deployment.action, deployment.status)}\n          </OptionStatus>\n        </OptionRow>\n      </MenuItem>\n    ));\n\n  return (\n    <Root>\n      <Center>\n        <IconBadge>\n          <CompareArrowsIcon />\n        </IconBadge>\n\n        <Heading>\n          <Typography variant=\"h4\" component=\"h2\">\n            Compare Deployments\n          </Typography>\n          <Typography variant=\"body1\" color=\"text.secondary\">\n            Pick two deployments to see how their parameters and version differ.\n          </Typography>\n        </Heading>\n\n        <PickerRow>\n          <PickerSlot>\n            <Select\n              fullWidth\n              displayEmpty\n              value={source?.id ?? ''}\n              onChange={(event: any) =>\n                onSourceChange(find(event.target.value))\n              }\n              renderValue={(value: string) =>\n                value\n                  ? optionLabel(find(value), value, positionMap.get(value))\n                  : 'Pick a deployment…'\n              }\n            >\n              {renderOptions(target?.id)}\n            </Select>\n          </PickerSlot>\n\n          <Tooltip\n            title={canSwap ? 'Swap deployments' : 'Pick both first'}\n            arrow\n          >\n            <span>\n              <SwapButton\n                size=\"medium\"\n                onClick={onSwap}\n                disabled={!canSwap}\n                aria-label=\"Swap deployments\"\n              >\n                <SwapHorizIcon />\n              </SwapButton>\n            </span>\n          </Tooltip>\n\n          <PickerSlot>\n            <Select\n              fullWidth\n              displayEmpty\n              value={target?.id ?? ''}\n              onChange={(event: any) =>\n                onTargetChange(find(event.target.value))\n              }\n              renderValue={(value: string) =>\n                value\n                  ? optionLabel(find(value), value, positionMap.get(value))\n                  : 'Pick a deployment…'\n              }\n            >\n              {renderOptions(source?.id)}\n            </Select>\n          </PickerSlot>\n        </PickerRow>\n\n        {sameSelected ? (\n          <WarnLine variant=\"caption\">\n            Pick two different deployments to compare.\n          </WarnLine>\n        ) : (\n          <Spacer />\n        )}\n\n        <CompareButton\n          variant=\"contained\"\n          size=\"large\"\n          onClick={onCompare}\n          disabled={!canCompare}\n        >\n          Compare\n        </CompareButton>\n      </Center>\n    </Root>\n  );\n};\n\nexport default SelectStep;\n\nconst Root = stylin(Box)(({ theme }: { theme: any }) => ({\n  flex: 1,\n  display: 'flex',\n  alignItems: 'center',\n  justifyContent: 'center',\n  padding: theme.spacing(4),\n}));\n\nconst Center = stylin(Box)(({ theme }: { theme: any }) => ({\n  width: '100%',\n  maxWidth: theme.spacing(90),\n  display: 'flex',\n  flexDirection: 'column',\n  alignItems: 'center',\n  gap: theme.spacing(3),\n}));\n\nconst IconBadge = stylin(Box)(({ theme }: { theme: any }) => ({\n  display: 'flex',\n  alignItems: 'center',\n  justifyContent: 'center',\n  width: theme.spacing(7),\n  height: theme.spacing(7),\n  borderRadius: '50%',\n  backgroundColor: theme.palette.action.selected,\n  color: theme.palette.primary.main,\n  '& > svg': { fontSize: 32 },\n}));\n\nconst Heading = stylin(Box)(({ theme }: { theme: any }) => ({\n  display: 'flex',\n  flexDirection: 'column',\n  alignItems: 'center',\n  textAlign: 'center',\n  gap: theme.spacing(1),\n  maxWidth: theme.spacing(75),\n}));\n\nconst PickerRow = stylin(Box)(({ theme }: { theme: any }) => ({\n  width: '100%',\n  display: 'flex',\n  alignItems: 'center',\n  gap: theme.spacing(1.5),\n  marginTop: theme.spacing(2),\n  [theme.breakpoints.down('sm')]: {\n    flexDirection: 'column',\n  },\n}));\n\nconst PickerSlot = stylin(Box)({\n  flex: 1,\n  minWidth: 0,\n  width: '100%',\n});\n\nconst OptionRow = stylin(Box)(({ theme }: { theme: any }) => ({\n  display: 'flex',\n  alignItems: 'center',\n  justifyContent: 'space-between',\n  gap: theme.spacing(1.5),\n  width: '100%',\n  minWidth: 0,\n}));\n\nconst OptionMain = stylin(Box)(({ theme }: { theme: any }) => ({\n  display: 'flex',\n  alignItems: 'center',\n  gap: theme.spacing(1),\n  minWidth: 0,\n}));\n\nconst Position = stylin('span')(({ theme }: { theme: any }) => ({\n  fontFamily: theme.typography.fontFamilyMono,\n  fontSize: theme.typography.body2.fontSize,\n  fontWeight: theme.typography.fontWeightBold,\n  color: theme.palette.text.secondary,\n}));\n\nconst OptionId = stylin('span')(({ theme }: { theme: any }) => ({\n  fontFamily: theme.typography.fontFamilyMono,\n  fontSize: theme.typography.body2.fontSize,\n  fontWeight: theme.typography.fontWeightBold,\n  color: theme.palette.text.primary,\n  whiteSpace: 'nowrap',\n  overflow: 'hidden',\n  textOverflow: 'ellipsis',\n}));\n\nconst OptionStatus = stylin('span')(({ theme }: { theme: any }) => ({\n  fontSize: theme.typography.caption.fontSize,\n  color: theme.palette.text.secondary,\n  whiteSpace: 'nowrap',\n  flexShrink: 0,\n}));\n\nconst SwapButton = stylin(IconButton)(({ theme }: { theme: any }) => ({\n  color: theme.palette.text.secondary,\n  border: `1px solid ${theme.palette.divider}`,\n  backgroundColor: theme.palette.background.paper,\n  flexShrink: 0,\n  '&:hover': {\n    color: theme.palette.primary.main,\n    borderColor: theme.palette.primary.main,\n    backgroundColor: theme.palette.background.paper,\n  },\n}));\n\nconst WarnLine = stylin(Typography)(({ theme }: { theme: any }) => ({\n  color: theme.palette.warning.main,\n  marginTop: theme.spacing(0.5),\n}));\n\nconst Spacer = stylin(Box)(({ theme }: { theme: any }) => ({\n  height: theme.spacing(2),\n}));\n\nconst CompareButton = stylin(Button)(({ theme }: { theme: any }) => ({\n  minWidth: theme.spacing(24),\n  marginTop: theme.spacing(1),\n}));\n"],"names":[],"mappings":"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"}

package/dist/features/environment/CompareDeploymentsDialog/compareColumns.esm.js

@@ -0,0 +1,86 @@
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { col } from '@massdriver/ui/DataList';
+import Box from '@massdriver/ui/Box';
+import Chip from '@massdriver/ui/Chip';
+import stylin from '@massdriver/ui/stylin';
+import { ComparisonValueCell } from '../CompareEnvironmentsDialog/ComparisonValueCell.esm.js';
+import { VERSION_PATH } from '../CompareEnvironmentsDialog/flattenComparison.esm.js';
+
+const renderPathCell = (value, row) => /* @__PURE__ */ jsxs(PathCellWrap, { children: [
+  /* @__PURE__ */ jsx(StatusStripe, { status: row.status }),
+  value === VERSION_PATH ? /* @__PURE__ */ jsx(Chip, { size: "small", variant: "outlined", label: "Version" }) : /* @__PURE__ */ jsx(PathText, { children: value })
+] });
+const renderLeftCell = (_value, row) => /* @__PURE__ */ jsx(
+  ComparisonValueCell,
+  {
+    side: row.source,
+    isDifferent: row.status === "different",
+    isMissing: row.status === "targetOnly"
+  }
+);
+const renderRightCell = (_value, row) => /* @__PURE__ */ jsx(
+  ComparisonValueCell,
+  {
+    side: row.target,
+    isDifferent: row.status === "different",
+    isMissing: row.status === "sourceOnly"
+  }
+);
+const buildCompareColumns = ({
+  leftLabel,
+  rightLabel
+} = {}) => [
+  col.custom("path", "Path", renderPathCell, {
+    flex: 2,
+    minWidth: 200,
+    sortable: true,
+    searchable: true
+  }),
+  col.custom("sourceValue", leftLabel || "Source", renderLeftCell, {
+    flex: 2,
+    minWidth: 180,
+    sortable: true,
+    searchable: true
+  }),
+  col.custom("targetValue", rightLabel || "Target", renderRightCell, {
+    flex: 2,
+    minWidth: 180,
+    sortable: true,
+    searchable: true
+  })
+];
+const stripeColor = (theme, status) => {
+  if (status === "different") return theme.palette.warning.main;
+  if (status === "sourceOnly" || status === "targetOnly") {
+    return theme.palette.info.main;
+  }
+  return "transparent";
+};
+const PathCellWrap = stylin(Box)(({ theme }) => ({
+  display: "flex",
+  alignItems: "center",
+  gap: theme.spacing(1),
+  minWidth: 0
+}));
+const StatusStripe = stylin(Box, ["status"])(
+  ({ theme, status }) => ({
+    width: 3,
+    alignSelf: "stretch",
+    minHeight: theme.spacing(3),
+    borderRadius: "2px",
+    backgroundColor: stripeColor(theme, status),
+    flexShrink: 0,
+    marginLeft: "-4px"
+  })
+);
+const PathText = stylin(Box)(({ theme }) => ({
+  fontFamily: theme.typography.fontFamilyMono,
+  fontSize: theme.typography.caption.fontSize,
+  color: theme.palette.text.secondary,
+  whiteSpace: "nowrap",
+  overflow: "hidden",
+  textOverflow: "ellipsis"
+}));
+
+export { buildCompareColumns, buildCompareColumns as default };
+//# sourceMappingURL=compareColumns.esm.js.map

package/dist/features/environment/CompareDeploymentsDialog/compareColumns.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"compareColumns.esm.js","sources":["../../../../src/features/environment/CompareDeploymentsDialog/compareColumns.tsx"],"sourcesContent":["import { col } from '@massdriver/ui/DataList';\nimport Box from '@massdriver/ui/Box';\nimport Chip from '@massdriver/ui/Chip';\nimport stylin from '@massdriver/ui/stylin';\nimport ComparisonValueCell from '../CompareEnvironmentsDialog/ComparisonValueCell';\nimport {\n  VERSION_PATH,\n  type ComparisonStatus,\n} from '../CompareEnvironmentsDialog/flattenComparison';\nimport type { DeploymentComparisonRow } from './flattenDeploymentComparison';\n\nconst renderPathCell = (value: string, row: DeploymentComparisonRow) => (\n  <PathCellWrap>\n    <StatusStripe status={row.status} />\n    {value === VERSION_PATH ? (\n      <Chip size=\"small\" variant=\"outlined\" label=\"Version\" />\n    ) : (\n      <PathText>{value}</PathText>\n    )}\n  </PathCellWrap>\n);\n\nconst renderLeftCell = (_value: unknown, row: DeploymentComparisonRow) => (\n  <ComparisonValueCell\n    side={row.source}\n    isDifferent={row.status === 'different'}\n    isMissing={row.status === 'targetOnly'}\n  />\n);\n\nconst renderRightCell = (_value: unknown, row: DeploymentComparisonRow) => (\n  <ComparisonValueCell\n    side={row.target}\n    isDifferent={row.status === 'different'}\n    isMissing={row.status === 'sourceOnly'}\n  />\n);\n\nexport const buildCompareColumns = ({\n  leftLabel,\n  rightLabel,\n}: {\n  leftLabel?: string;\n  rightLabel?: string;\n} = {}) => [\n  col.custom('path', 'Path', renderPathCell, {\n    flex: 2,\n    minWidth: 200,\n    sortable: true,\n    searchable: true,\n  }),\n  col.custom('sourceValue', leftLabel || 'Source', renderLeftCell, {\n    flex: 2,\n    minWidth: 180,\n    sortable: true,\n    searchable: true,\n  }),\n  col.custom('targetValue', rightLabel || 'Target', renderRightCell, {\n    flex: 2,\n    minWidth: 180,\n    sortable: true,\n    searchable: true,\n  }),\n];\n\nexport default buildCompareColumns;\n\n// Left status stripe: different → warning, source/target-only → info, equal →\n// transparent. Colors resolve from the theme palette (raw CSS, not sx tokens).\nconst stripeColor = (theme: any, status: ComparisonStatus): string => {\n  if (status === 'different') return theme.palette.warning.main;\n  if (status === 'sourceOnly' || status === 'targetOnly') {\n    return theme.palette.info.main;\n  }\n  return 'transparent';\n};\n\nconst PathCellWrap = stylin(Box)(({ theme }: { theme: any }) => ({\n  display: 'flex',\n  alignItems: 'center',\n  gap: theme.spacing(1),\n  minWidth: 0,\n}));\n\nconst StatusStripe = stylin(Box, ['status'])(\n  ({ theme, status }: { theme: any; status: ComparisonStatus }) => ({\n    width: 3,\n    alignSelf: 'stretch',\n    minHeight: theme.spacing(3),\n    borderRadius: '2px',\n    backgroundColor: stripeColor(theme, status),\n    flexShrink: 0,\n    marginLeft: '-4px',\n  }),\n);\n\nconst PathText = stylin(Box)(({ theme }: { theme: any }) => ({\n  fontFamily: theme.typography.fontFamilyMono,\n  fontSize: theme.typography.caption.fontSize,\n  color: theme.palette.text.secondary,\n  whiteSpace: 'nowrap',\n  overflow: 'hidden',\n  textOverflow: 'ellipsis',\n}));\n"],"names":[],"mappings":"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"}

package/dist/features/environment/CompareDeploymentsDialog/flattenDeploymentComparison.esm.js

@@ -0,0 +1,57 @@
+import { computeStatus, VERSION_PATH } from '../CompareEnvironmentsDialog/flattenComparison.esm.js';
+
+const sideToString = (side) => {
+  if (!side?.present) return null;
+  const value = side.value;
+  if (value == null) return "null";
+  return typeof value === "string" ? value : JSON.stringify(value);
+};
+const flattenDeploymentComparison = (comparison) => {
+  if (!comparison) return [];
+  const version = comparison.version;
+  const params = (comparison.params ?? []).filter(
+    Boolean
+  );
+  const versionSource = {
+    present: version?.source != null,
+    value: version?.source ?? null
+  };
+  const versionTarget = {
+    present: version?.target != null,
+    value: version?.target ?? null
+  };
+  const versionRow = {
+    id: "__version__",
+    kind: "version",
+    path: VERSION_PATH,
+    source: versionSource,
+    target: versionTarget,
+    sourceValue: sideToString(versionSource),
+    targetValue: sideToString(versionTarget),
+    equal: version?.equal ?? false,
+    status: computeStatus({
+      equal: version?.equal,
+      source: versionSource,
+      target: versionTarget
+    })
+  };
+  const paramRows = params.map((param) => {
+    const source = param.source ?? { present: false };
+    const target = param.target ?? { present: false };
+    return {
+      id: param.path,
+      kind: "param",
+      path: param.path,
+      source,
+      target,
+      sourceValue: sideToString(source),
+      targetValue: sideToString(target),
+      equal: param.equal ?? false,
+      status: computeStatus({ equal: param.equal, source, target })
+    };
+  });
+  return [versionRow, ...paramRows];
+};
+
+export { flattenDeploymentComparison as default };
+//# sourceMappingURL=flattenDeploymentComparison.esm.js.map

package/dist/features/environment/CompareDeploymentsDialog/flattenDeploymentComparison.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"flattenDeploymentComparison.esm.js","sources":["../../../../src/features/environment/CompareDeploymentsDialog/flattenDeploymentComparison.ts"],"sourcesContent":["import {\n  computeStatus,\n  VERSION_PATH,\n  type ComparisonSide,\n  type ComparisonStatus,\n} from '../CompareEnvironmentsDialog/flattenComparison';\n\n// Deployment comparison rows are un-grouped (no component dimension): a single\n// version row plus one row per param. Ported from the web app's\n// flattenDeploymentComparison.js. `computeStatus` / `VERSION_PATH` are reused\n// unchanged from the environment-compare flatten module.\nexport interface DeploymentComparisonRow {\n  id: string;\n  kind: 'version' | 'param';\n  path: string;\n  source: ComparisonSide;\n  target: ComparisonSide;\n  sourceValue: string | null;\n  targetValue: string | null;\n  equal: boolean;\n  status: ComparisonStatus;\n}\n\ninterface DeploymentCompareParam {\n  path: string;\n  equal?: boolean | null;\n  source?: ComparisonSide | null;\n  target?: ComparisonSide | null;\n}\n\nexport interface DeploymentComparison {\n  source?: Record<string, unknown> | null;\n  target?: Record<string, unknown> | null;\n  version?: {\n    source?: string | null;\n    target?: string | null;\n    equal?: boolean | null;\n  } | null;\n  params?: (DeploymentCompareParam | null)[] | null;\n}\n\nconst sideToString = (side: ComparisonSide): string | null => {\n  if (!side?.present) return null;\n  const value = side.value;\n  if (value == null) return 'null';\n  return typeof value === 'string' ? value : JSON.stringify(value);\n};\n\nconst flattenDeploymentComparison = (\n  comparison?: DeploymentComparison | null,\n): DeploymentComparisonRow[] => {\n  if (!comparison) return [];\n\n  const version = comparison.version;\n  const params = (comparison.params ?? []).filter(\n    Boolean,\n  ) as DeploymentCompareParam[];\n\n  const versionSource: ComparisonSide = {\n    present: version?.source != null,\n    value: version?.source ?? null,\n  };\n  const versionTarget: ComparisonSide = {\n    present: version?.target != null,\n    value: version?.target ?? null,\n  };\n\n  const versionRow: DeploymentComparisonRow = {\n    id: '__version__',\n    kind: 'version',\n    path: VERSION_PATH,\n    source: versionSource,\n    target: versionTarget,\n    sourceValue: sideToString(versionSource),\n    targetValue: sideToString(versionTarget),\n    equal: version?.equal ?? false,\n    status: computeStatus({\n      equal: version?.equal,\n      source: versionSource,\n      target: versionTarget,\n    }),\n  };\n\n  const paramRows: DeploymentComparisonRow[] = params.map(param => {\n    const source: ComparisonSide = param.source ?? { present: false };\n    const target: ComparisonSide = param.target ?? { present: false };\n    return {\n      id: param.path,\n      kind: 'param' as const,\n      path: param.path,\n      source,\n      target,\n      sourceValue: sideToString(source),\n      targetValue: sideToString(target),\n      equal: param.equal ?? false,\n      status: computeStatus({ equal: param.equal, source, target }),\n    };\n  });\n\n  return [versionRow, ...paramRows];\n};\n\nexport default flattenDeploymentComparison;\n"],"names":[],"mappings":";;AAyCA,MAAM,YAAA,GAAe,CAAC,IAAA,KAAwC;AAC5D,EAAA,IAAI,CAAC,IAAA,EAAM,OAAA,EAAS,OAAO,IAAA;AAC3B,EAAA,MAAM,QAAQ,IAAA,CAAK,KAAA;AACnB,EAAA,IAAI,KAAA,IAAS,MAAM,OAAO,MAAA;AAC1B,EAAA,OAAO,OAAO,KAAA,KAAU,QAAA,GAAW,KAAA,GAAQ,IAAA,CAAK,UAAU,KAAK,CAAA;AACjE,CAAA;AAEA,MAAM,2BAAA,GAA8B,CAClC,UAAA,KAC8B;AAC9B,EAAA,IAAI,CAAC,UAAA,EAAY,OAAO,EAAC;AAEzB,EAAA,MAAM,UAAU,UAAA,CAAW,OAAA;AAC3B,EAAA,MAAM,MAAA,GAAA,CAAU,UAAA,CAAW,MAAA,IAAU,EAAC,EAAG,MAAA;AAAA,IACvC;AAAA,GACF;AAEA,EAAA,MAAM,aAAA,GAAgC;AAAA,IACpC,OAAA,EAAS,SAAS,MAAA,IAAU,IAAA;AAAA,IAC5B,KAAA,EAAO,SAAS,MAAA,IAAU;AAAA,GAC5B;AACA,EAAA,MAAM,aAAA,GAAgC;AAAA,IACpC,OAAA,EAAS,SAAS,MAAA,IAAU,IAAA;AAAA,IAC5B,KAAA,EAAO,SAAS,MAAA,IAAU;AAAA,GAC5B;AAEA,EAAA,MAAM,UAAA,GAAsC;AAAA,IAC1C,EAAA,EAAI,aAAA;AAAA,IACJ,IAAA,EAAM,SAAA;AAAA,IACN,IAAA,EAAM,YAAA;AAAA,IACN,MAAA,EAAQ,aAAA;AAAA,IACR,MAAA,EAAQ,aAAA;AAAA,IACR,WAAA,EAAa,aAAa,aAAa,CAAA;AAAA,IACvC,WAAA,EAAa,aAAa,aAAa,CAAA;AAAA,IACvC,KAAA,EAAO,SAAS,KAAA,IAAS,KAAA;AAAA,IACzB,QAAQ,aAAA,CAAc;AAAA,MACpB,OAAO,OAAA,EAAS,KAAA;AAAA,MAChB,MAAA,EAAQ,aAAA;AAAA,MACR,MAAA,EAAQ;AAAA,KACT;AAAA,GACH;AAEA,EAAA,MAAM,SAAA,GAAuC,MAAA,CAAO,GAAA,CAAI,CAAA,KAAA,KAAS;AAC/D,IAAA,MAAM,MAAA,GAAyB,KAAA,CAAM,MAAA,IAAU,EAAE,SAAS,KAAA,EAAM;AAChE,IAAA,MAAM,MAAA,GAAyB,KAAA,CAAM,MAAA,IAAU,EAAE,SAAS,KAAA,EAAM;AAChE,IAAA,OAAO;AAAA,MACL,IAAI,KAAA,CAAM,IAAA;AAAA,MACV,IAAA,EAAM,OAAA;AAAA,MACN,MAAM,KAAA,CAAM,IAAA;AAAA,MACZ,MAAA;AAAA,MACA,MAAA;AAAA,MACA,WAAA,EAAa,aAAa,MAAM,CAAA;AAAA,MAChC,WAAA,EAAa,aAAa,MAAM,CAAA;AAAA,MAChC,KAAA,EAAO,MAAM,KAAA,IAAS,KAAA;AAAA,MACtB,MAAA,EAAQ,cAAc,EAAE,KAAA,EAAO,MAAM,KAAA,EAAO,MAAA,EAAQ,QAAQ;AAAA,KAC9D;AAAA,EACF,CAAC,CAAA;AAED,EAAA,OAAO,CAAC,UAAA,EAAY,GAAG,SAAS,CAAA;AAClC;;;;"}

package/dist/features/environment/CompareDeploymentsDialog/queries.esm.js

@@ -0,0 +1,53 @@
+const COMPARE_DEPLOYMENTS_QUERY = `
+  query MassdriverCompareDeployments(
+    $organizationId: ID!
+    $sourceId: UUID!
+    $targetId: UUID!
+  ) {
+    compareDeployments(
+      organizationId: $organizationId
+      sourceId: $sourceId
+      targetId: $targetId
+    ) {
+      source { id status action version createdAt deployedBy message }
+      target { id status action version createdAt deployedBy message }
+      version { source target equal }
+      params {
+        path
+        equal
+        source { present value }
+        target { present value }
+      }
+    }
+  }
+`;
+const DEPLOYMENTS_BY_INSTANCE_QUERY = `
+  query MassdriverDeploymentsByInstance(
+    $organizationId: ID!
+    $filter: DeploymentsFilter
+  ) {
+    deployments(
+      organizationId: $organizationId
+      filter: $filter
+      sort: { field: UPDATED_AT, order: DESC }
+      cursor: { limit: 50 }
+    ) {
+      cursor { next }
+      items {
+        id
+        status
+        action
+        version
+        message
+        createdAt
+        updatedAt
+        lastTransitionedAt
+        elapsedTime
+        deployedBy
+      }
+    }
+  }
+`;
+
+export { COMPARE_DEPLOYMENTS_QUERY, DEPLOYMENTS_BY_INSTANCE_QUERY };
+//# sourceMappingURL=queries.esm.js.map

package/dist/features/environment/CompareDeploymentsDialog/queries.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"queries.esm.js","sources":["../../../../src/features/environment/CompareDeploymentsDialog/queries.ts"],"sourcesContent":["import type { DeploymentComparison } from './flattenDeploymentComparison';\n\n// Field-by-field diff of two deployments. `organizationId` is injected by the\n// relay; callers pass sourceId + targetId only. NOTE: `compareDeployments` takes\n// `UUID!` ids (unlike the deployments-list filter, which takes `ID!`) — the\n// relay rejects the query if this is mismatched.\nexport const COMPARE_DEPLOYMENTS_QUERY = `\n  query MassdriverCompareDeployments(\n    $organizationId: ID!\n    $sourceId: UUID!\n    $targetId: UUID!\n  ) {\n    compareDeployments(\n      organizationId: $organizationId\n      sourceId: $sourceId\n      targetId: $targetId\n    ) {\n      source { id status action version createdAt deployedBy message }\n      target { id status action version createdAt deployedBy message }\n      version { source target equal }\n      params {\n        path\n        equal\n        source { present value }\n        target { present value }\n      }\n    }\n  }\n`;\n\nexport interface CompareDeploymentsResult {\n  compareDeployments: DeploymentComparison | null;\n}\n\n// Feeds the two deployment pickers. Filtered by instance only (unaffected by the\n// History tab's action filter) and capped at a single page of 50 — the web app's\n// infinite-scroll picker is dropped as an acceptable read-only simplification.\nexport const DEPLOYMENTS_BY_INSTANCE_QUERY = `\n  query MassdriverDeploymentsByInstance(\n    $organizationId: ID!\n    $filter: DeploymentsFilter\n  ) {\n    deployments(\n      organizationId: $organizationId\n      filter: $filter\n      sort: { field: UPDATED_AT, order: DESC }\n      cursor: { limit: 50 }\n    ) {\n      cursor { next }\n      items {\n        id\n        status\n        action\n        version\n        message\n        createdAt\n        updatedAt\n        lastTransitionedAt\n        elapsedTime\n        deployedBy\n      }\n    }\n  }\n`;\n"],"names":[],"mappings":"AAMO,MAAM,yBAAA,GAA4B;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AA+BlC,MAAM,6BAAA,GAAgC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;"}

package/dist/features/environment/CompareEnvironmentsDialog/CompareEnvironmentsDialog.esm.js

@@ -0,0 +1,94 @@
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { useState, useEffect, useMemo } from 'react';
+import { useApi } from '@backstage/frontend-plugin-api';
+import useAsync from 'react-use/esm/useAsync';
+import { Dialog, DialogTitle, DialogActions, DialogContent } from '@massdriver/ui/Dialog';
+import Box from '@massdriver/ui/Box';
+import Button from '@massdriver/ui/Button';
+import Alert from '@massdriver/ui/Alert';
+import LoadingIndicator from '@massdriver/ui/LoadingIndicator';
+import stylin from '@massdriver/ui/stylin';
+import { massdriverApiRef } from '../../../api.esm.js';
+import { SelectStep } from './SelectStep.esm.js';
+import { ResultsStep } from './ResultsStep.esm.js';
+import flattenComparison from './flattenComparison.esm.js';
+import { COMPARE_ENVIRONMENTS_QUERY } from './queries.esm.js';
+
+const CompareEnvironmentsDialog = ({
+  open,
+  onClose,
+  projectName,
+  environments,
+  defaultSourceEnvironment
+}) => {
+  const api = useApi(massdriverApiRef);
+  const [step, setStep] = useState("select");
+  const [source, setSource] = useState(null);
+  const [target, setTarget] = useState(null);
+  useEffect(() => {
+    if (open) {
+      setSource(defaultSourceEnvironment ?? null);
+      setTarget(null);
+      setStep("select");
+    }
+  }, [open, defaultSourceEnvironment]);
+  const runCompare = step === "results" && source && target;
+  const { value, loading, error } = useAsync(async () => {
+    if (!runCompare) return null;
+    const data = await api.query(COMPARE_ENVIRONMENTS_QUERY, {
+      sourceId: source.id,
+      targetId: target.id
+    });
+    return data.compareEnvironments;
+  }, [api, runCompare, source?.id, target?.id]);
+  const rows = useMemo(() => flattenComparison(value), [value]);
+  const handleCompare = () => {
+    if (!source || !target || source.id === target.id) return;
+    setStep("results");
+  };
+  const handleSwap = () => {
+    setSource(target);
+    setTarget(source);
+  };
+  return /* @__PURE__ */ jsxs(Dialog, { open, onClose, maxWidth: "lg", fullWidth: true, children: [
+    /* @__PURE__ */ jsx(DialogTitle, { children: "Compare Environments" }),
+    /* @__PURE__ */ jsx(Body, { children: runCompare ? loading ? /* @__PURE__ */ jsx(Centered, { children: /* @__PURE__ */ jsx(LoadingIndicator, {}) }) : error ? /* @__PURE__ */ jsx(Centered, { children: /* @__PURE__ */ jsx(Alert, { severity: "error", children: String(error.message ?? error) }) }) : /* @__PURE__ */ jsx(
+      ResultsStep,
+      {
+        rows,
+        sourceName: value?.source?.name || source?.name,
+        targetName: value?.target?.name || target?.name,
+        loading,
+        onChangeSelection: () => setStep("select")
+      }
+    ) : /* @__PURE__ */ jsx(
+      SelectStep,
+      {
+        source,
+        target,
+        environments,
+        projectName,
+        onSourceChange: setSource,
+        onTargetChange: setTarget,
+        onSwap: handleSwap,
+        onCompare: handleCompare
+      }
+    ) }),
+    /* @__PURE__ */ jsx(DialogActions, { children: /* @__PURE__ */ jsx(Button, { variant: "text", onClick: onClose, children: "Close" }) })
+  ] });
+};
+const Body = stylin(DialogContent)(({ theme }) => ({
+  display: "flex",
+  flexDirection: "column",
+  minHeight: theme.spacing(60)
+}));
+const Centered = stylin(Box)(({ theme }) => ({
+  flex: 1,
+  display: "flex",
+  alignItems: "center",
+  justifyContent: "center",
+  padding: theme.spacing(6)
+}));
+
+export { CompareEnvironmentsDialog, CompareEnvironmentsDialog as default };
+//# sourceMappingURL=CompareEnvironmentsDialog.esm.js.map

package/dist/features/environment/CompareEnvironmentsDialog/CompareEnvironmentsDialog.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CompareEnvironmentsDialog.esm.js","sources":["../../../../src/features/environment/CompareEnvironmentsDialog/CompareEnvironmentsDialog.tsx"],"sourcesContent":["import { useEffect, useMemo, useState } from 'react';\nimport { useApi } from '@backstage/frontend-plugin-api';\nimport useAsync from 'react-use/esm/useAsync';\nimport {\n  Dialog,\n  DialogActions,\n  DialogContent,\n  DialogTitle,\n} from '@massdriver/ui/Dialog';\nimport Box from '@massdriver/ui/Box';\nimport Button from '@massdriver/ui/Button';\nimport Alert from '@massdriver/ui/Alert';\nimport LoadingIndicator from '@massdriver/ui/LoadingIndicator';\nimport stylin from '@massdriver/ui/stylin';\nimport { massdriverApiRef } from '../../../api';\nimport type { HeaderEnvironment } from '../GraphHeader/queries';\nimport SelectStep from './SelectStep';\nimport ResultsStep from './ResultsStep';\nimport flattenComparison from './flattenComparison';\nimport {\n  COMPARE_ENVIRONMENTS_QUERY,\n  type CompareEnvironmentsResult,\n} from './queries';\n\n/**\n * Read-only environment comparison dialog. Two steps: pick source + target\n * (SelectStep), then view the flattened field-by-field diff (ResultsStep). No\n * mutations — the web app's URL-param state is replaced with local `useState`.\n */\nexport const CompareEnvironmentsDialog = ({\n  open,\n  onClose,\n  projectName,\n  environments,\n  defaultSourceEnvironment,\n}: {\n  open: boolean;\n  onClose: () => void;\n  projectName?: string;\n  environments: HeaderEnvironment[];\n  defaultSourceEnvironment?: HeaderEnvironment | null;\n}) => {\n  const api = useApi(massdriverApiRef);\n  const [step, setStep] = useState<'select' | 'results'>('select');\n  const [source, setSource] = useState<HeaderEnvironment | null>(null);\n  const [target, setTarget] = useState<HeaderEnvironment | null>(null);\n\n  useEffect(() => {\n    if (open) {\n      setSource(defaultSourceEnvironment ?? null);\n      setTarget(null);\n      setStep('select');\n    }\n  }, [open, defaultSourceEnvironment]);\n\n  const runCompare = step === 'results' && source && target;\n\n  const { value, loading, error } = useAsync(async () => {\n    if (!runCompare) return null;\n    const data = (await api.query(COMPARE_ENVIRONMENTS_QUERY, {\n      sourceId: source!.id,\n      targetId: target!.id,\n    })) as CompareEnvironmentsResult;\n    return data.compareEnvironments;\n  }, [api, runCompare, source?.id, target?.id]);\n\n  const rows = useMemo(() => flattenComparison(value), [value]);\n\n  const handleCompare = () => {\n    if (!source || !target || source.id === target.id) return;\n    setStep('results');\n  };\n\n  const handleSwap = () => {\n    setSource(target);\n    setTarget(source);\n  };\n\n  return (\n    <Dialog open={open} onClose={onClose} maxWidth=\"lg\" fullWidth>\n      <DialogTitle>Compare Environments</DialogTitle>\n      <Body>\n        {runCompare ? (\n          loading ? (\n            <Centered>\n              <LoadingIndicator />\n            </Centered>\n          ) : error ? (\n            <Centered>\n              <Alert severity=\"error\">{String(error.message ?? error)}</Alert>\n            </Centered>\n          ) : (\n            <ResultsStep\n              rows={rows}\n              sourceName={value?.source?.name || source?.name}\n              targetName={value?.target?.name || target?.name}\n              loading={loading}\n              onChangeSelection={() => setStep('select')}\n            />\n          )\n        ) : (\n          <SelectStep\n            source={source}\n            target={target}\n            environments={environments}\n            projectName={projectName}\n            onSourceChange={setSource}\n            onTargetChange={setTarget}\n            onSwap={handleSwap}\n            onCompare={handleCompare}\n          />\n        )}\n      </Body>\n      <DialogActions>\n        <Button variant=\"text\" onClick={onClose}>\n          Close\n        </Button>\n      </DialogActions>\n    </Dialog>\n  );\n};\n\nexport default CompareEnvironmentsDialog;\n\nconst Body = stylin(DialogContent)(({ theme }: { theme: any }) => ({\n  display: 'flex',\n  flexDirection: 'column',\n  minHeight: theme.spacing(60),\n}));\n\nconst Centered = stylin(Box)(({ theme }: { theme: any }) => ({\n  flex: 1,\n  display: 'flex',\n  alignItems: 'center',\n  justifyContent: 'center',\n  padding: theme.spacing(6),\n}));\n"],"names":[],"mappings":"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"}