@replicated/portal-components 0.0.16 → 0.0.18

package/dist/esm/pending-installations.js

@@ -1,7 +1,8 @@
 "use client";
 import { useState, useEffect } from 'react';
+import { useSearchParams, useRouter } from 'next/navigation';
 import Link from 'next/link';
-import { jsx, jsxs } from 'react/jsx-runtime';
+import { jsxs, jsx } from 'react/jsx-runtime';
 
 /**
  * Enterprise Portal Components
@@ -96,11 +97,18 @@ var formatTimeAgo = (dateString) => {
 };
 var PendingInstallations = ({
   fetchPendingInstallationsAction,
+  discardInstallationAction,
   initialInstallations = [],
   pollIntervalMs = 5e3
 }) => {
   const [installations, setInstallations] = useState(initialInstallations);
   const [showAll, setShowAll] = useState(false);
+  const [showConfirmDialog, setShowConfirmDialog] = useState(false);
+  const [installationToDiscard, setInstallationToDiscard] = useState(null);
+  const [isDiscarding, setIsDiscarding] = useState(false);
+  const [discardError, setDiscardError] = useState(null);
+  const searchParams = useSearchParams();
+  const router = useRouter();
   useEffect(() => {
     const fetchInstallations = async () => {
       try {
@@ -117,117 +125,193 @@ var PendingInstallations = ({
     const intervalId = setInterval(fetchInstallations, pollIntervalMs);
     return () => clearInterval(intervalId);
   }, [fetchPendingInstallationsAction, pollIntervalMs]);
+  const installOptionsId = searchParams.get("installOptionsId");
+  if (installOptionsId) {
+    return null;
+  }
   if (installations.length === 0) {
     return null;
   }
   const firstInstallation = installations[0];
   const remainingCount = installations.length - 1;
-  return /* @__PURE__ */ jsx("div", { className: "mb-6 rounded-xl border border-orange-200 bg-orange-50 p-6", children: /* @__PURE__ */ jsxs("div", { className: "flex items-start gap-4", children: [
-    /* @__PURE__ */ jsx("div", { className: "flex-shrink-0 text-orange-600", children: /* @__PURE__ */ jsx(ClockIcon, {}) }),
-    /* @__PURE__ */ jsxs("div", { className: "flex-1 space-y-3", children: [
-      /* @__PURE__ */ jsxs("div", { className: "flex items-start justify-between gap-4", children: [
-        /* @__PURE__ */ jsxs("div", { className: "flex-1", children: [
-          /* @__PURE__ */ jsxs("h3", { className: "text-base font-semibold text-gray-900", children: [
-            "Pending installation: ",
-            firstInstallation.name,
-            " \u2022",
-            " ",
-            firstInstallation.method === "helm" ? "Helm" : "Linux",
-            " installation"
-          ] }),
-          /* @__PURE__ */ jsxs("p", { className: "mt-1 text-sm text-gray-600", children: [
-            "Started ",
-            formatTimeAgo(firstInstallation.startedAt),
-            " by ",
-            firstInstallation.startedBy
+  const handleDeleteClick = (installation) => {
+    setInstallationToDiscard(installation);
+    setShowConfirmDialog(true);
+    setDiscardError(null);
+  };
+  const handleCancelDiscard = () => {
+    setShowConfirmDialog(false);
+    setInstallationToDiscard(null);
+    setDiscardError(null);
+  };
+  const handleConfirmDiscard = async () => {
+    if (!installationToDiscard || !discardInstallationAction) {
+      return;
+    }
+    setIsDiscarding(true);
+    setDiscardError(null);
+    try {
+      await discardInstallationAction(installationToDiscard.id);
+      const result = await fetchPendingInstallationsAction();
+      setInstallations(result.installations);
+      const currentInstallOptionsId = searchParams.get("installOptionsId");
+      if (currentInstallOptionsId === installationToDiscard.id) {
+        router.push("/install");
+      }
+      setShowConfirmDialog(false);
+      setInstallationToDiscard(null);
+    } catch (error) {
+      console.error("[pending-installations] Failed to discard installation", error);
+      setDiscardError(error instanceof Error ? error.message : "Failed to discard installation");
+    } finally {
+      setIsDiscarding(false);
+    }
+  };
+  return /* @__PURE__ */ jsxs("div", { className: "mb-6 rounded-xl border border-orange-200 bg-orange-50 p-6", children: [
+    /* @__PURE__ */ jsxs("div", { className: "flex items-start gap-4", children: [
+      /* @__PURE__ */ jsx("div", { className: "flex-shrink-0 text-orange-600", children: /* @__PURE__ */ jsx(ClockIcon, {}) }),
+      /* @__PURE__ */ jsxs("div", { className: "flex-1 space-y-3", children: [
+        /* @__PURE__ */ jsxs("div", { className: "flex items-start justify-between gap-4", children: [
+          /* @__PURE__ */ jsxs("div", { className: "flex-1", children: [
+            /* @__PURE__ */ jsxs("h3", { className: "text-base font-semibold text-gray-900", children: [
+              "Pending installation: ",
+              firstInstallation.name,
+              " \u2022",
+              " ",
+              firstInstallation.method === "helm" ? "Helm" : "Linux",
+              " installation"
+            ] }),
+            /* @__PURE__ */ jsxs("p", { className: "mt-1 text-sm text-gray-600", children: [
+              "Started ",
+              formatTimeAgo(firstInstallation.startedAt),
+              " by ",
+              firstInstallation.startedBy
+            ] }),
+            remainingCount > 0 && /* @__PURE__ */ jsxs(
+              "button",
+              {
+                type: "button",
+                onClick: () => setShowAll(!showAll),
+                className: "mt-2 flex items-center gap-1 text-sm font-medium text-gray-700 hover:text-gray-900",
+                children: [
+                  "View ",
+                  remainingCount,
+                  " more pending installation",
+                  remainingCount !== 1 ? "s" : "",
+                  /* @__PURE__ */ jsx(ChevronRightIcon, {})
+                ]
+              }
+            )
           ] }),
-          remainingCount > 0 && /* @__PURE__ */ jsxs(
-            "button",
-            {
-              type: "button",
-              onClick: () => setShowAll(!showAll),
-              className: "mt-2 flex items-center gap-1 text-sm font-medium text-gray-700 hover:text-gray-900",
-              children: [
-                "View ",
-                remainingCount,
-                " more pending installation",
-                remainingCount !== 1 ? "s" : "",
-                /* @__PURE__ */ jsx(ChevronRightIcon, {})
-              ]
-            }
-          )
+          /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+            discardInstallationAction && /* @__PURE__ */ jsx(
+              "button",
+              {
+                type: "button",
+                onClick: () => handleDeleteClick(firstInstallation),
+                className: "rounded-lg p-2 text-red-600 transition hover:bg-red-100",
+                "aria-label": "Delete installation",
+                children: /* @__PURE__ */ jsx(TrashIcon, {})
+              }
+            ),
+            /* @__PURE__ */ jsxs(
+              Link,
+              {
+                href: `/install?installOptionsId=${firstInstallation.id}&type=${firstInstallation.method}&step=2`,
+                className: "inline-flex items-center gap-2 rounded-lg bg-orange-200 px-4 py-2 text-sm font-semibold text-gray-900 transition hover:bg-orange-300",
+                children: [
+                  "Continue installation",
+                  /* @__PURE__ */ jsx(ArrowRightIcon, {})
+                ]
+              }
+            )
+          ] })
         ] }),
-        /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
-          /* @__PURE__ */ jsx(
-            "button",
-            {
-              type: "button",
-              className: "rounded-lg p-2 text-red-600 transition hover:bg-red-100",
-              "aria-label": "Delete installation",
-              children: /* @__PURE__ */ jsx(TrashIcon, {})
-            }
-          ),
-          /* @__PURE__ */ jsxs(
-            Link,
-            {
-              href: `/install?installOptionsId=${firstInstallation.id}&type=${firstInstallation.method}&step=2`,
-              className: "inline-flex items-center gap-2 rounded-lg bg-orange-200 px-4 py-2 text-sm font-semibold text-gray-900 transition hover:bg-orange-300",
-              children: [
-                "Continue installation",
-                /* @__PURE__ */ jsx(ArrowRightIcon, {})
-              ]
-            }
-          )
-        ] })
-      ] }),
-      showAll && remainingCount > 0 && /* @__PURE__ */ jsx("div", { className: "mt-4 space-y-2 border-t border-orange-200 pt-4", children: installations.slice(1).map((installation) => /* @__PURE__ */ jsxs(
-        "div",
-        {
-          className: "flex items-center justify-between rounded-lg bg-white p-3",
-          children: [
-            /* @__PURE__ */ jsxs("div", { children: [
-              /* @__PURE__ */ jsxs("h4", { className: "text-sm font-medium text-gray-900", children: [
-                installation.name,
-                " \u2022",
-                " ",
-                installation.method === "helm" ? "Helm" : "Linux",
-                " installation"
+        showAll && remainingCount > 0 && /* @__PURE__ */ jsx("div", { className: "mt-4 space-y-2 border-t border-orange-200 pt-4", children: installations.slice(1).map((installation) => /* @__PURE__ */ jsxs(
+          "div",
+          {
+            className: "flex items-center justify-between rounded-lg bg-white p-3",
+            children: [
+              /* @__PURE__ */ jsxs("div", { children: [
+                /* @__PURE__ */ jsxs("h4", { className: "text-sm font-medium text-gray-900", children: [
+                  installation.name,
+                  " \u2022",
+                  " ",
+                  installation.method === "helm" ? "Helm" : "Linux",
+                  " installation"
+                ] }),
+                /* @__PURE__ */ jsxs("p", { className: "mt-0.5 text-xs text-gray-600", children: [
+                  "Started ",
+                  formatTimeAgo(installation.startedAt),
+                  " by ",
+                  installation.startedBy
+                ] })
               ] }),
-              /* @__PURE__ */ jsxs("p", { className: "mt-0.5 text-xs text-gray-600", children: [
-                "Started ",
-                formatTimeAgo(installation.startedAt),
-                " by ",
-                installation.startedBy
+              /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+                discardInstallationAction && /* @__PURE__ */ jsx(
+                  "button",
+                  {
+                    type: "button",
+                    onClick: () => handleDeleteClick(installation),
+                    className: "rounded-lg p-2 text-red-600 transition hover:bg-red-100",
+                    "aria-label": "Delete installation",
+                    children: /* @__PURE__ */ jsx(TrashIcon, {})
+                  }
+                ),
+                /* @__PURE__ */ jsxs(
+                  Link,
+                  {
+                    href: `/install?installOptionsId=${installation.id}&type=${installation.method}&step=2`,
+                    className: "inline-flex items-center gap-2 rounded-lg bg-orange-200 px-3 py-1.5 text-xs font-semibold text-gray-900 transition hover:bg-orange-300",
+                    children: [
+                      "Continue",
+                      /* @__PURE__ */ jsx(ArrowRightIcon, {})
+                    ]
+                  }
+                )
               ] })
-            ] }),
-            /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
-              /* @__PURE__ */ jsx(
-                "button",
-                {
-                  type: "button",
-                  className: "rounded-lg p-2 text-red-600 transition hover:bg-red-100",
-                  "aria-label": "Delete installation",
-                  children: /* @__PURE__ */ jsx(TrashIcon, {})
-                }
-              ),
-              /* @__PURE__ */ jsxs(
-                Link,
-                {
-                  href: `/install?installOptionsId=${installation.id}&type=${installation.method}&step=2`,
-                  className: "inline-flex items-center gap-2 rounded-lg bg-orange-200 px-3 py-1.5 text-xs font-semibold text-gray-900 transition hover:bg-orange-300",
-                  children: [
-                    "Continue",
-                    /* @__PURE__ */ jsx(ArrowRightIcon, {})
-                  ]
-                }
-              )
-            ] })
-          ]
-        },
-        installation.id
-      )) })
-    ] })
-  ] }) });
+            ]
+          },
+          installation.id
+        )) })
+      ] })
+    ] }),
+    showConfirmDialog && installationToDiscard && /* @__PURE__ */ jsx("div", { className: "fixed inset-0 z-50 flex items-center justify-center bg-black bg-opacity-50", children: /* @__PURE__ */ jsxs("div", { className: "w-full max-w-md rounded-lg bg-white p-6 shadow-xl", children: [
+      /* @__PURE__ */ jsx("h3", { className: "text-lg font-semibold text-gray-900", children: "Discard install and service account token" }),
+      /* @__PURE__ */ jsxs("div", { className: "mt-4", children: [
+        /* @__PURE__ */ jsxs("p", { className: "text-sm text-gray-600", children: [
+          "This will permanently delete the service account",
+          " ",
+          /* @__PURE__ */ jsx("code", { className: "rounded bg-gray-100 px-1 py-0.5 text-sm", children: installationToDiscard.name }),
+          " ",
+          "and remove the pending installation. This action cannot be undone."
+        ] }),
+        discardError && /* @__PURE__ */ jsx("p", { className: "mt-3 text-sm text-red-600", children: "Failed to discard installation. Please try again." })
+      ] }),
+      /* @__PURE__ */ jsxs("div", { className: "mt-6 flex justify-end gap-3", children: [
+        /* @__PURE__ */ jsx(
+          "button",
+          {
+            type: "button",
+            onClick: handleCancelDiscard,
+            disabled: isDiscarding,
+            className: "rounded-lg border border-gray-300 bg-white px-4 py-2 text-sm font-medium text-gray-700 hover:bg-gray-50 disabled:opacity-50",
+            children: "Cancel"
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          "button",
+          {
+            type: "button",
+            onClick: handleConfirmDiscard,
+            disabled: isDiscarding,
+            className: "rounded-lg bg-red-600 px-4 py-2 text-sm font-medium text-white hover:bg-red-700 disabled:opacity-50",
+            children: isDiscarding ? "Discarding..." : "Discard install and token"
+          }
+        )
+      ] })
+    ] }) })
+  ] });
 };
 PendingInstallations.displayName = "PendingInstallations";
 

