From 2fdb09df01603185ad22a347704142b937f22730 Mon Sep 17 00:00:00 2001
From: ValueOn AG <p.motsch@valueon.ch>
Date: Sun, 8 Feb 2026 13:28:35 +0100
Subject: [PATCH] admin views fixes

---
 src/config/pageRegistry.tsx           |  1 +
 src/pages/billing/BillingAdmin.tsx    | 21 ++++++++++++++++++---
 src/pages/billing/BillingDataView.tsx |  5 +----
 3 files changed, 20 insertions(+), 7 deletions(-)

diff --git a/src/config/pageRegistry.tsx b/src/config/pageRegistry.tsx
index 35785cc..c71ba73 100644
--- a/src/config/pageRegistry.tsx
+++ b/src/config/pageRegistry.tsx
@@ -61,6 +61,7 @@ export const PAGE_ICONS: Record<string, React.ReactNode> = {
   'page.admin.user-mandates': <FaUserTag />,
   'page.admin.feature-roles': <FaCube />,
   'page.admin.feature-instances': <FaCubes />,
+  'page.admin.featureInstances': <FaCubes />,
   'page.admin.feature-users': <FaUsersCog />,
   'page.admin.user-access-overview': <FaUserShield />,
   'page.admin.billing': <FaMoneyBillAlt />,
diff --git a/src/pages/billing/BillingAdmin.tsx b/src/pages/billing/BillingAdmin.tsx
index 1cddd88..8efb3cf 100644
--- a/src/pages/billing/BillingAdmin.tsx
+++ b/src/pages/billing/BillingAdmin.tsx
@@ -7,7 +7,7 @@
  * - Konten übersicht
  */
 
-import React, { useState, useEffect, useCallback } from 'react';
+import React, { useState, useEffect, useCallback, useMemo } from 'react';
 import { useBillingAdmin, type BillingSettings, type AccountSummary, type MandateUserSummary } from '../../hooks/useBilling';
 import { useAdminMandates } from '../../hooks/useMandates';
 import styles from './Billing.module.css';
@@ -321,16 +321,30 @@ const CreditAdder: React.FC<CreditAdderProps> = ({ settings, accounts, users, on
 
 interface AccountsOverviewProps {
   accounts: AccountSummary[];
+  users: MandateUserSummary[];
   loading: boolean;
 }
 
-const AccountsOverview: React.FC<AccountsOverviewProps> = ({ accounts, loading }) => {
+const AccountsOverview: React.FC<AccountsOverviewProps> = ({ accounts, users, loading }) => {
   const formatCurrency = (amount: number) => {
     return new Intl.NumberFormat('de-CH', {
       style: 'currency',
       currency: 'CHF'
     }).format(amount);
   };
+
+  // Build a lookup map: userId -> display name
+  const _userNameMap = useMemo(() => {
+    const map = new Map<string, string>();
+    for (const user of users) {
+      const displayName = user.displayName
+        || [user.firstName, user.lastName].filter(Boolean).join(' ')
+        || user.email
+        || user.id;
+      map.set(user.id, displayName);
+    }
+    return map;
+  }, [users]);
   
   if (loading) {
     return <div className={styles.loadingPlaceholder}>Lade Konten...</div>;
@@ -348,7 +362,7 @@ const AccountsOverview: React.FC<AccountsOverviewProps> = ({ accounts, loading }
           <div key={account.id} className={styles.accountCard}>
             <h4>{account.accountType === 'MANDATE' ? 'Mandanten-Konto' : 'Benutzer-Konto'}</h4>
             <div className={styles.accountInfo}>
-              {account.userId && <span>User: {account.userId}</span>}
+              {account.userId && <span>User: {_userNameMap.get(account.userId) || account.userId}</span>}
               <span>Guthaben: <strong>{formatCurrency(account.balance)}</strong></span>
               {account.creditLimit && <span>Limit: {formatCurrency(account.creditLimit)}</span>}
               <span>Status: {account.enabled ? 'Aktiv' : 'Deaktiviert'}</span>
@@ -414,6 +428,7 @@ export const BillingAdmin: React.FC = () => {
           
           <AccountsOverview 
             accounts={accounts}
+            users={users}
             loading={loading}
           />
         </>
diff --git a/src/pages/billing/BillingDataView.tsx b/src/pages/billing/BillingDataView.tsx
index 1f51613..f11360d 100644
--- a/src/pages/billing/BillingDataView.tsx
+++ b/src/pages/billing/BillingDataView.tsx
@@ -273,7 +273,6 @@ export const BillingDataView: React.FC = () => {
         params.month = month;
       }
       const response = await api.get('/api/billing/view/statistics', { params });
-      console.log('📊 View statistics response:', response.data);
       setViewStats(response.data);
     } catch (err: any) {
       console.error('Failed to load statistics:', err);
@@ -409,12 +408,10 @@ export const BillingDataView: React.FC = () => {
             )}
           </section>
 
-          {/* Usage Statistics via FormGeneratorReport */}
+          {/* Usage Statistics via FormGeneratorReport (no period selector - always full year) */}
           <section className={styles.section}>
             <FormGeneratorReport
               title="Nutzungsübersicht"
-              periodSelector={periodSelectorConfig}
-              onFilterChange={_handleStatsFilterChange}
               loading={statsLoading}
               sections={overviewSections}
               noDataMessage="Keine Statistiken verfügbar"