made files a derived prop to change based on the file data type

added file type
This commit is contained in:
Nikhil Nandagopal 2021-03-12 14:34:05 +05:30
parent d7a5f36fea
commit 11c8d4f34b
2 changed files with 20 additions and 14 deletions

View File

@ -254,8 +254,9 @@ export const GLOBAL_DEFS = {
description: "string",
},
file: {
name: "text",
data: "string",
name: "text",
type: "file",
},
};

View File

@ -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<string, any> {
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;