How do I use the file names from the FilePicker widget as an array for my JSObject?

Hi there,
I’m setting up a small app which requires the user to select some files via a FilePicker widget.

I need to get the filenames of the files selected and use those to create a new array where, using a reference array, I’m able to convert the file names in language names.
For instance:

The user selects the “it.xlf”, “es.xlf” and “pt-rBR.xlf” files
I have a map which says that it.xlf corresponds to it_IT, etc.
I convert [“it.xlf”, “es.xlf”, “pt-rBR.xlf”] to [“it_IT”, “es_ES”, “pt_BR”].

I have come up with the following JSObject:

export default {
	convert_filename_to_language: () => {
		//write code here
		const selected_files = file_picker.files.map((selected_file) => {return selected_file.name});				
		const language_map = [{'file': 'de.xlf', 'lang': 'de_DE'},{'file': 'es.xlf', 'lang': 'es_ES'},{'file': 'it.xlf', 'lang': 'it_IT'},{'file': 'pt-rBR.xlf', 'lang': 'pt_BR'}]
		const languages = [];
		var k=0;

		// POPULATE ARRAY
		for (let i = 0; i < selected_files.length; i++) {
			for (let j = 0; j < language_map.length; j++) {
				if(selected_files[i]==language_map[j]['file']) {
				 languages[k]=language_map[j]['lang'];
				 k++;
				}
			}
		}

	return languages
		},
}

This works perfectly if
const selected_files = ["it.xlf", "es.xlf", "pt-rBR.xlf"],

but it fails to execute if I try to get the file names array using
file_picker.files.map((selected_file) => {return selected_file.name});

Am I doing something wrong with the filepicker mapping, maybe?

Thank you,
Enrico

I think I just answered myself:
I first need to store a “selected_files” variable onFilesSelected; then I can use appsmith.store.selected_files in my JSObject.
That seems to work :slight_smile:

2 Likes

Hey @enricogiaistar, glad you figured it out, thanks for sharing with the community :slight_smile:

1 Like