Refactor NpsPoll to custom effect
[MAILPOET-1916]
This commit is contained in:
committed by
M. Shull
parent
3dc67ac481
commit
1edfedbe01
@@ -1,19 +1,13 @@
|
|||||||
import React, { useState, useLayoutEffect } from 'react';
|
import React, { useLayoutEffect } from 'react';
|
||||||
import MailPoet from 'mailpoet';
|
import MailPoet from 'mailpoet';
|
||||||
import ReactDOMServer from 'react-dom/server';
|
import ReactDOMServer from 'react-dom/server';
|
||||||
import satismeter from 'satismeter-loader';
|
import satismeter from 'satismeter-loader';
|
||||||
import ReviewRequest from 'review_request.jsx';
|
import ReviewRequest from 'review_request.jsx';
|
||||||
import getTrackingData from 'analytics.js';
|
import getTrackingData from 'analytics.js';
|
||||||
|
|
||||||
const NpsPoll = () => {
|
const useNpsPoll = () => {
|
||||||
const [pollShown, setPollShown] = useState(false);
|
useLayoutEffect(() => {
|
||||||
const [modalShown, setModalShown] = useState(false);
|
const showReviewRequestModal = () => {
|
||||||
|
|
||||||
function showReviewRequestModal() {
|
|
||||||
if (modalShown) {
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
setModalShown(true);
|
|
||||||
MailPoet.Modal.popup({
|
MailPoet.Modal.popup({
|
||||||
width: 800,
|
width: 800,
|
||||||
template: ReactDOMServer.renderToString(
|
template: ReactDOMServer.renderToString(
|
||||||
@@ -30,9 +24,9 @@ const NpsPoll = () => {
|
|||||||
.addEventListener('click', () => MailPoet.Modal.close());
|
.addEventListener('click', () => MailPoet.Modal.close());
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
}
|
};
|
||||||
|
|
||||||
function callSatismeter(trackingData) {
|
const callSatismeter = (trackingData) => {
|
||||||
const newUsersPollId = '6L479eVPXk7pBn6S';
|
const newUsersPollId = '6L479eVPXk7pBn6S';
|
||||||
const oldUsersPollId = 'k0aJAsQAWI2ERyGv';
|
const oldUsersPollId = 'k0aJAsQAWI2ERyGv';
|
||||||
satismeter({
|
satismeter({
|
||||||
@@ -61,25 +55,19 @@ const NpsPoll = () => {
|
|||||||
},
|
},
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
}
|
};
|
||||||
|
|
||||||
useLayoutEffect(() => {
|
if (window.mailpoet_display_nps_poll) {
|
||||||
if (window.mailpoet_display_nps_poll && !pollShown) {
|
getTrackingData().then(({ data }) => callSatismeter(data));
|
||||||
setPollShown(true);
|
|
||||||
getTrackingData().then(data => callSatismeter(data.data));
|
|
||||||
}
|
}
|
||||||
});
|
}, []);
|
||||||
|
|
||||||
return null;
|
return null;
|
||||||
};
|
};
|
||||||
|
|
||||||
const withNpsPoll = function withNpsPoll(Component) {
|
const withNpsPoll = Component => (props) => {
|
||||||
return props => (
|
useNpsPoll();
|
||||||
<>
|
return <Component {...props} />;
|
||||||
<NpsPoll />
|
|
||||||
<Component {...props} />
|
|
||||||
</>
|
|
||||||
);
|
|
||||||
};
|
};
|
||||||
|
|
||||||
export default withNpsPoll;
|
export default withNpsPoll;
|
||||||
|
Reference in New Issue
Block a user