@extends('layouts.app')

@section('content')

<x-slot name="header">
    <h2 class="font-semibold text-xl text-gray-800 leading-tight">
        {{ __('Profile') }}
    </h2>
</x-slot>

<div>
    <div class="max-w-7xl mx-auto py-10 sm:px-6 lg:px-8">
        @if (Laravel\Fortify\Features::canUpdateProfileInformation())
        <livewire:profile.update-profile-information-form />

        <x-section-border />
        @endif

        {{-- Interface language (users.language); applied by SetLocale middleware --}}
        <div class="mt-10 sm:mt-0">
            <div class="md:grid md:grid-cols-3 md:gap-6">
                <div class="md:col-span-1">
                    <h3 class="text-lg font-medium text-gray-900">{{ __('Interface Language') }}</h3>
                    <p class="mt-1 text-sm text-gray-600">{{ __('Choose the language used across the interface.') }}</p>
                </div>
                <div class="mt-5 md:mt-0 md:col-span-2">
                    <form method="POST" action="{{ route('set-language') }}"
                        class="bg-white shadow rounded-lg px-4 py-5 sm:p-6">
                        @csrf
                        <label for="language" class="block text-sm font-medium text-gray-700">{{ __('Language')
                            }}</label>
                        <select id="language" name="language"
                            class="mt-1 block w-full border-gray-300 rounded-md shadow-sm focus:border-indigo-500 focus:ring-indigo-500 sm:text-sm">
                            @foreach (config('app.supported_locales') as $code => $label)
                            <option value="{{ $code }}" @selected((auth()->user()->language ?? config('app.locale')) ===
                                $code)>{{ $label }}</option>
                            @endforeach
                        </select>
                        <div class="mt-4 text-right">
                            <button type="submit"
                                class="inline-flex items-center px-4 py-2 bg-gray-800 border border-transparent rounded-md font-semibold text-xs text-white uppercase tracking-widest hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-gray-500">
                                {{ __('Save') }}
                            </button>
                        </div>
                    </form>
                </div>
            </div>
        </div>

        <x-section-border />

        @if (Laravel\Fortify\Features::enabled(Laravel\Fortify\Features::updatePasswords()))
        <div class="mt-10 sm:mt-0">
            <livewire:profile.update-password-form />
        </div>

        <x-section-border />
        @endif

        @if (Laravel\Fortify\Features::canManageTwoFactorAuthentication())
        <div class="mt-10 sm:mt-0">
            <livewire:profile.two-factor-authentication-form />
        </div>

        <x-section-border />
        @endif

        <div class="mt-10 sm:mt-0">
            <livewire:profile.logout-other-browser-sessions-form />
        </div>

        @if (Laravel\Jetstream\Jetstream::hasAccountDeletionFeatures())
        <x-section-border />

        <div class="mt-10 sm:mt-0">
            <livewire:profile.delete-user-form />
        </div>
        @endif
    </div>
</div>

@endsection