init-process-input-modal-view

Feature #14129

Arvados-DCO-1.1-Signed-off-by: Pawel Kowalczyk <pawel.kowalczyk@contractors.roche.com>

diff --git a/src/store/processes/process-command-actions.ts b/src/store/processes/process-command-actions.ts
index 6c765568aaf9ddd707ee283ffa4add5571199c24..c014bd4c8dc6724272c7487884c22a9ea3414c57 100644 (file)
--- 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 (file)
index 0000000..7b0ae4c
--- /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 = { process };
+            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 4ad68597098029c1e274688de9e67bfd07083e48..32d78e30c0c79f6b4bc66fe358dc5b6a7b702449 100644 (file)
--- a/src/views-components/context-menu/action-sets/process-action-set.ts
+++ b/src/views-components/context-menu/action-sets/process-action-set.ts
@@ -18,6 +18,7 @@ import { openProcessCommandDialog } from '~/store/processes/process-command-acti
 import { detailsPanelActions } from '~/store/details-panel/details-panel-action';
 import { openSharingDialog } from "~/store/sharing-dialog/sharing-dialog-actions";
 import { openAdvancedTabDialog } from "~/store/advanced-tab/advanced-tab";
+import { openProcessInputDialog } from "~/store/processes/process-input-actions";
 
 export const processActionSet: ContextMenuActionSet = [[
     {
@@ -67,7 +68,7 @@ export const processActionSet: ContextMenuActionSet = [[
         icon: InputIcon,
         name: "Inputs",
         execute: (dispatch, resource) => {
-            // add code
+            dispatch<any>(openProcessInputDialog(resource.uuid));
         }
     },
     {

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 81022ea56fe982297d44be5d92ab9f20fbaa47bd..c95a209a9d57be6de7652a44d0e3726aa5af5e71 100644 (file)
--- 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 (file)
index 0000000..96eab1c
--- /dev/null
+++ b/src/views-components/process-input-dialog/process-input-dialog.tsx
@@ -0,0 +1,31 @@
+// Copyright (C) The Arvados Authors. All rights reserved.
+//
+// SPDX-License-Identifier: AGPL-3.0
+
+import * as React from "react";
+import { Dialog, DialogActions, Button, CardHeader, DialogContent } from '@material-ui/core';
+import { WithDialogProps } from '~/store/dialog/with-dialog';
+import { withDialog } from "~/store/dialog/with-dialog";
+import { PROCESS_INPUT_DIALOG_NAME, ProcessInputDialogData } from '~/store/processes/process-input-actions';
+
+export const ProcessInputDialog = withDialog(PROCESS_INPUT_DIALOG_NAME)(
+    (props: WithDialogProps<ProcessInputDialogData>) =>
+        <Dialog
+            open={props.open}
+            maxWidth={false}
+            onClose={props.closeDialog}>
+            <CardHeader
+                title="Inputs - Pipeline template that generates a config file from a template" />
+            <DialogContent>
+                cos
+            </DialogContent>
+            <DialogActions>
+                <Button
+                    variant='flat'
+                    color='primary'
+                    onClick={props.closeDialog}>
+                    Close
+                </Button>
+            </DialogActions>
+        </Dialog>
+); 
\ 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 9b21ce5e27e4f38c908eed42fb6497bc9884c6bb..56c1a0e52aa5d1da7b35b5e08ff3ea57f031ab0e 100644 (file)
--- a/src/views/process-panel/process-information-card.tsx
+++ b/src/views/process-panel/process-information-card.tsx
@@ -68,14 +68,14 @@ 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}>
-        {console.log(process)}
             <CardHeader
                 classes={{
                     content: classes.title,
@@ -121,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 ab8af36ffbb5e619e69fa22e2fbbb62b07d0a634..df0f7a64bfafc78dcbdb2bc541f237cf43f435e7 100644 (file)
--- 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 4f283a6c9cadb56826b74b47d09a19501a0253df..8108cd1ef4d0b19a51fc7c530e6880e61b529334 100644 (file)
--- 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 41f9682f639c8e76faed175f8bc2511ce680c196..9566945ffd131d1f4813a6ffaa52ab66059534f7 100644 (file)
--- a/src/views/workbench/workbench.tsx
+++ b/src/views/workbench/workbench.tsx
@@ -44,6 +44,7 @@ import { WorkflowPanel } from '~/views/workflow-panel/workflow-panel';
 import { SearchResultsPanel } from '~/views/search-results-panel/search-results-panel';
 import { SharingDialog } from '~/views-components/sharing-dialog/sharing-dialog';
 import { AdvancedTabDialog } from '~/views-components/advanced-tab-dialog/advanced-tab-dialog';
+import { ProcessInputDialog } from '~/views-components/process-input-dialog/process-input-dialog';
 
 type CssRules = 'root' | 'container' | 'splitter' | 'asidePanel' | 'contentWrapper' | 'content';
 
@@ -125,6 +126,7 @@ export const WorkbenchPanel =
             <MultipleFilesRemoveDialog />
             <PartialCopyCollectionDialog />
             <ProcessCommandDialog />
+            <ProcessInputDialog />
             <RenameFileDialog />
             <RichTextEditorDialog />
             <SharingDialog />