fix(dashboard): distinguish CLI update vs install banner
When the local fn/fusion CLI is on the wrong version, the banner now says "Update the Fusion CLI", shows installed vs expected versions, and labels the action "Update with npm" instead of the generic install copy. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
5
.changeset/cli-version-mismatch-banner.md
Normal file
5
.changeset/cli-version-mismatch-banner.md
Normal file
@@ -0,0 +1,5 @@
|
|||||||
|
---
|
||||||
|
"@fusion/dashboard": patch
|
||||||
|
---
|
||||||
|
|
||||||
|
Differentiate the CLI banner between missing-install and version-mismatch states: when the installed `fn`/`fusion` CLI is out of date, show "Update the Fusion CLI" with current vs target versions and an "Update with npm" button instead of the generic install copy.
|
||||||
@@ -103,14 +103,30 @@ export function CliBinaryInstallBanner({ onOpenSettings }: Props) {
|
|||||||
// disabled the install banner would be misleading.
|
// disabled the install banner would be misleading.
|
||||||
if (status.state === "skipped") return null;
|
if (status.state === "skipped") return null;
|
||||||
|
|
||||||
|
const isMismatch = status.state === "version-mismatch";
|
||||||
|
const installedVersion = status.binary.version;
|
||||||
|
const targetVersion = status.expectedVersion;
|
||||||
|
const title = isMismatch ? "Update the Fusion CLI" : "Install the Fusion CLI";
|
||||||
|
const body = isMismatch ? (
|
||||||
|
<>
|
||||||
|
Your installed <code>fn</code>/<code>fusion</code> CLI is{" "}
|
||||||
|
<strong>v{installedVersion ?? "unknown"}</strong> but this dashboard expects{" "}
|
||||||
|
<strong>v{targetVersion}</strong>. Update to stay in sync.
|
||||||
|
</>
|
||||||
|
) : (
|
||||||
|
<>
|
||||||
|
Get the <code>fn</code> and <code>fusion</code> commands on your terminal so you
|
||||||
|
can drive Fusion from anywhere. One click below or copy the command into your shell.
|
||||||
|
</>
|
||||||
|
);
|
||||||
|
const idleLabel = isMismatch ? "Update with npm" : "Install with npm";
|
||||||
|
const busyLabel = isMismatch ? "Updating…" : "Installing…";
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="cli-binary-banner" role="status">
|
<div className="cli-binary-banner" role="status">
|
||||||
<div className="cli-binary-banner__body">
|
<div className="cli-binary-banner__body">
|
||||||
<div className="cli-binary-banner__title">Install the Fusion CLI</div>
|
<div className="cli-binary-banner__title">{title}</div>
|
||||||
<div className="cli-binary-banner__text">
|
<div className="cli-binary-banner__text">{body}</div>
|
||||||
Get the <code>fn</code> and <code>fusion</code> commands on your terminal so you
|
|
||||||
can drive Fusion from anywhere. One click below or copy the command into your shell.
|
|
||||||
</div>
|
|
||||||
<div className="cli-binary-banner__actions">
|
<div className="cli-binary-banner__actions">
|
||||||
<button
|
<button
|
||||||
type="button"
|
type="button"
|
||||||
@@ -118,7 +134,7 @@ export function CliBinaryInstallBanner({ onOpenSettings }: Props) {
|
|||||||
onClick={() => void handleInstall()}
|
onClick={() => void handleInstall()}
|
||||||
disabled={installing}
|
disabled={installing}
|
||||||
>
|
>
|
||||||
{installing ? "Installing…" : "Install with npm"}
|
{installing ? busyLabel : idleLabel}
|
||||||
</button>
|
</button>
|
||||||
<button
|
<button
|
||||||
type="button"
|
type="button"
|
||||||
|
|||||||
Reference in New Issue
Block a user