Feature/improve users table (#291)

* Improve users table
  * Engagement / Day
  * Registration

* Update changelog

CHANGELOG.md

@@ -14,6 +14,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 ### Changed
 
 - Refactored the exchange rate service
+- Improved the users table in the admin control panel
 
 ## 1.37.0 - 13.08.2021
 

apps/api/src/app/admin/admin.service.ts

@@ -4,6 +4,7 @@ import { PrismaService } from '@ghostfolio/api/services/prisma.service';
 import { AdminData } from '@ghostfolio/common/interfaces';
 import { Injectable } from '@nestjs/common';
 import { Currency } from '@prisma/client';
+import { differenceInDays } from 'date-fns';
 
 @Injectable()
 export class AdminService {
@@ -87,8 +88,8 @@ export class AdminService {
     return null;
   }
 
-  private async getUsersWithAnalytics() {
-    return await this.prismaService.user.findMany({
+  private async getUsersWithAnalytics(): Promise<AdminData['users']> {
+    const usersWithAnalytics = await this.prismaService.user.findMany({
       orderBy: {
         Analytics: {
           updatedAt: 'desc'
@@ -115,5 +116,23 @@ export class AdminService {
         }
       }
     });
+
+    return usersWithAnalytics.map(
+      ({ _count, alias, Analytics, createdAt, id }) => {
+        const daysSinceRegistration =
+          differenceInDays(new Date(), createdAt) + 1;
+        const engagement = Analytics.activityCount / daysSinceRegistration;
+
+        return {
+          alias,
+          createdAt,
+          engagement,
+          id,
+          accountCount: _count.Account || 0,
+          lastActivity: Analytics.updatedAt,
+          transactionCount: _count.Order || 0
+        };
+      }
+    );
   }
 }

apps/client/src/app/pages/admin/admin-page.html

@@ -97,7 +97,7 @@
               <th class="mat-header-cell px-1 py-2 text-right" i18n>#</th>
               <th class="mat-header-cell px-1 py-2" i18n>User</th>
               <th class="mat-header-cell px-1 py-2 text-right" i18n>
-                Registration Date
+                Registration
               </th>
               <th class="mat-header-cell px-1 py-2 text-right" i18n>
                 Accounts
@@ -106,7 +106,7 @@
                 Transactions
               </th>
               <th class="mat-header-cell px-1 py-2 text-right" i18n>
-                Engagement
+                Engagement per Day
               </th>
               <th class="mat-header-cell px-1 py-2" i18n>Last Activitiy</th>
               <th class="mat-header-cell px-1 py-2"></th>
@@ -119,19 +119,19 @@
                 {{ userItem.alias || userItem.id }}
               </td>
               <td class="mat-cell px-1 py-2 text-right">
-                {{ userItem.createdAt | date: defaultDateFormat }}
+                {{ formatDistanceToNow(userItem.createdAt) }}
               </td>
               <td class="mat-cell px-1 py-2 text-right">
-                {{ userItem._count?.Account }}
+                {{ userItem.accountCount }}
               </td>
               <td class="mat-cell px-1 py-2 text-right">
-                {{ userItem._count?.Order }}
+                {{ userItem.transactionCount }}
               </td>
               <td class="mat-cell px-1 py-2 text-right">
-                {{ userItem.Analytics?.activityCount }}
+                {{ userItem.engagement | number: '1.0-0' }}
               </td>
               <td class="mat-cell px-1 py-2">
-                {{ formatDistanceToNow(userItem.Analytics?.updatedAt) }}
+                {{ formatDistanceToNow(userItem.lastActivity) }}
               </td>
               <td class="mat-cell px-1 py-2">
                 <button

libs/common/src/lib/interfaces/admin-data.interface.ts

@@ -4,12 +4,12 @@ export interface AdminData {
   transactionCount: number;
   userCount: number;
   users: {
+    accountCount: number;
     alias: string;
     createdAt: Date;
-    Analytics: {
-      activityCount: number;
-      updatedAt: Date;
-    };
+    engagement: number;
     id: string;
+    lastActivity: Date;
+    transactionCount: number;
   }[];
 }