diff --git a/app/client/src/utils/autocomplete/EntityDefinitions.ts b/app/client/src/utils/autocomplete/EntityDefinitions.ts index bf3641787e..af706aec92 100644 --- a/app/client/src/utils/autocomplete/EntityDefinitions.ts +++ b/app/client/src/utils/autocomplete/EntityDefinitions.ts @@ -254,8 +254,9 @@ export const GLOBAL_DEFS = { description: "string", }, file: { - name: "text", data: "string", + name: "text", + type: "file", }, }; diff --git a/app/client/src/widgets/FilepickerWidget.tsx b/app/client/src/widgets/FilepickerWidget.tsx index e4b5e183e2..bdee6c2984 100644 --- a/app/client/src/widgets/FilepickerWidget.tsx +++ b/app/client/src/widgets/FilepickerWidget.tsx @@ -197,7 +197,7 @@ class FilePickerWidget extends BaseWidget< label: VALIDATION_TYPES.TEXT, maxNumFiles: VALIDATION_TYPES.NUMBER, allowedFileTypes: VALIDATION_TYPES.ARRAY, - files: VALIDATION_TYPES.ARRAY, + selectedFiles: VALIDATION_TYPES.ARRAY, isRequired: VALIDATION_TYPES.BOOLEAN, // onFilesSelected: VALIDATION_TYPES.ACTION_SELECTOR, }; @@ -206,13 +206,13 @@ class FilePickerWidget extends BaseWidget< static getDerivedPropertiesMap(): DerivedPropertiesMap { return { isValid: `{{ this.isRequired ? this.files.length > 0 : true }}`, - value: `{{this.files}}`, + files: `{{this.selectedFiles.map((file) => { return { ...file, data: this.fileDataType === "Base64" ? file.base64 : this.fileDataType === "Binary" ? file.raw : file.text } })}}`, }; } static getMetaPropertiesMap(): Record { return { - files: [], + selectedFiles: [], uploadedFileData: {}, }; } @@ -317,8 +317,8 @@ class FilePickerWidget extends BaseWidget< }); this.state.uppy.on("file-removed", (file: any) => { - const updatedFiles = this.props.files - ? this.props.files.filter((dslFile) => { + const updatedFiles = this.props.selectedFiles + ? this.props.selectedFiles.filter((dslFile) => { return file.id !== dslFile.id; }) : []; @@ -326,7 +326,9 @@ class FilePickerWidget extends BaseWidget< }); this.state.uppy.on("files-added", (files: any[]) => { - const dslFiles = this.props.files ? [...this.props.files] : []; + const dslFiles = this.props.selectedFiles + ? [...this.props.selectedFiles] + : []; const fileReaderPromises = files.map((file) => { const reader = new FileReader(); @@ -343,9 +345,9 @@ class FilePickerWidget extends BaseWidget< textReader.onloadend = () => { const text = textReader.result; const newFile = { + type: file.type, id: file.id, base64: base64data, - blob: file.data, raw: rawData, text: text, data: @@ -365,7 +367,10 @@ class FilePickerWidget extends BaseWidget< }); Promise.all(fileReaderPromises).then((files) => { - this.props.updateWidgetMetaProperty("files", dslFiles.concat(files)); + this.props.updateWidgetMetaProperty( + "selectedFiles", + dslFiles.concat(files), + ); }); }); @@ -412,9 +417,9 @@ class FilePickerWidget extends BaseWidget< componentDidUpdate(prevProps: FilePickerWidgetProps) { super.componentDidUpdate(prevProps); if ( - prevProps.files && - prevProps.files.length > 0 && - this.props.files === undefined + prevProps.selectedFiles && + prevProps.selectedFiles.length > 0 && + this.props.selectedFiles === undefined ) { this.state.uppy.reset(); } else if ( @@ -443,7 +448,7 @@ class FilePickerWidget extends BaseWidget< widgetId={this.props.widgetId} key={this.props.widgetId} label={this.props.label} - files={this.props.files || []} + files={this.props.selectedFiles || []} isLoading={this.props.isLoading || this.state.isLoading} isDisabled={this.props.isDisabled} /> @@ -464,7 +469,7 @@ export interface FilePickerWidgetProps extends WidgetProps, WithMeta { label: string; maxNumFiles?: number; maxFileSize?: number; - files?: any[]; + selectedFiles?: any[]; allowedFileTypes: string[]; onFilesSelected?: string; fileDataType?: FileDataTypes;