[ARVADOS-WORKBENCH2] created: 1.2.0-696-g1470338

Git user git at public.curoverse.com
Thu Oct 18 12:03:39 EDT 2018


        at  14703389175ba7248997d7286ad7b5f6aaacd211 (commit)


commit 14703389175ba7248997d7286ad7b5f6aaacd211
Author: Pawel Kowalczyk <pawel.kowalczyk at contractors.roche.com>
Date:   Thu Oct 18 18:03:23 2018 +0200

    init-input-modal
    
    Feature #14129
    
    Arvados-DCO-1.1-Signed-off-by: Pawel Kowalczyk <pawel.kowalczyk at contractors.roche.com>

diff --git a/src/store/processes/process-command-actions.ts b/src/store/processes/process-command-actions.ts
index 6c76556..c014bd4 100644
--- a/src/store/processes/process-command-actions.ts
+++ b/src/store/processes/process-command-actions.ts
@@ -3,7 +3,7 @@
 // SPDX-License-Identifier: AGPL-3.0
 
 import { dialogActions } from '~/store/dialog/dialog-actions';
-import { RootState } from '../store';
+import { RootState } from '~/store/store';
 import { Dispatch } from 'redux';
 import { getProcess } from '~/store/processes/process';
 import { quote } from 'shell-quote';
diff --git a/src/store/processes/process-input-actions.ts b/src/store/processes/process-input-actions.ts
new file mode 100644
index 0000000..79e2753
--- /dev/null
+++ b/src/store/processes/process-input-actions.ts
@@ -0,0 +1,22 @@
+// Copyright (C) The Arvados Authors. All rights reserved.
+//
+// SPDX-License-Identifier: AGPL-3.0
+
+import { dialogActions } from '~/store/dialog/dialog-actions';
+import { RootState } from '~/store/store';
+import { Dispatch } from 'redux';
+import { getProcess } from '~/store/processes/process';
+
+export const PROCESS_INPUT_DIALOG_NAME = 'processInputDialog';
+
+export interface ProcessInputDialogData {
+}
+
+export const openProcessInputDialog = (processUuid: string) =>
+    (dispatch: Dispatch<any>, getState: () => RootState) => {
+        const process = getProcess(processUuid)(getState().resources);
+        if (process) {
+            const data: ProcessInputDialogData = {};
+            dispatch(dialogActions.OPEN_DIALOG({ id: PROCESS_INPUT_DIALOG_NAME, data }));
+        }
+    };
\ No newline at end of file
diff --git a/src/views-components/context-menu/action-sets/process-action-set.ts b/src/views-components/context-menu/action-sets/process-action-set.ts
index 3248873..b504cda 100644
--- a/src/views-components/context-menu/action-sets/process-action-set.ts
+++ b/src/views-components/context-menu/action-sets/process-action-set.ts
@@ -14,8 +14,9 @@ import { navigateToProcessLogs } from '~/store/navigation/navigation-action';
 import { openMoveProcessDialog } from '~/store/processes/process-move-actions';
 import { openProcessUpdateDialog } from "~/store/processes/process-update-actions";
 import { openCopyProcessDialog } from '~/store/processes/process-copy-actions';
-import { openProcessCommandDialog } from '../../../store/processes/process-command-actions';
+import { openProcessCommandDialog } from '~/store/processes/process-command-actions';
 import { detailsPanelActions } from '~/store/details-panel/details-panel-action';
