Added feature flag for new admin-x settings

refs https://github.com/TryGhost/Team/issues/3151

- allows toggling route to new settings screen in react

Co-authored-by: Peter Zimon <zimo@ghost.org>

ghost/admin/app/components/gh-nav-menu/main.hbs

@@ -117,6 +117,11 @@
                             </li>
                         {{/if}}
                     {{/if}}
+                    {{#if (and (gh-user-can-admin this.session.user) (feature "adminXSettings"))}}
+                            <li>
+                                <LinkTo @route="settings-x" @current-when={{this.isSettingsRoute}} data-test-nav="settings">{{svg-jar "settings"}} AdminX Settings</LinkTo>
+                            </li>
+                    {{/if}}
                 </ul>
 
                 {{#if this.session.user.isOwnerOnly}}

ghost/admin/app/services/feature.js

@@ -76,6 +76,7 @@ export default class FeatureService extends Service {
     @feature('imageEditor') imageEditor;
     @feature('signupCard') signupCard;
     @feature('collections') collections;
+    @feature('adminXSettings') adminXSettings;
 
     _user = null;
 

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

@@ -218,9 +218,9 @@
                         <form>
                             <GhFormGroup>
                                 <label for="feedback-lexical">Have any issues? Feedback? Let us know below!</label>
-                                <GhTextarea 
+                                <GhTextarea
                                     @id="feedback-lexical"
-                                    @name="feedback-lexical" 
+                                    @name="feedback-lexical"
                                     @value={{this.feedbackMessage}}
                                     @placeholder="I've noticed that..."
                                     @shouldFocus={{true}}
@@ -228,7 +228,7 @@
                                 />
                             </GhFormGroup>
                         </form>
-                        <GhTaskButton 
+                        <GhTaskButton
                             @buttonText="Send feedback"
                             @task={{this.submitFeedback}}
                             @class="gh-btn gh-btn-black gh-btn-icon"
@@ -396,6 +396,20 @@
                         </div>
                     </div>
                 </div>
+
+                <div class="gh-expandable-block">
+                    <div class="gh-expandable-header">
+                        <div>
+                            <h4 class="gh-expandable-title">Admin X</h4>
+                            <p class="gh-expandable-description">
+                                Enables Admin X, the new admin UI for Ghost
+                            </p>
+                        </div>
+                        <div class="for-switch">
+                            <GhFeatureFlag @flag="adminXSettings" />
+                        </div>
+                    </div>
+                </div>
             </div>
         </div>
         {{/if}}

ghost/core/core/shared/labs.js

@@ -42,7 +42,8 @@ const ALPHA_FEATURES = [
     'postDiffing',
     'imageEditor',
     'signupCard',
-    'collections'
+    'collections',
+    'adminXSettings'
 ];
 
 module.exports.GA_KEYS = [...GA_FEATURES];