fix(notifications): support html descriptions
This commit is contained in:
parent
4e8d962027
commit
c9941dedb9
|
@ -8,7 +8,7 @@ import EditorWarningIcon from '@atlaskit/icon/glyph/editor/warning';
|
|||
import PeopleIcon from '@atlaskit/icon/glyph/people';
|
||||
import PersonIcon from '@atlaskit/icon/glyph/person';
|
||||
import QuestionsIcon from '@atlaskit/icon/glyph/questions';
|
||||
import React from 'react';
|
||||
import React, { isValidElement } from 'react';
|
||||
|
||||
import { translate } from '../../../base/i18n';
|
||||
import Message from '../../../base/react/components/web/Message';
|
||||
|
@ -78,12 +78,19 @@ class Notification extends AbstractNotification<Props> {
|
|||
* @returns {ReactElement}
|
||||
*/
|
||||
_renderDescription() {
|
||||
const description = this._getDescription().join(' ');
|
||||
const description = this._getDescription();
|
||||
|
||||
// Keeping in mind that:
|
||||
// - Notifications that use the `translateToHtml` function get an element-based description array with one entry
|
||||
// - Message notifications receive string-based description arrays that might need additional parsing
|
||||
// We look for ready-to-render elements, and if present, we roll with them
|
||||
// Otherwise, we use the Message component that accepts a string `text` prop
|
||||
const shouldRenderHtml = description.length === 1 && isValidElement(description[0]);
|
||||
|
||||
// the id is used for testing the UI
|
||||
return (
|
||||
<p data-testid = { this._getDescriptionKey() } >
|
||||
<Message text = { description } />
|
||||
{ shouldRenderHtml ? description : <Message text = { description.join(' ') } /> }
|
||||
</p>
|
||||
);
|
||||
}
|
||||
|
|
Loading…
Reference in New Issue