From ee5aae8a90025dc06cb75866f8820e24cc7aed75 Mon Sep 17 00:00:00 2001
From: Kevin Ansfield <kevin@lookingsideways.co.uk>
Date: Wed, 26 Jan 2022 10:55:05 +0000
Subject: [PATCH] Switched member activity feed widget from email_recipients to
 events feed

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

- removed inclusion of `email_recipients` in member query when fetching member for display on the member details screen as it was only used for the activity feed
- added `<Member::ActivityFeed>` template-only component as a replacement for `<GhMemberActivityFeed>`
  - uses `members-event-fetcher` resource for consistency with main activity feed and dashboard widget. Allows for a template-only component because data fetching behaviour can be managed directly from the template rather than requiring a backing component
---
 .../components/gh-member-settings-form.hbs    | 12 ++++--
 .../app/components/member/activity-feed.hbs   | 38 +++++++++++++++++++
 ghost/admin/app/routes/member.js              |  7 +++-
 3 files changed, 52 insertions(+), 5 deletions(-)
 create mode 100644 ghost/admin/app/components/member/activity-feed.hbs

diff --git a/ghost/admin/app/components/gh-member-settings-form.hbs b/ghost/admin/app/components/gh-member-settings-form.hbs
index a1382c5c0b..a015165487 100644
--- a/ghost/admin/app/components/gh-member-settings-form.hbs
+++ b/ghost/admin/app/components/gh-member-settings-form.hbs
@@ -302,10 +302,14 @@
                 {{/if}}
             </div>
 
-            <GhMemberActivityFeed
-                @member={{this.member}}
-                @emailRecipients={{this.member.emailRecipients}}
-            />
+            {{#if (feature "membersActivityFeed")}}
+                <Member::ActivityFeed @member={{this.member}} />
+            {{else}}
+                <GhMemberActivityFeed
+                    @member={{this.member}}
+                    @emailRecipients={{this.member.emailRecipients}}
+                />
+            {{/if}}
         </div>
     </section>
 
diff --git a/ghost/admin/app/components/member/activity-feed.hbs b/ghost/admin/app/components/member/activity-feed.hbs
new file mode 100644
index 0000000000..bbaafe8c26
--- /dev/null
+++ b/ghost/admin/app/components/member/activity-feed.hbs
@@ -0,0 +1,38 @@
+{{#let (members-event-fetcher filter=(concat "data.member_id:" @member.id) pageSize=5) as |eventsFetcher|}}
+    {{#if eventsFetcher.data}}<h4 class="gh-main-section-header small bn">Member activity</h4>{{/if}}
+    <div class="gh-main-section-content bordered {{if eventsFetcher.data "" "mt8"}}">
+        <div class="gh-member-feed" ...attributes>
+            <div class="flex-auto flex flex-column items-stretch {{if eventsFetcher.data "justify-between" "h-100 justify-center"}}">
+                <div>
+                    {{#if eventsFetcher.isLoading}}
+                        <div class="relative h17"><GhLoadingSpinner class="h30" /></div>
+                    {{else if eventsFetcher.data}}
+                        {{#each eventsFetcher.data as |rawEvent|}}
+                            {{#let (parse-member-event rawEvent) as |event|}}
+                                <div class="gh-member-feed-row">
+                                    <span class="gh-member-feed-activity midgrey" data-tooltip={{capitalize (concat event.action " " event.object)}}>{{svg-jar event.icon class=event.iconClass}}</span>
+                                    {{#if event.email}}
+                                        <GhEmailPreviewLink @data={{event.email}} class="gh-member-feed-title" />
+                                    {{else}}
+                                        <span class="gh-member-feed-title">{{event.action}} {{event.object}}</span>
+                                    {{/if}}
+                                    <span class="gh-member-feed-date">{{moment-format event.timestamp "D MMM YYYY"}}</span>
+                                </div>
+                            {{/let}}
+                        {{/each}}
+
+                        <LinkTo class="gh-btn gh-member-btn-expandfeed" @route="members-activity" @query={{hash excludedEvents=null member=@member.id}}><span>View all activity</span></LinkTo>
+                    {{else}}
+                        <div class="gh-members-no-data gh-members-no-list">
+                            <div class="lightgrey">{{svg-jar "no-data-list"}}</div>
+                            <h4>Member activity</h4>
+                            <p>
+                                All events related to this member will be shown here.
+                            </p>
+                        </div>
+                    {{/if}}
+                </div>
+            </div>
+        </div>
+    </div>
+{{/let}}
\ No newline at end of file
diff --git a/ghost/admin/app/routes/member.js b/ghost/admin/app/routes/member.js
index 80dd9fb110..8543a88c90 100644
--- a/ghost/admin/app/routes/member.js
+++ b/ghost/admin/app/routes/member.js
@@ -3,6 +3,7 @@ import {action} from '@ember/object';
 import {inject as service} from '@ember/service';
 
 export default class MembersRoute extends AdminRoute {
+    @service feature;
     @service router;
 
     _requiresBackgroundRefresh = true;
@@ -18,7 +19,11 @@ export default class MembersRoute extends AdminRoute {
         this._requiresBackgroundRefresh = false;
 
         if (params.member_id) {
-            return this.store.queryRecord('member', {id: params.member_id, include: 'email_recipients,products'});
+            if (this.feature.membersActivityFeed) {
+                return this.store.queryRecord('member', {id: params.member_id, include: 'products'});
+            } else {
+                return this.store.queryRecord('member', {id: params.member_id, include: 'email_recipients,products'});
+            }
         } else {
             return this.store.createRecord('member');
         }