import React, { useEffect, useState } from 'react'; import { RouteComponentProps } from 'react-router-dom'; import { Schedule } from '@/api/server/schedules/getServerSchedules'; import getServerSchedule from '@/api/server/schedules/getServerSchedule'; import Spinner from '@/components/elements/Spinner'; import FlashMessageRender from '@/components/FlashMessageRender'; import { httpErrorToHuman } from '@/api/http'; import ScheduleRow from '@/components/server/schedules/ScheduleRow'; import ScheduleTaskRow from '@/components/server/schedules/ScheduleTaskRow'; import EditScheduleModal from '@/components/server/schedules/EditScheduleModal'; import NewTaskButton from '@/components/server/schedules/NewTaskButton'; import DeleteScheduleButton from '@/components/server/schedules/DeleteScheduleButton'; import Can from '@/components/elements/Can'; import useServer from '@/plugins/useServer'; import useFlash from '@/plugins/useFlash'; import { ServerContext } from '@/state/server'; import PageContentBlock from '@/components/elements/PageContentBlock'; import tw from 'twin.macro'; import Button from '@/components/elements/Button'; import GreyRowBox from '@/components/elements/GreyRowBox'; interface Params { id: string; } interface State { schedule?: Schedule; } export default ({ match, history, location: { state } }: RouteComponentProps, State>) => { const { id, uuid } = useServer(); const { clearFlashes, addError } = useFlash(); const [ isLoading, setIsLoading ] = useState(true); const [ showEditModal, setShowEditModal ] = useState(false); const schedule = ServerContext.useStoreState(st => st.schedules.data.find(s => s.id === state.schedule?.id), [ match ]); const appendSchedule = ServerContext.useStoreActions(actions => actions.schedules.appendSchedule); useEffect(() => { if (schedule?.id === Number(match.params.id)) { setIsLoading(false); return; } clearFlashes('schedules'); getServerSchedule(uuid, Number(match.params.id)) .then(schedule => appendSchedule(schedule)) .catch(error => { console.error(error); addError({ message: httpErrorToHuman(error), key: 'schedules' }); }) .then(() => setIsLoading(false)); }, [ match ]); return ( {!schedule || isLoading ? : <> setShowEditModal(false)} />

Configured Tasks

{schedule.tasks.length > 0 ? <> { schedule.tasks .sort((a, b) => a.sequenceId - b.sequenceId) .map(task => ( )) } {schedule.tasks.length > 1 &&

Task delays are relative to the previous task in the listing.

} :

There are no tasks configured for this schedule.

}
history.push(`/server/${id}/schedules`)} />
}
); };