@extends('app.shell')

@section('body')
  @php
    /** @var \Illuminate\Support\Collection<int, \App\Models\Activity> $activities */
    /** @var \App\Models\Person|null $mePerson */
    $locale = app()->getLocale();
    $displayCurrency = request()->user()?->profile?->currency ?: 'USD';
  @endphp

  <div class="min-h-screen safe-bottom animate-fade-in">
    <div class="app-page-wrap pt-14 md:pt-6 lg:pt-8 pb-6 md:pb-8 space-y-4">
      <h1 class="text-[28px] font-bold text-foreground tracking-tight">{{ __('Activity') }}</h1>

      @if ($activities->count() === 0)
        <div class="text-center py-16 space-y-4">
          <div class="w-16 h-16 rounded-2xl bg-primary/10 flex items-center justify-center mx-auto">
            <x-lucide-clock class="w-7 h-7 text-primary" />
          </div>
          <div>
            <p class="text-[17px] font-semibold text-foreground">{{ __('No activity yet') }}</p>
            <p class="text-[14px] text-muted-foreground mt-1">{{ __('Add an expense to see it here.') }}</p>
          </div>
        </div>
      @else
        <div class="apple-card px-4">
          @foreach ($activities as $i => $a)
            <div>
              <x-list-row
                left-class="w-10 h-10 rounded-full bg-secondary flex items-center justify-center text-lg shrink-0"
                :show-chevron="false"
                class="px-0 py-0 rounded-none shadow-none bg-transparent"
              >
                <x-slot:left>{{ $a->user?->avatar ?? '🙂' }}</x-slot:left>

                <p class="text-[14px] text-foreground leading-snug">
                  <span class="font-semibold">
                    {{ ($mePerson && $a->user_person_id === $mePerson->id) ? __('You') : ($a->user?->name ?? __('Someone')) }}
                  </span>
                  <span class="text-muted-foreground">
                    {{ $a->description }}
                  </span>
                </p>
                <p class="text-[12px] text-muted-foreground mt-0.5">
                  @if ($a->list_name || $a->group_name)
                    <span>
                      {{ $a->list_name ?? $a->group_name }} ·
                    </span>
                  @endif
                  {{ optional($a->activity_at)->format('M j') }}
                </p>

                @if ($a->amount !== null)
                  <x-slot:right>
                    <p class="text-[15px] font-semibold text-foreground shrink-0 tabular-nums">
                      @php
                        $fmt = \App\Support\Money::formatConvertedWithOriginal((float) $a->amount, $displayCurrency, $displayCurrency, $locale);
                      @endphp
                      {{ $fmt['primary'] }}
                    </p>
                  </x-slot:right>
                @endif
              </x-list-row>

              @if ($i < $activities->count() - 1)
                <div class="subtle-divider ml-[52px]"></div>
              @endif
            </div>
          @endforeach
        </div>
      @endif
    </div>
  </div>
@endsection