60 lines
1.8 KiB
TypeScript
60 lines
1.8 KiB
TypeScript
import { WarmStartIcon } from "~/assets/icons/WarmStartIcon";
|
|
import { InfoIconTooltip, SimpleTooltip } from "./primitives/Tooltip";
|
|
import { cn } from "~/utils/cn";
|
|
import { Paragraph } from "./primitives/Paragraph";
|
|
|
|
export function WarmStartCombo({
|
|
isWarmStart,
|
|
showTooltip = false,
|
|
className,
|
|
}: {
|
|
isWarmStart: boolean;
|
|
showTooltip?: boolean;
|
|
className?: string;
|
|
}) {
|
|
return (
|
|
<div className={cn("flex items-center gap-1 text-sm text-text-dimmed", className)}>
|
|
<WarmStartIcon isWarmStart={isWarmStart} className="size-5" />
|
|
<span>{isWarmStart ? "Warm Start" : "Cold Start"}</span>
|
|
{showTooltip && <InfoIconTooltip content={<WarmStartTooltipContent />} />}
|
|
</div>
|
|
);
|
|
}
|
|
|
|
export function WarmStartIconWithTooltip({
|
|
isWarmStart,
|
|
className,
|
|
}: {
|
|
isWarmStart: boolean;
|
|
className?: string;
|
|
}) {
|
|
return (
|
|
<SimpleTooltip
|
|
className="relative z-9999"
|
|
button={<WarmStartIcon isWarmStart={isWarmStart} className={className} />}
|
|
content={<WarmStartTooltipContent />}
|
|
/>
|
|
);
|
|
}
|
|
|
|
function WarmStartTooltipContent() {
|
|
return (
|
|
<div className="flex max-w-xs flex-col gap-4 p-1">
|
|
<div>
|
|
<WarmStartCombo isWarmStart={false} className="mb-0.5 text-text-bright" />
|
|
<Paragraph variant="small" className="text-wrap! text-text-dimmed">
|
|
A cold start happens when we need to boot up a new machine for your run to execute. This
|
|
takes longer than a warm start.
|
|
</Paragraph>
|
|
</div>
|
|
<div>
|
|
<WarmStartCombo isWarmStart={true} className="mb-0.5 text-text-bright" />
|
|
<Paragraph variant="small" className="text-wrap! text-text-dimmed">
|
|
A warm start happens when we can reuse a machine from a run that recently finished. This
|
|
takes less time than a cold start.
|
|
</Paragraph>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|