import { Terminal } from "lucide-react";
import { Button } from "@/components/ui/button";
import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
import { useNavigate } from "react-router-dom";

export function SshTasksAddonPage() {
	const navigate = useNavigate();

	return (
		<div className="flex flex-col gap-4">
			<h2 className="text-xl font-semibold">SSH tasks</h2>
			<Card>
				<CardHeader>
					<CardTitle>Saved actions</CardTitle>
				</CardHeader>
				<CardContent className="flex flex-col gap-3">
					<p className="text-sm text-muted-foreground">
						Create, edit, and run saved shell or Python tasks against local
						or remote machines.
					</p>
					<Button onClick={() => navigate("/actions")}>
						<Terminal className="mr-2 h-4 w-4" />
						Open Actions
					</Button>
				</CardContent>
			</Card>
		</div>
	);
}