+import { openProcessInputDialog } from "~/store/processes/process-input-actions";
 
 export const processActionSet: ContextMenuActionSet = [[
     {
@@ -58,9 +59,7 @@ export const processActionSet: ContextMenuActionSet = [[
     {
         icon: InputIcon,
         name: "Inputs",
-        execute: (dispatch, resource) => {
-            // add code
-        }
+        execute: (dispatch, resource) => dispatch<any>(openProcessInputDialog(resource.uuid))
     },
     {
         icon: OutputIcon,
diff --git a/src/views-components/process-command-dialog/process-command-dialog.tsx b/src/views-components/process-command-dialog/process-command-dialog.tsx
index 81022ea..c95a209 100644
--- a/src/views-components/process-command-dialog/process-command-dialog.tsx
+++ b/src/views-components/process-command-dialog/process-command-dialog.tsx
@@ -3,7 +3,7 @@
 // SPDX-License-Identifier: AGPL-3.0
 
 import * as React from "react";
-import { Dialog, DialogTitle, DialogActions, Button, StyleRulesCallback, WithStyles, withStyles, Tooltip, IconButton, Grid, CardHeader } from '@material-ui/core';
+import { Dialog, DialogActions, Button, StyleRulesCallback, WithStyles, withStyles, Tooltip, IconButton, CardHeader } from '@material-ui/core';
 import { withDialog } from "~/store/dialog/with-dialog";
 import { PROCESS_COMMAND_DIALOG_NAME } from '~/store/processes/process-command-actions';
 import { WithDialogProps } from '~/store/dialog/with-dialog';
diff --git a/src/views-components/process-input-dialog/process-input-dialog.tsx b/src/views-components/process-input-dialog/process-input-dialog.tsx
new file mode 100644
index 0000000..f9cf1d0
--- /dev/null
+++ b/src/views-components/process-input-dialog/process-input-dialog.tsx
@@ -0,0 +1,96 @@
+// Copyright (C) The Arvados Authors. All rights reserved.
+//
+// SPDX-License-Identifier: AGPL-3.0
+
+import * as React from "react";
+import { Dialog, DialogActions, Button, StyleRulesCallback, WithStyles, withStyles, Grid, CardHeader, DialogContent, Table, TableHead, TableCell, TableRow, TableBody } from '@material-ui/core';
+import { WithDialogProps } from '~/store/dialog/with-dialog';
+import { withDialog } from "~/store/dialog/with-dialog";
+import { compose } from 'redux';
+import { PROCESS_INPUT_DIALOG_NAME, ProcessInputDialogData } from '~/store/processes/process-input-actions';
+
+type CssRules = 'multipleRow' | 'singleRow';
+
+const styles: StyleRulesCallback<CssRules> = theme => ({
+    multipleRow: {
+        display: 'flex',
+        alignItems: 'center',
+        padding: theme.spacing.unit,
+        paddingLeft: 0
+    },
+    singleRow: {
+        verticalAlign: 'baseline',
+        paddingTop: '14px',
+    }
+});
+
+interface ProcessInputTableData {
+    contentAdress: string;
+    collectionAdressess: string[];
+    projectNames: string[];
+    modificationDate: any[];
+}
+
+const rows: ProcessInputTableData[] = [
+    { contentAdress: '84a2c033bdd8f1110fb965bcdbb3f296+1123', collectionAdressess: ['CCRF-CEM_FASTQ', 'bbb', 'ccc'], projectNames: ['WES CL000004_THP-1 Test', 'cos', 'Exomeseq Pipeline Saisanis'], modificationDate: ['7:30 PM 9/3/2017', '0:00 PM 2/3/2018', '10:25 PM 12/3/2019'] },
+    { contentAdress: '1cfee2c94995ff557d742df10b431e1e+4739', collectionAdressess: ['aaa', 'Copy of dbsnp_138.hg19 + tbi', 'ccc'], projectNames: ['aa', 'WES CL000004_THP-1 Test', 'ccc'], modificationDate: ['7:30 PM 9/3/2017', '10:25 PM 12/3/2019', '10:25 PM 12/3/2019'] },
+    { contentAdress: '6396d955250b3cd8451ed237de3333bc+121', collectionAdressess: ['aaa', 'bbb', 'ccc'], projectNames: ['Copy of config.txt, hg19.fasta.fai, targets_100bpflank.bed', 'bbb', 'WES CL000004_THP-1 Test'], modificationDate: ['7:30 PM 9/3/2017', '0:00 PM 2/3/2018', '10:25 PM 12/3/2019'] },
+    { contentAdress: '84a2c033bdd8f1110fb965bcdbb3f296+1123', collectionAdressess: ['aaa', 'bbb', 'config.txt, hg19.fasta.fai, targets_100bpflank.bed'], projectNames: ['Exomeseq Pipeline Saisanis', 'bbb', 'ccc'], modificationDate: ['7:30 PM 9/3/2017', '0:00 PM 2/3/2018', '10:25 PM 12/3/2019'] }
+];
+
+export const ProcessInputDialog = compose(
+    withDialog(PROCESS_INPUT_DIALOG_NAME),
+    withStyles(styles),
+)(
+    (props: WithDialogProps<ProcessInputDialogData> & WithStyles<CssRules>) =>
+        <Dialog
+            open={props.open}
+            maxWidth={false}
+            onClose={props.closeDialog}>
+            <CardHeader
+                title="Inputs - Pipeline template that generates a config file from a template" />
+            <DialogContent>
+                <Table>
+                    <TableHead>
+                        <TableRow>
+                            <TableCell>Content address</TableCell>
+                            <TableCell>Collection with this address</TableCell>
+                            <TableCell>Project</TableCell>
+                            <TableCell>Modification date</TableCell>
+                        </TableRow>
+                    </TableHead>
+                    <TableBody>
+                        {rows.map((row, index) => {
+                            return (
+                                <TableRow key={index}>
+                                    <TableCell className={props.classes.singleRow}>{row.contentAdress}</TableCell>
+                                    {renderMultipleRowsInCell(row.collectionAdressess, props.classes)}
+                                    {renderMultipleRowsInCell(row.projectNames, props.classes)}
+                                    {renderMultipleRowsInCell(row.modificationDate, props.classes)}
+                                </TableRow>
+                            );
+                        })}
+                    </TableBody>
+                </Table>
+            </DialogContent>
+            <DialogActions>
+                <Button
+                    variant='flat'
+                    color='primary'
+                    onClick={props.closeDialog}>
+                    Close
+                </Button>
+            </DialogActions>
+        </Dialog>
+);
+
+const renderMultipleRowsInCell = (data: any[], classes: any) => {
+    return <TableCell>{data.map((it, index) => {
+        return (
+            <span key={index} className={classes.multipleRow}>
+                {it}
+            </span>
+        );
+    })}
+    </TableCell>;
+};
\ No newline at end of file
diff --git a/src/views/process-panel/process-information-card.tsx b/src/views/process-panel/process-information-card.tsx
index 0813126..56c1a0e 100644
--- a/src/views/process-panel/process-information-card.tsx
+++ b/src/views/process-panel/process-information-card.tsx
@@ -68,12 +68,13 @@ const styles: StyleRulesCallback<CssRules> = (theme: ArvadosTheme) => ({
 export interface ProcessInformationCardDataProps {
     process: Process;
     onContextMenu: (event: React.MouseEvent<HTMLElement>) => void;
+    openProcessInputDialog: (uuid: string) => void;
 }
 
 type ProcessInformationCardProps = ProcessInformationCardDataProps & WithStyles<CssRules, true>;
 
 export const ProcessInformationCard = withStyles(styles, { withTheme: true })(
-    ({ classes, process, onContextMenu, theme }: ProcessInformationCardProps) =>
+    ({ classes, process, onContextMenu, theme, openProcessInputDialog }: ProcessInformationCardProps) =>
         <Card className={classes.card}>
             <CardHeader
                 classes={{
@@ -120,7 +121,9 @@ export const ProcessInformationCard = withStyles(styles, { withTheme: true })(
                     </Grid>
                     <Grid item xs={6}>
                         <DetailsAttribute classLabel={classes.link} label='Outputs' />
-                        <DetailsAttribute classLabel={classes.link} label='Inputs' />
+                        <span onClick={() => openProcessInputDialog(process.containerRequest.uuid)}>
+                            <DetailsAttribute classLabel={classes.link} label='Inputs' />
+                        </span>
                     </Grid>
                 </Grid>
             </CardContent>
diff --git a/src/views/process-panel/process-panel-root.tsx b/src/views/process-panel/process-panel-root.tsx
index ab8af36..df0f7a6 100644
--- a/src/views/process-panel/process-panel-root.tsx
+++ b/src/views/process-panel/process-panel-root.tsx
@@ -22,6 +22,7 @@ export interface ProcessPanelRootDataProps {
 export interface ProcessPanelRootActionProps {
     onContextMenu: (event: React.MouseEvent<HTMLElement>, process: Process) => void;
     onToggle: (status: string) => void;
+    openProcessInputDialog: (uuid: string) => void;
 }
 
 export type ProcessPanelRootProps = ProcessPanelRootDataProps & ProcessPanelRootActionProps;
@@ -32,7 +33,8 @@ export const ProcessPanelRoot = ({process, ...props}: ProcessPanelRootProps) =>
             <Grid item sm={12} md={7}>
                 <ProcessInformationCard
                     process={process}
-                    onContextMenu={event => props.onContextMenu(event, process)} />
+                    onContextMenu={event => props.onContextMenu(event, process)} 
+                    openProcessInputDialog={props.openProcessInputDialog} />
             </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 4f283a6..8108cd1 100644
--- a/src/views/process-panel/process-panel.tsx
+++ b/src/views/process-panel/process-panel.tsx
@@ -12,6 +12,7 @@ import { ProcessPanelRootDataProps, ProcessPanelRootActionProps, ProcessPanelRoo
 import { ProcessPanel as ProcessPanelState} from '~/store/process-panel/process-panel';
 import { groupBy } from 'lodash';
 import { toggleProcessPanelFilter } from '~/store/process-panel/process-panel-actions';
+import { openProcessInputDialog } from '~/store/processes/process-input-actions';
 
 const mapStateToProps = ({ router, resources, processPanel }: RootState): ProcessPanelRootDataProps => {
     const pathname = router.location ? router.location.pathname : '';
@@ -32,7 +33,8 @@ const mapDispatchToProps = (dispatch: Dispatch): ProcessPanelRootActionProps =>
     },
     onToggle: status => {
         dispatch<any>(toggleProcessPanelFilter(status));
-    }
+    },
+    openProcessInputDialog: (uuid) => dispatch<any>(openProcessInputDialog(uuid))
 });
 
 export const ProcessPanel = connect(mapStateToProps, mapDispatchToProps)(ProcessPanelRoot);
diff --git a/src/views/workbench/workbench.tsx b/src/views/workbench/workbench.tsx
index 788c96a..8d418af 100644
--- a/src/views/workbench/workbench.tsx
+++ b/src/views/workbench/workbench.tsx
@@ -48,6 +48,7 @@ import { FavoritesTreePicker } from '../../views-components/projects-tree-picker
 import { ProjectsTreePicker } from '~/views-components/projects-tree-picker/projects-tree-picker';
 import { Chips } from '~/components/chips/chips';
 import { ChipsInput } from '../../components/chips-input/chips-input';
+import { ProcessInputDialog } from '~/views-components/process-input-dialog/process-input-dialog';
 
 type CssRules = 'root' | 'container' | 'splitter' | 'asidePanel' | 'contentWrapper' | 'content';
 
@@ -128,6 +129,7 @@ export const WorkbenchPanel =
             <MultipleFilesRemoveDialog />
             <PartialCopyCollectionDialog />
             <ProcessCommandDialog />
+            <ProcessInputDialog />
             <RenameFileDialog />
             <RichTextEditorDialog />
             <Snackbar />

-----------------------------------------------------------------------


hooks/post-receive
-- 




More information about the arvados-commits mailing list