Profittabilità
Ore lavorate
{hours.toFixed(1)}h
Importo accettato
{accepted > 0 ? `€${accepted.toFixed(2)}` : "Non impostato"}
€/h reale
{realHourlyRate !== null ? `€${realHourlyRate.toFixed(2)}/h` : "—"}
€/h target
€{targetHourlyRate.toFixed(2)}/h
Costo ideale ({hours.toFixed(1)}h × €{targetHourlyRate}/h)
€{idealCost.toFixed(2)}
{hours > 0 && accepted > 0 && (
Delta (guadagno/perdita)
{deltaIsProfit ? "+" : ""}€{delta.toFixed(2)}
)}
{hours === 0 && (
Avvia il timer per iniziare a tracciare le ore.
)}
);
}
```
**C. Creare src/components/admin/tabs/TimerTab.tsx**
Il TimerTab mostra il timer (TimerCell) e la ProfitabilityCard. È un Client Component perché TimerCell è "use client".
```typescript
"use client";
import { TimerCell } from "@/components/admin/TimerCell";
import { ProfitabilityCard } from "@/components/admin/ProfitabilityCard";
type TimerTabProps = {
projectId: string;
acceptedTotal: string;
activeTimerEntryId: string | null;
activeTimerStartedAt: Date | null;
totalTrackedSeconds: number;
targetHourlyRate: number;
};
export function TimerTab({
projectId,
acceptedTotal,
activeTimerEntryId,
activeTimerStartedAt,
totalTrackedSeconds,
targetHourlyRate,
}: TimerTabProps) {
return (