[ARVADOS-WORKBENCH2] created: 1.2.0-608-ga76de01

Git user git at public.curoverse.com
Thu Oct 11 14:56:49 EDT 2018


        at  a76de01ade8b658f82118b1f8987ee43ffad2797 (commit)


commit a76de01ade8b658f82118b1f8987ee43ffad2797
Author: Michal Klobukowski <michal.klobukowski at contractors.roche.com>
Date:   Thu Oct 11 20:56:32 2018 +0200

    Create collection input
    
    Feature #13862
    
    Arvados-DCO-1.1-Signed-off-by: Michal Klobukowski <michal.klobukowski at contractors.roche.com>

diff --git a/src/views/run-process-panel/inputs/directory-input.tsx b/src/views/run-process-panel/inputs/directory-input.tsx
new file mode 100644
index 0000000..c0e21e8
--- /dev/null
+++ b/src/views/run-process-panel/inputs/directory-input.tsx
@@ -0,0 +1,128 @@
+// Copyright (C) The Arvados Authors. All rights reserved.
+//
+// SPDX-License-Identifier: AGPL-3.0
+
+import * as React from 'react';
+import {
+    isRequiredInput,
+    DirectoryCommandInputParameter,
+    CWLType,
+    Directory
+} from '~/models/workflow';
+import { Field } from 'redux-form';
+import { require } from '~/validators/require';
+import { Input, Dialog, DialogTitle, DialogContent, DialogActions, Button } from '@material-ui/core';
+import { GenericInputProps, GenericInput } from './generic-input';
+import { ProjectsTreePicker } from '~/views-components/projects-tree-picker/projects-tree-picker';
+import { connect, DispatchProp } from 'react-redux';
+import { initProjectsTreePicker } from '~/store/tree-picker/tree-picker-actions';
+import { TreeItem } from '~/components/tree/tree';
+import { ProjectsTreePickerItem } from '~/views-components/projects-tree-picker/generic-projects-tree-picker';
+import { CollectionResource } from '~/models/collection';
+import { ResourceKind } from '~/models/resource';
+
+export interface DirectoryInputProps {
+    input: DirectoryCommandInputParameter;
+}
+export const DirectoryInput = ({ input }: DirectoryInputProps) =>
+    <Field
+        name={input.id}
+        commandInput={input}
+        component={DirectoryInputComponent}
+        format={(value?: Directory) => value ? value.basename : ''}
+        parse={(directory: CollectionResource): Directory => ({
+            class: CWLType.DIRECTORY,
+            location: `keep:${directory.portableDataHash}`,
+            basename: directory.name,
+        })}
+        validate={[
+            isRequiredInput(input)
+                ? require
+                : () => undefined,
+        ]} />;
+
+
+interface DirectoryInputComponentState {
+    open: boolean;
+    directory?: CollectionResource;
+}
+
+const DirectoryInputComponent = connect()(
+    class FileInputComponent extends React.Component<GenericInputProps & DispatchProp, DirectoryInputComponentState> {
+        state: DirectoryInputComponentState = {
+            open: false,
+        };
+
+        componentDidMount() {
+            this.props.dispatch<any>(
+                initProjectsTreePicker(this.props.commandInput.id));
+        }
+
+        render() {
+            return <>
+                {this.renderInput()}
+                {this.renderDialog()}
+            </>;
+        }
+
+        openDialog = () => {
+            this.setState({ open: true });
+        }
+
+        closeDialog = () => {
+            this.setState({ open: false });
+        }
+
+        submit = () => {
+            this.closeDialog();
+            this.props.input.onChange(this.state.directory);
+        }
+
+        setDirectory = (event: React.MouseEvent<HTMLElement>, { data }: TreeItem<ProjectsTreePickerItem>, pickerId: string) => {
+            if ('kind' in data && data.kind === ResourceKind.COLLECTION) {
+                this.setState({ directory: data });
+            } else {
+                this.setState({ directory: undefined });
+            }
+        }
+
+        renderInput() {
+            return <GenericInput
+                component={props =>
+                    <Input
+                        readOnly
+                        fullWidth
+                        value={props.input.value}
+                        error={props.meta.touched && !!props.meta.error}
+                        onClick={this.openDialog}
+                        onKeyPress={this.openDialog} />}
+                {...this.props} />;
+        }
+
+        renderDialog() {
+            return <Dialog
+                open={this.state.open}
+                onClose={this.closeDialog}
+                fullWidth
+                maxWidth='md'>
+                <DialogTitle>Choose a directory</DialogTitle>
+                <DialogContent>
+                    <ProjectsTreePicker
+                        pickerId={this.props.commandInput.id}
+                        includeCollections
+                        toggleItemActive={this.setDirectory} />
+                </DialogContent>
+                <DialogActions>
+                    <Button onClick={this.closeDialog}>Cancel</Button>
+                    <Button
+                        disabled={!this.state.directory}
+                        variant='contained'
+                        color='primary'
+                        onClick={this.submit}>Ok</Button>
+                </DialogActions>
+            </Dialog>;
+        }
+
+    });
+
+
diff --git a/src/views/run-process-panel/run-process-inputs-form.tsx b/src/views/run-process-panel/run-process-inputs-form.tsx
index b0d5d5f..41355b2 100644
--- a/src/views/run-process-panel/run-process-inputs-form.tsx
+++ b/src/views/run-process-panel/run-process-inputs-form.tsx
@@ -4,7 +4,7 @@
 
 import * as React from 'react';
 import { reduxForm, InjectedFormProps } from 'redux-form';
-import { CommandInputParameter, CWLType, IntCommandInputParameter, BooleanCommandInputParameter, FileCommandInputParameter } from '~/models/workflow';
+import { CommandInputParameter, CWLType, IntCommandInputParameter, BooleanCommandInputParameter, FileCommandInputParameter, DirectoryCommandInputParameter } from '~/models/workflow';
 import { IntInput } from '~/views/run-process-panel/inputs/int-input';
 import { StringInput } from '~/views/run-process-panel/inputs/string-input';
 import { StringCommandInputParameter, FloatCommandInputParameter, isPrimitiveOfType, File, Directory, WorkflowInputsData, EnumCommandInputParameter } from '../../models/workflow';
@@ -15,6 +15,7 @@ import { connect } from 'react-redux';
 import { compose } from 'redux';
 import { Grid, StyleRulesCallback, withStyles, WithStyles } from '@material-ui/core';
 import { EnumInput } from './inputs/enum-input';
+import { DirectoryInput } from './inputs/directory-input';
 
 export const RUN_PROCESS_INPUTS_FORM = 'runProcessInputsForm';
 
@@ -71,6 +72,9 @@ const getInputComponent = (input: CommandInputParameter) => {
 
         case isPrimitiveOfType(input, CWLType.FILE):
             return <FileInput input={input as FileCommandInputParameter} />;
+        
+        case isPrimitiveOfType(input, CWLType.DIRECTORY):
+            return <DirectoryInput input={input as DirectoryCommandInputParameter} />;
 
         case typeof input.type === 'object' &&
             !(input.type instanceof Array) &&

commit 29b8c5b7e3fd8079677637dcfdb5fdadc4027295
Author: Michal Klobukowski <michal.klobukowski at contractors.roche.com>
Date:   Thu Oct 11 20:33:04 2018 +0200

    Add projects picker to file input
    
    Feature #13862
    
    Arvados-DCO-1.1-Signed-off-by: Michal Klobukowski <michal.klobukowski at contractors.roche.com>

diff --git a/src/views/run-process-panel/inputs/file-input.tsx b/src/views/run-process-panel/inputs/file-input.tsx
index 7c4402f..140a9d0 100644
--- a/src/views/run-process-panel/inputs/file-input.tsx
+++ b/src/views/run-process-panel/inputs/file-input.tsx
@@ -4,7 +4,6 @@
 
 import * as React from 'react';
 import {
-    getInputLabel,
     isRequiredInput,
     FileCommandInputParameter,
     File,
@@ -12,8 +11,15 @@ import {
 } from '~/models/workflow';
 import { Field } from 'redux-form';
 import { require } from '~/validators/require';
-import { Input } from '@material-ui/core';
+import { Input, Dialog, DialogTitle, DialogContent, DialogActions, Button } from '@material-ui/core';
 import { GenericInputProps, GenericInput } from './generic-input';
+import { ProjectsTreePicker } from '~/views-components/projects-tree-picker/projects-tree-picker';
+import { connect, DispatchProp } from 'react-redux';
+import { initProjectsTreePicker } from '~/store/tree-picker/tree-picker-actions';
+import { TreeItem } from '~/components/tree/tree';
+import { ProjectsTreePickerItem } from '~/views-components/projects-tree-picker/generic-projects-tree-picker';
+import { CollectionFile, CollectionFileType } from '~/models/collection-file';
+import { getFileFullPath } from '~/services/collection-service/collection-service-files-response';
 
 export interface FileInputProps {
     input: FileCommandInputParameter;
@@ -21,13 +27,13 @@ export interface FileInputProps {
 export const FileInput = ({ input }: FileInputProps) =>
     <Field
         name={input.id}
-        commandInput={input}        
+        commandInput={input}
         component={FileInputComponent}
         format={(value?: File) => value ? value.location : ''}
-        parse={(value: string): File => ({
+        parse={(file: CollectionFile): File => ({
             class: CWLType.FILE,
-            location: value,
-            basename: value.split('/').slice(1).join('/')
+            location: `keep:${getFileFullPath(file)}`,
+            basename: file.name,
         })}
         validate={[
             isRequiredInput(input)
@@ -35,8 +41,89 @@ export const FileInput = ({ input }: FileInputProps) =>
                 : () => undefined,
         ]} />;
 
-const FileInputComponent = (props: GenericInputProps) =>
-    <GenericInput
-        component={props =>
-            <Input readOnly fullWidth value={props.input.value} error={props.meta.touched && !!props.meta.error}/>}
-        {...props} />;
+
+interface FileInputComponentState {
+    open: boolean;
+    file?: CollectionFile;
+}
+
+const FileInputComponent = connect()(
+    class FileInputComponent extends React.Component<GenericInputProps & DispatchProp, FileInputComponentState> {
+        state: FileInputComponentState = {
+            open: false,
+        };
+
+        componentDidMount() {
+            this.props.dispatch<any>(
+                initProjectsTreePicker(this.props.commandInput.id));
+        }
+
+        render() {
+            return <>
+                {this.renderInput()}
+                {this.renderDialog()}
+            </>;
+        }
+
+        openDialog = () => {
+            this.setState({ open: true });
+        }
+
+        closeDialog = () => {
+            this.setState({ open: false });
+        }
+
+        submit = () => {
+            this.closeDialog();
+            this.props.input.onChange(this.state.file);
+        }
+
+        setFile = (event: React.MouseEvent<HTMLElement>, { data }: TreeItem<ProjectsTreePickerItem>, pickerId: string) => {
+            if ('type' in data && data.type === CollectionFileType.FILE) {
+                this.setState({ file: data });
+            } else {
+                this.setState({ file: undefined });
+            }
+        }
+
+        renderInput() {
+            return <GenericInput
+                component={props =>
+                    <Input
+                        readOnly
+                        fullWidth
+                        value={props.input.value}
+                        error={props.meta.touched && !!props.meta.error}
+                        onClick={this.openDialog}
+                        onKeyPress={this.openDialog} />}
+                {...this.props} />;
+        }
+
+        renderDialog() {
+            return <Dialog
+                open={this.state.open}
+                onClose={this.closeDialog}
+                fullWidth
+                maxWidth='md'>
+                <DialogTitle>Choose a file</DialogTitle>
+                <DialogContent>
+                    <ProjectsTreePicker
+                        pickerId={this.props.commandInput.id}
+                        includeCollections
+                        includeFiles
+                        toggleItemActive={this.setFile} />
+                </DialogContent>
+                <DialogActions>
+                    <Button onClick={this.closeDialog}>Cancel</Button>
+                    <Button
+                        disabled={!this.state.file}
+                        variant='contained'
+                        color='primary'
+                        onClick={this.submit}>Ok</Button>
+                </DialogActions>
+            </Dialog>;
+        }
+
+    });
+
+

commit bb7f866a34548157fd5ba69475da4c8065f0227b
Author: Michal Klobukowski <michal.klobukowski at contractors.roche.com>
Date:   Thu Oct 11 18:09:45 2018 +0200

    Add toggleItemSelection callback
    
    Feature #13862
    
    Arvados-DCO-1.1-Signed-off-by: Michal Klobukowski <michal.klobukowski at contractors.roche.com>

diff --git a/src/views-components/projects-tree-picker/generic-projects-tree-picker.tsx b/src/views-components/projects-tree-picker/generic-projects-tree-picker.tsx
index 21839ff..77f831f 100644
--- a/src/views-components/projects-tree-picker/generic-projects-tree-picker.tsx
+++ b/src/views-components/projects-tree-picker/generic-projects-tree-picker.tsx
@@ -63,8 +63,11 @@ const mapDispatchToProps = (dispatch: Dispatch, { loadRootItem, includeCollectio
             dispatch(treePickerActions.TOGGLE_TREE_PICKER_NODE_COLLAPSE({ id, pickerId }));
         }
     },
-    toggleItemSelection: (_, { id }, pickerId) => {
-        dispatch<any>(treePickerActions.TOGGLE_TREE_PICKER_NODE_SELECTION({ id, pickerId }));
+    toggleItemSelection: (event, item, pickerId) => {
+        dispatch<any>(treePickerActions.TOGGLE_TREE_PICKER_NODE_SELECTION({ id: item.id, pickerId }));
+        if(props.toggleItemSelection){
+            props.toggleItemSelection(event, item, pickerId);
+        }
     },
 });
 
diff --git a/src/views-components/projects-tree-picker/projects-tree-picker.tsx b/src/views-components/projects-tree-picker/projects-tree-picker.tsx
index 5d6bb78..ba29be8 100644
--- a/src/views-components/projects-tree-picker/projects-tree-picker.tsx
+++ b/src/views-components/projects-tree-picker/projects-tree-picker.tsx
@@ -16,6 +16,7 @@ export interface ProjectsTreePickerProps {
     includeFiles?: boolean;
     showSelection?: boolean;
     toggleItemActive?: (event: React.MouseEvent<HTMLElement>, item: TreeItem<ProjectsTreePickerItem>, pickerId: string) => void;
+    toggleItemSelection?: (event: React.MouseEvent<HTMLElement>, item: TreeItem<ProjectsTreePickerItem>, pickerId: string) => void;
 }
 
 export const ProjectsTreePicker = ({ pickerId, ...props }: ProjectsTreePickerProps) => {

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


hooks/post-receive
-- 




More information about the arvados-commits mailing list