| 1 |
import React, { Component } from 'react'; |
| 2 |
import { withRouter } from 'react-router'; |
| 3 |
|
| 4 |
import '../../css/admin/manage/notices.scss'; |
| 5 |
|
| 6 |
import Api from 'Shared/Api'; |
| 7 |
import Icon from 'Shared/Icon'; |
| 8 |
import { __wpupg } from 'Shared/Translations'; |
| 9 |
|
| 10 |
class Notices extends Component { |
| 11 |
render() { |
| 12 |
if ( ! wpupg_admin_manage_modal.notices || ! wpupg_admin_manage_modal.notices.length ) { |
| 13 |
return null; |
| 14 |
} |
| 15 |
|
| 16 |
return ( |
| 17 |
<div className="wpupg-admin-manage-notices"> |
| 18 |
{ |
| 19 |
wpupg_admin_manage_modal.notices.map((notice, index) => { |
| 20 |
// Check if notice already dismissed. |
| 21 |
if ( notice.dismissed ) { |
| 22 |
return null; |
| 23 |
} |
| 24 |
|
| 25 |
// Check if notice should show up in a specific location only. |
| 26 |
if ( false !== notice.location && this.props.location.pathname !== '/' + notice.location ) { |
| 27 |
return null; |
| 28 |
} |
| 29 |
|
| 30 |
return ( |
| 31 |
<div className="wpupg-admin-notice" key={ index }> |
| 32 |
<div className="wpupg-admin-notice-content"> |
| 33 |
{ |
| 34 |
notice.title |
| 35 |
? |
| 36 |
<div className="wpupg-admin-notice-title">{ notice.title }</div> |
| 37 |
: |
| 38 |
null |
| 39 |
} |
| 40 |
<div |
| 41 |
className="wpupg-admin-notice-text" |
| 42 |
dangerouslySetInnerHTML={ { __html: notice.text } } |
| 43 |
/> |
| 44 |
</div> |
| 45 |
{ |
| 46 |
notice.dismissable |
| 47 |
&& |
| 48 |
<div className="wpupg-admin-notice-dismiss"> |
| 49 |
<Icon |
| 50 |
title={ __wpupg( 'Remove Notice' ) } |
| 51 |
type="close" |
| 52 |
onClick={() => { |
| 53 |
Api.general.dismissNotice( notice.id ); |
| 54 |
notice.dismissed = true; |
| 55 |
this.forceUpdate(); |
| 56 |
}} |
| 57 |
/> |
| 58 |
</div> |
| 59 |
} |
| 60 |
</div> |
| 61 |
) |
| 62 |
}) |
| 63 |
} |
| 64 |
</div> |
| 65 |
); |
| 66 |
} |
| 67 |
} |
| 68 |
|
| 69 |
export default withRouter(Notices) |
