secstate/Iris
Public Access
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 1 Wiki Activity

Process action naming convention

Browse Source
This commit is contained in:
James Barnsley
2020-02-13 10:41:20 +13:00
parent c4486e4007
commit 571c857814
16 changed files with 559 additions and 342 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
src/js/components/Loader.js
View File

@ -31,6 +31,7 @@ export default memo((props) => {
const {
body,
loading,
finished = false,
mini,
lazy,
white,
@ -38,7 +39,7 @@ export default memo((props) => {
progress = null,
} = props;
if (!loading) {
if (!loading && !finished) {
return null;
}
@ -70,6 +71,17 @@ export default memo((props) => {
);
}
if (finished) {
classNameString += ' loader--finished';
return (
<div className={classNameString}>
<div className="loader__spinner">
<Icon name="check" />
</div>
</div>
);
}
if (progress) {
classNameString += ' loader--progress';
return (

41
src/js/components/Notifications.js
View File

@ -112,7 +112,9 @@ class Notifications extends React.Component {
renderProcess(process) {
const {
data: { total, remaining },
message,
level = 'info',
content,
description = null,
status,
closing,
key,
@ -126,28 +128,55 @@ class Notifications extends React.Component {
switch (status) {
case 'running':
return (
<div className={`notification notification--process${closing ? ' closing' : ''}`} key={key}>
<div
className={
`notification notification--${level} notification--process${closing ? ' closing' : ''}`
}
key={key}
>
<Loader
progress={progress}
loading
mini
white
/>
{message}
{content && content !== '' && <div className="notification__content">{content}</div>}
{description && description !== '' && <div className="notification__description">{description}</div>}
<Icon name="close" className="notification__close-button" onClick={() => { uiActions.cancelProcess(key); }} />
</div>
);
case 'finished':
return (
<div
className={
`notification notification--${level} notification--process${closing ? ' closing' : ''}`
}
key={key}
>
<Icon className="notification__icon" name={level === 'error' ? 'close' : 'check'} />
{content && content !== '' && <div className="notification__content">{content}</div>}
{description && description !== '' && <div className="notification__description">{description}</div>}
<Icon name="close" className="notification__close-button" onClick={() => { uiActions.closeProcess(key); }} />
</div>
);
case 'cancelling':
return (
<div className={`notification notification--process cancelling${closing ? ' closing' : ''}`} key={key}>
<div
className={
`notification notification--${level} notification--process cancelling${closing ? ' closing' : ''}`
}
key={key}
>
<Loader />
Cancelling
{content && content !== '' && <div className="notification__content">{content}</div>}
{description && description !== '' && <div className="notification__description">{description}</div>}
</div>
);
case 'cancelled':
case 'finished':
case 'completed':
default:
return null;
}