diff --git a/CHANGELOG.md b/CHANGELOG.md index 18abe6baac8..fd8691dfe70 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -7,6 +7,7 @@ - Fixed bug in `euiHeaderAffordForFixed` mixin that was not accounting for situations where `EuiDataGrid` was in full screen mode ([#5054](https://github.com/elastic/eui/pull/5054)) - Fixed `z-index` styles that were causing `EuiModal` and `EuiFlyout` components to appear behind `EuiDataGrid` when in full screen mode ([#5054](https://github.com/elastic/eui/pull/5054)) - Fixed untranslated i18n strings for `EuiFilterButton` - adds 2 new tokens and removes old `euiFilterButton.filterBadge` token ([#4750](https://github.com/elastic/eui/pull/5061)) +- Fixed missing i18n token `EuiFilePicker`'s default prompt, and improved i18n string for `euiFilePicker.filesSelected` ([#5063](https://github.com/elastic/eui/pull/5063)) **Theme: Amsterdam** diff --git a/src/components/form/file_picker/file_picker.tsx b/src/components/form/file_picker/file_picker.tsx index 8b4ac82d9a6..5014b103d8d 100644 --- a/src/components/form/file_picker/file_picker.tsx +++ b/src/components/form/file_picker/file_picker.tsx @@ -60,7 +60,12 @@ export interface EuiFilePickerProps export class EuiFilePicker extends Component { static defaultProps = { - initialPromptText: 'Select or drag and drop a file', + initialPromptText: ( + + ), compressed: false, display: 'large', }; @@ -72,12 +77,18 @@ export class EuiFilePicker extends Component { fileInput: HTMLInputElement | null = null; - handleChange = (filesSelected?: string | null) => { + handleChange = () => { if (!this.fileInput) return; if (this.fileInput.files && this.fileInput.files.length > 1) { this.setState({ - promptText: `${this.fileInput.files.length} ${filesSelected}`, + promptText: ( + + ), }); } else if (this.fileInput.files && this.fileInput.files.length === 0) { this.setState({ promptText: null }); @@ -101,7 +112,7 @@ export class EuiFilePicker extends Component { if (!this.fileInput) return; this.fileInput.value = ''; - this.handleChange(null); + this.handleChange(); }; showDrop = () => { @@ -117,13 +128,10 @@ export class EuiFilePicker extends Component { render() { return ( - {([clearSelectedFiles, filesSelected]: string[]) => { + {(clearSelectedFiles: string) => { const { id, name, @@ -213,7 +221,7 @@ export class EuiFilePicker extends Component { id={id} name={name} className="euiFilePicker__input" - onChange={() => this.handleChange(filesSelected)} + onChange={this.handleChange} ref={(input) => { this.fileInput = input; }}