From 277e169f7b8c00f004fe837dedadd5d3bf3919ad Mon Sep 17 00:00:00 2001
From: Peter Zimon <zimo@ghost.org>
Date: Wed, 22 May 2024 13:14:28 +0200
Subject: [PATCH] Fixed static copy in newsletter preview (#20238)

DES-342

A static site title ("The Local Host") was displayed in the newsletter
preview instead of the actual site title. Also, moved over the "Support
independent publishing" button to design tab in newsletter settings.
---
 .../newsletters/NewsletterDetailModal.tsx     | 41 +++++++++----------
 .../newsletters/NewsletterPreviewContent.tsx  |  2 +-
 2 files changed, 21 insertions(+), 22 deletions(-)

diff --git a/apps/admin-x-settings/src/components/settings/email/newsletters/NewsletterDetailModal.tsx b/apps/admin-x-settings/src/components/settings/email/newsletters/NewsletterDetailModal.tsx
index af79431360..fa6b1a38c3 100644
--- a/apps/admin-x-settings/src/components/settings/email/newsletters/NewsletterDetailModal.tsx
+++ b/apps/admin-x-settings/src/components/settings/email/newsletters/NewsletterDetailModal.tsx
@@ -251,27 +251,6 @@ const Sidebar: React.FC<{
                         onChange={e => updateNewsletter({subscribe_on_signup: e.target.checked})}
                     />
                 </Form>
-                <Separator />
-                <div className='my-5 flex w-full items-start'>
-                    <span>
-                        <Icon className='mr-2 mt-[-1px]' colorClass='text-red' name='heart'/>
-                    </span>
-                    <Form marginBottom={false}>
-                        <Toggle
-                            checked={newsletter.show_badge}
-                            direction='rtl'
-                            label={
-                                <div className='flex flex-col gap-0.5'>
-                                    <span className='text-sm md:text-base'>Promote independent publishing</span>
-                                    <span className='text-[11px] leading-tight text-grey-700 md:text-xs md:leading-tight'>Show you’re a part of the indie publishing movement with a small badge in the footer</span>
-                                </div>
-                            }
-                            labelStyle='value'
-                            onChange={e => updateNewsletter({show_badge: e.target.checked})}
-                        />
-                    </Form>
-                </div>
-                <Separator />
                 <div className='mb-5 mt-10'>
                     {newsletter.status === 'active' ? (!onlyOne && <Button color='red' label='Archive newsletter' link onClick={confirmStatusChange} />) : <Button color='green' label='Reactivate newsletter' link onClick={confirmStatusChange} />}
                 </div>
@@ -488,6 +467,26 @@ const Sidebar: React.FC<{
                         onChange={html => updateNewsletter({footer_content: html})}
                     />
                 </Form>
+                <Separator />
+                <div className='my-5 flex w-full items-start'>
+                    <span>
+                        <Icon className='mr-2 mt-[-1px]' colorClass='text-red' name='heart'/>
+                    </span>
+                    <Form marginBottom={false}>
+                        <Toggle
+                            checked={newsletter.show_badge}
+                            direction='rtl'
+                            label={
+                                <div className='flex flex-col gap-0.5'>
+                                    <span className='text-sm md:text-base'>Promote independent publishing</span>
+                                    <span className='text-[11px] leading-tight text-grey-700 md:text-xs md:leading-tight'>Show you’re a part of the indie publishing movement with a small badge in the footer</span>
+                                </div>
+                            }
+                            labelStyle='value'
+                            onChange={e => updateNewsletter({show_badge: e.target.checked})}
+                        />
+                    </Form>
+                </div>
             </>
         }
     ];
diff --git a/apps/admin-x-settings/src/components/settings/email/newsletters/NewsletterPreviewContent.tsx b/apps/admin-x-settings/src/components/settings/email/newsletters/NewsletterPreviewContent.tsx
index 0bffd1434a..a7c36862e0 100644
--- a/apps/admin-x-settings/src/components/settings/email/newsletters/NewsletterPreviewContent.tsx
+++ b/apps/admin-x-settings/src/components/settings/email/newsletters/NewsletterPreviewContent.tsx
@@ -230,7 +230,7 @@ const NewsletterPreviewContent: React.FC<{
                             {showSubscriptionDetails && (
                                 <div className="border-b border-grey-200 py-8" style={{borderColor: secondaryBorderColor}}>
                                     <h4 className="mb-3 text-[1.2rem] uppercase tracking-wide" style={{color: titleColor}}>Subscription details</h4>
-                                    <p className="m-0 mb-4 text-base" style={{color: textColor}}>You are receiving this because you are a paid subscriber to The Local Host. Your subscription will renew on 17 Jul 2024.</p>
+                                    <p className="m-0 mb-4 text-base" style={{color: textColor}}>You are receiving this because you are a paid subscriber to {siteTitle}. Your subscription will renew on 17 Jul 2024.</p>
                                     <div className="flex">
                                         <div className="shrink-0 text-base">
                                             <p style={{color: textColor}}>Name: Jamie Larson</p>