Fix fiile uploads for Toob ML and Toob Convolution Reversbs.

react/src/FilePropertyDialog.tsx

@@ -32,7 +32,7 @@ import Button from '@mui/material/Button';
 import FileUploadIcon from '@mui/icons-material/FileUpload';
 import AudioFileIcon from '@mui/icons-material/AudioFile';
 import ArrowBackIcon from '@mui/icons-material/ArrowBack';
-import FolderIcon from '@mui/icons-material/Folder';
+import FolderOutlinedIcon from '@mui/icons-material/FolderOutlined';
 import InsertDriveFileOutlinedIcon from '@mui/icons-material/InsertDriveFileOutlined';
 import InsertDriveFileIcon from '@mui/icons-material/InsertDriveFile';
 import DialogActions from '@mui/material/DialogActions';
@@ -105,6 +105,7 @@ export interface FilePropertyDialogState {
     canDelete: boolean;
     fileResult: FileRequestResult;
     navDirectory: string;
+    uploadDirectory: string;
     isProtectedDirectory: boolean;
     columns: number;
     columnWidth: number;
@@ -187,12 +188,14 @@ export default withStyles(styles, { withTheme: true })(
 
             this.model = PiPedalModelFactory.getInstance();
 
+            let selectedFile = props.selectedFile;
             this.state = {
                 fullScreen: this.getFullScreen(),
-                selectedFile: props.selectedFile,
+                selectedFile: selectedFile,
                 selectedFileProtected: true,
                 selectedFileIsDirectory: false,
-                navDirectory: this.getNavDirectoryFromFile(props.selectedFile, props.fileProperty),
+                navDirectory: this.getNavDirectoryFromFile(selectedFile, props.fileProperty),
+                uploadDirectory: "",
                 hasSelection: false,
                 canDelete: false,
                 columns: 0,
@@ -256,7 +259,8 @@ export default withStyles(styles, { withTheme: true })(
                             fileResult: filesResult,
                             hasSelection: !!fileEntry,
                             selectedFileProtected: fileEntry ? fileEntry.isProtected: true,
-                            navDirectory: navPath
+                            navDirectory: navPath,
+                            uploadDirectory: filesResult.currentDirectory
                         });
                     }
                 }).catch((error) => {
@@ -300,6 +304,8 @@ export default withStyles(styles, { withTheme: true })(
         componentDidMount() {
             super.componentDidMount();
             this.mounted = true;
+            this.requestFiles(this.state.navDirectory)
+            this.requestScroll = true;
         }
         componentWillUnmount() {
             super.componentWillUnmount();
@@ -310,14 +316,16 @@ export default withStyles(styles, { withTheme: true })(
             super.componentDidUpdate?.(prevProps, prevState, snapshot);
             if (prevProps.open !== this.props.open || prevProps.fileProperty !== this.props.fileProperty || prevProps.selectedFile !== this.props.selectedFile) {
                 if (this.props.open) {
-                    let navDirectory = this.getNavDirectoryFromFile(this.props.selectedFile, this.props.fileProperty);
+                    let selectedFile = this.props.selectedFile;
+                    let navDirectory = this.getNavDirectoryFromFile(selectedFile, this.props.fileProperty);
                     this.setState({
-                        selectedFile: this.props.selectedFile,
+                        selectedFile: selectedFile,
                         selectedFileIsDirectory: false,
                         selectedFileProtected: true,
                         newFolderDialogOpen: false,
                         renameDialogOpen: false,
-                        moveDialogOpen: false
+                        moveDialogOpen: false,
+                        navDirectory: navDirectory
                     });
                     this.requestFiles(navDirectory)
                     this.requestScroll = true;
@@ -549,7 +557,7 @@ export default withStyles(styles, { withTheme: true })(
             }
             if (fileEntry.isDirectory) {
                 return (
-                    <FolderIcon style={{ flex: "0 0 auto", opacity: 0.7, marginRight: 8, marginLeft: 8 }} />
+                    <FolderOutlinedIcon style={{ flex: "0 0 auto", opacity: 0.7, marginRight: 8, marginLeft: 8 }} />
                 );
             }
             if (isAudioFile(fileEntry.pathname)) {
@@ -741,7 +749,7 @@ export default withStyles(styles, { withTheme: true })(
                                 }
                             }
                             uploadPage={
-                                "uploadUserFile?directory=" + encodeURIComponent(this.state.navDirectory)
+                                "uploadUserFile?directory=" + encodeURIComponent(this.state.uploadDirectory)
                                 + "&ext="
                                 + encodeURIComponent(this.getFileExtensionList(this.props.fileProperty))
                             }

react/src/PiPedalModel.tsx

@@ -99,6 +99,7 @@ export class FileRequestResult {
     files: FileEntry[] = [];
     isProtected: boolean = false;
     breadcrumbs: BreadcrumbEntry[] = [];
+    currentDirectory: string = "";
 };
 
 export type PluginPresetsChangedHandler = (pluginUri: string) => void;

react/src/PluginControlView.tsx

@@ -23,7 +23,7 @@ import { WithStyles } from '@mui/styles';
 import createStyles from '@mui/styles/createStyles';
 import withStyles from '@mui/styles/withStyles';
 import { PiPedalModel, PiPedalModelFactory } from './PiPedalModel';
-import { UiPlugin, UiControl, UiFileProperty,UiFrequencyPlot, ScalePoint } from './Lv2Plugin';
+import { UiPlugin, UiControl, UiFileProperty, UiFrequencyPlot, ScalePoint } from './Lv2Plugin';
 import {
     Pedalboard, PedalboardItem, ControlValue
 } from './Pedalboard';
@@ -247,8 +247,7 @@ type PluginControlViewState = {
 
 const PluginControlView =
     withStyles(styles, { withTheme: true })(
-        class extends ResizeResponsiveComponent<PluginControlViewProps, PluginControlViewState>
-        {
+        class extends ResizeResponsiveComponent<PluginControlViewProps, PluginControlViewState> {
             model: PiPedalModel;
 
             constructor(props: PluginControlViewProps) {
@@ -526,7 +525,7 @@ const PluginControlView =
                 return false;
             }
 
-            controlKeyIndex : number = 0;
+            controlKeyIndex: number = 0;
             controlNodesToNodes(nodes: (ReactNode | ControlGroup)[]): ReactNode[] {
                 let classes = this.props.classes;
                 let isLandscapeGrid = this.state.landscapeGrid;
@@ -543,7 +542,7 @@ const PluginControlView =
                             let item = controlGroup.controls[j];
                             controls.push(
                                 (
-                                    <div key={"ctl"+(this.controlKeyIndex++)} className={classes.controlPadding}>
+                                    <div key={"ctl" + (this.controlKeyIndex++)} className={classes.controlPadding}>
                                         {item}
                                     </div>
 
@@ -552,7 +551,7 @@ const PluginControlView =
                         }
 
                         result.push((
-                            <div key={"ctl"+(this.controlKeyIndex++)} className={!isLandscapeGrid ? classes.portGroup : classes.portGroupLandscape}>
+                            <div key={"ctl" + (this.controlKeyIndex++)} className={!isLandscapeGrid ? classes.portGroup : classes.portGroupLandscape}>
                                 <div className={classes.portGroupTitle}>
                                     <Typography noWrap variant="caption" >{controlGroup.name}</Typography>
                                 </div>
@@ -566,7 +565,7 @@ const PluginControlView =
 
                     } else {
                         result.push((
-                            <div key={"ctl"+(this.controlKeyIndex++)} className={hasGroups ? classes.portgroupControlPadding : classes.controlPadding} >
+                            <div key={"ctl" + (this.controlKeyIndex++)} className={hasGroups ? classes.portgroupControlPadding : classes.controlPadding} >
                                 {node as ReactNode}
                             </div>
                         ));
@@ -584,7 +583,7 @@ const PluginControlView =
 
 
             render(): ReactNode {
-                this.controlKeyIndex = 0; 
+                this.controlKeyIndex = 0;
                 let classes = this.props.classes;
                 let pedalboardItem: PedalboardItem;
                 let pedalboard = this.model.pedalboard.get();
@@ -650,29 +649,33 @@ const PluginControlView =
                                 )
                             }
                         </div>
-                        <FilePropertyDialog open={this.state.showFileDialog}
-                            fileProperty={this.state.dialogFileProperty}
-                            selectedFile={this.state.dialogFileValue}
-                            onCancel={() => { 
-                                this.setState({ showFileDialog: false }); 
-                            }}
-                            onOk={(fileProperty, selectedFile) => {
+                        {this.state.showFileDialog && (
 
-                                this.model.setPatchProperty(
-                                    this.props.instanceId,
-                                    fileProperty.patchProperty,
-                                    JsonAtom.Path(selectedFile)
-                                )
-                                    .then(() => {
+                            <FilePropertyDialog open={this.state.showFileDialog}
+                                fileProperty={this.state.dialogFileProperty}
+                                selectedFile={this.state.dialogFileValue}
+                                onCancel={() => {
+                                    this.setState({ showFileDialog: false });
+                                }}
+                                onOk={(fileProperty, selectedFile) => {
+
+                                    this.model.setPatchProperty(
+                                        this.props.instanceId,
+                                        fileProperty.patchProperty,
+                                        JsonAtom.Path(selectedFile)
+                                    )
+                                        .then(() => {
+
+                                        })
+                                        .catch((error) => {
+                                            this.model.showAlert("Unable to complete the operation. Audio is not running." + error);
+                                        });
+                                    this.setState({ showFileDialog: false });
+                                }
+                                }
+                            />
+                        )}
 
-                                    })
-                                    .catch((error) => {
-                                        this.model.showAlert("Unable to complete the operation. Audio is not running." + error);
-                                    });
-                                this.setState({ showFileDialog: false });
-                            }
-                            }
-                        />
                         <FullScreenIME uiControl={this.state.imeUiControl} value={this.state.imeValue}
 
                             onChange={(key, value) => this.onImeValueChange(key, value)}