Remove the separate dialogContent declaration & inline

Fixes "React error #130" in production build when trying to
open dialog.

refs #19438

Arvados-DCO-1.1-Signed-off-by: Peter Amstutz <peter.amstutz@curii.com>

diff --git a/src/views/run-process-panel/inputs/directory-array-input.tsx b/src/views/run-process-panel/inputs/directory-array-input.tsx
index e64dca0e49b9b8a8e55514267718108b82557662..27255bd961e99f9db306ff5e2a637c921352a2b6 100644 (file)
--- a/src/views/run-process-panel/inputs/directory-array-input.tsx
+++ b/src/views/run-process-panel/inputs/directory-array-input.tsx
@@ -267,7 +267,27 @@ const DirectoryArrayInputComponent = connect(mapStateToProps)(
                     maxWidth='md' >
                     <DialogTitle>Choose collections</DialogTitle>
                     <DialogContent className={classes.root}>
-                        <this.dialogContent />
+                        <div className={classes.pickerWrapper}>
+                            <div className={classes.tree}>
+                                <ProjectsTreePicker
+                                    pickerId={this.props.commandInput.id}
+                                    includeCollections
+                                    showSelection
+                                    options={this.props.options}
+                                    toggleItemSelection={this.refreshDirectories} />
+                            </div>
+                            <Divider />
+                            <div className={classes.chips}>
+                                <Typography variant='subtitle1'>Selected collections ({this.state.directories.length}):</Typography>
+                                <Chips
+                                    orderable
+                                    deletable
+                                    values={this.state.directories}
+                                    onChange={this.setDirectories}
+                                    getLabel={(directory: CollectionResource) => directory.name} />
+                            </div>
+                        </div>
+
                     </DialogContent>
                     <DialogActions>
                         <Button onClick={this.closeDialog}>Cancel</Button>
@@ -280,30 +300,6 @@ const DirectoryArrayInputComponent = connect(mapStateToProps)(
                 </Dialog>
         );
 
-        dialogContent = withStyles(this.dialogContentStyles)(
-            ({ classes }: WithStyles<DialogContentCssRules>) =>
-                <div className={classes.pickerWrapper}>
-                    <div className={classes.tree}>
-                        <ProjectsTreePicker
-                            pickerId={this.props.commandInput.id}
-                            includeCollections
-                            showSelection
-                            options={this.props.options}
-                            toggleItemSelection={this.refreshDirectories} />
-                    </div>
-                    <Divider />
-                    <div className={classes.chips}>
-                        <Typography variant='subtitle1'>Selected collections ({this.state.directories.length}):</Typography>
-                        <Chips
-                            orderable
-                            deletable
-                            values={this.state.directories}
-                            onChange={this.setDirectories}
-                            getLabel={(directory: CollectionResource) => directory.name} />
-                    </div>
-                </div>
-        );
-
     });
 
 type DialogContentCssRules = 'root' | 'pickerWrapper' | 'tree' | 'divider' | 'chips';

diff --git a/src/views/run-process-panel/inputs/file-array-input.tsx b/src/views/run-process-panel/inputs/file-array-input.tsx
index 0be8f19feda9e40fe2ab7aebffb497250ca3c688..a2f884e3e636b9c404369fc5b02508887cdbf6de 100644 (file)
--- a/src/views/run-process-panel/inputs/file-array-input.tsx
+++ b/src/views/run-process-panel/inputs/file-array-input.tsx
@@ -249,7 +249,28 @@ const FileArrayInputComponent = connect(mapStateToProps)(
                     maxWidth='md' >
                     <DialogTitle>Choose files</DialogTitle>
                     <DialogContent className={classes.root}>
-                        <this.dialogContent />
+                        <div className={classes.pickerWrapper}>
+                            <div className={classes.tree}>
+                                <ProjectsTreePicker
+                                    pickerId={this.props.commandInput.id}
+                                    includeCollections
+                                    includeFiles
+                                    showSelection
+                                    options={this.props.options}
+                                    toggleItemSelection={this.refreshFiles} />
+                            </div>
+                            <Divider />
+                            <div className={classes.chips}>
+                                <Typography variant='subtitle1'>Selected files ({this.state.files.length}):</Typography>
+                                <Chips
+                                    orderable
+                                    deletable
+                                    values={this.state.files}
+                                    onChange={this.setFiles}
+                                    getLabel={(file: CollectionFile) => file.name} />
+                            </div>
+                        </div>
+
                     </DialogContent>
                     <DialogActions>
                         <Button onClick={this.closeDialog}>Cancel</Button>
@@ -262,31 +283,6 @@ const FileArrayInputComponent = connect(mapStateToProps)(
                 </Dialog>
         );
 
-        dialogContent = withStyles(this.dialogContentStyles)(
-            ({ classes }: WithStyles<DialogContentCssRules>) =>
-                <div className={classes.pickerWrapper}>
-                    <div className={classes.tree}>
-                        <ProjectsTreePicker
-                            pickerId={this.props.commandInput.id}
-                            includeCollections
-                            includeFiles
-                            showSelection
-                            options={this.props.options}
-                            toggleItemSelection={this.refreshFiles} />
-                    </div>
-                    <Divider />
-                    <div className={classes.chips}>
-                        <Typography variant='subtitle1'>Selected files ({this.state.files.length}):</Typography>
-                        <Chips
-                            orderable
-                            deletable
-                            values={this.state.files}
-                            onChange={this.setFiles}
-                            getLabel={(file: CollectionFile) => file.name} />
-                    </div>
-                </div>
-        );
-
     });
 
 type DialogContentCssRules = 'root' | 'pickerWrapper' | 'tree' | 'divider' | 'chips';

diff --git a/src/views/run-process-panel/inputs/file-input.tsx b/src/views/run-process-panel/inputs/file-input.tsx
index 218bf4189cbabebe6330089bb47f6fa23c8e8f3a..b0206e1452e8d2845815665640af50b6a8470c5a 100644 (file)
--- a/src/views/run-process-panel/inputs/file-input.tsx
+++ b/src/views/run-process-panel/inputs/file-input.tsx
@@ -138,7 +138,14 @@ const FileInputComponent = connect()(
                     maxWidth='md'>
                     <DialogTitle>Choose a file</DialogTitle>
                     <DialogContent className={classes.root}>
-                        <this.dialogContent />
+                        <div className={classes.pickerWrapper}>
+                            <ProjectsTreePicker
+                                pickerId={this.props.commandInput.id}
+                                includeCollections
+                                includeFiles
+                                options={this.props.options}
+                                toggleItemActive={this.setFile} />
+                        </div>
                     </DialogContent>
                     <DialogActions>
                         <Button onClick={this.closeDialog}>Cancel</Button>
@@ -150,18 +157,4 @@ const FileInputComponent = connect()(
                     </DialogActions>
                 </Dialog >
         );
-
-        dialogContent = withStyles(this.dialogContentStyles)(
-            ({ classes }: WithStyles<DialogContentCssRules>) =>
-                <div className={classes.pickerWrapper}>
-                    <ProjectsTreePicker
-                        pickerId={this.props.commandInput.id}
-                        includeCollections
-                        includeFiles
-                        options={this.props.options}
-                        toggleItemActive={this.setFile} />
-                </div>
-        );
-
-
     });