@extends('layouts.admin')

@section('title', 'Settings')
@section('heading', 'Settings')

@section('content')
@php
    $icon = function (string $title): string {
        $t = strtolower($title);
        return match (true) {
            str_contains($t, 'contact'), str_contains($t, 'email'), str_contains($t, 'phone') => 'phone',
            str_contains($t, 'social') => 'users',
            str_contains($t, 'regist'), str_contains($t, 'legal'), str_contains($t, 'tax') => 'shield',
            str_contains($t, 'pay'), str_contains($t, 'donat') => 'heart',
            str_contains($t, 'seo'), str_contains($t, 'search') => 'search',
            str_contains($t, 'address'), str_contains($t, 'location') => 'pin',
            default => 'cog',
        };
    };
@endphp
<header class="rhead rhead--wide">
    <div class="rhead__id">
        <span class="rhead__ico" aria-hidden="true"><svg class="i i--lg"><use href="#i-cog"/></svg></span>
        <div>
            <h2>Site settings</h2>
            <p>Contact details, registrations and impact numbers shown across your website.</p>
        </div>
    </div>
    <div class="rhead__act"><a class="btn btn--ghost btn--sm" href="{{ route('home') }}" target="_blank" rel="noopener"><svg class="i" aria-hidden="true"><use href="#i-external"/></svg>View website</a></div>
</header>

<div class="sgrid">
<nav class="snav" aria-label="Settings sections">
    <p class="snav__title">On this page</p>
    @foreach ($sections as $section)
        <a href="#sec-{{ \Illuminate\Support\Str::slug($section['title']) }}"><svg class="i" aria-hidden="true"><use href="#i-{{ $icon($section['title']) }}"/></svg>{{ $section['title'] }}</a>
    @endforeach
    <a href="#stats"><svg class="i" aria-hidden="true"><use href="#i-chart"/></svg>Impact numbers</a>
</nav>

<form class="settings" method="post" action="{{ route('admin.settings.update') }}" novalidate>
    @csrf @method('PUT')

    @foreach ($sections as $section)
        <section class="card panel panel--form spanel" id="sec-{{ \Illuminate\Support\Str::slug($section['title']) }}">
            <h2 class="spanel__h"><span class="spanel__ico" aria-hidden="true"><svg class="i"><use href="#i-{{ $icon($section['title']) }}"/></svg></span>{{ $section['title'] }}</h2>
            <div class="editor__grid">
                @foreach ($section['fields'] as $f)
                    @php
                        $err = $errors->first($f['key']);
                        $id = 's-'.$f['key'];
                        $val = old($f['key'], \App\Models\Setting::get($f['key'], ''));
                    @endphp
                    <div @class(['editor__cell', 'editor__cell--half' => ! empty($f['half'])])>
                        <div class="field @if($err) has-error @endif">
                            <label class="field__label" for="{{ $id }}">{{ $f['label'] }}</label>
                            @if ($f['type'] === 'textarea')
                                <textarea class="input input--area" id="{{ $id }}" name="{{ $f['key'] }}" rows="{{ $f['rows'] ?? 3 }}" aria-describedby="{{ $id }}-d">{{ $val }}</textarea>
                            @else
                                <input class="input" id="{{ $id }}" type="{{ $f['type'] }}" name="{{ $f['key'] }}" value="{{ $val }}" aria-describedby="{{ $id }}-d">
                            @endif
                            <div id="{{ $id }}-d">
                                @if (! empty($f['hint']))<p class="field__hint">{{ $f['hint'] }}</p>@endif
                                @if ($err)<p class="field__err">{{ $err }}</p>@endif
                            </div>
                        </div>
                    </div>
                @endforeach
            </div>
        </section>
    @endforeach

    <section class="card panel panel--form spanel" id="stats">
        <h2 class="spanel__h"><span class="spanel__ico" aria-hidden="true"><svg class="i"><use href="#i-chart"/></svg></span>Impact numbers</h2>
        <p class="muted">Shown on the home and Our Impact pages. Leave a row empty to hide it. Use real, verifiable figures.</p>
        <div class="statrows">
            @foreach ($stats as $i => $row)
                <fieldset class="statrow">
                    <legend class="sr-only">Number {{ $i + 1 }}</legend>
                    <div class="field @error("stats.$i.value") has-error @enderror">
                        <label class="field__label" for="st-v-{{ $i }}">Number</label>
                        <input class="input" id="st-v-{{ $i }}" type="number" inputmode="numeric" min="0" name="stats[{{ $i }}][value]" value="{{ old("stats.$i.value", $row['value'] ?? '') }}">
                    </div>
                    <div class="field">
                        <label class="field__label" for="st-s-{{ $i }}">Suffix</label>
                        <input class="input" id="st-s-{{ $i }}" type="text" maxlength="10" name="stats[{{ $i }}][suffix]" value="{{ old("stats.$i.suffix", $row['suffix'] ?? '') }}" placeholder="+">
                    </div>
                    <div class="field">
                        <label class="field__label" for="st-l-{{ $i }}">Label</label>
                        <input class="input" id="st-l-{{ $i }}" type="text" maxlength="40" name="stats[{{ $i }}][label]" value="{{ old("stats.$i.label", $row['label'] ?? '') }}" placeholder="Meals served">
                    </div>
                </fieldset>
            @endforeach
        </div>
    </section>

    <div class="editor__foot editor__foot--sticky">
        <button class="btn btn--green" type="submit"><svg class="i" aria-hidden="true"><use href="#i-check"/></svg>Save settings</button>
        <span class="muted sfoot">Changes go live on the website straight away.</span>
    </div>
</form>
</div>
@endsection