f69eb3f9eb
Add native CE detection of "a newer image is available" for running
containers, surfaced as a read-only HTTP endpoint and a containers-list
badge/column. No applying of updates (M3/M4), no auto-heal (M1).
Backend:
- New CE handler GET /docker/{id}/containers/{containerId}/image_status
backed by the existing zlib/CE digest engine
(images.NewClientWithRegistry + ContainerImageStatus). Honors nodeName,
authz, and routes registry calls through the credential store / SSRF
AllowList. Engine failures degrade to a 200 {Status:"error"} so the UI
stays graceful. Response shape: {Status, Message?}.
Frontend (CE-only, no isBE gating; the EE ImageStatus component is left
untouched):
- useContainerImageStatus TanStack Query hook (5min staleTime, no
refetch-on-focus; backend caches 24h) calling the non-proxied endpoint.
- UpdateStatusBadge component (own assets, neutral on skipped/error).
- "Update available" column in the containers datatable; one cached,
non-blocking query per visible row.
Tests: Go response-shape unit test; vitest for the badge (all statuses)
and the hook (url + nodeName query param via msw).
Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
53 lines
1.5 KiB
TypeScript
53 lines
1.5 KiB
TypeScript
import { Loader } from 'lucide-react';
|
|
|
|
import UpdatesAvailable from '@/assets/ico/icon_updates-available.svg?c';
|
|
import UpToDate from '@/assets/ico/icon_up-to-date.svg?c';
|
|
|
|
import { Icon } from '@@/Icon';
|
|
|
|
import { ContainerImageStatusValue } from '../../queries/useContainerImageStatus';
|
|
|
|
export interface Props {
|
|
status?: ContainerImageStatusValue;
|
|
isLoading?: boolean;
|
|
}
|
|
|
|
/**
|
|
* CE container image update badge.
|
|
*
|
|
* Renders "Update available" when the image is outdated, an up-to-date indicator
|
|
* when it matches the registry, a spinner while the status is being fetched, and
|
|
* nothing for neutral states (skipped/error/processing/preparing) so that
|
|
* undetectable images don't clutter the UI.
|
|
*/
|
|
export function UpdateStatusBadge({ status, isLoading }: Props) {
|
|
if (isLoading) {
|
|
return (
|
|
<span role="status" aria-label="Checking for image updates">
|
|
<Icon icon={Loader} size="sm" spin className="!mr-1 align-middle" />
|
|
</span>
|
|
);
|
|
}
|
|
|
|
if (status === 'outdated') {
|
|
return (
|
|
<span className="inline-flex items-center gap-1 whitespace-nowrap text-warning">
|
|
<Icon icon={UpdatesAvailable} size="sm" className="align-middle" />
|
|
Update available
|
|
</span>
|
|
);
|
|
}
|
|
|
|
if (status === 'updated') {
|
|
return (
|
|
<span className="inline-flex items-center gap-1 whitespace-nowrap text-muted">
|
|
<Icon icon={UpToDate} size="sm" className="align-middle" />
|
|
Up to date
|
|
</span>
|
|
);
|
|
}
|
|
|
|
// skipped / error / processing / preparing / undefined -> neutral, nothing to show.
|
|
return null;
|
|
}
|