UI: Handle Empty File Uploads in FileUploader

[Samk13]

❤️ Thank you for your contribution!

Description

• Closes Backend errors not shown in record file upload screen and failed files cannot remove invenio-app-rdm#2804
• Depends on Deposit: Expose ALLOW_EMPTY_FILES config for UI Control invenio-app-rdm#2815
• Display a warning for empty files, indicating they won't be included.
• Show a list of removed file names in the warning.
• This feature is controlled by records-resources-allow-empty-files config value.
• Continue uploading other files while showing the warning message.

Checklist

Ticks in all boxes and 🟢 on all GitHub actions status checks are required to merge:

• I'm aware of the code of conduct.
• I've created logical separate commits and followed the commit message format.
• I've added relevant test cases.
• I've added relevant documentation.
• I've marked translation strings.
• I've identified the copyright holder(s) and updated copyright headers for touched files (>15 lines contributions).
• I've NOT included third-party code (copy/pasted source code or new dependencies).
  • If you have added third-party code (copy/pasted or new dependencies), please reach out to an architect.

Frontend

• I've followed the CSS/JS and React guidelines.
• I've followed the web accessibility guidelines.
• I've followed the user interface guidelines.

Reminder

By using GitHub, you have already agreed to the GitHub’s Terms of Service including that:

1. You license your contribution under the same terms as the current repository’s license.
2. You agree that you have the right to license your contribution under the current repository’s license.

[ntarocco]

Thanks, LGTM! Just a few comments to make it a bit more readable!

[ntarocco]

Very minor optimization... we ended up having 3 times filter, maybe we can loop once?

Suggested change

	const emptyFiles = acceptedFiles.filter((file) => file.size === 0);
	const nonEmptyFiles = acceptedFiles.filter((file) => file.size > 0);
	const filesNames = _map(filesList, "name");
	let hasEmptyFiles = false;
	let hasNonEmptyFiles = false;
	let hasDuplicatedFiles = false;
	let nonEmptyFiles = [];
	for (const file of acceptedFiles) {
	if (file.size === 0) {
	hasEmptyFiles = true;
	} else {
	hasNonEmptyFiles = true;
	nonEmptyFiles.push(file);
	}
	if (filesNames.includes(file.name)) {
	hasDuplicatedFiles = true;
	}
	}

[Samk13]

I opted to use reduce to accumulate duplicate, empty, and non-empty files in a single pass. This allows us to track file names for warnings while maintaining efficiency and flexibility, as booleans alone can't e.g track file names.
Let me know if this works or if there's a better approach.

[Samk13]

@ntarocco Since you wanted to improve readability, I've added a separate commit where I refactored the component. Now, the uploader continues uploading the rest of the files while showing warnings for duplicate files or empty files (was not possible before). I've also added other missing translations and small fixes.
So you can review this commit separately.

[ntarocco]

Fantastic improvement and very nice and readable implementation 👏🏼