Typography,
Grid,
Link,
+ Button
} from '@material-ui/core';
import { ArvadosTheme } from 'common/custom-theme';
import {
MaximizeIcon,
ResourceIcon,
UnMaximizeIcon,
+ ShowChartIcon,
} from 'components/icon/icon';
import { MPVPanelProps } from 'components/multi-panel-view/multi-panel-view';
import { connect } from 'react-redux';
import { DetailsAttribute } from "components/details-attribute/details-attribute";
import { formatFileSize } from "common/formatters";
import { MountKind } from 'models/mount-types';
-import { CollectionFile } from 'models/collection-file';
interface ProcessResourceCardDataProps {
process: Process;
nodeInfo: NodeInstanceType | null;
- usageReport: CollectionFile | null;
+ usageReport: string | null;
}
-type CssRules = "card" | "header" | "title" | "avatar" | "iconHeader" | "content" | "sectionH3";
+type CssRules = "card" | "header" | "title" | "avatar" | "iconHeader" | "content" | "sectionH3" | "reportButton";
const styles: StyleRulesCallback<CssRules> = (theme: ArvadosTheme) => ({
card: {
color: theme.customs.colors.greyD,
fontSize: "0.8125rem",
textTransform: "uppercase",
+ },
+ reportButton: {
}
});
}
action={
<div>
+ {usageReport && <Link href={usageReport} className={classes.reportButton} target="_blank"><ShowChartIcon /> Resource usage report</Link>}
{doUnMaximizePanel && panelMaximized &&
<Tooltip title={`Unmaximize ${panelName || 'panel'}`} disableFocusListener>
<IconButton onClick={doUnMaximizePanel}><UnMaximizeIcon /></IconButton>
</div>
} />
<CardContent className={classes.content}>
- {usageReport && <Link href={usageReport.url}>Resource usage report</Link>}
<Grid container>
<Grid item xs={4}>
<h3 className={classes.sectionH3}>Requested Resources</h3>