Fixed paid members showing up in post analytics hover (#24591)

ref
https://linear.app/ghost/issue/PROD-2377/analytics-growth-top-content-sources-shows-paid-related-columns

- In the main post list and Analytics top post list stats popup, paid
membership related columns are displayed in the Top Sources table even
though paid membership is turned off for the publication.
- In Analytics > Top Posts, the hover behaved similarly.
- Aligned display of labels between the two hovers.

---------

Co-authored-by: Steve Larson <[email protected]>

Author: peterzimon

apps/stats/src/views/Stats/Overview/components/TopPosts.tsx

@@ -168,14 +168,15 @@ const TopPosts: React.FC<TopPostsProps> = ({
                                                         metrics={[
                                                             {
                                                                 icon: <LucideIcon.User className='shrink-0 text-muted-foreground' size={16} strokeWidth={1.5} />,
-                                                                label: 'Free members',
+                                                                label: 'Free',
                                                                 metric: post.free_members > 0 ? `+${formatNumber(post.free_members)}` : '0'
                                                             },
-                                                            {
+                                                            // Only show paid members if paid members are enabled
+                                                            ...(appSettings?.paidMembersEnabled ? [{
                                                                 icon: <LucideIcon.CreditCard className='shrink-0 text-muted-foreground' size={16} strokeWidth={1.5} />,
-                                                                label: 'Paid members',
+                                                                label: 'Paid',
                                                                 metric: post.paid_members > 0 ? `+${formatNumber(post.paid_members)}` : '0'
-                                                            }
+                                                            }] : [])
                                                         ]}
                                                         title='New members'
                                                     />

ghost/admin/app/components/posts-list/list-item-analytics.hbs

@@ -285,19 +285,21 @@
                                     {{/if}}
                                 </span>
                             </div>
-                            <div class="metric">
-                                <div class="data">
-                                    {{svg-jar "analytics-paid-members"}}
-                                    Paid
+                            {{#if this.membersUtils.paidMembersEnabled}}
+                                <div class="metric">
+                                    <div class="data">
+                                        {{svg-jar "analytics-paid-members"}}
+                                        Paid
+                                    </div>
+                                    <span>
+                                        {{#if this.hasMemberData}}
+                                            {{format-number this.memberCounts.paid}}
+                                        {{else}}
+                                            0
+                                        {{/if}}
+                                    </span>
                                 </div>
-                                <span>
-                                    {{#if this.hasMemberData}}
-                                        {{format-number this.memberCounts.paid}}
-                                    {{else}}
-                                        0
-                                    {{/if}}
-                                </span>
-                            </div>
+                            {{/if}}
                         </div>
                     </div>
                         <div class="gh-post-list-analytics-metric" data-test-analytics-member-conversions>

ghost/admin/app/components/posts-list/list-item-analytics.js

@@ -7,6 +7,7 @@ import {tracked} from '@glimmer/tracking';
 
 export default class PostsListItemClicks extends Component {
     @service feature;
+    @service membersUtils;
     @service session;
     @service settings;
     @service postAnalytics;