package/dist/esm/pending-installations.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/components/pending-installations.tsx"],"names":[],"mappings":"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","file":"pending-installations.js","sourcesContent":["\"use client\";\n\nimport { useEffect, useState } from \"react\";\nimport Link from \"next/link\";\nimport type { PendingInstallation, FetchPendingInstallationsResult } from \"../actions/install\";\n\nexport interface PendingInstallationsProps {\n  fetchPendingInstallationsAction: () => Promise<FetchPendingInstallationsResult>;\n  initialInstallations?: PendingInstallation[];\n  pollIntervalMs?: number;\n}\n\nconst ClockIcon = () => (\n  <svg\n    xmlns=\"http://www.w3.org/2000/svg\"\n    viewBox=\"0 0 24 24\"\n    fill=\"none\"\n    stroke=\"currentColor\"\n    strokeWidth=\"2\"\n    strokeLinecap=\"round\"\n    strokeLinejoin=\"round\"\n    className=\"h-6 w-6\"\n  >\n    <circle cx=\"12\" cy=\"12\" r=\"10\" />\n    <polyline points=\"12 6 12 12 16 14\" />\n  </svg>\n);\n\nconst TrashIcon = () => (\n  <svg\n    xmlns=\"http://www.w3.org/2000/svg\"\n    viewBox=\"0 0 24 24\"\n    fill=\"none\"\n    stroke=\"currentColor\"\n    strokeWidth=\"2\"\n    strokeLinecap=\"round\"\n    strokeLinejoin=\"round\"\n    className=\"h-5 w-5\"\n  >\n    <path d=\"M3 6h18\" />\n    <path d=\"M19 6v14c0 1-1 2-2 2H7c-1 0-2-1-2-2V6\" />\n    <path d=\"M8 6V4c0-1 1-2 2-2h4c1 0 2 1 2 2v2\" />\n  </svg>\n);\n\nconst ChevronRightIcon = () => (\n  <svg\n    xmlns=\"http://www.w3.org/2000/svg\"\n    viewBox=\"0 0 24 24\"\n    fill=\"none\"\n    stroke=\"currentColor\"\n    strokeWidth=\"2\"\n    strokeLinecap=\"round\"\n    strokeLinejoin=\"round\"\n    className=\"h-4 w-4\"\n  >\n    <polyline points=\"9 18 15 12 9 6\" />\n  </svg>\n);\n\nconst ArrowRightIcon = () => (\n  <svg\n    xmlns=\"http://www.w3.org/2000/svg\"\n    viewBox=\"0 0 24 24\"\n    fill=\"none\"\n    stroke=\"currentColor\"\n    strokeWidth=\"2\"\n    strokeLinecap=\"round\"\n    strokeLinejoin=\"round\"\n    className=\"h-4 w-4\"\n  >\n    <line x1=\"5\" y1=\"12\" x2=\"19\" y2=\"12\" />\n    <polyline points=\"12 5 19 12 12 19\" />\n  </svg>\n);\n\nconst formatTimeAgo = (dateString: string): string => {\n  try {\n    const date = new Date(dateString);\n    const now = new Date();\n    const seconds = Math.floor((now.getTime() - date.getTime()) / 1000);\n\n    if (seconds < 60) return \"just now\";\n    if (seconds < 3600) {\n      const minutes = Math.floor(seconds / 60);\n      return `${minutes} ${minutes === 1 ? \"minute\" : \"minutes\"} ago`;\n    }\n    if (seconds < 86400) {\n      const hours = Math.floor(seconds / 3600);\n      return `${hours === 1 ? \"an hour\" : `${hours} hours`} ago`;\n    }\n    const days = Math.floor(seconds / 86400);\n    return `${days} ${days === 1 ? \"day\" : \"days\"} ago`;\n  } catch {\n    return dateString;\n  }\n};\n\nexport const PendingInstallations = ({\n  fetchPendingInstallationsAction,\n  initialInstallations = [],\n  pollIntervalMs = 5000\n}: PendingInstallationsProps) => {\n  const [installations, setInstallations] = useState<PendingInstallation[]>(initialInstallations);\n  const [showAll, setShowAll] = useState(false);\n\n  useEffect(() => {\n    const fetchInstallations = async () => {\n      try {\n        const result = await fetchPendingInstallationsAction();\n        setInstallations(result.installations);\n      } catch (error) {\n        console.error(\"[pending-installations] Failed to fetch pending installations\", error);\n      }\n    };\n\n    // Fetch immediately\n    fetchInstallations();\n\n    // Set up polling interval (skip if pollIntervalMs is 0 or falsy)\n    if (!pollIntervalMs) {\n      return;\n    }\n    const intervalId = setInterval(fetchInstallations, pollIntervalMs);\n\n    // Cleanup on unmount\n    return () => clearInterval(intervalId);\n  }, [fetchPendingInstallationsAction, pollIntervalMs]);\n\n  // Don't render if no pending installations\n  if (installations.length === 0) {\n    return null;\n  }\n\n  const firstInstallation = installations[0]!;\n  const remainingCount = installations.length - 1;\n\n  return (\n    <div className=\"mb-6 rounded-xl border border-orange-200 bg-orange-50 p-6\">\n      <div className=\"flex items-start gap-4\">\n        <div className=\"flex-shrink-0 text-orange-600\">\n          <ClockIcon />\n        </div>\n        <div className=\"flex-1 space-y-3\">\n          <div className=\"flex items-start justify-between gap-4\">\n            <div className=\"flex-1\">\n              <h3 className=\"text-base font-semibold text-gray-900\">\n                Pending installation: {firstInstallation.name} •{\" \"}\n                {firstInstallation.method === \"helm\" ? \"Helm\" : \"Linux\"} installation\n              </h3>\n              <p className=\"mt-1 text-sm text-gray-600\">\n                Started {formatTimeAgo(firstInstallation.startedAt)} by {firstInstallation.startedBy}\n              </p>\n              {remainingCount > 0 && (\n                <button\n                  type=\"button\"\n                  onClick={() => setShowAll(!showAll)}\n                  className=\"mt-2 flex items-center gap-1 text-sm font-medium text-gray-700 hover:text-gray-900\"\n                >\n                  View {remainingCount} more pending installation{remainingCount !== 1 ? \"s\" : \"\"}\n                  <ChevronRightIcon />\n                </button>\n              )}\n            </div>\n            <div className=\"flex items-center gap-2\">\n              <button\n                type=\"button\"\n                className=\"rounded-lg p-2 text-red-600 transition hover:bg-red-100\"\n                aria-label=\"Delete installation\"\n              >\n                <TrashIcon />\n              </button>\n              <Link\n                href={`/install?installOptionsId=${firstInstallation.id}&type=${firstInstallation.method}&step=2`}\n                className=\"inline-flex items-center gap-2 rounded-lg bg-orange-200 px-4 py-2 text-sm font-semibold text-gray-900 transition hover:bg-orange-300\"\n              >\n                Continue installation\n                <ArrowRightIcon />\n              </Link>\n            </div>\n          </div>\n\n          {showAll && remainingCount > 0 && (\n            <div className=\"mt-4 space-y-2 border-t border-orange-200 pt-4\">\n              {installations.slice(1).map((installation) => (\n                <div\n                  key={installation.id}\n                  className=\"flex items-center justify-between rounded-lg bg-white p-3\"\n                >\n                  <div>\n                    <h4 className=\"text-sm font-medium text-gray-900\">\n                      {installation.name} •{\" \"}\n                      {installation.method === \"helm\" ? \"Helm\" : \"Linux\"} installation\n                    </h4>\n                    <p className=\"mt-0.5 text-xs text-gray-600\">\n                      Started {formatTimeAgo(installation.startedAt)} by {installation.startedBy}\n                    </p>\n                  </div>\n                  <div className=\"flex items-center gap-2\">\n                    <button\n                      type=\"button\"\n                      className=\"rounded-lg p-2 text-red-600 transition hover:bg-red-100\"\n                      aria-label=\"Delete installation\"\n                    >\n                      <TrashIcon />\n                    </button>\n                    <Link\n                      href={`/install?installOptionsId=${installation.id}&type=${installation.method}&step=2`}\n                      className=\"inline-flex items-center gap-2 rounded-lg bg-orange-200 px-3 py-1.5 text-xs font-semibold text-gray-900 transition hover:bg-orange-300\"\n                    >\n                      Continue\n                      <ArrowRightIcon />\n                    </Link>\n                  </div>\n                </div>\n              ))}\n            </div>\n          )}\n        </div>\n      </div>\n    </div>\n  );\n};\n\nPendingInstallations.displayName = \"PendingInstallations\";\n"]}
+{"version":3,"sources":["../../src/components/pending-installations.tsx"],"names":[],"mappings":"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","file":"pending-installations.js","sourcesContent":["\"use client\";\n\nimport { useEffect, useState } from \"react\";\nimport { useSearchParams, useRouter } from \"next/navigation\";\nimport Link from \"next/link\";\nimport type { PendingInstallation, FetchPendingInstallationsResult, DiscardInstallationResult } from \"../actions/install\";\n\nexport interface PendingInstallationsProps {\n  fetchPendingInstallationsAction: () => Promise<FetchPendingInstallationsResult>;\n  discardInstallationAction?: (installOptionsId: string) => Promise<DiscardInstallationResult>;\n  initialInstallations?: PendingInstallation[];\n  pollIntervalMs?: number;\n}\n\nconst ClockIcon = () => (\n  <svg\n    xmlns=\"http://www.w3.org/2000/svg\"\n    viewBox=\"0 0 24 24\"\n    fill=\"none\"\n    stroke=\"currentColor\"\n    strokeWidth=\"2\"\n    strokeLinecap=\"round\"\n    strokeLinejoin=\"round\"\n    className=\"h-6 w-6\"\n  >\n    <circle cx=\"12\" cy=\"12\" r=\"10\" />\n    <polyline points=\"12 6 12 12 16 14\" />\n  </svg>\n);\n\nconst TrashIcon = () => (\n  <svg\n    xmlns=\"http://www.w3.org/2000/svg\"\n    viewBox=\"0 0 24 24\"\n    fill=\"none\"\n    stroke=\"currentColor\"\n    strokeWidth=\"2\"\n    strokeLinecap=\"round\"\n    strokeLinejoin=\"round\"\n    className=\"h-5 w-5\"\n  >\n    <path d=\"M3 6h18\" />\n    <path d=\"M19 6v14c0 1-1 2-2 2H7c-1 0-2-1-2-2V6\" />\n    <path d=\"M8 6V4c0-1 1-2 2-2h4c1 0 2 1 2 2v2\" />\n  </svg>\n);\n\nconst ChevronRightIcon = () => (\n  <svg\n    xmlns=\"http://www.w3.org/2000/svg\"\n    viewBox=\"0 0 24 24\"\n    fill=\"none\"\n    stroke=\"currentColor\"\n    strokeWidth=\"2\"\n    strokeLinecap=\"round\"\n    strokeLinejoin=\"round\"\n    className=\"h-4 w-4\"\n  >\n    <polyline points=\"9 18 15 12 9 6\" />\n  </svg>\n);\n\nconst ArrowRightIcon = () => (\n  <svg\n    xmlns=\"http://www.w3.org/2000/svg\"\n    viewBox=\"0 0 24 24\"\n    fill=\"none\"\n    stroke=\"currentColor\"\n    strokeWidth=\"2\"\n    strokeLinecap=\"round\"\n    strokeLinejoin=\"round\"\n    className=\"h-4 w-4\"\n  >\n    <line x1=\"5\" y1=\"12\" x2=\"19\" y2=\"12\" />\n    <polyline points=\"12 5 19 12 12 19\" />\n  </svg>\n);\n\nconst formatTimeAgo = (dateString: string): string => {\n  try {\n    const date = new Date(dateString);\n    const now = new Date();\n    const seconds = Math.floor((now.getTime() - date.getTime()) / 1000);\n\n    if (seconds < 60) return \"just now\";\n    if (seconds < 3600) {\n      const minutes = Math.floor(seconds / 60);\n      return `${minutes} ${minutes === 1 ? \"minute\" : \"minutes\"} ago`;\n    }\n    if (seconds < 86400) {\n      const hours = Math.floor(seconds / 3600);\n      return `${hours === 1 ? \"an hour\" : `${hours} hours`} ago`;\n    }\n    const days = Math.floor(seconds / 86400);\n    return `${days} ${days === 1 ? \"day\" : \"days\"} ago`;\n  } catch {\n    return dateString;\n  }\n};\n\nexport const PendingInstallations = ({\n  fetchPendingInstallationsAction,\n  discardInstallationAction,\n  initialInstallations = [],\n  pollIntervalMs = 5000\n}: PendingInstallationsProps) => {\n  const [installations, setInstallations] = useState<PendingInstallation[]>(initialInstallations);\n  const [showAll, setShowAll] = useState(false);\n  const [showConfirmDialog, setShowConfirmDialog] = useState(false);\n  const [installationToDiscard, setInstallationToDiscard] = useState<PendingInstallation | null>(null);\n  const [isDiscarding, setIsDiscarding] = useState(false);\n  const [discardError, setDiscardError] = useState<string | null>(null);\n  const searchParams = useSearchParams();\n  const router = useRouter();\n\n  useEffect(() => {\n    const fetchInstallations = async () => {\n      try {\n        const result = await fetchPendingInstallationsAction();\n        setInstallations(result.installations);\n      } catch (error) {\n        console.error(\"[pending-installations] Failed to fetch pending installations\", error);\n      }\n    };\n\n    // Fetch immediately\n    fetchInstallations();\n\n    // Set up polling interval (skip if pollIntervalMs is 0 or falsy)\n    if (!pollIntervalMs) {\n      return;\n    }\n    const intervalId = setInterval(fetchInstallations, pollIntervalMs);\n\n    // Cleanup on unmount\n    return () => clearInterval(intervalId);\n  }, [fetchPendingInstallationsAction, pollIntervalMs]);\n\n  // Don't show banner if already viewing a pending installation\n  const installOptionsId = searchParams.get(\"installOptionsId\");\n  if (installOptionsId) {\n    return null;\n  }\n\n  // Don't render if no pending installations\n  if (installations.length === 0) {\n    return null;\n  }\n\n  const firstInstallation = installations[0]!;\n  const remainingCount = installations.length - 1;\n\n  const handleDeleteClick = (installation: PendingInstallation) => {\n    setInstallationToDiscard(installation);\n    setShowConfirmDialog(true);\n    setDiscardError(null);\n  };\n\n  const handleCancelDiscard = () => {\n    setShowConfirmDialog(false);\n    setInstallationToDiscard(null);\n    setDiscardError(null);\n  };\n\n  const handleConfirmDiscard = async () => {\n    if (!installationToDiscard || !discardInstallationAction) {\n      return;\n    }\n\n    setIsDiscarding(true);\n    setDiscardError(null);\n\n    try {\n      await discardInstallationAction(installationToDiscard.id);\n      \n      // Refresh the installations list\n      const result = await fetchPendingInstallationsAction();\n      setInstallations(result.installations);\n      \n      // If we're currently viewing the discarded installation, redirect to install page\n      // Check current URL state, not captured closure value\n      const currentInstallOptionsId = searchParams.get(\"installOptionsId\");\n      if (currentInstallOptionsId === installationToDiscard.id) {\n        router.push(\"/install\");\n      }\n      \n      // Close the dialog\n      setShowConfirmDialog(false);\n      setInstallationToDiscard(null);\n    } catch (error) {\n      console.error(\"[pending-installations] Failed to discard installation\", error);\n      setDiscardError(error instanceof Error ? error.message : \"Failed to discard installation\");\n    } finally {\n      setIsDiscarding(false);\n    }\n  };\n\n  return (\n    <div className=\"mb-6 rounded-xl border border-orange-200 bg-orange-50 p-6\">\n      <div className=\"flex items-start gap-4\">\n        <div className=\"flex-shrink-0 text-orange-600\">\n          <ClockIcon />\n        </div>\n        <div className=\"flex-1 space-y-3\">\n          <div className=\"flex items-start justify-between gap-4\">\n            <div className=\"flex-1\">\n              <h3 className=\"text-base font-semibold text-gray-900\">\n                Pending installation: {firstInstallation.name} •{\" \"}\n                {firstInstallation.method === \"helm\" ? \"Helm\" : \"Linux\"} installation\n              </h3>\n              <p className=\"mt-1 text-sm text-gray-600\">\n                Started {formatTimeAgo(firstInstallation.startedAt)} by {firstInstallation.startedBy}\n              </p>\n              {remainingCount > 0 && (\n                <button\n                  type=\"button\"\n                  onClick={() => setShowAll(!showAll)}\n                  className=\"mt-2 flex items-center gap-1 text-sm font-medium text-gray-700 hover:text-gray-900\"\n                >\n                  View {remainingCount} more pending installation{remainingCount !== 1 ? \"s\" : \"\"}\n                  <ChevronRightIcon />\n                </button>\n              )}\n            </div>\n            <div className=\"flex items-center gap-2\">\n              {discardInstallationAction && (\n                <button\n                  type=\"button\"\n                  onClick={() => handleDeleteClick(firstInstallation)}\n                  className=\"rounded-lg p-2 text-red-600 transition hover:bg-red-100\"\n                  aria-label=\"Delete installation\"\n                >\n                  <TrashIcon />\n                </button>\n              )}\n              <Link\n                href={`/install?installOptionsId=${firstInstallation.id}&type=${firstInstallation.method}&step=2`}\n                className=\"inline-flex items-center gap-2 rounded-lg bg-orange-200 px-4 py-2 text-sm font-semibold text-gray-900 transition hover:bg-orange-300\"\n              >\n                Continue installation\n                <ArrowRightIcon />\n              </Link>\n            </div>\n          </div>\n\n          {showAll && remainingCount > 0 && (\n            <div className=\"mt-4 space-y-2 border-t border-orange-200 pt-4\">\n              {installations.slice(1).map((installation) => (\n                <div\n                  key={installation.id}\n                  className=\"flex items-center justify-between rounded-lg bg-white p-3\"\n                >\n                  <div>\n                    <h4 className=\"text-sm font-medium text-gray-900\">\n                      {installation.name} •{\" \"}\n                      {installation.method === \"helm\" ? \"Helm\" : \"Linux\"} installation\n                    </h4>\n                    <p className=\"mt-0.5 text-xs text-gray-600\">\n                      Started {formatTimeAgo(installation.startedAt)} by {installation.startedBy}\n                    </p>\n                  </div>\n                  <div className=\"flex items-center gap-2\">\n                    {discardInstallationAction && (\n                      <button\n                        type=\"button\"\n                        onClick={() => handleDeleteClick(installation)}\n                        className=\"rounded-lg p-2 text-red-600 transition hover:bg-red-100\"\n                        aria-label=\"Delete installation\"\n                      >\n                        <TrashIcon />\n                      </button>\n                    )}\n                    <Link\n                      href={`/install?installOptionsId=${installation.id}&type=${installation.method}&step=2`}\n                      className=\"inline-flex items-center gap-2 rounded-lg bg-orange-200 px-3 py-1.5 text-xs font-semibold text-gray-900 transition hover:bg-orange-300\"\n                    >\n                      Continue\n                      <ArrowRightIcon />\n                    </Link>\n                  </div>\n                </div>\n              ))}\n            </div>\n          )}\n        </div>\n      </div>\n\n      {/* Confirmation Dialog */}\n      {showConfirmDialog && installationToDiscard && (\n        <div className=\"fixed inset-0 z-50 flex items-center justify-center bg-black bg-opacity-50\">\n          <div className=\"w-full max-w-md rounded-lg bg-white p-6 shadow-xl\">\n            <h3 className=\"text-lg font-semibold text-gray-900\">\n              Discard install and service account token\n            </h3>\n            <div className=\"mt-4\">\n              <p className=\"text-sm text-gray-600\">\n                This will permanently delete the service account{\" \"}\n                <code className=\"rounded bg-gray-100 px-1 py-0.5 text-sm\">{installationToDiscard.name}</code>{\" \"}\n                and remove the pending installation. This action cannot be undone.\n              </p>\n              {discardError && (\n                <p className=\"mt-3 text-sm text-red-600\">\n                  Failed to discard installation. Please try again.\n                </p>\n              )}\n            </div>\n            <div className=\"mt-6 flex justify-end gap-3\">\n              <button\n                type=\"button\"\n                onClick={handleCancelDiscard}\n                disabled={isDiscarding}\n                className=\"rounded-lg border border-gray-300 bg-white px-4 py-2 text-sm font-medium text-gray-700 hover:bg-gray-50 disabled:opacity-50\"\n              >\n                Cancel\n              </button>\n              <button\n                type=\"button\"\n                onClick={handleConfirmDiscard}\n                disabled={isDiscarding}\n                className=\"rounded-lg bg-red-600 px-4 py-2 text-sm font-medium text-white hover:bg-red-700 disabled:opacity-50\"\n              >\n                {isDiscarding ? \"Discarding...\" : \"Discard install and token\"}\n              </button>\n            </div>\n          </div>\n        </div>\n      )}\n    </div>\n  );\n};\n\nPendingInstallations.displayName = \"PendingInstallations\";\n"]}

