Canvas: Add worker kill action to monitoring tab
Change-Id: I8387dcf2320f9eccdb2e443fd4039e91ff35ed31
diff --git a/apps/canvas/front/src/Monitoring.tsx b/apps/canvas/front/src/Monitoring.tsx
index 3bc0b63..0d86432 100644
--- a/apps/canvas/front/src/Monitoring.tsx
+++ b/apps/canvas/front/src/Monitoring.tsx
@@ -6,7 +6,7 @@
import { ResizablePanelGroup, ResizablePanel, ResizableHandle } from "@/components/ui/resizable";
import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from "@/components/ui/tooltip";
import { useToast } from "@/hooks/use-toast";
-import { Check, Ellipsis, LoaderCircle, LogsIcon, X, RefreshCw } from "lucide-react";
+import { Check, Ellipsis, LoaderCircle, LogsIcon, X, RefreshCw, Power } from "lucide-react";
import { XTerm } from "@/components/XTerm";
export function Logs() {
@@ -107,6 +107,41 @@
[projectId, toast],
);
+ const handleQuitWorkerClick = useCallback(
+ (serviceName: string, workerId: string) => {
+ if (!projectId) return;
+ if (!window.confirm(`Are you sure you want to terminate worker ${workerId} for service ${serviceName}?`)) {
+ return;
+ }
+ toast({
+ title: "Worker ${serviceName} / ${workerId} is being terminated.",
+ });
+ fetch(`/api/project/${projectId}/quitquitquit/${serviceName}/${workerId}`, {
+ method: "POST",
+ })
+ .then((resp) => {
+ if (!resp.ok) {
+ toast({
+ title: `Failed to terminate worker ${serviceName} / ${workerId}`,
+ variant: "destructive",
+ });
+ } else {
+ toast({
+ title: `Successfully terminated worker ${serviceName} / ${workerId}`,
+ });
+ }
+ })
+ .catch((e) => {
+ console.error(e);
+ toast({
+ title: `Failed to terminate worker ${serviceName} / ${workerId}`,
+ variant: "destructive",
+ });
+ });
+ },
+ [projectId, toast],
+ );
+
const defaultExpandedServiceNames = useMemo(() => sortedServices.map((s) => s.name), [sortedServices]);
const defaultExpandedFirstWorkerId = useMemo(() => {
if (sortedServices.length > 0 && sortedServices[0].workers && sortedServices[0].workers.length > 0) {
@@ -167,6 +202,20 @@
<RefreshCw className="w-4 h-4" />
Reload Worker
</Button>
+ <Button
+ onClick={() =>
+ handleQuitWorkerClick(
+ service.name,
+ worker.id,
+ )
+ }
+ size="sm"
+ variant="link"
+ className="!px-0"
+ >
+ <Power className="w-4 h-4" />
+ Quit Worker
+ </Button>
{!worker.commit && (
<p className="flex items-center">
<FailureIcon />