import { CodeSnippetDataProps } from '~/components/code-snippet/code-snippet';
import { BackIcon } from '~/components/icon/icon';
import { DefaultView } from '~/components/default-view/default-view';
-import { openContextMenu } from '../../store/context-menu/context-menu-actions';
type CssRules = 'backLink' | 'backIcon' | 'card' | 'title' | 'iconHeader' | 'link';
const styles: StyleRulesCallback<CssRules> = (theme: ArvadosTheme) => ({
backLink: {
- fontSize: '1rem',
+ fontSize: '14px',
fontWeight: 600,
display: 'flex',
alignItems: 'center',
color: theme.customs.colors.green700
},
link: {
- alignSelf: 'flex-end',
- textAlign: 'right'
+ fontSize: '0.875rem',
+ color: theme.palette.primary.main,
+ textAlign: 'right',
+ '&:hover': {
+ cursor: 'pointer'
+ }
}
});
export interface ProcessLogMainCardActionProps {
onContextMenu: (event: React.MouseEvent<any>, process: Process) => void;
+ navigateToLogCollection: (uuid: string) => void;
}
export type ProcessLogMainCardProps = ProcessLogMainCardDataProps
& ProcessLogFormActionProps;
export const ProcessLogMainCard = withStyles(styles)(
- ({ classes, process, selectedFilter, filters, onChange, lines, onContextMenu }: ProcessLogMainCardProps & WithStyles<CssRules>) =>
+ ({ classes, process, selectedFilter, filters, onChange, lines, onContextMenu, navigateToLogCollection }: ProcessLogMainCardProps & WithStyles<CssRules>) =>
<Grid item xs={12}>
<Link to={`/processes/${process.containerRequest.uuid}`} className={classes.backLink}>
- <BackIcon className={classes.backIcon} /> Back
+ <BackIcon className={classes.backIcon} /> BACK
</Link>
<Card className={classes.card}>
<CardHeader
avatar={<ProcessIcon className={classes.iconHeader} />}
action={
- <IconButton onClick={event => onContextMenu(event, process)} aria-label="More options">
- <Tooltip title="More options">
+ <Tooltip title="More options" disableFocusListener>
+ <IconButton onClick={event => onContextMenu(event, process)} aria-label="More options">
<MoreOptionsIcon />
- </Tooltip>
- </IconButton>}
+ </IconButton>
+ </Tooltip>}
title={
<Tooltip title={process.containerRequest.name} placement="bottom-start">
- <Typography noWrap variant="title" className={classes.title}>
+ <Typography noWrap variant='h6' className={classes.title}>
{process.containerRequest.name}
</Typography>
</Tooltip>}
<ProcessLogForm selectedFilter={selectedFilter} filters={filters} onChange={onChange} />
</Grid>
<Grid item xs={6} className={classes.link}>
- <Typography component='div'>
+ <span onClick={() => navigateToLogCollection(process.containerRequest.logUuid!)}>
Go to Log collection
- </Typography>
+ </span>
</Grid>
</Grid>
<Grid item xs>