[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