ui: organize and tweak to flash messages
This commit is contained in:
parent
d8da79b7fb
commit
9c92d51e28
18 changed files with 36 additions and 36 deletions
|
@ -25,7 +25,7 @@ const EggRouter = () => {
|
|||
|
||||
useEffect(() => {
|
||||
if (!error) clearFlashes('egg');
|
||||
if (error) clearAndAddHttpError({ error, key: 'egg' });
|
||||
if (error) clearAndAddHttpError({ key: 'egg', error });
|
||||
}, [ error ]);
|
||||
|
||||
if (!egg || (error && isValidating)) {
|
||||
|
|
|
@ -26,7 +26,7 @@ export default () => {
|
|||
|
||||
useEffect(() => {
|
||||
if (!error) clearFlashes('server');
|
||||
if (error) clearAndAddHttpError({ error, key: 'server' });
|
||||
if (error) clearAndAddHttpError({ key: 'server', error });
|
||||
}, [ error ]);
|
||||
|
||||
if (!server || (error && isValidating)) {
|
||||
|
|
|
@ -21,7 +21,7 @@ export default () => {
|
|||
</div>
|
||||
</div>
|
||||
|
||||
<FlashMessageRender byKey={'settings'} css={tw`mb-4`}/>
|
||||
<FlashMessageRender byKey={'admin:settings'} css={tw`mb-4`}/>
|
||||
|
||||
<SubNavigation>
|
||||
<SubNavigationLink to="/admin/settings" name="General">
|
||||
|
|
|
@ -30,7 +30,7 @@ const DisableTwoFactorModal = () => {
|
|||
.catch(error => {
|
||||
console.error(error);
|
||||
|
||||
clearAndAddHttpError({ error, key: 'account:two-factor' });
|
||||
clearAndAddHttpError({ key: 'account:two-factor', error });
|
||||
setSubmitting(false);
|
||||
setPropOverrides(null);
|
||||
});
|
||||
|
|
|
@ -31,7 +31,7 @@ const SetupTwoFactorModal = () => {
|
|||
.then(setToken)
|
||||
.catch(error => {
|
||||
console.error(error);
|
||||
clearAndAddHttpError({ error, key: 'account:two-factor' });
|
||||
clearAndAddHttpError({ key: 'account:two-factor', error });
|
||||
});
|
||||
}, []);
|
||||
|
||||
|
@ -44,7 +44,7 @@ const SetupTwoFactorModal = () => {
|
|||
.catch(error => {
|
||||
console.error(error);
|
||||
|
||||
clearAndAddHttpError({ error, key: 'account:two-factor' });
|
||||
clearAndAddHttpError({ key: 'account:two-factor', error });
|
||||
})
|
||||
.then(() => {
|
||||
setSubmitting(false);
|
||||
|
|
|
@ -25,7 +25,7 @@ const BackupContainer = () => {
|
|||
return;
|
||||
}
|
||||
|
||||
clearAndAddHttpError({ error, key: 'backups' });
|
||||
clearAndAddHttpError({ key: 'backups', error });
|
||||
}, [ error ]);
|
||||
|
||||
if (!backups || (error && isValidating)) {
|
||||
|
|
|
@ -50,7 +50,7 @@ const JavaVersionModalFeature = () => {
|
|||
|
||||
const updateJava = () => {
|
||||
setLoading(true);
|
||||
clearFlashes('feature:javaVersion');
|
||||
clearFlashes('feature:java-version');
|
||||
|
||||
setSelectedDockerImage(uuid, selectedVersion)
|
||||
.then(() => {
|
||||
|
@ -63,39 +63,38 @@ const JavaVersionModalFeature = () => {
|
|||
})
|
||||
.catch(error => {
|
||||
console.error(error);
|
||||
clearAndAddHttpError({ key: 'feature:javaVersion', error });
|
||||
clearAndAddHttpError({ key: 'feature:java-version', error });
|
||||
})
|
||||
.then(() => setLoading(false));
|
||||
};
|
||||
|
||||
useEffect(() => {
|
||||
clearFlashes('feature:javaVersion');
|
||||
clearFlashes('feature:java-version');
|
||||
}, []);
|
||||
|
||||
return (
|
||||
<Modal visible={visible} onDismissed={() => setVisible(false)} closeOnBackground={false} showSpinnerOverlay={loading}>
|
||||
<FlashMessageRender key={'feature:javaVersion'} css={tw`mb-4`}/>
|
||||
<FlashMessageRender key={'feature:java-version'} css={tw`mb-4`}/>
|
||||
|
||||
<h2 css={tw`text-2xl mb-4 text-neutral-100`}>Invalid Java version, update Docker image?</h2>
|
||||
<p css={tw`mt-4`}>This server is unable to start due to the required Java version not being met.</p>
|
||||
<p css={tw`mt-4`}>By pressing {'"Update Docker Image"'} below you are acknowledging that the Docker image this server uses will be changed to an image below that has the Java version you are requesting.</p>
|
||||
|
||||
<div css={tw`sm:flex items-center mt-4`}>
|
||||
<p>Please select a Java version from the list below.</p>
|
||||
<Select
|
||||
onChange={e => setSelectedVersion(e.target.value)}
|
||||
>
|
||||
{dockerImageList.map((key, index) => {
|
||||
return (
|
||||
<option key={index} value={key.image}>{key.name}</option>
|
||||
);
|
||||
})}
|
||||
<Select onChange={e => setSelectedVersion(e.target.value)}>
|
||||
{dockerImageList.map((key, index) => (
|
||||
<option key={index} value={key.image}>{key.name}</option>
|
||||
))}
|
||||
</Select>
|
||||
</div>
|
||||
|
||||
<div css={tw`mt-8 sm:flex items-center justify-end`}>
|
||||
<Button isSecondary onClick={() => setVisible(false)} css={tw`w-full sm:w-auto border-transparent`}>
|
||||
Cancel
|
||||
Cancel
|
||||
</Button>
|
||||
<Button onClick={updateJava} css={tw`mt-4 sm:mt-0 sm:ml-4 w-full sm:w-auto`}>
|
||||
Update Docker Image
|
||||
Update Docker Image
|
||||
</Button>
|
||||
</div>
|
||||
</Modal>
|
||||
|
|
|
@ -73,7 +73,7 @@ export default () => {
|
|||
})
|
||||
.catch(error => {
|
||||
console.error(error);
|
||||
addError({ message: httpErrorToHuman(error), key: 'files:view' });
|
||||
addError({ key: 'files:view', message: httpErrorToHuman(error) });
|
||||
})
|
||||
.then(() => setLoading(false));
|
||||
};
|
||||
|
|
|
@ -110,7 +110,7 @@ export default ({ className }: WithClassname) => {
|
|||
.then(() => mutate())
|
||||
.catch(error => {
|
||||
console.error(error);
|
||||
clearAndAddHttpError({ error, key: 'files' });
|
||||
clearAndAddHttpError({ key: 'files', error });
|
||||
});
|
||||
};
|
||||
|
||||
|
|
|
@ -24,7 +24,7 @@ const RunScheduleButton = ({ schedule }: { schedule: Schedule }) => {
|
|||
})
|
||||
.catch(error => {
|
||||
console.error(error);
|
||||
clearAndAddHttpError({ error, key: 'schedules' });
|
||||
clearAndAddHttpError({ key: 'schedules', error });
|
||||
})
|
||||
.then(() => setLoading(false));
|
||||
}, []);
|
||||
|
|
|
@ -31,7 +31,7 @@ export default () => {
|
|||
getServerSchedules(uuid)
|
||||
.then(schedules => setSchedules(schedules))
|
||||
.catch(error => {
|
||||
addError({ message: httpErrorToHuman(error), key: 'schedules' });
|
||||
addError({ key: 'schedules', message: httpErrorToHuman(error) });
|
||||
console.error(error);
|
||||
})
|
||||
.then(() => setLoading(false));
|
||||
|
|
|
@ -65,7 +65,7 @@ export default () => {
|
|||
.then(schedule => appendSchedule(schedule))
|
||||
.catch(error => {
|
||||
console.error(error);
|
||||
clearAndAddHttpError({ error, key: 'schedules' });
|
||||
clearAndAddHttpError({ key: 'schedules', error });
|
||||
})
|
||||
.then(() => setIsLoading(false));
|
||||
}, [ scheduleId ]);
|
||||
|
|
|
@ -58,7 +58,7 @@ export default ({ schedule, task }: Props) => {
|
|||
.catch(error => {
|
||||
console.error(error);
|
||||
setIsLoading(false);
|
||||
addError({ message: httpErrorToHuman(error), key: 'schedules' });
|
||||
addError({ key: 'schedules', message: httpErrorToHuman(error) });
|
||||
});
|
||||
};
|
||||
|
||||
|
|
|
@ -81,7 +81,7 @@ const TaskDetailsModal = ({ schedule, task }: Props) => {
|
|||
clearFlashes('schedule:task');
|
||||
if (backupLimit === 0 && values.action === 'backup') {
|
||||
setSubmitting(false);
|
||||
addError({ message: 'A backup task cannot be created when the server\'s backup limit is set to 0.', key: 'schedule:task' });
|
||||
addError({ key: 'schedule:task', message: 'A backup task cannot be created when the server\'s backup limit is set to 0.' });
|
||||
} else {
|
||||
createOrUpdateScheduleTask(uuid, schedule.id, task?.id, values)
|
||||
.then(task => {
|
||||
|
@ -96,7 +96,7 @@ const TaskDetailsModal = ({ schedule, task }: Props) => {
|
|||
.catch(error => {
|
||||
console.error(error);
|
||||
setSubmitting(false);
|
||||
addError({ message: httpErrorToHuman(error), key: 'schedule:task' });
|
||||
addError({ key: 'schedule:task', message: httpErrorToHuman(error) });
|
||||
});
|
||||
}
|
||||
};
|
||||
|
|
|
@ -16,12 +16,12 @@ export default () => {
|
|||
const { addFlash, clearFlashes } = useStoreActions((actions: Actions<ApplicationStore>) => actions.flashes);
|
||||
|
||||
const reinstall = () => {
|
||||
clearFlashes('settings');
|
||||
clearFlashes('server:settings');
|
||||
setIsSubmitting(true);
|
||||
reinstallServer(uuid)
|
||||
.then(() => {
|
||||
addFlash({
|
||||
key: 'settings',
|
||||
key: 'server:settings',
|
||||
type: 'success',
|
||||
message: 'Your server has begun the reinstallation process.',
|
||||
});
|
||||
|
@ -29,7 +29,7 @@ export default () => {
|
|||
.catch(error => {
|
||||
console.error(error);
|
||||
|
||||
addFlash({ key: 'settings', type: 'error', message: httpErrorToHuman(error) });
|
||||
addFlash({ key: 'server:settings', type: 'error', message: httpErrorToHuman(error) });
|
||||
})
|
||||
.then(() => {
|
||||
setIsSubmitting(false);
|
||||
|
|
|
@ -45,12 +45,12 @@ export default () => {
|
|||
const { addError, clearFlashes } = useStoreActions((actions: Actions<ApplicationStore>) => actions.flashes);
|
||||
|
||||
const submit = ({ name }: Values, { setSubmitting }: FormikHelpers<Values>) => {
|
||||
clearFlashes('settings');
|
||||
clearFlashes('server:settings');
|
||||
renameServer(server.uuid, name)
|
||||
.then(() => setServer({ ...server, name }))
|
||||
.catch(error => {
|
||||
console.error(error);
|
||||
addError({ key: 'settings', message: httpErrorToHuman(error) });
|
||||
addError({ key: 'server:settings', message: httpErrorToHuman(error) });
|
||||
})
|
||||
.then(() => setSubmitting(false));
|
||||
};
|
||||
|
|
|
@ -23,7 +23,8 @@ export default () => {
|
|||
|
||||
return (
|
||||
<ServerContentBlock title={'Settings'}>
|
||||
<FlashMessageRender byKey={'settings'} css={tw`mb-4`}/>
|
||||
<FlashMessageRender byKey={'server:settings'} css={tw`mb-4`}/>
|
||||
|
||||
<div css={tw`md:flex`}>
|
||||
<div css={tw`w-full md:flex-1 md:mr-10`}>
|
||||
<Can action={'file.sftp'}>
|
||||
|
|
|
@ -38,7 +38,7 @@ const VariableBox = ({ variable }: Props) => {
|
|||
}), false))
|
||||
.catch(error => {
|
||||
console.error(error);
|
||||
clearAndAddHttpError({ error, key: FLASH_KEY });
|
||||
clearAndAddHttpError({ key: FLASH_KEY, error });
|
||||
})
|
||||
.then(() => setLoading(false));
|
||||
}, 500);
|
||||
|
|
Loading…
Reference in a new issue