From 8537239548cfe175e15f987f35377b001c1777f9 Mon Sep 17 00:00:00 2001
From: James Morris <moreofmorris@users.noreply.github.com>
Date: Mon, 31 Oct 2022 12:10:36 +0000
Subject: [PATCH] Moved the audience feedback setting into the footer

refs https://github.com/TryGhost/Team/issues/2191
---
 .../modals/newsletters/edit/design.hbs         | 18 ++++++++++++++++++
 .../modals/newsletters/edit/design.js          | 10 ++++++++++
 .../modals/newsletters/edit/settings.hbs       | 17 -----------------
 ghost/admin/app/styles/components/modals.css   |  4 ++++
 4 files changed, 32 insertions(+), 17 deletions(-)

diff --git a/ghost/admin/app/components/modals/newsletters/edit/design.hbs b/ghost/admin/app/components/modals/newsletters/edit/design.hbs
index 5f03c17b64..0877aaa898 100644
--- a/ghost/admin/app/components/modals/newsletters/edit/design.hbs
+++ b/ghost/admin/app/components/modals/newsletters/edit/design.hbs
@@ -173,6 +173,24 @@
             {{#liquid-if isOpen}}
                 <div class="modal-fullsettings-tab-expanded">
                     <div class="gh-stack">
+
+                        {{#if (feature "audienceFeedback")}}
+                            <GhFormGroup @classNames="gh-stack-item gh-setting gh-setting-extra">
+                                <label for="capture-feedback" class="modal-fullsettings-title" data-test-toggle="feedbackEnabled">Ask your readers for feedback</label>
+                                <div class="for-switch small">
+                                    <div class="container">
+                                        <input
+                                            type="checkbox"
+                                            id="capture-feedback"
+                                            checked={{@newsletter.feedbackEnabled}}
+                                            {{on "change" (fn this.onCheckboxChange "feedbackEnabled")}}
+                                        >
+                                        <button type="button" class="input-toggle-component" {{on "click" (fn this.toggleProperty "feedbackEnabled")}}></button>
+                                    </div>
+                                </div>
+                            </GhFormGroup>
+                        {{/if}}
+
                         <GhFormGroup @classNames="gh-stack-item">
                             <label class="modal-fullsettings-title">Email footer</label>
                             <KoenigBasicHtmlInput
diff --git a/ghost/admin/app/components/modals/newsletters/edit/design.js b/ghost/admin/app/components/modals/newsletters/edit/design.js
index 1efa24c0d0..19228e75b1 100644
--- a/ghost/admin/app/components/modals/newsletters/edit/design.js
+++ b/ghost/admin/app/components/modals/newsletters/edit/design.js
@@ -8,6 +8,16 @@ export default class EditNewsletterDesignForm extends Component {
 
     imageExtensions = IMAGE_EXTENSIONS;
 
+    @action
+    onCheckboxChange(property, event) {
+        this.args.newsletter[property] = event.target.checked;
+    }
+
+    @action
+    toggleProperty(property) {
+        this.args.newsletter[property] = !this.args.newsletter[property];
+    }
+
     @action
     imageUploaded(property, images) {
         if (images[0]) {
diff --git a/ghost/admin/app/components/modals/newsletters/edit/settings.hbs b/ghost/admin/app/components/modals/newsletters/edit/settings.hbs
index 72a0df9f6e..877118732e 100644
--- a/ghost/admin/app/components/modals/newsletters/edit/settings.hbs
+++ b/ghost/admin/app/components/modals/newsletters/edit/settings.hbs
@@ -114,23 +114,6 @@
                                 </div>
                             </div>
                         </GhFormGroup>
-
-                        {{#if (feature "audienceFeedback")}}
-                            <GhFormGroup @classNames="gh-stack-item gh-setting">
-                                <label for="capture-feedback" class="modal-fullsettings-title" data-test-toggle="feedbackEnabled">Ask your readers for feedback</label>
-                                <div class="for-switch small">
-                                    <div class="container">
-                                        <input
-                                            type="checkbox"
-                                            id="capture-feedback"
-                                            checked={{@newsletter.feedbackEnabled}}
-                                            {{on "change" (fn this.onCheckboxChange "feedbackEnabled")}}
-                                        >
-                                        <button type="button" class="input-toggle-component" {{on "click" (fn this.toggleProperty "feedbackEnabled")}}></button>
-                                    </div>
-                                </div>
-                            </GhFormGroup>
-                        {{/if}}
                     </div>
                 </div>
             {{/liquid-if}}
diff --git a/ghost/admin/app/styles/components/modals.css b/ghost/admin/app/styles/components/modals.css
index c2e4e97c53..033c9a2dd9 100644
--- a/ghost/admin/app/styles/components/modals.css
+++ b/ghost/admin/app/styles/components/modals.css
@@ -694,6 +694,10 @@
     padding: 12px 0;
 }
 
+.modal-fullsettings-tab-expanded .gh-setting.gh-setting-extra {
+    padding-bottom: 24px;
+}
+
 .modal-fullsettings-form-labs .for-checkbox .input-toggle-component {
     background: var(--white);
 }