- Remove Card wrappers and gray backgrounds from routine detail - Use max-w-2xl container layout like issue detail page - Add icons to tabs (Clock, Play, ListTree, Activity) matching issue tabs - Make activity tab compact (single-line items with space-y-1.5) - Create shared RunButton and PauseResumeButton components - Build user-friendly ScheduleEditor with presets (hourly, daily, weekdays, weekly, monthly) - Auto-detect timezone via Intl API instead of manual timezone input - Use shared action buttons in both AgentDetail and RoutineDetail - Replace bordered run history cards with compact divided list Co-Authored-By: Paperclip <noreply@paperclip.ing>
52 lines
1.2 KiB
TypeScript
52 lines
1.2 KiB
TypeScript
import { Pause, Play } from "lucide-react";
|
|
import { Button } from "@/components/ui/button";
|
|
|
|
export function RunButton({
|
|
onClick,
|
|
disabled,
|
|
label = "Run now",
|
|
size = "sm",
|
|
}: {
|
|
onClick: () => void;
|
|
disabled?: boolean;
|
|
label?: string;
|
|
size?: "sm" | "default";
|
|
}) {
|
|
return (
|
|
<Button variant="outline" size={size} onClick={onClick} disabled={disabled}>
|
|
<Play className="h-3.5 w-3.5 sm:mr-1" />
|
|
<span className="hidden sm:inline">{label}</span>
|
|
</Button>
|
|
);
|
|
}
|
|
|
|
export function PauseResumeButton({
|
|
isPaused,
|
|
onPause,
|
|
onResume,
|
|
disabled,
|
|
size = "sm",
|
|
}: {
|
|
isPaused: boolean;
|
|
onPause: () => void;
|
|
onResume: () => void;
|
|
disabled?: boolean;
|
|
size?: "sm" | "default";
|
|
}) {
|
|
if (isPaused) {
|
|
return (
|
|
<Button variant="outline" size={size} onClick={onResume} disabled={disabled}>
|
|
<Play className="h-3.5 w-3.5 sm:mr-1" />
|
|
<span className="hidden sm:inline">Resume</span>
|
|
</Button>
|
|
);
|
|
}
|
|
|
|
return (
|
|
<Button variant="outline" size={size} onClick={onPause} disabled={disabled}>
|
|
<Pause className="h-3.5 w-3.5 sm:mr-1" />
|
|
<span className="hidden sm:inline">Pause</span>
|
|
</Button>
|
|
);
|
|
}
|