package/dist/esm/security-card.js

@@ -166,6 +166,7 @@ var Dropdown = ({ value, options, onChange, disabled, testId }) => {
         children: [
           /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
             /* @__PURE__ */ jsx("span", { children: selected?.label || "Select..." }),
+            selected?.badge && /* @__PURE__ */ jsx("span", { className: "rounded bg-green-50 px-1.5 py-0.5 text-xs font-medium text-green-600", children: selected.badge }),
             selected?.sublabel && /* @__PURE__ */ jsx("span", { className: "text-xs font-normal text-gray-500", children: selected.sublabel })
           ] }),
           /* @__PURE__ */ jsx(ChevronDownIcon, { className: "h-4 w-4 text-gray-500" })
@@ -185,7 +186,10 @@ var Dropdown = ({ value, options, onChange, disabled, testId }) => {
           "data-testid": `${testId}-option-${option.value}`,
           className: "flex w-full items-center justify-between px-4 py-2 text-left text-sm hover:bg-gray-100",
           children: [
-            /* @__PURE__ */ jsx("span", { className: "font-semibold text-gray-900", children: option.label }),
+            /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+              /* @__PURE__ */ jsx("span", { className: "font-semibold text-gray-900", children: option.label }),
+              option.badge && /* @__PURE__ */ jsx("span", { className: "rounded bg-green-50 px-1.5 py-0.5 text-xs font-medium text-green-600", children: option.badge })
+            ] }),
             option.sublabel && /* @__PURE__ */ jsx("span", { className: "text-xs text-gray-500", children: option.sublabel })
           ]
         },
