75 lines
2.5 KiB
TypeScript
75 lines
2.5 KiB
TypeScript
 
|
import type { MigrationState } from "../../lib/types";
|
||
|
|
import Button from "../ui/Button";
|
||
|
|
import StatusIndicator from "../ui/StatusIndicator";
|
||
|
|
import { ROLLBACK_SCOPE, formatSnapshotDate } from "./migrationCopy";
|
||
|
|
|
||
|
|
interface Props {
|
||
|
|
record: MigrationState;
|
||
|
|
/** Disables the action row while resume/rollback is in flight. */
|
||
|
|
busy?: boolean;
|
||
|
|
onResume: () => void;
|
||
|
|
onRollback: () => void;
|
||
|
|
}
|
||
|
|
|
||
|
|
/**
|
||
|
|
* A migration that got past the container swap and stopped there.
|
||
|
|
*
|
||
|
|
* This is deliberately **not** [`MigrationReportCard`]. That card's primary
|
||
|
|
* action is Keep, which means "accept this and drop the rollback image" — and
|
||
|
|
* on an unfinished migration `triple-c-snapshot-<id>:latest` still points at
|
||
|
|
* the *old* lineage, so Keep would delete the only way back while leaving a
|
||
|
|
* container the app can no longer reason about. The backend's own message on
|
||
|
|
* this record says to resume; offering Keep beside it was the UI contradicting
|
||
|
|
* the backend and losing.
|
||
|
|
*
|
||
|
|
* So the two actions here are Resume and Roll back, and nothing else. It is
|
||
|
|
* shown ahead of any report, whether the record was found on mount or produced
|
||
|
|
* by a run that just failed — those are the same situation.
|
||
|
|
*/
|
||
|
|
export default function MigrationInterruptedCard({
|
||
|
|
record,
|
||
|
|
busy = false,
|
||
|
|
onResume,
|
||
|
|
onRollback,
|
||
|
|
}: Props) {
|
||
|
|
const started = formatSnapshotDate(record.started_at);
|
||
|
|
|
||
|
|
return (
|
||
|
|
<div className="space-y-2">
|
||
|
|
<StatusIndicator
|
||
|
|
tone="error"
|
||
|
|
label="The container base update did not finish"
|
||
|
|
className="text-[13px] font-semibold"
|
||
|
|
/>
|
||
|
|
|
||
|
|
<p className="text-xs text-[var(--text-secondary)] leading-snug">
|
||
|
|
This container is part-way onto the new base: it was replaced, but the
|
||
|
|
result was never saved
|
||
|
|
{started ? `. The update started ${started}` : ""}. Resuming replays the
|
||
|
|
same plan it was given — it is the only way to finish it.
|
||
|
|
</p>
|
||
|
|
|
||
|
|
{record.report?.message && (
|
||
|
|
<p className="text-xs text-[var(--text-secondary)] leading-snug select-text">
|
||
|
|
{record.report.message}
|
||
|
|
</p>
|
||
|
|
)}
|
||
|
|
|
||
|
|
<p className="text-xs text-[var(--text-secondary)] leading-snug">
|
||
|
|
{ROLLBACK_SCOPE}
|
||
|
|
</p>
|
||
|
|
|
||
|
|
<div className="flex flex-wrap gap-1.5 pt-0.5">
|
||
|
|
<Button size="md" variant="primary" disabled={busy} onClick={onResume}>
|
||
|
|
Resume update
|
||
|
|
</Button>
|
||
|
|
{record.rollback_image && (
|
||
|
|
<Button size="md" variant="danger" disabled={busy} onClick={onRollback}>
|
||
|
|
Roll back
|
||
|
|
</Button>
|
||
|
|
)}
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
);
|
||
|
|
}
|