diff --git a/app/src/pages/ToolDetail.tsx b/app/src/pages/ToolDetail.tsx index 2a273ae..eb08951 100644 --- a/app/src/pages/ToolDetail.tsx +++ b/app/src/pages/ToolDetail.tsx @@ -1,10 +1,13 @@ import { useParams, Link } from "react-router-dom" -import { Loader2, Package } from "lucide-react" -import { useDeployment, useSetEnabled } from "@/services/api/hooks" +import { Loader2 } from "lucide-react" +import { useApply, useDeployment, useSetEnabled } from "@/services/api/hooks" +import { kindIcon } from "@/lib/labels" import { DetailHeader } from "@/components/detail/DetailHeader" import { ConfigPanel } from "@/components/detail/ConfigPanel" import { RelatedDeployments } from "@/components/detail/RelatedDeployments" +const ProgramIcon = kindIcon("program") + export function ToolDetailPage() { const { name } = useParams<{ name: string }>() const { data: deployment, isLoading, error, refetch } = useDeployment(name ?? "") @@ -60,7 +63,7 @@ export function ToolDetailPage() { to={`/programs/${program}`} className="inline-flex items-center gap-1.5 text-sm text-[var(--primary)] hover:underline" > - {program} + {program} @@ -83,8 +86,15 @@ function PathLifecycle({ installed: boolean | null onDone: () => void }) { - const { mutate, isPending } = useSetEnabled() + const setEnabled = useSetEnabled() + const apply = useApply() const installed = installedState === true + // Drift: the desired state (enabled) and the actual state (installed) disagree — + // config says it should be on PATH but isn't, or vice versa. The enable/disable + // toggle changes *intent*; converging is a separate act, so offer an Apply button + // that reconciles reality to the current intent without flipping it. + const drift = installedState !== null && installedState !== enabled + const busy = setEnabled.isPending || apply.isPending const dot = installedState === true ? "bg-green-500" @@ -97,20 +107,34 @@ function PathLifecycle({ {installed ? "Installed on PATH" : "Not installed"} {!enabled && disabled} + {drift && needs apply} manager: path - +
+ {drift && ( + + )} + +
) }