diff --git a/mailpoet/assets/js/src/newsletters/sending-status.jsx b/mailpoet/assets/js/src/newsletters/sending-status.jsx
index a4d675deab..e00b412688 100644
--- a/mailpoet/assets/js/src/newsletters/sending-status.jsx
+++ b/mailpoet/assets/js/src/newsletters/sending-status.jsx
@@ -1,6 +1,6 @@
import classnames from 'classnames';
import { Link, useLocation, useParams } from 'react-router-dom';
-import { memo, useEffect, useState } from 'react';
+import { memo, useEffect, useState, useRef } from 'react';
import PropTypes from 'prop-types';
import { __, _x } from '@wordpress/i18n';
@@ -45,6 +45,8 @@ function SendingStatus() {
sent: false,
});
+ const refreshRef = useRef(null);
+
useEffect(() => {
MailPoet.Ajax.post({
api_version: window.mailpoet_api_version,
@@ -74,7 +76,11 @@ function SendingStatus() {
)}
-
+
>
);
}
@@ -85,27 +91,28 @@ const compareProps = (prev, next) =>
prev.location.pathname === next.location.pathname &&
prev.params.id === next.params.id;
-const onRenderItem = (item) => (
+const onRenderItem = (item, refreshRef) => (
-
+
);
const SendingStatusListing = memo(
- ({ location, params }) => (
+ ({ location, params, refreshRef }) => (
onRenderItem(item, refreshRef)}
getListingItemKey={(item) => `${item.taskId}-${item.subscriberId}`}
columns={columns}
messages={messages}
auto_refresh
sort_by="failed"
sort_order="desc"
+ refreshRef={refreshRef}
afterGetItems={(state) => {
checkMailerStatus(state);
checkCronStatus(state);
@@ -121,6 +128,7 @@ SendingStatusListing.propTypes = {
params: PropTypes.shape({
id: PropTypes.string.isRequired,
}).isRequired,
+ refreshRef: PropTypes.shape({ current: PropTypes.func }),
};
function StatsLink({
@@ -154,6 +162,7 @@ function ListingItem({
subscriberId,
lastName,
firstName,
+ refreshRef = null,
error = '',
}) {
const resend = () => {
@@ -163,7 +172,7 @@ function ListingItem({
action: 'resend',
data: { taskId, subscriberId },
})
- .done(() => window.mailpoet_listing.forceUpdate())
+ .done(() => refreshRef?.current && refreshRef.current())
.fail((res) => MailPoet.Notice.showApiErrorNotice(res));
};
@@ -250,6 +259,7 @@ ListingItem.propTypes = {
firstName: PropTypes.string.isRequired,
processed: PropTypes.number.isRequired,
subscriberId: PropTypes.number.isRequired,
+ refreshRef: PropTypes.shape({ current: PropTypes.func }),
};
ListingItem.displayName = 'ListingItem';
SendingStatus.displayName = 'SendingStatus';