From 18696a6ee4b91f369d5a4ed9d1243df80e5953e9 Mon Sep 17 00:00:00 2001
From: Peter Zimon <zimo@ghost.org>
Date: Wed, 5 May 2021 15:39:42 +0200
Subject: [PATCH] Added subscription count to member's product list

no refs.

- added subscription count to the product list in member details screen if there are multiple subscriptions for the given product. This is to make it clear and avoid confusion around the edge case when members have multiple subscriptions for the same product.
---
 .../app/components/gh-member-settings-form-cp.hbs      |  7 +++++--
 ghost/admin/app/styles/layouts/members.css             | 10 ++++++++++
 2 files changed, 15 insertions(+), 2 deletions(-)

diff --git a/ghost/admin/app/components/gh-member-settings-form-cp.hbs b/ghost/admin/app/components/gh-member-settings-form-cp.hbs
index 854b9d04a0..bf660ed77e 100644
--- a/ghost/admin/app/components/gh-member-settings-form-cp.hbs
+++ b/ghost/admin/app/components/gh-member-settings-form-cp.hbs
@@ -121,7 +121,10 @@
                 <div class="gh-main-section-content bordered">
                     <div class="gh-cp-memberproduct">
                         <h3 class="gh-memberproduct-name">
-                            {{product.name}}
+                            {{product.name}} 
+                            {{#unless (eq product.subscriptions.length 1    )}}
+                            <span class="gh-memberproduct-subcount">({{product.subscriptions.length}} subscriptions)</span>
+                            {{/unless}}
                         </h3>
                         {{#each product.subscriptions as |sub|}}
                         <div class="gh-memberproduct-subscription">
@@ -138,7 +141,7 @@
                                     <span class="gh-badge active">Active</span>
                                 {{/if}}
                             </div>
-                            <div>Created on {{sub.startDate}}</div>
+                            <div class="gh-memberproduct-created">Created on {{sub.startDate}}</div>
 
                             <span class="action-menu">
                                 <GhDropdownButton @dropdownName="subscription-menu-{{sub.id}}" @classNames="gh-btn gh-btn-outline gh-btn-icon only-has-icon" @title="User Actions">
diff --git a/ghost/admin/app/styles/layouts/members.css b/ghost/admin/app/styles/layouts/members.css
index c1b592eb71..5950bc68ed 100644
--- a/ghost/admin/app/styles/layouts/members.css
+++ b/ghost/admin/app/styles/layouts/members.css
@@ -1616,6 +1616,10 @@ p.gh-members-import-errordetail:first-of-type {
     border-top: 1px solid var(--whitegrey);
 }
 
+.gh-memberproduct-created {
+    margin-top: 1px;
+}
+
 .gh-memberproduct-archived .gh-memberproduct-name {
     opacity: 0.5;
 }
@@ -1687,4 +1691,10 @@ p.gh-members-import-errordetail:first-of-type {
 
 .gh-memberproduct-subscription .action-menu > .gh-btn svg {
     margin: 0;
+}
+
+.gh-memberproduct-subcount {
+    font-size: 1.4rem;
+    font-weight: 400;
+    color: var(--midgrey);
 }
\ No newline at end of file