Allow dynamic content in strapi.notifications

This commit is contained in:
cyril lopez 2018-02-16 11:16:51 +01:00
parent 55d095df9a
commit 05a229b8fc
6 changed files with 47 additions and 9 deletions

View File

@ -7,6 +7,7 @@
import React from 'react';
import PropTypes from 'prop-types';
import { FormattedMessage } from 'react-intl';
import { isObject } from 'lodash';
import styles from './styles.scss';
@ -40,12 +41,18 @@ class Notification extends React.Component { // eslint-disable-line react/prefer
render() {
const options = this.options[this.props.notification.status] || this.options.info;
const { notification: { message } } = this.props;
const content = isObject(message) && message.id ?
<FormattedMessage id={message.id} defaultMessage={message.id} values={message.values} />
: <FormattedMessage id={message} defaultMessage={message} />;
return (
<li key={this.props.notification.id} className={`${styles.notification} ${styles[options.class]}`}>
<i className={`fa ${options.icon} ${styles.notificationIcon}`} />
<div className={styles.notificationContent}>
<p className={styles.notificationTitle}><FormattedMessage id={this.props.notification.message} /></p>
<p className={styles.notificationTitle}>
{content}
</p>
</div>
<i className={`fa fa-close ${styles.notificationClose}`} onClick={this.handleCloseClicked} />
</li>
@ -53,8 +60,26 @@ class Notification extends React.Component { // eslint-disable-line react/prefer
}
}
Notification.defaultProps = {
notification: {
id: 1,
message: 'app.utils.defaultMessage',
status: 'success',
},
};
Notification.propTypes = {
notification: PropTypes.object.isRequired,
notification: PropTypes.shape({
id: PropTypes.number,
message: PropTypes.oneOfType([
PropTypes.string,
PropTypes.shape({
id: PropTypes.string,
values: PropTypes.object,
}),
]),
status: PropTypes.string,
}),
onHideNotification: PropTypes.func.isRequired,
};

View File

@ -43,8 +43,21 @@ class NotificationsContainer extends React.Component { // eslint-disable-line re
}
}
NotificationsContainer.defaultProps = {
notifications: [
{
id: 1,
message: 'app.utils.defaultMessage',
status: 'success',
},
],
};
NotificationsContainer.propTypes = {
notifications: PropTypes.object.isRequired,
notifications: PropTypes.oneOfType([
PropTypes.object,
PropTypes.array,
]),
onHideNotification: PropTypes.func.isRequired,
};

View File

@ -21,8 +21,8 @@ function notificationProviderReducer(state = initialState, action) {
switch (action.type) {
case SHOW_NOTIFICATION:
return state.set('notifications', state.get('notifications').push({
message: action.message,
status: action.status,
message: action.message || 'app.utils.defaultMessage',
status: action.status || 'success',
id: action.id,
}));
case HIDE_NOTIFICATION:

View File

@ -2,5 +2,5 @@
"HomePage.title": "Upload",
"HomePage.description": "Discover all the uploaded files",
"HomePage.InputSearch.placeholder": "Type something to search..."
"HomePage.InputSearch.placeholder": "Search for a file..."
}

View File

@ -2,6 +2,6 @@
"HomePage.title": "Upload",
"HomePage.description": "Découvrez tous les fichiers téléchargés",
"HomePage.InputSearch.placeholder": "Tapez pour rechercher un truc..."
"HomePage.InputSearch.placeholder": "Rechercher un fichier..."
}

View File

@ -3,8 +3,8 @@
"version": "3.0.0-alpha.10.1",
"description": "This is the description of the plugin.",
"strapi": {
"name": "upload",
"icon": "plug",
"name": "Upload",
"icon": "upload",
"description": "Description of upload plugin."
},
"scripts": {