Show non-billable status without statistic hours

frontend/src/views/StatisticsPage.tsx

@@ -31,11 +31,11 @@ type StatisticsPageProps = {
 };
 
 const trackedTextClass = "text-sky-700 dark:text-sky-300";
-const teamspaceTextClass = "text-emerald-700 dark:text-emerald-300";
+const teamspaceTextClass = "text-fuchsia-700 dark:text-fuchsia-300";
 const trackedFillClass = "fill-sky-500/70 dark:fill-sky-400/65";
-const teamspaceStrokeClass = "text-emerald-600 dark:text-emerald-300";
+const teamspaceStrokeClass = "text-fuchsia-600 dark:text-fuchsia-300";
 const trackedDotClass = "bg-sky-500 dark:bg-sky-400";
-const teamspaceDotClass = "bg-emerald-500 dark:bg-emerald-400";
+const teamspaceDotClass = "bg-fuchsia-500 dark:bg-fuchsia-400";
 const nonBillableTextClass = "text-indigo-700 dark:text-indigo-300";
 const openTextClass = "text-amber-700 dark:text-amber-300";
 const organizationPageSize = 8;
@@ -195,7 +195,6 @@ function buildMonthSeries(month: string, buckets: StatisticsDailyBucket[]) {
       sessions: bucket?.sessions ?? 0,
       totalMinutes: bucket?.total_minutes ?? 0,
       billedMinutes: bucket?.billed_minutes ?? 0,
-      nonBillableMinutes: bucket?.non_billable_minutes ?? 0,
       openMinutes: bucket?.open_minutes ?? 0,
       billedSessions: bucket?.billed_sessions ?? 0,
       nonBillableSessions: bucket?.non_billable_sessions ?? 0,
@@ -345,7 +344,7 @@ function TicketHotspot({ ticket, month, onNavigate }: { ticket: StatisticsTicket
         <div className="mt-1 flex flex-wrap gap-x-3 gap-y-1 text-xs">
           <span className={trackedTextClass}>Abgerechnet {formatMinutes(ticket.total_minutes)}</span>
           <span className={teamspaceTextClass}>Teamspace {formatMinutes(ticket.crm_billed_minutes)}</span>
-          <span className={nonBillableTextClass}>Nicht {formatMinutes(ticket.non_billable_minutes)}</span>
+          <span className={nonBillableTextClass}>Nicht {ticket.non_billable_sessions} Session(s)</span>
           <span className="text-muted-foreground">{ticket.billed_sessions} abgerechnet</span>
           <span>{ticket.active_days} Tag(e)</span>
           <span className={deltaTextClass(ticket.crm_delta_minutes)}>{formatTeamspaceDelta(ticket.crm_delta_minutes)}</span>
@@ -423,7 +422,6 @@ export function StatisticsPage({ onNavigate }: StatisticsPageProps) {
   const billedSessions = totals?.billedSessions ?? 0;
   const billedMinutes = totals?.billedMinutes ?? 0;
   const nonBillableSessions = totals?.nonBillableSessions ?? 0;
-  const nonBillableMinutes = totals?.nonBillableMinutes ?? 0;
   const openSessions = totals?.openSessions ?? 0;
   const openMinutes = totals?.openMinutes ?? 0;
   const crmCoverage = percentage(totals?.crmBilledMinutes ?? 0, totals?.minutes ?? 0);
@@ -492,10 +490,9 @@ export function StatisticsPage({ onNavigate }: StatisticsPageProps) {
         />
         <MetricCard
           label="Nicht abrechenbar"
-          value={formatMinutes(nonBillableMinutes)}
+          value={`${nonBillableSessions} Session(s)`}
           detail={
             <div className="space-y-0.5">
-              <div>{nonBillableSessions} Session(s)</div>
               <div>wird nicht kalkuliert</div>
             </div>
           }
@@ -546,7 +543,7 @@ export function StatisticsPage({ onNavigate }: StatisticsPageProps) {
               </div>
               <div className="grid gap-2 text-xs sm:grid-cols-3 xl:grid-cols-1 2xl:grid-cols-3">
                 <div className={trackedTextClass}>Abgerechnet: {billedSessions} Session(s), {formatMinutes(billedMinutes)}</div>
-                <div className={nonBillableTextClass}>Nicht: {nonBillableSessions} Session(s), {formatMinutes(nonBillableMinutes)}</div>
+                <div className={nonBillableTextClass}>Nicht: {nonBillableSessions} Session(s)</div>
                 <div className={openTextClass}>Offen: {openSessions} Session(s), {formatMinutes(openMinutes)}</div>
               </div>
             </div>
@@ -590,7 +587,7 @@ export function StatisticsPage({ onNavigate }: StatisticsPageProps) {
                 <p className="flex flex-wrap gap-x-3 gap-y-1 text-xs">
                   <span className={trackedTextClass}>Abgerechnet {formatMinutes(topOrganization.total_minutes)}</span>
                   <span className={teamspaceTextClass}>Teamspace {formatMinutes(topOrganization.crm_billed_minutes)}</span>
-                  <span className={nonBillableTextClass}>Nicht {formatMinutes(topOrganization.non_billable_minutes)}</span>
+                  <span className={nonBillableTextClass}>Nicht {topOrganization.non_billable_sessions} Session(s)</span>
                 </p>
               </div>
             ) : null}
@@ -650,7 +647,7 @@ export function StatisticsPage({ onNavigate }: StatisticsPageProps) {
                   <div className="flex flex-wrap gap-x-3 gap-y-1 text-xs">
                     <span className={trackedTextClass}>Abgerechnet {formatMinutes(organization.total_minutes)}</span>
                     <span className={teamspaceTextClass}>Teamspace {formatMinutes(organization.crm_billed_minutes)}</span>
-                    <span className={nonBillableTextClass}>Nicht {formatMinutes(organization.non_billable_minutes)}</span>
+                    <span className={nonBillableTextClass}>Nicht {organization.non_billable_sessions} Session(s)</span>
                     <span className="text-muted-foreground">{percentage(organization.total_minutes, totals?.minutes ?? 0)}% vom Monat</span>
                     <span className={deltaTextClass(organization.crm_delta_minutes)}>{formatTeamspaceDelta(organization.crm_delta_minutes)}</span>
                   </div>
@@ -723,7 +720,7 @@ export function StatisticsPage({ onNavigate }: StatisticsPageProps) {
                 </div>
                 <div className="grid grid-cols-3 gap-2 text-xs text-muted-foreground">
                   <span>Abr. {group.billed_sessions} / {formatMinutes(group.billed_minutes)}</span>
-                  <span>Nicht {group.non_billable_sessions} / {formatMinutes(group.non_billable_minutes)}</span>
+                  <span>Nicht {group.non_billable_sessions}</span>
                   <span>Offen {group.open_sessions} / {formatMinutes(group.open_minutes)}</span>
                 </div>
               </div>