From 4b3fc52cf00b8f071c54408af8298e25107ec02e Mon Sep 17 00:00:00 2001
From: Kevin Ansfield <kevin@lookingsideways.co.uk>
Date: Tue, 18 Jan 2022 15:16:22 +0000
Subject: [PATCH] Extracted dashboard member activity into separate component

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

- first step of further refactoring to make member activity display more generic
- separates component data loading from overall controller logic and allows it to be tested in integration tests as well as acceptance tests
---
 .../dashboard/latest-member-activity.hbs      | 25 ++++++++++
 .../dashboard/latest-member-activity.js       | 46 +++++++++++++++++++
 ghost/admin/app/controllers/dashboard.js      | 16 -------
 ghost/admin/app/templates/dashboard.hbs       | 26 +----------
 4 files changed, 72 insertions(+), 41 deletions(-)
 create mode 100644 ghost/admin/app/components/dashboard/latest-member-activity.hbs
 create mode 100644 ghost/admin/app/components/dashboard/latest-member-activity.js

diff --git a/ghost/admin/app/components/dashboard/latest-member-activity.hbs b/ghost/admin/app/components/dashboard/latest-member-activity.hbs
new file mode 100644
index 0000000000..df66b45276
--- /dev/null
+++ b/ghost/admin/app/components/dashboard/latest-member-activity.hbs
@@ -0,0 +1,25 @@
+{{#if this.shouldDisplay}}
+    <div class="gh-dashboard-box grey activity-feed" data-test-dashboard-member-activity>
+        <h4 class="gh-dashboard-header">Activity feed</h4>
+        <div class="content">
+            {{#if this.eventsLoading}}
+                Loading...
+            {{else}}
+                {{#if this.eventsError}}
+                    <p class="error">
+                        There was an error loading events
+                        <code>{{this.eventsError.message}}</code>
+                    </p>
+                {{else}}
+                    <GhEventTimeline @events={{this.eventsData}}/>
+
+                    {{#if (feature "membersActivityFeed")}}
+                        <div class="gh-dashboard-top-members-footer">
+                            <LinkTo @route="members-activity">See all activity {{svg-jar "arrow-right"}}</LinkTo>
+                        </div>
+                    {{/if}}
+                {{/if}}
+            {{/if}}
+        </div>
+    </div>
+{{/if}}
\ No newline at end of file
diff --git a/ghost/admin/app/components/dashboard/latest-member-activity.js b/ghost/admin/app/components/dashboard/latest-member-activity.js
new file mode 100644
index 0000000000..7b088b9006
--- /dev/null
+++ b/ghost/admin/app/components/dashboard/latest-member-activity.js
@@ -0,0 +1,46 @@
+import Component from '@glimmer/component';
+import {inject as service} from '@ember/service';
+import {tracked} from '@glimmer/tracking';
+
+export default class DashboardLatestMemberActivityComponent extends Component {
+    @service membersActivity;
+    @service session;
+    @service settings;
+
+    @tracked eventsData = null;
+    @tracked eventsError = null;
+    @tracked eventsLoading = false;
+
+    get shouldDisplay() {
+        const isOwner = this.session.user?.isOwnerOnly;
+        const hasCompletedLaunchWizard = this.settings.get('editorIsLaunchComplete');
+
+        console.log(this.session.user, {isOwner, hasCompletedLaunchWizard});
+
+        if (isOwner && !hasCompletedLaunchWizard) {
+            return false;
+        }
+
+        return true;
+    }
+
+    constructor() {
+        super(...arguments);
+
+        if (this.shouldDisplay) {
+            this.loadEvents();
+        }
+    }
+
+    async loadEvents() {
+        try {
+            this.eventsLoading = true;
+            const {events} = await this.membersActivity.fetchTimeline({limit: 5});
+            this.eventsData = events;
+        } catch (error) {
+            this.eventsError = error;
+        } finally {
+            this.eventsLoading = false;
+        }
+    }
+}
diff --git a/ghost/admin/app/controllers/dashboard.js b/ghost/admin/app/controllers/dashboard.js
index ee91f54b4f..01128e21f8 100644
--- a/ghost/admin/app/controllers/dashboard.js
+++ b/ghost/admin/app/controllers/dashboard.js
@@ -13,10 +13,6 @@ export default class DashboardController extends Controller {
     @service settings;
     @service whatsNew;
 
-    @tracked eventsData = null;
-    @tracked eventsError = null;
-    @tracked eventsLoading = false;
-
     @tracked mrrStatsData = null;
     @tracked mrrStatsError = null;
     @tracked mrrStatsLoading = false;
@@ -48,7 +44,6 @@ export default class DashboardController extends Controller {
     }
 
     initialise() {
-        this.loadEvents();
         this.loadTopMembers();
         this.loadCharts();
         this.loadWhatsNew();
@@ -161,17 +156,6 @@ export default class DashboardController extends Controller {
         this.loadNewsletterOpenRates();
     }
 
-    loadEvents() {
-        this.eventsLoading = true;
-        this.membersActivity.fetchTimeline({limit: 5}).then(({events}) => {
-            this.eventsData = events;
-            this.eventsLoading = false;
-        }, (error) => {
-            this.eventsError = error;
-            this.eventsLoading = false;
-        });
-    }
-
     loadNewsletterOpenRates() {
         this.newsletterOpenRatesLoading = true;
         this.membersStats.fetchNewsletterStats().then((results) => {
diff --git a/ghost/admin/app/templates/dashboard.hbs b/ghost/admin/app/templates/dashboard.hbs
index a4532d8c54..1f02459661 100644
--- a/ghost/admin/app/templates/dashboard.hbs
+++ b/ghost/admin/app/templates/dashboard.hbs
@@ -281,31 +281,7 @@
                     </div>
                 {{/if}}
 
-                {{#unless (and this.session.user.isOwnerOnly (not this.settings.editorIsLaunchComplete))}}
-                    <div class="gh-dashboard-box grey activity-feed">
-                        <h4 class="gh-dashboard-header">Activity feed</h4>
-                        <div class="content">
-                            {{#if this.eventsLoading}}
-                                Loading...
-                            {{else}}
-                                {{#if this.eventsError}}
-                                    <p class="error">
-                                        There was an error loading events
-                                        <code>{{this.eventsError.message}}</code>
-                                    </p>
-                                {{else}}
-                                    <GhEventTimeline @events={{this.eventsData}}/>
-
-                                    {{#if (feature "membersActivityFeed")}}
-                                        <div class="gh-dashboard-top-members-footer">
-                                            <LinkTo @route="members-activity">See all activity {{svg-jar "arrow-right"}}</LinkTo>
-                                        </div>
-                                    {{/if}}
-                                {{/if}}
-                            {{/if}}
-                        </div>
-                    </div>
-                {{/unless}}
+                <Dashboard::LatestMemberActivity />
             {{/if}}
 
             {{#unless (or  whatsNewEntriesLoading whatsNewEntriesError)}}