Merge branch '19142-avoid-loading-unneeded-mounts' into main. Closes #19142
[arvados-workbench2.git] / src / views / run-process-panel / inputs / file-array-input.tsx
index c134548c734dee8270d4e36d4ba9793a5e065d98..ddb558b9e552afe99bb47a4663e7951ae5eb2515 100644 (file)
@@ -2,39 +2,40 @@
 //
 // SPDX-License-Identifier: AGPL-3.0
 
-import * as React from 'react';
+import React from 'react';
 import {
     isRequiredInput,
     FileArrayCommandInputParameter,
     File,
     CWLType
-} from '~/models/workflow';
+} from 'models/workflow';
 import { Field } from 'redux-form';
-import { ERROR_MESSAGE } from '~/validators/require';
-import { Input, Dialog, DialogTitle, DialogContent, DialogActions, Button, Divider, Grid, WithStyles, Typography } from '@material-ui/core';
+import { ERROR_MESSAGE } from 'validators/require';
+import { Input, Dialog, DialogTitle, DialogContent, DialogActions, Button, Divider, WithStyles, Typography } from '@material-ui/core';
 import { GenericInputProps, GenericInput } from './generic-input';
-import { ProjectsTreePicker } from '~/views-components/projects-tree-picker/projects-tree-picker';
+import { ProjectsTreePicker } from 'views-components/projects-tree-picker/projects-tree-picker';
 import { connect, DispatchProp } from 'react-redux';
-import { initProjectsTreePicker, getSelectedNodes, treePickerActions, getProjectsTreePickerIds } from '~/store/tree-picker/tree-picker-actions';
-import { ProjectsTreePickerItem } from '~/views-components/projects-tree-picker/generic-projects-tree-picker';
-import { CollectionFile, CollectionFileType } from '~/models/collection-file';
+import { initProjectsTreePicker, getSelectedNodes, treePickerActions, getProjectsTreePickerIds } from 'store/tree-picker/tree-picker-actions';
+import { ProjectsTreePickerItem } from 'views-components/projects-tree-picker/generic-projects-tree-picker';
+import { CollectionFile, CollectionFileType } from 'models/collection-file';
 import { createSelector, createStructuredSelector } from 'reselect';
-import { ChipsInput } from '~/components/chips-input/chips-input';
+import { ChipsInput } from 'components/chips-input/chips-input';
 import { identity, values, noop } from 'lodash';
 import { InputProps } from '@material-ui/core/Input';
-import { TreePicker } from '~/store/tree-picker/tree-picker';
-import { RootState } from '~/store/store';
-import { Chips } from '~/components/chips/chips';
+import { TreePicker } from 'store/tree-picker/tree-picker';
+import { RootState } from 'store/store';
+import { Chips } from 'components/chips/chips';
 import withStyles, { StyleRulesCallback } from '@material-ui/core/styles/withStyles';
 
 export interface FileArrayInputProps {
     input: FileArrayCommandInputParameter;
+    options?: { showOnlyOwned: boolean, showOnlyWritable: boolean };
 }
 export const FileArrayInput = ({ input }: FileArrayInputProps) =>
     <Field
         name={input.id}
         commandInput={input}
-        component={FileArrayInputComponent}
+        component={FileArrayInputComponent as any}
         parse={parseFiles}
         format={formatFiles}
         validate={validationSelector(input)} />;
@@ -52,7 +53,7 @@ const parse = (file: CollectionFile): File => ({
 });
 
 const formatFiles = (files: File[] = []) =>
-    files.map(format);
+    files ? files.map(format) : [];
 
 const format = (file: File): CollectionFile => ({
     id: file.location
@@ -92,7 +93,9 @@ const mapStateToProps = createStructuredSelector({
 });
 
 const FileArrayInputComponent = connect(mapStateToProps)(
-    class FileArrayInputComponent extends React.Component<FileArrayInputComponentProps & GenericInputProps & DispatchProp, FileArrayInputComponentState> {
+    class FileArrayInputComponent extends React.Component<FileArrayInputComponentProps & GenericInputProps & DispatchProp & {
+        options?: { showOnlyOwned: boolean, showOnlyWritable: boolean };
+    }, FileArrayInputComponentState> {
         state: FileArrayInputComponentState = {
             open: false,
             files: [],
@@ -167,12 +170,11 @@ const FileArrayInputComponent = connect(mapStateToProps)(
             });
 
             this.setFiles(files);
-
         }
 
         refreshFiles = () => {
             clearTimeout(this.fileRefreshTimeout);
-            this.fileRefreshTimeout = setTimeout(this.setSelectedFiles);
+            this.fileRefreshTimeout = window.setTimeout(this.setSelectedFiles);
         }
 
         setSelectedFiles = () => {
@@ -193,7 +195,7 @@ const FileArrayInputComponent = connect(mapStateToProps)(
 
         chipsInput = () =>
             <ChipsInput
-                value={this.props.input.value}
+                values={this.props.input.value}
                 disabled={this.props.commandInput.disabled}
                 onChange={noop}
                 createNewValue={identity}
@@ -223,6 +225,7 @@ const FileArrayInputComponent = connect(mapStateToProps)(
                 <DialogActions>
                     <Button onClick={this.closeDialog}>Cancel</Button>
                     <Button
+                        data-cy='ok-button'
                         variant='contained'
                         color='primary'
                         onClick={this.submit}>Ok</Button>
@@ -259,6 +262,7 @@ const FileArrayInputComponent = connect(mapStateToProps)(
                             includeCollections
                             includeFiles
                             showSelection
+                            options={this.props.options}
                             toggleItemSelection={this.refreshFiles} />
                     </div>
                     <Divider />
@@ -277,6 +281,3 @@ const FileArrayInputComponent = connect(mapStateToProps)(
     });
 
 type DialogContentCssRules = 'root' | 'tree' | 'divider' | 'chips';
-
-
-