Cavemanon/piratepoet
7
Fork 0
Code Pull Requests Actions Releases 16 Activity

Refactor into a function component

Browse Source 
[MAILPOET-2192]
This commit is contained in:
Pavel Dohnal
2019-08-28 15:28:58 +02:00
committed by M. Shull
parent ca60de6d96
commit 8dba43b560
1 changed files with 78 additions and 81 deletions
Download Patch File Download Diff File Expand all files Collapse all files

159
assets/js/src/newsletters/listings/notification_history.jsx
View File

@ -43,7 +43,7 @@ const columns = [
}, },
]; ];
let newsletterActions = [ const newsletterActions = addStatsCTAAction([
{ {
name: 'view', name: 'view',
link: function link(newsletter) { link: function link(newsletter) {
@ -57,94 +57,91 @@ let newsletterActions = [
{ {
name: 'trash', name: 'trash',
}, },
]; ]);
newsletterActions = addStatsCTAAction(newsletterActions);
class NewsletterListNotificationHistory extends React.Component { const renderItem = (newsletter, actions, meta) => {
static displayName = 'NewsletterListNotificationHistory'; const rowClasses = classNames(
'manage-column',
'column-primary',
'has-row-actions'
);
static propTypes = { const segments = newsletter.segments.map((segment) => segment.name).join(', ');
location: PropTypes.object.isRequired, // eslint-disable-line react/forbid-prop-types
match: PropTypes.shape({
params: PropTypes.object, // eslint-disable-line react/forbid-prop-types
}).isRequired,
};
renderItem = (newsletter, actions, meta) => { return (
const rowClasses = classNames( <>
'manage-column', <td className={rowClasses}>
'column-primary', <strong>
'has-row-actions' <a
); href={newsletter.preview_url}
target="_blank"
const segments = newsletter.segments.map((segment) => segment.name).join(', '); rel="noopener noreferrer"
>
return ( { newsletter.queue.newsletter_rendered_subject || newsletter.subject }
<div> </a>
<td className={rowClasses}> </strong>
<strong> { actions }
<a </td>
href={newsletter.preview_url} <td className="column" data-colname={MailPoet.I18n.t('status')}>
target="_blank" <QueueStatus newsletter={newsletter} mailerLog={meta.mta_log} />
rel="noopener noreferrer" </td>
> <td className="column" data-colname={MailPoet.I18n.t('lists')}>
{ newsletter.queue.newsletter_rendered_subject || newsletter.subject } { segments }
</a> </td>
</strong> { (mailpoetTrackingEnabled === true) ? (
{ actions } <td className="column" data-colname={MailPoet.I18n.t('statistics')}>
<Statistics newsletter={newsletter} currentTime={meta.current_time} />
</td> </td>
<td className="column" data-colname={MailPoet.I18n.t('status')}> ) : null }
<QueueStatus newsletter={newsletter} mailerLog={meta.mta_log} /> <td className="column-date" data-colname={MailPoet.I18n.t('sentOn')}>
</td> { (newsletter.sent_at) ? MailPoet.Date.format(newsletter.sent_at) : MailPoet.I18n.t('notSentYet') }
<td className="column" data-colname={MailPoet.I18n.t('lists')}> </td>
{ segments } </>
</td> );
{ (mailpoetTrackingEnabled === true) ? ( };
<td className="column" data-colname={MailPoet.I18n.t('statistics')}>
<Statistics newsletter={newsletter} currentTime={meta.current_time} />
</td>
) : null }
<td className="column-date" data-colname={MailPoet.I18n.t('sentOn')}>
{ (newsletter.sent_at) ? MailPoet.Date.format(newsletter.sent_at) : MailPoet.I18n.t('notSentYet') }
</td>
</div>
);
};
render() { const NewsletterListNotificationHistory = (props) => (
return ( <>
<div> <ListingHeading />
<ListingHeading />
<FeatureAnnouncement hasNews={window.mailpoet_feature_announcement_has_news} /> <FeatureAnnouncement hasNews={window.mailpoet_feature_announcement_has_news} />
<ListingTabs tab="notification" /> <ListingTabs tab="notification" />
<Link <Link
className="page-title-action" className="page-title-action"
to="/notification" to="/notification"
> >
{MailPoet.I18n.t('backToPostNotifications')} {MailPoet.I18n.t('backToPostNotifications')}
</Link> </Link>
<Listing <Listing
limit={window.mailpoet_listing_per_page} limit={window.mailpoet_listing_per_page}
location={this.props.location} location={props.location}
params={this.props.match.params} params={props.match.params}
endpoint="newsletters" endpoint="newsletters"
type="notification_history" type="notification_history"
base_url="notification/history/:parent_id" base_url="notification/history/:parent_id"
onRenderItem={this.renderItem} onRenderItem={renderItem}
columns={columns} columns={columns}
item_actions={newsletterActions} item_actions={newsletterActions}
auto_refresh auto_refresh
sort_by="sent_at" sort_by="sent_at"
sort_order="desc" sort_order="desc"
afterGetItems={(state) => { checkMailerStatus(state); checkCronStatus(state); }} afterGetItems={(state) => { checkMailerStatus(state); checkCronStatus(state); }}
/> />
</div> </>
); );
}
} NewsletterListNotificationHistory.propTypes = {
location: PropTypes.shape({
pathname: PropTypes.string,
}).isRequired,
match: PropTypes.shape({
params: PropTypes.shape({
id: PropTypes.string,
}),
}).isRequired,
};
export default NewsletterListNotificationHistory; export default NewsletterListNotificationHistory;