@extends('app.shell')

@section('body')
  @php
    /** @var \App\Models\SharedPurchase $purchase */
    $locale = app()->getLocale();
    $displayCurrency = request()->user()?->profile?->currency ?: 'USD';
    $statusOptions = [
      ['value' => 'planning', 'label' => __('Planning')],
      ['value' => 'decided', 'label' => __('Decided')],
      ['value' => 'bought', 'label' => __('Bought')],
    ];
  @endphp

  <div class="min-h-screen safe-bottom animate-in-up">
    <div class="app-page-wrap pt-6 md:pt-6 lg:pt-8 pb-6 md:pb-8 space-y-6">
      <x-page-header title="{{ $purchase->emoji }} {{ $purchase->name }}" back />

      <p class="text-[13px] text-muted-foreground px-1">
        {{ $purchase->members->count() }} {{ __('members') }}
      </p>

      @if ($purchase->target_amount !== null && $purchase->target_amount > 0)
        <div class="apple-card px-4 py-4">
          <p class="text-[12px] text-muted-foreground uppercase tracking-wide">{{ __('Target') }}</p>
          <p class="text-[22px] font-semibold text-foreground mt-1 tabular-nums">
            @php
              $fmt = \App\Support\Money::formatConvertedWithOriginal((float) $purchase->target_amount, $displayCurrency, $displayCurrency, $locale);
            @endphp
            {{ $fmt['primary'] }}
          </p>
        </div>
      @endif

      <form method="POST" action="{{ route('app.shared-purchases.update', ['id' => $purchase->id]) }}" class="space-y-6">
        @csrf

        <div>
          <p class="section-header mb-2.5 px-1">{{ __('Status') }}</p>
          <div class="flex gap-2 flex-wrap">
            @foreach ($statusOptions as $opt)
              <button
                type="submit"
                name="status"
                value="{{ $opt['value'] }}"
                class="px-4 py-2.5 rounded-full text-[14px] font-medium transition-colors {{ $purchase->status === $opt['value'] ? 'bg-primary text-primary-foreground' : 'apple-card text-foreground' }}"
              >
                {{ $opt['label'] }}
              </button>
            @endforeach
          </div>
        </div>

        <div>
          <p class="section-header mb-2.5 px-1">{{ __('Notes') }}</p>
          <textarea
            name="notes"
            rows="4"
            placeholder="{{ __('Add notes...') }}"
            class="w-full apple-card-inset px-4 py-3.5 text-[15px] text-foreground placeholder:text-muted-foreground/50 outline-none focus:ring-2 focus:ring-primary/15 rounded-2xl resize-none"
          >{{ $purchase->notes }}</textarea>
          <x-primary-button variant="sheet" class="mt-3">
            {{ __('Save notes') }}
          </x-primary-button>
        </div>
      </form>
    </div>
  </div>
@endsection