- {process.container &&
- (process.container.state === ContainerState.QUEUED ||
- process.container.state === ContainerState.LOCKED ||
- process.container.state === ContainerState.RUNNING) &&
- process.containerRequest.priority !== null &&
- process.containerRequest.priority > 0 &&
- <span data-cy="process-cancel" className={classes.cancelButton} onClick={() => cancelProcess(process.containerRequest.uuid)}>Cancel</span>}
+ {isProcessCancelable(process) &&
+ <Button
+ data-cy="process-cancel-button"
+ variant="contained"
+ size="small"
+ color="primary"
+ className={classNames(classes.actionButton, classes.cancelButton)}
+ onClick={() => cancelProcess(process.containerRequest.uuid)}>
+ <StopIcon />
+ Cancel
+ </Button>}