<div class="orders-dashboard">
  <div class="orders-dashboard__metrics">
    <app-dashboard-metric labelKey="adminOrders.ordersToday" [value]="stats().ordersToday.toString()" />
    <app-dashboard-metric labelKey="adminOrders.status.pending" [value]="stats().pending.toString()" />
    <app-dashboard-metric labelKey="adminOrders.paidCount" [value]="stats().paid.toString()" />
    <app-dashboard-metric labelKey="adminOrders.status.cancelled" [value]="stats().cancelled.toString()" />
    <app-dashboard-metric labelKey="adminOrders.status.refunded" [value]="stats().refunded.toString()" />
    <app-dashboard-metric labelKey="adminOrders.customersCount" [value]="stats().customers.toString()" />
    <app-dashboard-metric labelKey="adminOrders.returningCustomers" [value]="stats().returningCustomers.toString()" />
    <app-dashboard-metric labelKey="adminOrders.averageOrder" [value]="stats().averageOrder + ' ' + stats().currency" />
  </div>

  @if (stats().alerts.length > 0) {
    <app-card padding="sm" class="orders-dashboard__alerts">
      @for (alert of stats().alerts; track alert.labelKey) {
        <app-badge variant="warning">{{ alert.count }} — {{ alert.labelKey | translate }}</app-badge>
      }
    </app-card>
  }

  <app-card padding="sm" class="orders-dashboard__activity">
    <h4>{{ 'adminOrders.recentActivity' | translate }}</h4>
    @if (stats().recentActivity.length === 0) {
      <p>{{ 'adminOrders.noRecentActivity' | translate }}</p>
    } @else {
      <ul>
        @for (entry of stats().recentActivity; track entry.timestamp + entry.orderId) {
          <li>{{ entry.timestamp | date:'short' }} — {{ entry.orderNumber }} — {{ activityText(entry) }}</li>
        }
      </ul>
    }
  </app-card>
</div>