@@ -347,14 +351,12 @@ function SecurityCard({
     if (!selectedSequence) return filteredReleases[0] || null;
     return filteredReleases.find((r) => r.channelSequence === selectedSequence) || null;
   }, [filteredReleases, selectedSequence]);
-  const previousRelease = useMemo(() => {
-    if (!selectedRelease) return null;
-    const idx = filteredReleases.findIndex(
-      (r) => r.channelSequence === selectedRelease.channelSequence
-    );
-    if (idx === -1 || idx >= filteredReleases.length - 1) return null;
-    return filteredReleases[idx + 1];
-  }, [filteredReleases, selectedRelease]);
+  const latestRelease = useMemo(() => {
+    return filteredReleases.length > 0 ? filteredReleases[0] : null;
+  }, [filteredReleases]);
+  const isSelectedLatest = useMemo(() => {
+    return selectedRelease?.channelSequence === latestRelease?.channelSequence;
+  }, [selectedRelease, latestRelease]);
   useEffect(() => {
     const firstRelease = filteredReleases[0];
     if (filteredReleases.length > 0 && !selectedSequence && firstRelease) {
@@ -391,12 +393,12 @@ function SecurityCard({
         setSecurityError(err instanceof Error ? err.message : "Failed to fetch security data");
         setSecurityData(null);
       }
-      if (previousRelease && onFetchSecurityDiff) {
+      if (!isSelectedLatest && latestRelease && onFetchSecurityDiff) {
         try {
           const diffResult = await onFetchSecurityDiff({
             installType: selectedInstallType,
-            fromChannelSequence: previousRelease.channelSequence,
-            toChannelSequence: selectedRelease.channelSequence
+            fromChannelSequence: selectedRelease.channelSequence,
+            toChannelSequence: latestRelease.channelSequence
           });
           setDiffData(diffResult);
         } catch (err) {
@@ -422,7 +424,7 @@ function SecurityCard({
       setIsLoadingSbom(false);
     };
     fetchData();
-  }, [selectedRelease, selectedInstallType, previousRelease, onFetchSecurityInfo, onFetchSecurityDiff, onFetchSBOM]);
+  }, [selectedRelease, selectedInstallType, latestRelease, isSelectedLatest, onFetchSecurityInfo, onFetchSecurityDiff, onFetchSBOM]);
   const installTypeOptions = useMemo(() => {
     const options = [];
     if (showLinux) options.push({ value: "linux", label: "Linux" });
@@ -430,9 +432,10 @@ function SecurityCard({
     return options;
   }, [showLinux, showHelm]);
   const releaseOptions = useMemo(() => {
-    return filteredReleases.map((r) => ({
+    return filteredReleases.map((r, index) => ({
       value: r.channelSequence.toString(),
       label: `Version ${r.versionLabel}`,
+      badge: index === 0 ? "Latest" : void 0,
       sublabel: `Sequence ${r.channelSequence}${r.isRequired ? " (required)" : ""}`
     }));
   }, [filteredReleases]);
@@ -499,12 +502,31 @@ function SecurityCard({
     }
   }, [selectedRelease, selectedInstallType, onDownloadSBOM]);
   const hasSecurityData = securityData?.images?.some((img) => img.security);
+  const activeInstancesOnVersion = useMemo(() => {
+    if (!selectedRelease?.versionLabel || !securityData?.activeInstancesByVersion) {
+      return 0;
+    }
+    return securityData.activeInstancesByVersion[selectedRelease.versionLabel] || 0;
+  }, [selectedRelease, securityData]);
+  const fixedCVEsToLatest = useMemo(() => {
+    if (!diffData?.images) return 0;
+    return Object.values(diffData.images).reduce((total, imageDiff) => {
+      if (!imageDiff.removed) return total;
+      return total + Object.keys(imageDiff.removed.critical || {}).length + Object.keys(imageDiff.removed.high || {}).length + Object.keys(imageDiff.removed.medium || {}).length + Object.keys(imageDiff.removed.low || {}).length;
+    }, 0);
+  }, [diffData]);
+  const hasCriticalFixed = useMemo(() => {
+    if (!diffData?.images) return false;
+    return Object.values(diffData.images).some(
+      (imageDiff) => imageDiff.removed?.critical && Object.keys(imageDiff.removed.critical).length > 0
+    );
+  }, [diffData]);
   return /* @__PURE__ */ jsxs("div", { className: "space-y-6", children: [
     /* @__PURE__ */ jsxs("div", { children: [
       /* @__PURE__ */ jsx("h1", { className: "text-3xl font-bold text-gray-900", children: "Security Center" }),
       /* @__PURE__ */ jsx("p", { className: "text-gray-600", children: "Security information and compliance reports for each release" })
     ] }),
-    /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-1 gap-6 lg:grid-cols-2", children: [
+    /* @__PURE__ */ jsxs("div", { className: "flex items-end gap-6", children: [
       /* @__PURE__ */ jsxs("div", { className: "w-72", children: [
         /* @__PURE__ */ jsx("span", { className: "mb-2 block text-sm font-medium text-gray-700", children: "Install Type" }),
         availableInstallTypes.length > 1 ? /* @__PURE__ */ jsx(
@@ -529,7 +551,45 @@ function SecurityCard({
             testId: "release-dropdown"
           }
         )
-      ] })
+      ] }),
+      !isSelectedLatest ? /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-1 self-start pt-7", children: [
+        /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+          /* @__PURE__ */ jsx(
+            "a",
+            {
+              href: "/update",
+              className: "rounded px-3 py-1 text-xs text-white no-underline",
+              style: {
+                backgroundColor: hasCriticalFixed ? "#dc2626" : primaryColor || "#2563eb",
+                borderColor: hasCriticalFixed ? "#dc2626" : primaryColor || "#2563eb"
+              },
+              children: hasCriticalFixed ? "Critical update available" : "Update available"
+            }
+          ),
+          fixedCVEsToLatest > 0 && /* @__PURE__ */ jsxs("span", { className: "text-xs font-medium text-gray-600", children: [
+            fixedCVEsToLatest,
+            " Fixed CVEs"
+          ] })
+        ] }),
+        activeInstancesOnVersion > 0 && /* @__PURE__ */ jsxs("span", { className: "text-sm text-gray-600", children: [
+          activeInstancesOnVersion,
+          " active instance",
+          activeInstancesOnVersion !== 1 ? "s" : "",
+          " on this version.",
+          " ",
+          /* @__PURE__ */ jsx("a", { href: "/update", className: "font-semibold text-blue-500 hover:underline", children: "See more." })
+        ] })
+      ] }) : (
+        /* Show active instances inline when on latest */
+        activeInstancesOnVersion > 0 && /* @__PURE__ */ jsxs("div", { className: "pb-2 text-sm text-gray-600", children: [
+          activeInstancesOnVersion,
+          " active instance",
+          activeInstancesOnVersion !== 1 ? "s" : "",
+          " on this version.",
+          " ",
+          /* @__PURE__ */ jsx("a", { href: "/update", className: "font-semibold text-blue-500 hover:underline", children: "See more." })
+        ] })
+      )
     ] }),
     (hasSecurityData || isLoadingScans || isLoadingSbom || securityError || sbomError) && /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-1 gap-6 lg:grid-cols-2", children: [
       /* @__PURE__ */ jsxs("div", { className: "rounded-lg border border-gray-200 bg-white", children: [