Files
netfelix-audio-fix/src/features/pipeline/ScheduleControls.tsx

89 lines
2.4 KiB
TypeScript

import { useState } from 'react';
import { api } from '~/shared/lib/api';
import { Input } from '~/shared/components/ui/input';
import { Button } from '~/shared/components/ui/button';
interface ScheduleControlsProps {
scheduler: {
job_sleep_seconds: number;
schedule_enabled: boolean;
schedule_start: string;
schedule_end: string;
};
onUpdate: () => void;
}
export function ScheduleControls({ scheduler, onUpdate }: ScheduleControlsProps) {
const [open, setOpen] = useState(false);
const [state, setState] = useState(scheduler);
const save = async () => {
await api.patch('/api/execute/scheduler', state);
onUpdate();
setOpen(false);
};
const startAll = async () => {
await api.post('/api/execute/start');
onUpdate();
};
return (
<div className="relative flex items-center gap-2">
<Button variant="primary" size="sm" onClick={startAll}>
Start queue
</Button>
<button
onClick={() => setOpen(!open)}
className="text-xs text-gray-500 hover:text-gray-700 cursor-pointer"
>
Schedule settings
</button>
{open && (
<div className="absolute right-0 top-10 z-50 bg-white border rounded-lg shadow-lg p-4 w-72">
<h3 className="text-sm font-medium mb-3">Schedule Settings</h3>
<label className="block text-xs text-gray-600 mb-1">Sleep between jobs (seconds)</label>
<Input
type="number"
min={0}
value={state.job_sleep_seconds}
onChange={(e) => setState({ ...state, job_sleep_seconds: parseInt(e.target.value) || 0 })}
className="mb-3"
/>
<label className="flex items-center gap-2 text-xs text-gray-600 mb-2">
<input
type="checkbox"
checked={state.schedule_enabled}
onChange={(e) => setState({ ...state, schedule_enabled: e.target.checked })}
/>
Enable time window
</label>
{state.schedule_enabled && (
<div className="flex items-center gap-2 mb-3">
<Input
type="time"
value={state.schedule_start}
onChange={(e) => setState({ ...state, schedule_start: e.target.value })}
className="w-24"
/>
<span className="text-xs text-gray-500">to</span>
<Input
type="time"
value={state.schedule_end}
onChange={(e) => setState({ ...state, schedule_end: e.target.value })}
className="w-24"
/>
</div>
)}
<Button variant="primary" size="sm" onClick={save}>Save</Button>
</div>
)}
</div>
);
}