Added some basic prototype toggles

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

ghost/admin/app/components/dashboard/dashboard-v5.hbs

@@ -1 +1,94 @@
-Dashboard 5.0 is active, but not yet implemented
+<section class="gh-dashboard-area lw-banner">
+    Dashboard 5.0 is active, but not yet implemented
+</section>
+
+{{#if this.areMembersEnabled}}
+    <section>
+        These are members related graphs
+    </section>
+
+    {{#if this.hasPaidTiers}}
+        <section>
+            These are some paid members related graphs
+        </section>
+    {{/if}}
+{{/if}}
+
+{{#if this.areNewslettersEnabled}}
+    <section>
+        These are newsletter related graphs
+    </section>
+{{/if}}
+
+<div class="gh-main-section">
+    <h4 class="gh-main-section-header small bn">Prototype control panel</h4>
+    <div class="gh-expandable">
+        <div class="gh-expandable-block">
+            <div class="gh-expandable-header">
+                <div>
+                    <h4 class="gh-expandable-title">Has paid tiers</h4>
+                    <p class="gh-expandable-description">
+                        Paid memberships
+                    </p>
+                </div>
+                <div class="for-switch">
+                    <label class="switch">
+                        <input type="checkbox" checked={{this.mockPaidTiers}} id="mockPaidTiers" onclick={{action (mut this.mockPaidTiers) value="target.checked"}}>
+                        <span class="input-toggle-component"></span>
+                    </label>
+                </div>
+            </div>
+        </div>
+
+        <div class="gh-expandable-block">
+            <div class="gh-expandable-header">
+                <div>
+                    <h4 class="gh-expandable-title">Stripe connected</h4>
+                    <p class="gh-expandable-description">
+                        Mock that Stripe is enabled
+                    </p>
+                </div>
+                <div class="for-switch">
+                    <label class="switch">
+                        <input type="checkbox" checked={{this.mockStripeEnabled}} id="stripeEnabled" onclick={{action (mut this.mockStripeEnabled) value="target.checked"}}>
+                        <span class="input-toggle-component"></span>
+                    </label>
+                </div>
+            </div>
+        </div>
+
+        <div class="gh-expandable-block">
+            <div class="gh-expandable-header">
+                <div>
+                    <h4 class="gh-expandable-title">Newsletters enabled</h4>
+                    <p class="gh-expandable-description">
+                        All email related charts shown
+                    </p>
+                </div>
+                <div class="for-switch">
+                    <label class="switch">
+                        <input type="checkbox" checked={{this.mockNewslettersEnabled}} id="mockNewslettersEnabled" onclick={{action (mut this.mockNewslettersEnabled) value="target.checked"}}>
+                        <span class="input-toggle-component"></span>
+                    </label>
+                </div>
+            </div>
+        </div>
+
+        <div class="gh-expandable-block">
+            <div class="gh-expandable-header">
+                <div>
+                    <h4 class="gh-expandable-title">Members enabled</h4>
+                    <p class="gh-expandable-description">
+                        Setting subscription access to other value than 'Nobody'
+                    </p>
+                </div>
+                <div class="for-switch">
+                    <label class="switch">
+                        <input type="checkbox" checked={{this.mockMembersEnabled}} id="mockMembersEnabled" onclick={{action (mut this.mockMembersEnabled) value="target.checked"}}>
+                        <span class="input-toggle-component"></span>
+                    </label>
+                </div>
+            </div>
+        </div>
+    </div>
+</div>

ghost/admin/app/components/dashboard/dashboard-v5.js

@@ -1,4 +1,25 @@
 import Component from '@glimmer/component';
+import {tracked} from '@glimmer/tracking';
 
 export default class DashboardDashboardV5Component extends Component {
+    @tracked mockPaidTiers = true;
+    @tracked mockStripeEnabled = true;
+    @tracked mockNewslettersEnabled = true;
+    @tracked mockMembersEnabled = true;
+
+    get hasPaidTiers() {
+        return this.mockPaidTiers;
+    }
+
+    get isStripeEnabled() {
+        return this.mockStripeEnabled;
+    }    
+
+    get areNewslettersEnabled() {
+        return this.mockNewslettersEnabled;
+    }
+
+    get areMembersEnabled() {
+        return this.mockMembersEnabled;
+    }
 }

ghost/admin/app/templates/dashboard.hbs

@@ -5,11 +5,10 @@
         </h2>
     </GhCanvasHeader>
 
-
-    <div class="view-container gh-dashboard">
-        {{#if (feature "dashboardV5")}}
-            <Dashboard::DashboardV5 />
-        {{else}}
+    {{#if (feature "dashboardV5")}}
+        <Dashboard::DashboardV5 />
+    {{else}}
+        <div class="view-container gh-dashboard">
             {{#if (and this.session.user.isOwnerOnly (not this.settings.editorIsLaunchComplete) (not (feature "improvedOnboarding")))}}
                 <section class="gh-dashboard-area lw-banner">
                     <div class="gh-lw-banner" style="background-image:url(assets/img/launch-wizard-bg.png);">
@@ -206,6 +205,6 @@
                 </div>
                 {{/if}}
             </section>
-        {{/if}}
-    </div>
+        </div>
+    {{/if}}
 </section>