diff --git a/i18n/en.pot b/i18n/en.pot index 7fc971ac..8bad0afd 100644 --- a/i18n/en.pot +++ b/i18n/en.pot @@ -5,8 +5,8 @@ msgstr "" "Content-Type: text/plain; charset=utf-8\n" "Content-Transfer-Encoding: 8bit\n" "Plural-Forms: nplurals=2; plural=(n != 1)\n" -"POT-Creation-Date: 2021-03-16T11:10:22.254Z\n" -"PO-Revision-Date: 2021-03-16T11:10:22.254Z\n" +"POT-Creation-Date: 2021-03-25T22:14:19.666Z\n" +"PO-Revision-Date: 2021-03-25T22:14:19.666Z\n" msgid "Failed to load: {{error}}" msgstr "" @@ -29,6 +29,12 @@ msgstr "" msgid "Upload image" msgstr "" +msgid "File uploaded successfully" +msgstr "" + +msgid "Error uploading file: {{error}}" +msgstr "" + msgid "Cancel upload" msgstr "" @@ -608,13 +614,13 @@ msgstr "" msgid "Custom top menu logo" msgstr "" -msgid "Allow users to switch dashboard favorite view type" +msgid "Allow users to switch dashboard items view type" msgstr "" -msgid "Allow users to open dashboard favorite in relevant app" +msgid "Allow users to open dashboard items in relevant app" msgstr "" -msgid "Allow users to show dashboard favorite interpretations and details" +msgid "Allow users to show dashboard items interpretations and details" msgstr "" msgid "Allow users to view dashboard items in fullscreen" diff --git a/src/form-fields/file-upload.js b/src/form-fields/file-upload.js index 8a6b0a0a..cf0d3ad0 100644 --- a/src/form-fields/file-upload.js +++ b/src/form-fields/file-upload.js @@ -1,4 +1,4 @@ -import { useConfig } from '@dhis2/app-runtime' +import { useConfig, useAlert } from '@dhis2/app-runtime' import i18n from '@dhis2/d2-i18n' import { Button, @@ -78,6 +78,7 @@ Upload.propTypes = { class FileUpload extends React.Component { static propTypes = { + alert: PropTypes.object.isRequired, isEnabled: PropTypes.bool.isRequired, label: PropTypes.string.isRequired, name: PropTypes.oneOf(['logo_front', 'logo_banner']).isRequired, @@ -112,7 +113,8 @@ class FileUpload extends React.Component { } onUpload = async e => { - if (e.target.files.length === 0) { + const { files } = e.target + if (files.length === 0) { return } @@ -136,7 +138,7 @@ class FileUpload extends React.Component { this.xhr = xhr const data = new FormData() - data.append('file', e.target.files[0]) + data.append('file', files[0]) try { await api.post(['staticContent', this.props.name].join('/'), data) @@ -146,12 +148,18 @@ class FileUpload extends React.Component { progress: undefined, isEnabled: true, }) - } catch { + } catch (error) { + this.props.alert.show({ + message: i18n.t('Error uploading file: {{error}}', { + error: error.httpStatus || error.message, + nsSeparator: null, + }), + critical: true, + }) this.props.onChange({ target: { value: false } }) this.setState({ uploading: false, progress: undefined, - isEnabled: false, }) } } @@ -188,7 +196,6 @@ class FileUpload extends React.Component { display: 'block', whiteSpace: 'nowrap', } - const checkStyle = { display: 'inline-block', whiteSpace: 'nowrap', @@ -196,7 +203,6 @@ class FileUpload extends React.Component { paddingTop: 8, paddingBottom: 8, } - const btnStyle = { display: 'inline-block', position: 'absolute', @@ -244,4 +250,14 @@ class FileUpload extends React.Component { } } -export default FileUpload +const withAlerts = Component => { + return function ComponentWithAlerts(props) { + const alert = useAlert( + ({ message }) => message, + options => options + ) + return + } +} + +export default withAlerts(FileUpload) diff --git a/src/settingsFields.component.js b/src/settingsFields.component.js index 9a6ebafd..e56d3283 100644 --- a/src/settingsFields.component.js +++ b/src/settingsFields.component.js @@ -1,5 +1,5 @@ import i18n from '@dhis2/d2-i18n' -import { Button, Card } from '@dhis2/ui' +import { Button, Card, CenteredContent, CircularLoader } from '@dhis2/ui' import FormBuilder from 'd2-ui/lib/forms/FormBuilder.component' import { wordToValidatorMap } from 'd2-ui/lib/forms/Validators' import IconButton from 'material-ui/IconButton' @@ -204,9 +204,6 @@ class SettingsFields extends React.Component { }) case 'staticContent': - if (!settingsStore.state) { - return null - } return Object.assign({}, fieldBase, { component: FileUpload, props: { @@ -264,7 +261,7 @@ class SettingsFields extends React.Component { console.warn( `Unknown control type "${mapping.type}" encountered for field "${key}"` ) - return {} + return null } } @@ -278,6 +275,16 @@ class SettingsFields extends React.Component { ) } + if (!settingsStore.state) { + return ( + + + + + + ) + } + const fields = settings .map(key => { const mapping = settingsKeyMapping[key]