X-Git-Url: https://git.arvados.org/arvados-workbench2.git/blobdiff_plain/f2f7301dab111f2561332c8cc9e7c06df958ea66..5385afcada8666051658c6889c83848702497759:/src/views/run-process-panel/inputs/file-input.tsx diff --git a/src/views/run-process-panel/inputs/file-input.tsx b/src/views/run-process-panel/inputs/file-input.tsx index f5d3d939..0b80050d 100644 --- a/src/views/run-process-panel/inputs/file-input.tsx +++ b/src/views/run-process-panel/inputs/file-input.tsx @@ -3,6 +3,7 @@ // SPDX-License-Identifier: AGPL-3.0 import * as React from 'react'; +import { memoize } from 'lodash/fp'; import { isRequiredInput, FileCommandInputParameter, @@ -22,24 +23,34 @@ import { CollectionFile, CollectionFileType } from '~/models/collection-file'; export interface FileInputProps { input: FileCommandInputParameter; + options?: { showOnlyOwned: boolean, showOnlyWritable: boolean }; } -export const FileInput = ({ input }: FileInputProps) => +export const FileInput = ({ input, options }: FileInputProps) => value ? value.basename : ''} - parse={(file: CollectionFile): File => ({ - class: CWLType.FILE, - location: `keep:${file.id}`, - basename: file.name, - })} - validate={[ - isRequiredInput(input) - ? (file?: File) => file ? undefined : ERROR_MESSAGE - : () => undefined, - ]} />; - + format={format} + parse={parse} + {...{ + options + }} + validate={getValidation(input)} />; + +const format = (value?: File) => value ? value.basename : ''; + +const parse = (file: CollectionFile): File => ({ + class: CWLType.FILE, + location: `keep:${file.id}`, + basename: file.name, +}); + +const getValidation = memoize( + (input: FileCommandInputParameter) => ([ + isRequiredInput(input) + ? (file?: File) => file ? undefined : ERROR_MESSAGE + : () => undefined, + ])); interface FileInputComponentState { open: boolean; @@ -47,7 +58,9 @@ interface FileInputComponentState { } const FileInputComponent = connect()( - class FileInputComponent extends React.Component { + class FileInputComponent extends React.Component { state: FileInputComponentState = { open: false, }; @@ -77,7 +90,7 @@ const FileInputComponent = connect()( this.props.input.onChange(this.state.file); } - setFile = (event: React.MouseEvent, { data }: TreeItem, pickerId: string) => { + setFile = (_: {}, { data }: TreeItem) => { if ('type' in data && data.type === CollectionFileType.FILE) { this.setState({ file: data }); } else { @@ -91,10 +104,11 @@ const FileInputComponent = connect()( } + onClick={!props.commandInput.disabled ? this.openDialog : undefined} + onKeyPress={!props.commandInput.disabled ? this.openDialog : undefined} />} {...this.props} />; } @@ -103,6 +117,7 @@ const FileInputComponent = connect()( open={this.state.open} onClose={this.closeDialog} fullWidth + data-cy="choose-a-file-dialog" maxWidth='md'> Choose a file @@ -110,6 +125,7 @@ const FileInputComponent = connect()( pickerId={this.props.commandInput.id} includeCollections includeFiles + options={this.props.options} toggleItemActive={this.setFile} />