diff options
Diffstat (limited to 'webapp/components/emoji')
-rw-r--r-- | webapp/components/emoji/components/delete_emoji_modal.jsx | 49 | ||||
-rw-r--r-- | webapp/components/emoji/components/emoji_list_item.jsx | 11 |
2 files changed, 51 insertions, 9 deletions
diff --git a/webapp/components/emoji/components/delete_emoji_modal.jsx b/webapp/components/emoji/components/delete_emoji_modal.jsx new file mode 100644 index 000000000..604e3a27b --- /dev/null +++ b/webapp/components/emoji/components/delete_emoji_modal.jsx @@ -0,0 +1,49 @@ +import React from 'react'; +import {FormattedMessage} from 'react-intl'; + +import DeleteModalTrigger from '../../delete_modal_trigger.jsx'; + +export default class DeleteEmoji extends DeleteModalTrigger { + get triggerTitle() { + return ( + <FormattedMessage + id='emoji_list.delete' + defaultMessage='Delete' + /> + ); + } + + get modalTitle() { + return ( + <FormattedMessage + id='emoji_list.delete.confirm.title' + defaultMessage='Delete Custom Emoji' + /> + ); + } + + get modalMessage() { + return ( + <div className='alert alert-warning'> + <i className='fa fa-warning'/> + <FormattedMessage + id='emoji_list.delete.confirm.msg' + defaultMessage='This action permanently deletes the custom emoji. Are you sure you want to delete it?' + /> + </div> + ); + } + + get modalConfirmButton() { + return ( + <FormattedMessage + id='emoji_list.delete.confirm.button' + defaultMessage='Delete' + /> + ); + } +} + +DeleteEmoji.propTypes = { + onDelete: React.PropTypes.func.isRequired +}; diff --git a/webapp/components/emoji/components/emoji_list_item.jsx b/webapp/components/emoji/components/emoji_list_item.jsx index f2ed82ba7..019b0ca93 100644 --- a/webapp/components/emoji/components/emoji_list_item.jsx +++ b/webapp/components/emoji/components/emoji_list_item.jsx @@ -4,6 +4,7 @@ import React from 'react'; import EmojiStore from 'stores/emoji_store.jsx'; +import DeleteEmoji from './delete_emoji_modal.jsx'; import * as Utils from 'utils/utils.jsx'; @@ -80,15 +81,7 @@ export default class EmojiListItem extends React.Component { let deleteButton = null; if (this.props.onDelete) { deleteButton = ( - <a - href='#' - onClick={this.handleDelete} - > - <FormattedMessage - id='emoji_list.delete' - defaultMessage='Delete' - /> - </a> + <DeleteEmoji onDelete={this.handleDelete}/> ); } |