Apply new eslint rules; default to prettier for styling
This commit is contained in:
DaneEveritt
parent
f22cce8881
commit
dc84af9937
218 changed files with 3876 additions and 3564 deletions
|
|
@ -44,15 +44,18 @@ export default () => {
|
|||
const history = useHistory();
|
||||
const { id: scheduleId } = useParams<Params>();
|
||||
|
||||
const id = ServerContext.useStoreState(state => state.server.data!.id);
|
||||
const uuid = ServerContext.useStoreState(state => state.server.data!.uuid);
|
||||
const id = ServerContext.useStoreState((state) => state.server.data!.id);
|
||||
const uuid = ServerContext.useStoreState((state) => state.server.data!.uuid);
|
||||
|
||||
const { clearFlashes, clearAndAddHttpError } = useFlash();
|
||||
const [ isLoading, setIsLoading ] = useState(true);
|
||||
const [ showEditModal, setShowEditModal ] = useState(false);
|
||||
const [isLoading, setIsLoading] = useState(true);
|
||||
const [showEditModal, setShowEditModal] = useState(false);
|
||||
|
||||
const schedule = ServerContext.useStoreState(st => st.schedules.data.find(s => s.id === Number(scheduleId)), isEqual);
|
||||
const appendSchedule = ServerContext.useStoreActions(actions => actions.schedules.appendSchedule);
|
||||
const schedule = ServerContext.useStoreState(
|
||||
(st) => st.schedules.data.find((s) => s.id === Number(scheduleId)),
|
||||
isEqual
|
||||
);
|
||||
const appendSchedule = ServerContext.useStoreActions((actions) => actions.schedules.appendSchedule);
|
||||
|
||||
useEffect(() => {
|
||||
if (schedule?.id === Number(scheduleId)) {
|
||||
|
|
@ -62,56 +65,58 @@ export default () => {
|
|||
|
||||
clearFlashes('schedules');
|
||||
getServerSchedule(uuid, Number(scheduleId))
|
||||
.then(schedule => appendSchedule(schedule))
|
||||
.catch(error => {
|
||||
.then((schedule) => appendSchedule(schedule))
|
||||
.catch((error) => {
|
||||
console.error(error);
|
||||
clearAndAddHttpError({ error, key: 'schedules' });
|
||||
})
|
||||
.then(() => setIsLoading(false));
|
||||
}, [ scheduleId ]);
|
||||
}, [scheduleId]);
|
||||
|
||||
const toggleEditModal = useCallback(() => {
|
||||
setShowEditModal(s => !s);
|
||||
setShowEditModal((s) => !s);
|
||||
}, []);
|
||||
|
||||
return (
|
||||
<PageContentBlock title={'Schedules'}>
|
||||
<FlashMessageRender byKey={'schedules'} css={tw`mb-4`}/>
|
||||
{!schedule || isLoading ?
|
||||
<Spinner size={'large'} centered/>
|
||||
:
|
||||
<FlashMessageRender byKey={'schedules'} css={tw`mb-4`} />
|
||||
{!schedule || isLoading ? (
|
||||
<Spinner size={'large'} centered />
|
||||
) : (
|
||||
<>
|
||||
<ScheduleCronRow cron={schedule.cron} css={tw`sm:hidden bg-neutral-700 rounded mb-4 p-3`}/>
|
||||
<ScheduleCronRow cron={schedule.cron} css={tw`sm:hidden bg-neutral-700 rounded mb-4 p-3`} />
|
||||
<div css={tw`rounded shadow`}>
|
||||
<div css={tw`sm:flex items-center bg-neutral-900 p-3 sm:p-6 border-b-4 border-neutral-600 rounded-t`}>
|
||||
<div
|
||||
css={tw`sm:flex items-center bg-neutral-900 p-3 sm:p-6 border-b-4 border-neutral-600 rounded-t`}
|
||||
>
|
||||
<div css={tw`flex-1`}>
|
||||
<h3 css={tw`flex items-center text-neutral-100 text-2xl`}>
|
||||
{schedule.name}
|
||||
{schedule.isProcessing ?
|
||||
{schedule.isProcessing ? (
|
||||
<span
|
||||
css={tw`flex items-center rounded-full px-2 py-px text-xs ml-4 uppercase bg-neutral-600 text-white`}
|
||||
>
|
||||
<Spinner css={tw`w-3! h-3! mr-2`}/>
|
||||
<Spinner css={tw`w-3! h-3! mr-2`} />
|
||||
Processing
|
||||
</span>
|
||||
:
|
||||
<ActivePill active={schedule.isActive}/>
|
||||
}
|
||||
) : (
|
||||
<ActivePill active={schedule.isActive} />
|
||||
)}
|
||||
</h3>
|
||||
<p css={tw`mt-1 text-sm text-neutral-200`}>
|
||||
Last run at:
|
||||
{schedule.lastRunAt ?
|
||||
format(schedule.lastRunAt, 'MMM do \'at\' h:mma')
|
||||
:
|
||||
{schedule.lastRunAt ? (
|
||||
format(schedule.lastRunAt, "MMM do 'at' h:mma")
|
||||
) : (
|
||||
<span css={tw`text-neutral-300`}>n/a</span>
|
||||
}
|
||||
)}
|
||||
<span css={tw`ml-4 pl-4 border-l-4 border-neutral-600 py-px`}>
|
||||
Next run at:
|
||||
{schedule.nextRunAt ?
|
||||
format(schedule.nextRunAt, 'MMM do \'at\' h:mma')
|
||||
:
|
||||
{schedule.nextRunAt ? (
|
||||
format(schedule.nextRunAt, "MMM do 'at' h:mma")
|
||||
) : (
|
||||
<span css={tw`text-neutral-300`}>n/a</span>
|
||||
}
|
||||
)}
|
||||
</span>
|
||||
</p>
|
||||
</div>
|
||||
|
|
@ -120,28 +125,34 @@ export default () => {
|
|||
<Button.Text className={'flex-1 mr-4'} onClick={toggleEditModal}>
|
||||
Edit
|
||||
</Button.Text>
|
||||
<NewTaskButton schedule={schedule}/>
|
||||
<NewTaskButton schedule={schedule} />
|
||||
</Can>
|
||||
</div>
|
||||
</div>
|
||||
<div css={tw`hidden sm:grid grid-cols-5 md:grid-cols-5 gap-4 mb-4 mt-4`}>
|
||||
<CronBox title={'Minute'} value={schedule.cron.minute}/>
|
||||
<CronBox title={'Hour'} value={schedule.cron.hour}/>
|
||||
<CronBox title={'Day (Month)'} value={schedule.cron.dayOfMonth}/>
|
||||
<CronBox title={'Month'} value={schedule.cron.month}/>
|
||||
<CronBox title={'Day (Week)'} value={schedule.cron.dayOfWeek}/>
|
||||
<CronBox title={'Minute'} value={schedule.cron.minute} />
|
||||
<CronBox title={'Hour'} value={schedule.cron.hour} />
|
||||
<CronBox title={'Day (Month)'} value={schedule.cron.dayOfMonth} />
|
||||
<CronBox title={'Month'} value={schedule.cron.month} />
|
||||
<CronBox title={'Day (Week)'} value={schedule.cron.dayOfWeek} />
|
||||
</div>
|
||||
<div css={tw`bg-neutral-700 rounded-b`}>
|
||||
{schedule.tasks.length > 0 ?
|
||||
schedule.tasks.sort((a, b) => a.sequenceId === b.sequenceId ? 0 : (a.sequenceId > b.sequenceId ? 1 : -1)).map(task => (
|
||||
<ScheduleTaskRow key={`${schedule.id}_${task.id}`} task={task} schedule={schedule}/>
|
||||
))
|
||||
:
|
||||
null
|
||||
}
|
||||
{schedule.tasks.length > 0
|
||||
? schedule.tasks
|
||||
.sort((a, b) =>
|
||||
a.sequenceId === b.sequenceId ? 0 : a.sequenceId > b.sequenceId ? 1 : -1
|
||||
)
|
||||
.map((task) => (
|
||||
<ScheduleTaskRow
|
||||
key={`${schedule.id}_${task.id}`}
|
||||
task={task}
|
||||
schedule={schedule}
|
||||
/>
|
||||
))
|
||||
: null}
|
||||
</div>
|
||||
</div>
|
||||
<EditScheduleModal visible={showEditModal} schedule={schedule} onModalDismissed={toggleEditModal}/>
|
||||
<EditScheduleModal visible={showEditModal} schedule={schedule} onModalDismissed={toggleEditModal} />
|
||||
<div css={tw`mt-6 flex sm:justify-end`}>
|
||||
<Can action={'schedule.delete'}>
|
||||
<DeleteScheduleButton
|
||||
|
|
@ -149,14 +160,14 @@ export default () => {
|
|||
onDeleted={() => history.push(`/server/${id}/schedules`)}
|
||||
/>
|
||||
</Can>
|
||||
{schedule.tasks.length > 0 &&
|
||||
<Can action={'schedule.update'}>
|
||||
<RunScheduleButton schedule={schedule}/>
|
||||
</Can>
|
||||
}
|
||||
{schedule.tasks.length > 0 && (
|
||||
<Can action={'schedule.update'}>
|
||||
<RunScheduleButton schedule={schedule} />
|
||||
</Can>
|
||||
)}
|
||||
</div>
|
||||
</>
|
||||
}
|
||||
)}
|
||||
</PageContentBlock>
|
||||
);
|
||||
};
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue