import { useState } from 'react'; import deleteSchedule from '@/api/server/schedules/deleteSchedule'; import { ServerContext } from '@/state/server'; import { Actions, useStoreActions } from 'easy-peasy'; import { ApplicationStore } from '@/state'; import { httpErrorToHuman } from '@/api/http'; import { Button } from '@/components/elements/button/index'; import { Dialog } from '@/components/elements/dialog'; import SpinnerOverlay from '@/components/elements/SpinnerOverlay'; interface Props { scheduleId: number; onDeleted: () => void; } export default ({ scheduleId, onDeleted }: Props) => { const [visible, setVisible] = useState(false); const [isLoading, setIsLoading] = useState(false); const uuid = ServerContext.useStoreState(state => state.server.data!.uuid); const { addError, clearFlashes } = useStoreActions((actions: Actions) => actions.flashes); const onDelete = () => { setIsLoading(true); clearFlashes('schedules'); deleteSchedule(uuid, scheduleId) .then(() => { setIsLoading(false); onDeleted(); }) .catch(error => { console.error(error); addError({ key: 'schedules', message: httpErrorToHuman(error) }); setIsLoading(false); setVisible(false); }); }; return ( <> setVisible(false)} title={'Delete Schedule'} confirm={'Delete'} onConfirmed={onDelete} > All tasks will be removed and any running processes will be terminated. setVisible(true)} > Delete ); };