view data fixes

apps/website/lib/view-models/AnalyticsMetricsViewModel.test.ts

@@ -1,14 +1,17 @@
 import { describe, it, expect } from 'vitest';
 import { AnalyticsMetricsViewModel } from './AnalyticsMetricsViewModel';
+import { AnalyticsMetricsViewData } from '../view-data/AnalyticsMetricsViewData';
 
 describe('AnalyticsMetricsViewModel', () => {
-  it('maps raw metrics fields from data', () => {
-    const vm = new AnalyticsMetricsViewModel({
+  it('maps metrics fields from AnalyticsMetricsViewData', () => {
+    const viewData: AnalyticsMetricsViewData = {
       pageViews: 1234,
       uniqueVisitors: 567,
       averageSessionDuration: 180,
       bounceRate: 42.5,
-    });
+    };
+
+    const vm = new AnalyticsMetricsViewModel(viewData);
 
     expect(vm.pageViews).toBe(1234);
     expect(vm.uniqueVisitors).toBe(567);
@@ -16,36 +19,42 @@ describe('AnalyticsMetricsViewModel', () => {
     expect(vm.bounceRate).toBe(42.5);
   });
 
-  it('formats counts using locale formatting helpers', () => {
-    const vm = new AnalyticsMetricsViewModel({
+  it('formats counts using NumberDisplay', () => {
+    const viewData: AnalyticsMetricsViewData = {
       pageViews: 1200,
       uniqueVisitors: 3500,
       averageSessionDuration: 75,
       bounceRate: 10,
-    });
+    };
 
-    expect(vm.formattedPageViews).toBe((1200).toLocaleString());
-    expect(vm.formattedUniqueVisitors).toBe((3500).toLocaleString());
+    const vm = new AnalyticsMetricsViewModel(viewData);
+
+    expect(vm.formattedPageViews).toBe('1,200');
+    expect(vm.formattedUniqueVisitors).toBe('3,500');
   });
 
-  it('formats session duration as mm:ss', () => {
-    const vm = new AnalyticsMetricsViewModel({
+  it('formats session duration using DurationDisplay', () => {
+    const viewData: AnalyticsMetricsViewData = {
       pageViews: 0,
       uniqueVisitors: 0,
       averageSessionDuration: 125,
       bounceRate: 0,
-    });
+    };
 
-    expect(vm.formattedSessionDuration).toBe('2:05');
+    const vm = new AnalyticsMetricsViewModel(viewData);
+
+    expect(vm.formattedSessionDuration).toBe('2:05.000');
   });
 
-  it('formats bounce rate as percentage with one decimal', () => {
-    const vm = new AnalyticsMetricsViewModel({
+  it('formats bounce rate using PercentDisplay', () => {
+    const viewData: AnalyticsMetricsViewData = {
       pageViews: 0,
       uniqueVisitors: 0,
       averageSessionDuration: 0,
-      bounceRate: 37.345,
-    });
+      bounceRate: 0.37345,
+    };
+
+    const vm = new AnalyticsMetricsViewModel(viewData);
 
     expect(vm.formattedBounceRate).toBe('37.3%');
   });