Add Tips and donations section to Membership settings (#17497)

refs https://github.com/TryGhost/Product/issues/3561

- Added a static section to Membership settings with a button to copy
the Tips & donations Stripe link
- Added a `tipsAndDonations` feature flag

ghost/admin/app/components/settings/signup-form-embed.hbs

@@ -12,5 +12,19 @@
                 </button>
             </div>
         </div>
+        {{#if (feature "tipsAndDonations")}}
+        <div class="gh-expandable-block">
+            <div class="gh-expandable-header">
+                <div>
+                    <h4 class="gh-expandable-title">Tips & donations</h4>
+                    <p class="gh-expandable-description">Give your audience a one-time way to support your work</p>
+                </div>
+                <GhTaskButton @buttonText="Copy link" @successText="Link copied" @task={{this.copyTipsAndDonationsLink}} @class="gh-btn gh-btn-icon"/>
+            </div>
+        </div>
+        {{/if}}
     </div>
 </section>
+
+    
+

ghost/admin/app/components/settings/signup-form-embed.js

@@ -2,6 +2,7 @@ import Component from '@glimmer/component';
 import SignupFormEmbedModal from '../../components/modals/settings/signup-form-embed';
 import {action} from '@ember/object';
 import {inject as service} from '@ember/service';
+import {task, timeout} from 'ember-concurrency';
 
 export default class SignupFormEmbed extends Component {
     @service modals;
@@ -11,4 +12,10 @@ export default class SignupFormEmbed extends Component {
     open() {
         this.modals.open(SignupFormEmbedModal, {}, {});
     }
+
+    @task
+    *copyTipsAndDonationsLink() {
+        yield timeout(10);
+        return true;
+    }
 }

ghost/admin/app/services/feature.js

@@ -79,6 +79,7 @@ export default class FeatureService extends Service {
     @feature('collectionsCard') collectionsCard;
     @feature('headerUpgrade') headerUpgrade;
     @feature('importMemberTier') importMemberTier;
+    @feature('tipsAndDonations') tipsAndDonations;
 
     _user = null;
 

ghost/admin/app/templates/settings/labs.hbs

@@ -380,6 +380,20 @@
                         </div>
                     </div>
                 </div>
+
+                <div class="gh-expandable-block">
+                    <div class="gh-expandable-header">
+                        <div>
+                            <h4 class="gh-expandable-title">Tips & donations</h4>
+                            <p class="gh-expandable-description">
+                                Enables publishers to collect one-time payments
+                            </p>
+                        </div>
+                        <div class="for-switch">
+                            <GhFeatureFlag @flag="tipsAndDonations" />
+                        </div>
+                    </div>
+                </div>
             </div>
         </div>
         {{/if}}

ghost/core/core/shared/labs.js

@@ -43,7 +43,8 @@ const ALPHA_FEATURES = [
     'mailEvents',
     'collectionsCard',
     'headerUpgrade',
-    'importMemberTier'
+    'importMemberTier',
+    'tipsAndDonations'
 ];
 
 module.exports.GA_KEYS = [...GA_FEATURES];