diff --git a/ghost/portal/src/components/common/NewsletterManagement.js b/ghost/portal/src/components/common/NewsletterManagement.js
index af35d4e2ef..dcac959a93 100644
--- a/ghost/portal/src/components/common/NewsletterManagement.js
+++ b/ghost/portal/src/components/common/NewsletterManagement.js
@@ -20,43 +20,52 @@ function AccountHeader() {
);
}
+function SuccessIcon({show}) {
+ if (!show) {
+ return null;
+ }
+ return (
+
+ ✅
+
+ );
+}
+
function NewsletterPrefSection({newsletter, subscribedNewsletters, setSubscribedNewsletters}) {
const isChecked = subscribedNewsletters.some((d) => {
return d.id === newsletter?.id;
});
- const [description, setDescription] = useState(newsletter?.description || '');
+
+ const [showUpdated, setShowUpdated] = useState(false);
const [timeoutId, setTimeoutId] = useState(null);
- let finalDescription = description;
- if (!description) {
- finalDescription = isChecked ? 'Subscribed' : 'Unsubscribed';
- }
return (
{newsletter.name}
-
{finalDescription}
+
{newsletter?.description}
-
+
+
{
let updatedNewsletters = [];
if (!checked) {
updatedNewsletters = subscribedNewsletters.filter((d) => {
return d.id !== newsletter.id;
});
- setDescription('Unsubscribed');
+ setShowUpdated(true);
clearTimeout(timeoutId);
let newTimeoutId = setTimeout(() => {
- setDescription(newsletter?.description);
+ setShowUpdated(false);
}, 3000);
setTimeoutId(newTimeoutId);
} else {
updatedNewsletters = subscribedNewsletters.filter((d) => {
return d.id !== newsletter.id;
}).concat(newsletter);
- setDescription('Subscribed');
+ setShowUpdated(true);
clearTimeout(timeoutId);
let newTimeoutId = setTimeout(() => {
- setDescription(newsletter?.description);
+ setShowUpdated(false);
}, 3000);
setTimeoutId(newTimeoutId);
}