<x-admin.layout title="Settings">
    @php
        $currencies = ['BDT', 'USD', 'EUR', 'GBP'];

        // [field, label, type, select options]
        $sections = [
            'company' => ['Company Details', 'bi-building', [
                ['company_name', 'Company name'], ['tagline', 'Tagline'], ['address', 'Address', 'textarea'],
                ['phone', 'Phone'], ['support_hours', 'Support hours'], ['email', 'Email', 'email'], ['currency', 'Currency', 'select', $currencies], ['timezone', 'Timezone'],
            ]],
            'payments' => ['Payment Setup', 'bi-credit-card', []],
            'email' => ['Email Setup', 'bi-envelope', [
                ['mailer', 'Mailer', 'select', ['log', 'smtp']], ['host', 'Host'], ['port', 'Port', 'number'], ['username', 'Username'], ['password', 'Password', 'secret'],
                ['encryption', 'Encryption', 'select', ['tls', 'ssl']], ['from_name', 'From name'], ['from_address', 'From address', 'email'],
            ]],
            'chat' => ['Chat', 'bi-chat-dots', [
                ['enabled', 'Enable chat', 'checkbox'], ['provider', 'Provider', 'select', ['internal', 'whatsapp', 'messenger']], ['support_handle', 'Support handle'],
                ['welcome_message', 'Welcome message', 'textarea'], ['offline_message', 'Offline message', 'textarea'],
            ]],
            'gtm' => ['GTM', 'bi-tags', [
                ['enabled', 'Enable Google Tag Manager', 'checkbox'], ['container_id', 'Container ID'], ['environment_auth', 'Environment auth'],
            ]],
            'pixel' => ['Facebook Pixel', 'bi-facebook', [
                ['enabled', 'Enable Pixel', 'checkbox'], ['pixel_id', 'Pixel ID'], ['conversions_api_enabled', 'Enable Conversions API', 'checkbox'], ['access_token', 'Access token', 'secret'],
            ]],
            'seo' => ['SEO', 'bi-search', [
                ['meta_title', 'Meta title'], ['meta_description', 'Meta description', 'textarea'], ['canonical_url', 'Canonical URL', 'url'],
                ['og_title', 'OpenGraph title'], ['og_description', 'OpenGraph description', 'textarea'], ['og_type', 'OpenGraph type'], ['robots_index', 'Allow search engines to index the site', 'checkbox'],
            ]],
            'geo' => ['GEO', 'bi-globe2', [
                ['default_country', 'Default country'], ['allowed_countries', 'Allowed countries (comma-separated)', 'list'], ['default_currency', 'Default currency', 'select', $currencies],
                ['supported_currencies', 'Supported currencies (comma-separated)', 'list'], ['default_timezone', 'Default timezone'],
            ]],
            'aeo' => ['AEO', 'bi-stars', [
                ['enabled', 'Enable AEO', 'checkbox'], ['brand_summary', 'Brand summary', 'textarea'], ['structured_schema_enabled', 'Publish structured data', 'checkbox'],
                ['ai_category_discovery_enabled', 'Enable AI category discovery', 'checkbox'], ['llms_txt_directives', 'llms.txt directives', 'textarea'],
            ]],
            'storefront' => ['Storefront', 'bi-shop', [
                ['product_slider_seconds', 'Recommended products slide every (seconds)', 'number', ['min' => 1, 'max' => \App\Services\SettingsService::PRODUCT_SLIDER_MAX_SECONDS, 'step' => 1, 'required' => 'required']],
                ['category_slider_value', 'Recommended categories slide every (1-60)', 'number', ['min' => 1, 'max' => \App\Services\SettingsService::CATEGORY_SLIDER_MAX, 'step' => 1, 'required' => 'required']],
                ['category_slider_unit', 'Unit for the categories slider', 'select', \App\Services\SettingsService::CATEGORY_SLIDER_UNITS],
                ['delivery_charge_inside_dhaka', 'Delivery charge inside Dhaka district (৳)', 'number', ['min' => 0, 'max' => \App\Services\SettingsService::DELIVERY_CHARGE_MAX, 'step' => '0.01', 'required' => 'required']],
                ['delivery_charge_sub_dhaka', 'Delivery charge Sub-Dhaka (৳)', 'number', ['min' => 0, 'max' => \App\Services\SettingsService::DELIVERY_CHARGE_MAX, 'step' => '0.01', 'required' => 'required']],
                ['delivery_charge_outside_dhaka', 'Delivery charge outside Dhaka district (৳)', 'number', ['min' => 0, 'max' => \App\Services\SettingsService::DELIVERY_CHARGE_MAX, 'step' => '0.01', 'required' => 'required']],
                ['free_delivery_min_order', 'Free delivery when the order is at least (৳, leave empty for never)', 'number', ['min' => 1, 'max' => 9999999999.99, 'step' => '0.01']],
                ['google_login_enabled', 'Google login (also needs GOOGLE_CLIENT_ID in .env)', 'checkbox', ['default' => true]],
                ['facebook_login_enabled', 'Facebook login (also needs FACEBOOK_CLIENT_ID in .env)', 'checkbox', ['default' => true]],
                ['guest_checkout_enabled', 'Guest checkout (off: shoppers must sign in to order)', 'checkbox', ['default' => true]],
                ['phone_required', 'Phone number required to place an order', 'checkbox', ['default' => true]],
            ]],
            'sms' => ['SMS', 'bi-phone', [
                ['enabled', 'Send order status SMS to customers', 'checkbox'],
                ['provider', 'SMS company (log = testing, writes to the log instead of sending)', 'select', \App\Services\Integrations\SmsService::PROVIDERS],
                ['api_key', 'API key / API token', 'secret'],
                ['sender_id', 'Sender ID (letters and numbers only)', 'text', ['maxlength' => 20, 'pattern' => '[A-Za-z0-9]+']],
            ]],
        ];

        $gateways = ['sslcommerz' => 'SSLCommerz', 'bkash' => 'bKash', 'nagad' => 'Nagad'];
    @endphp

    <div class="row g-3">
        <div class="col-12 col-lg-3">
            <div id="adminSettingsTabs" class="list-group sm-settings-nav" role="tablist">
                @foreach ($sections as $key => [$title, $icon])
                    <a @class(['list-group-item list-group-item-action', 'active' => $loop->first]) href="#{{ $key }}" data-bs-toggle="list" role="tab" aria-controls="{{ $key }}"><i class="bi {{ $icon }}" aria-hidden="true"></i> {{ $title }}</a>
                @endforeach
            </div>
        </div>

        <div class="col-12 col-lg-9">
            <div class="tab-content">
                @foreach ($sections as $key => [$title, $icon, $fields])
                    <section id="{{ $key }}" @class(['tab-pane', 'show active' => $loop->first]) role="tabpanel" aria-label="{{ $title }}">
                        <div class="card">
                            <div class="card-body">
                                <h2 class="h5">{{ $title }}</h2>

                                <form method="POST" action="{{ route('admin.settings.update', $key) }}">
                                    @csrf
                                    @method('PUT')

                                    @foreach ($fields as $field)
                                        @include('admin.settings.partials.field', ['section' => $key, 'name' => $field[0], 'label' => $field[1], 'type' => $field[2] ?? 'text', 'options' => $field[3] ?? []])
                                    @endforeach

                                    @if ($key === 'storefront')
                                        @php($subDistricts = (array) ($settings['storefront']['sub_dhaka_districts'] ?? []))
                                        <fieldset class="border rounded p-3 mb-3">
                                            <legend class="float-none w-auto px-2 fs-6">Sub-Dhaka districts</legend>
                                            <p class="form-text mt-0">Dhaka city areas are always Inside Dhaka, and the rest of Dhaka district (Savar, Keraniganj, Dhamrai, Dohar, Nawabganj) is always Sub-Dhaka. Tick any other district that should pay the Sub-Dhaka charge; the rest pay the outside charge.</p>
                                            {{-- Sent empty when nothing is ticked, so clearing every box is saved too. --}}
                                            <input type="hidden" name="sub_dhaka_districts" value="">
                                            <div class="row row-cols-2 row-cols-md-3 g-1">
                                                @foreach (\App\Services\CheckoutService::subDhakaChoices() as $district)
                                                    <div class="col">
                                                        <div class="form-check">
                                                            <input id="subDistrict-{{ Str::slug($district) }}" name="sub_dhaka_districts[]" type="checkbox" value="{{ $district }}" class="form-check-input" @checked(in_array($district, $subDistricts, true))>
                                                            <label class="form-check-label" for="subDistrict-{{ Str::slug($district) }}">{{ $district }}</label>
                                                        </div>
                                                    </div>
                                                @endforeach
                                            </div>
                                            @error('sub_dhaka_districts')
                                                <div class="invalid-feedback d-block">{{ $message }}</div>
                                            @enderror
                                            @error('sub_dhaka_districts.*')
                                                <div class="invalid-feedback d-block">{{ $message }}</div>
                                            @enderror
                                        </fieldset>
                                    @endif

                                    @if ($key === 'payments')
                                        <p class="text-body-secondary">Secrets are encrypted when saved. Leave a masked field as it is to keep the stored value.</p>

                                        @foreach ($gateways as $gateway => $gatewayName)
                                            <fieldset class="border rounded p-3 mb-3">
                                                <legend class="float-none w-auto px-2 fs-6">{{ $gatewayName }}</legend>
                                                @include('admin.settings.partials.field', ['section' => 'payments', 'name' => "{$gateway}.enabled", 'label' => "Enable {$gatewayName}", 'type' => 'checkbox'])
                                                @include('admin.settings.partials.field', ['section' => 'payments', 'name' => "{$gateway}.sandbox_mode", 'label' => 'Sandbox mode', 'type' => 'checkbox'])
                                                @include('admin.settings.partials.field', ['section' => 'payments', 'name' => "{$gateway}.store_id", 'label' => 'Store ID'])
                                                @include('admin.settings.partials.field', ['section' => 'payments', 'name' => "{$gateway}.public_key", 'label' => 'Public key'])
                                                @include('admin.settings.partials.field', ['section' => 'payments', 'name' => "{$gateway}.secret_key", 'label' => 'Secret key', 'type' => 'secret'])
                                                @include('admin.settings.partials.field', ['section' => 'payments', 'name' => "{$gateway}.webhook_secret", 'label' => 'Webhook secret', 'type' => 'secret'])
                                            </fieldset>
                                        @endforeach

                                        <fieldset class="border rounded p-3 mb-3">
                                            <legend class="float-none w-auto px-2 fs-6">Cash on Delivery (COD)</legend>
                                            @include('admin.settings.partials.field', ['section' => 'payments', 'name' => 'cod.enabled', 'label' => 'Enable COD', 'type' => 'checkbox'])
                                        </fieldset>
                                    @endif

                                    <button class="btn sm-btn-primary" type="submit">Save {{ $title }}</button>
                                </form>

                                @if ($key === 'email')
                                    <hr>
                                    <h3 class="h6">Send Test Email</h3>
                                    <form method="POST" action="{{ route('admin.settings.email.test') }}">
                                        @csrf
                                        <label class="form-label" for="settingsTestRecipient">Recipient</label>
                                        <div class="input-group">
                                            <input id="settingsTestRecipient" name="recipient_email" type="email" required @class(['form-control', 'is-invalid' => $errors->has('recipient_email')])>
                                            <button class="btn btn-outline-secondary" type="submit">Send Test Email</button>
                                        </div>
                                    </form>
                                @endif

                                @if ($key === 'sms')
                                    <hr>
                                    <h3 class="h6">Send Test SMS</h3>
                                    <p class="text-body-secondary small">Save the settings above first. With the log provider the SMS goes to the dated integrations log in storage/logs (integrations-YYYY-MM-DD.log) instead of a phone.</p>
                                    <form method="POST" action="{{ route('admin.settings.sms.test') }}">
                                        @csrf
                                        <label class="form-label" for="settingsTestPhone">Bangladeshi mobile number</label>
                                        <div class="input-group">
                                            <input id="settingsTestPhone" name="phone" type="tel" inputmode="tel" autocomplete="tel" maxlength="20" placeholder="01712345678" pattern="{{ \App\Http\Requests\Storefront\CheckoutRequest::PHONE_HTML_PATTERN }}" required @class(['form-control', 'is-invalid' => $errors->has('phone')])>
                                            <button class="btn btn-outline-secondary" type="submit">Send Test SMS</button>
                                        </div>
                                        @error('phone')
                                            <div class="invalid-feedback d-block">{{ $message }}</div>
                                        @enderror
                                    </form>
                                @endif
                            </div>
                        </div>
                    </section>
                @endforeach
            </div>
        </div>
    </div>
</x-admin.layout>