[ARVADOS-WORKBENCH2] created: 1.3.0-137-g2cfcee1b
Git user
git at public.curoverse.com
Mon Dec 17 06:45:02 EST 2018
at 2cfcee1b9b63ab14a493992f1f81e1f71546fa38 (commit)
commit 2cfcee1b9b63ab14a493992f1f81e1f71546fa38
Author: Pawel Kromplewski <pawel.kromplewski at contractors.roche.com>
Date: Mon Dec 17 12:44:52 2018 +0100
Display workflow name inside info card inside process view
Feature #14434
Arvados-DCO-1.1-Signed-off-by: Pawel Kromplewski <pawel.kromplewski at contractors.roche.com>
diff --git a/src/components/details-attribute/details-attribute.tsx b/src/components/details-attribute/details-attribute.tsx
index 78b4341d..d255d14b 100644
--- a/src/components/details-attribute/details-attribute.tsx
+++ b/src/components/details-attribute/details-attribute.tsx
@@ -48,17 +48,22 @@ interface DetailsAttributeDataProps {
lowercaseValue?: boolean;
link?: string;
children?: React.ReactNode;
+ onValueClick?: () => void;
}
type DetailsAttributeProps = DetailsAttributeDataProps & WithStyles<CssRules>;
export const DetailsAttribute = withStyles(styles)(
- ({ label, link, value, children, classes, classLabel, classValue, lowercaseValue }: DetailsAttributeProps) =>
+ ({ label, link, value, children, classes, classLabel, classValue, lowercaseValue, onValueClick }: DetailsAttributeProps) =>
<Typography component="div" className={classes.attribute}>
<Typography component="span" className={classnames([classes.label, classLabel])}>{label}</Typography>
{ link
? <a href={link} className={classes.link} target='_blank'>{value}</a>
- : <Typography component="span" className={classnames([classes.value, classValue, { [classes.lowercaseValue]: lowercaseValue }])}>
+ : <Typography
+ onClick={onValueClick}
+ component="span"
+ className={classnames([classes.value, classValue, { [classes.lowercaseValue]: lowercaseValue }])}
+ >
{value}
{children}
</Typography> }
diff --git a/src/store/process-panel/process-panel-actions.ts b/src/store/process-panel/process-panel-actions.ts
index 2aa914af..42a718bd 100644
--- a/src/store/process-panel/process-panel-actions.ts
+++ b/src/store/process-panel/process-panel-actions.ts
@@ -8,9 +8,10 @@ import { Dispatch } from 'redux';
import { ProcessStatus } from '~/store/processes/process';
import { RootState } from '~/store/store';
import { ServiceRepository } from "~/services/services";
-import { navigateToCollection } from '~/store/navigation/navigation-action';
+import { navigateToCollection, navigateToWorkflows } from '~/store/navigation/navigation-action';
import { snackbarActions } from '~/store/snackbar/snackbar-actions';
import { SnackbarKind } from '../snackbar/snackbar-actions';
+import { showWorkflowDetails } from '~/store/workflow-panel/workflow-panel-actions';
export const procesPanelActions = unionize({
SET_PROCESS_PANEL_FILTERS: ofType<string[]>(),
@@ -37,6 +38,12 @@ export const navigateToOutput = (uuid: string) =>
}
};
+export const openWorkflow = (uuid: string) =>
+ (dispatch: Dispatch, getState: () => RootState, services: ServiceRepository) => {
+ dispatch<any>(navigateToWorkflows);
+ dispatch<any>(showWorkflowDetails(uuid));
+ };
+
export const initProcessPanelFilters = procesPanelActions.SET_PROCESS_PANEL_FILTERS([
ProcessStatus.QUEUED,
ProcessStatus.COMPLETED,
diff --git a/src/views/process-panel/process-information-card.tsx b/src/views/process-panel/process-information-card.tsx
index 7f3e025f..9e8b783f 100644
--- a/src/views/process-panel/process-information-card.tsx
+++ b/src/views/process-panel/process-information-card.tsx
@@ -13,7 +13,7 @@ import { DetailsAttribute } from '~/components/details-attribute/details-attribu
import { Process } from '~/store/processes/process';
import { getProcessStatus, getProcessStatusColor } from '~/store/processes/process';
import { formatDate } from '~/common/formatters';
-
+import { openWorkflow } from "~/store/process-panel/process-panel-actions";
type CssRules = 'card' | 'iconHeader' | 'label' | 'value' | 'chip' | 'link' | 'content' | 'title' | 'avatar';
@@ -70,12 +70,13 @@ export interface ProcessInformationCardDataProps {
onContextMenu: (event: React.MouseEvent<HTMLElement>) => void;
openProcessInputDialog: (uuid: string) => void;
navigateToOutput: (uuid: string) => void;
+ navigateToWorkflow: (uuid: string) => void;
}
type ProcessInformationCardProps = ProcessInformationCardDataProps & WithStyles<CssRules, true>;
export const ProcessInformationCard = withStyles(styles, { withTheme: true })(
- ({ classes, process, onContextMenu, theme, openProcessInputDialog, navigateToOutput }: ProcessInformationCardProps) =>
+ ({ classes, process, onContextMenu, theme, openProcessInputDialog, navigateToOutput, navigateToWorkflow }: ProcessInformationCardProps) =>
<Card className={classes.card}>
<CardHeader
classes={{
@@ -86,8 +87,8 @@ export const ProcessInformationCard = withStyles(styles, { withTheme: true })(
action={
<div>
<Chip label={getProcessStatus(process)}
- className={classes.chip}
- style={{ backgroundColor: getProcessStatusColor(getProcessStatus(process), theme as ArvadosTheme) }} />
+ className={classes.chip}
+ style={{backgroundColor: getProcessStatusColor(getProcessStatus(process), theme as ArvadosTheme)}} />
<Tooltip title="More options" disableFocusListener>
<IconButton
aria-label="More options"
@@ -114,11 +115,16 @@ export const ProcessInformationCard = withStyles(styles, { withTheme: true })(
<Grid container>
<Grid item xs={6}>
<DetailsAttribute classLabel={classes.label} classValue={classes.value}
- label='From' value={process.container ? formatDate(process.container.startedAt!) : 'N/A'} />
+ label='From'
+ value={process.container ? formatDate(process.container.startedAt!) : 'N/A'} />
<DetailsAttribute classLabel={classes.label} classValue={classes.value}
- label='To' value={process.container ? formatDate(process.container.finishedAt!) : 'N/A'} />
- <DetailsAttribute classLabel={classes.label} classValue={classes.link}
- label='Workflow' value='???' />
+ label='To'
+ value={process.container ? formatDate(process.container.finishedAt!) : 'N/A'} />
+ {process.containerRequest.properties.templateUuid &&
+ <DetailsAttribute label='Workflow' classLabel={classes.label} classValue={classes.link}
+ value={process.containerRequest.properties.templateUuid}
+ onValueClick={() => navigateToWorkflow(process.containerRequest.properties.templateUuid)}
+ />}
</Grid>
<Grid item xs={6}>
<span onClick={() => navigateToOutput(process.containerRequest.outputUuid!)}>
diff --git a/src/views/process-panel/process-panel-root.tsx b/src/views/process-panel/process-panel-root.tsx
index 73f71e5e..5fb6390c 100644
--- a/src/views/process-panel/process-panel-root.tsx
+++ b/src/views/process-panel/process-panel-root.tsx
@@ -24,6 +24,7 @@ export interface ProcessPanelRootActionProps {
onToggle: (status: string) => void;
openProcessInputDialog: (uuid: string) => void;
navigateToOutput: (uuid: string) => void;
+ navigateToWorkflow: (uuid: string) => void;
}
export type ProcessPanelRootProps = ProcessPanelRootDataProps & ProcessPanelRootActionProps;
@@ -36,7 +37,9 @@ export const ProcessPanelRoot = ({ process, ...props }: ProcessPanelRootProps) =
process={process}
onContextMenu={event => props.onContextMenu(event, process)}
openProcessInputDialog={props.openProcessInputDialog}
- navigateToOutput={props.navigateToOutput} />
+ navigateToOutput={props.navigateToOutput}
+ navigateToWorkflow={props.navigateToWorkflow}
+ />
</Grid>
<Grid item sm={12} md={5}>
<SubprocessesCard
diff --git a/src/views/process-panel/process-panel.tsx b/src/views/process-panel/process-panel.tsx
index 56724696..b3895280 100644
--- a/src/views/process-panel/process-panel.tsx
+++ b/src/views/process-panel/process-panel.tsx
@@ -11,7 +11,7 @@ import { matchProcessRoute } from '~/routes/routes';
import { ProcessPanelRootDataProps, ProcessPanelRootActionProps, ProcessPanelRoot } from './process-panel-root';
import { ProcessPanel as ProcessPanelState} from '~/store/process-panel/process-panel';
import { groupBy } from 'lodash';
-import { toggleProcessPanelFilter, navigateToOutput } from '~/store/process-panel/process-panel-actions';
+import { toggleProcessPanelFilter, navigateToOutput, openWorkflow } from '~/store/process-panel/process-panel-actions';
import { openProcessInputDialog } from '~/store/processes/process-input-actions';
const mapStateToProps = ({ router, resources, processPanel }: RootState): ProcessPanelRootDataProps => {
@@ -35,7 +35,8 @@ const mapDispatchToProps = (dispatch: Dispatch): ProcessPanelRootActionProps =>
dispatch<any>(toggleProcessPanelFilter(status));
},
openProcessInputDialog: (uuid) => dispatch<any>(openProcessInputDialog(uuid)),
- navigateToOutput: (uuid) => dispatch<any>(navigateToOutput(uuid))
+ navigateToOutput: (uuid) => dispatch<any>(navigateToOutput(uuid)),
+ navigateToWorkflow: (uuid) => dispatch<any>(openWorkflow(uuid))
});
export const ProcessPanel = connect(mapStateToProps, mapDispatchToProps)(ProcessPanelRoot);
-----------------------------------------------------------------------
hooks/post-receive
--
More information about the arvados-commits
mailing list