Tooltip,
Typography,
Grid,
- CircularProgress,
} from '@material-ui/core';
import { ArvadosTheme } from 'common/custom-theme';
import {
CloseIcon,
MaximizeIcon,
+ MemoryIcon,
UnMaximizeIcon,
- ProcessIcon
} from 'components/icon/icon';
import { MPVPanelProps } from 'components/multi-panel-view/multi-panel-view';
import { connect } from 'react-redux';
import { Process } from 'store/processes/process';
import { NodeInstanceType } from 'store/process-panel/process-panel';
-import { DefaultView } from 'components/default-view/default-view';
+import { DetailsAttribute } from "components/details-attribute/details-attribute";
+import { formatFileSize } from "common/formatters";
+import { MountKind } from 'models/mount-types';
interface ProcessResourceCardDataProps {
process: Process;
nodeInfo: NodeInstanceType | null;
}
-type CssRules = "card" | "header" | "title" | "avatar" | "iconHeader" | "content";
+type CssRules = "card" | "header" | "title" | "avatar" | "iconHeader" | "content" | "sectionH3";
const styles: StyleRulesCallback<CssRules> = (theme: ArvadosTheme) => ({
- card: {},
- header: {},
- title: {},
- avatar: {},
- iconHeader: {},
- content: {}
+ card: {
+ height: '100%'
+ },
+ header: {
+ paddingBottom: "0px"
+ },
+ title: {
+ paddingTop: theme.spacing.unit * 0.5
+ },
+ avatar: {
+ paddingTop: theme.spacing.unit * 0.5
+ },
+ iconHeader: {
+ fontSize: '1.875rem',
+ color: theme.customs.colors.greyL,
+ },
+ content: {
+ paddingTop: "0px",
+ maxHeight: `calc(100% - ${theme.spacing.unit * 7.5}px)`,
+ overflow: "auto"
+ },
+ sectionH3: {
+ margin: "0.5em",
+ color: theme.customs.colors.greyD,
+ fontSize: "0.8125rem",
+ textTransform: "uppercase",
+ }
});
type ProcessResourceCardProps = ProcessResourceCardDataProps & WithStyles<CssRules> & MPVPanelProps;
export const ProcessResourceCard = withStyles(styles)(connect()(
({ classes, nodeInfo, doHidePanel, doMaximizePanel, doUnMaximizePanel, panelMaximized, panelName, process, }: ProcessResourceCardProps) => {
-
- const loading = nodeInfo === null;
+ let diskRequest = 0;
+ if (process.container?.mounts) {
+ for (const mnt in process.container.mounts) {
+ const mp = process.container.mounts[mnt];
+ if (mp.kind === MountKind.TEMPORARY_DIRECTORY) {
+ diskRequest += mp.capacity;
+ }
+ }
+ }
return <Card className={classes.card} data-cy="process-resources-card">
<CardHeader
content: classes.title,
avatar: classes.avatar,
}}
- avatar={<ProcessIcon className={classes.iconHeader} />}
+ avatar={<MemoryIcon className={classes.iconHeader} />}
title={
<Typography noWrap variant='h6' color='inherit'>
Resources
</div>
} />
<CardContent className={classes.content}>
- <>
- {/* raw is undefined until params are loaded */}
- {loading && <Grid container item alignItems='center' justify='center'>
- <CircularProgress />
- </Grid>}
- {/* Once loaded, either raw or params may still be empty
- * Raw when all params are empty
- * Params when raw is provided by containerRequest properties but workflow mount is absent for preview
- */}
- {!loading &&
- <>
- <div>
- stuff
- </div>
- </>}
- {!loading && <Grid container item alignItems='center' justify='center'>
- <DefaultView messages={["No parameters found"]} />
- </Grid>}
- </>
+ <Grid container>
+ <Grid item xs={4}>
+ <h3 className={classes.sectionH3}>Requested Resources</h3>
+ <Grid container>
+ <Grid item xs={12}>
+ <DetailsAttribute label="Cores" value={process.container?.runtimeConstraints.vcpus} />
+ </Grid>
+ <Grid item xs={12}>
+ <DetailsAttribute label="RAM*" value={formatFileSize(process.container?.runtimeConstraints.ram)} />
+ </Grid>
+ <Grid item xs={12}>
+ <DetailsAttribute label="Disk" value={formatFileSize(diskRequest)} />
+ </Grid>
+
+ {process.container?.runtimeConstraints.cuda &&
+ process.container?.runtimeConstraints.cuda.device_count > 0 ?
+ <>
+ <Grid item xs={12}>
+ <DetailsAttribute label="CUDA devices" value={process.container?.runtimeConstraints.cuda.device_count} />
+ </Grid>
+ <Grid item xs={12}>
+ <DetailsAttribute label="CUDA driver version" value={process.container?.runtimeConstraints.cuda.driver_version} />
+ </Grid>
+ <Grid item xs={12}>
+ <DetailsAttribute label="CUDA hardware capability" value={process.container?.runtimeConstraints.cuda.hardware_capability} />
+ </Grid>
+ </> : null}
+
+ {process.container?.runtimeConstraints.keep_cache_ram &&
+ process.container?.runtimeConstraints.keep_cache_ram > 0 ?
+ <Grid item xs={12}>
+ <DetailsAttribute label="Keep cache (RAM)" value={formatFileSize(process.container?.runtimeConstraints.keep_cache_ram)} />
+ </Grid> : null}
+
+ {process.container?.runtimeConstraints.keep_cache_disk &&
+ process.container?.runtimeConstraints.keep_cache_disk > 0 ?
+ <Grid item xs={12}>
+ <DetailsAttribute label="Keep cache (disk)" value={formatFileSize(process.container?.runtimeConstraints.keep_cache_disk)} />
+ </Grid> : null}
+
+ {process.container?.runtimeConstraints.API ? <Grid item xs={12}>
+ <DetailsAttribute label="API access" value={process.container?.runtimeConstraints.API.toString()} />
+ </Grid> : null}
+
+ </Grid>
+ </Grid>
+
+
+ <Grid item xs={8}>
+ <h3 className={classes.sectionH3}>Assigned Instance Type</h3>
+ {nodeInfo === null ? <Grid item xs={8}>
+ No instance type recorded
+ </Grid>
+ :
+ <Grid container>
+ <Grid item xs={6}>
+ <DetailsAttribute label="Cores" value={nodeInfo.VCPUs} />
+ </Grid>
+
+ <Grid item xs={6}>
+ <DetailsAttribute label="Provider type" value={nodeInfo.ProviderType} />
+ </Grid>
+
+ <Grid item xs={6}>
+ <DetailsAttribute label="RAM" value={formatFileSize(nodeInfo.RAM)} />
+ </Grid>
+
+ <Grid item xs={6}>
+ <DetailsAttribute label="Price" value={"$" + nodeInfo.Price.toString()} />
+ </Grid>
+
+ <Grid item xs={6}>
+ <DetailsAttribute label="Disk" value={formatFileSize(nodeInfo.IncludedScratch + nodeInfo.AddedScratch)} />
+ </Grid>
+
+ <Grid item xs={6}>
+ <DetailsAttribute label="Preemptible" value={nodeInfo.Preemptible.toString()} />
+ </Grid>
+
+ {nodeInfo.CUDA && nodeInfo.CUDA.DeviceCount > 0 &&
+ <>
+ <Grid item xs={6}>
+ <DetailsAttribute label="CUDA devices" value={nodeInfo.CUDA.DeviceCount} />
+ </Grid>
+
+ <Grid item xs={6}>
+ </Grid>
+
+ <Grid item xs={6}>
+ <DetailsAttribute label="CUDA driver version" value={nodeInfo.CUDA.DriverVersion} />
+ </Grid>
+
+ <Grid item xs={6}>
+ </Grid>
+
+ <Grid item xs={6}>
+ <DetailsAttribute label="CUDA hardware capability" value={nodeInfo.CUDA.HardwareCapability} />
+ </Grid>
+ </>
+ }
+ </Grid>}
+ </Grid>
+ </Grid>
+ <Typography>* RAM available to the program is limited to Requested RAM, not Instance RAM</Typography>
</CardContent>
- </Card>;
+ </Card >;
}
));