@extends('layouts.app')

@php
    $currentUser = $user ?? Auth::user();

    $currentRole = (string) ($currentUser->role ?? '');
    $isAdminUser = \App\Support\WorkflowPermission::normalizeRole($currentRole) === \App\Support\WorkflowPermission::ROLE_ADMIN;
    $canManageBranding = \App\Support\WorkflowPermission::canUseAdminPermission(
        $currentRole,
        \App\Support\WorkflowPermission::ADMIN_PERMISSION_MANAGE_BRANDING
    );

    $settingsTabs = [
        'profile' => ['icon' => 'mdi mdi-account-outline', 'label' => 'Profile'],
    ];
    if ($isAdminUser) {
        $settingsTabs['general'] = ['icon' => 'mdi mdi-tune-variant', 'label' => 'General'];
    }
    if ($canManageBranding) {
        $settingsTabs['branding'] = ['icon' => 'mdi mdi-palette-outline', 'label' => 'Branding'];
    }

    $activeSettingsTab = (string) request()->query('tab', 'profile');
    if (!array_key_exists($activeSettingsTab, $settingsTabs)) {
        $activeSettingsTab = 'profile';
    }

    $settingsPageHeading = match ($activeSettingsTab) {
        'general' => __('General Settings'),
        'branding' => __('Branding'),
        default => __('Profile Settings'),
    };
    $settingsPageSubheading = match ($activeSettingsTab) {
        'general' => __('Configure system-wide settings.'),
        'branding' => __('Manage each logo and the browser favicon independently across the system.'),
        default => __('Identity details are managed securely by UHS Account. Your profile photo remains managed in DTS.'),
    };
@endphp

@section('title')
    {{ $settingsPageHeading }}
@endsection

@section('css')
    <meta name="turbo-cache-control" content="no-cache">
    <link href="{{ URL::asset('build/libs/sweetalert2/sweetalert2.min.css') }}" rel="stylesheet" type="text/css" />

    @include('profile.partials.settings-styles')
@endsection

@section('content')
    @php
        $displayRole = __(\App\Support\WorkflowPermission::roleLabelForAdmin((string) ($currentUser->role ?? 'user')));

        $rawOrganizationName = trim((string) ($currentUser->organization_name ?? ''));
        $displayOrganization = '';

        if ($rawOrganizationName !== '') {
            $locale = strtolower((string) app()->getLocale());
            $organizationRecord = \App\Models\Organization::where('name', $rawOrganizationName)->first();

            if ($organizationRecord) {
                $displayOrganization = $locale === 'kh' && trim((string) ($organizationRecord->name_kh ?? '')) !== ''
                    ? $organizationRecord->name_kh
                    : (trim((string) ($organizationRecord->name_en ?? '')) !== '' ? $organizationRecord->name_en : $rawOrganizationName);
            } else {
                $displayOrganization = $rawOrganizationName;
            }
        }

        $avatarUrl = $currentUser->avatarUrl();

        $displayFirstName = trim((string) ($currentUser->first_name ?? ''));
        $displayLastName = trim((string) ($currentUser->last_name ?? ''));
        $displayName = trim($displayFirstName . ' ' . $displayLastName);
        $displayInitial = mb_strtoupper(mb_substr($displayName !== '' ? $displayName : (string) ($currentUser->name ?? 'U'), 0, 1));
    @endphp

    <div class="dashboard-content-heading mb-3">
        <h4 class="mb-1 fw-semibold">{{ $settingsPageHeading }}</h4>
        <p class="mb-0 text-muted fs-13">{{ $settingsPageSubheading }}</p>
    </div>

    @if(count($settingsTabs) > 1)
        <ul class="nav nav-pills settings-subnav gap-2 mb-3">
            @foreach($settingsTabs as $settingsTabKey => $settingsTabMeta)
                <li class="nav-item">
                    <a class="nav-link {{ $activeSettingsTab === $settingsTabKey ? 'active' : '' }}"
                       href="{{ route('profile.settings', ['tab' => $settingsTabKey]) }}">
                        <i class="{{ $settingsTabMeta['icon'] }} me-1"></i>{{ __($settingsTabMeta['label']) }}
                    </a>
                </li>
            @endforeach
        </ul>
    @endif

    @if($isAdminUser && $activeSettingsTab === 'general')
        @include('profile.partials.general')
    @elseif($canManageBranding && $activeSettingsTab === 'branding')
        @include('profile.partials.branding')
    @else
    <div class="profile-settings-page">
        <form
            method="POST"
            action="{{ route('profile.settings.update') }}"
            enctype="multipart/form-data"
            autocomplete="off"
            id="profileSettingsForm"
            novalidate
        >
            @csrf

            <div class="row g-4">
                <div class="col-xl-4 col-lg-5">
                    <div class="card profile-summary-card">
                        <div class="profile-summary-top">
                            <div class="profile-avatar-wrap dropdown">
                                <button
                                    type="button"
                                    class="profile-avatar-menu-toggle"
                                    data-bs-toggle="dropdown"
                                    aria-expanded="false"
                                    aria-label="{{ __('Profile image options') }}"
                                >
                                    <img
                                        src="{{ $avatarUrl ?: '' }}"
                                        alt="{{ __('Profile Avatar') }}"
                                        class="profile-avatar-img {{ $avatarUrl ? '' : 'd-none' }}"
                                        id="profileAvatarPreview"
                                    >
                                    <span class="profile-avatar-empty {{ $avatarUrl ? 'd-none' : '' }}" id="profileAvatarEmpty">
                                        {{ $displayInitial }}
                                    </span>

                                    <span class="profile-avatar-edit">
                                        <i class="ri-camera-line"></i>
                                    </span>
                                </button>
                                <div class="dropdown-menu dropdown-menu-end profile-avatar-dropdown">
                                    <button type="button" class="dropdown-item" id="uploadProfileButton">
                                        <i class="ri-upload-cloud-2-line me-2"></i>{{ __('Upload Profile') }}
                                    </button>
                                    <button type="button" class="dropdown-item text-danger" id="removeProfileButton">
                                        <i class="ri-delete-bin-line me-2"></i>{{ __('Remove Profile') }}
                                    </button>
                                </div>
                            </div>

                            <div class="profile-summary-name">
                                {{ $displayName }}
                            </div>

                            <p class="profile-summary-role">
                                {{ $displayRole }}
                            </p>
                        </div>

                        <div class="profile-summary-body">
                            <div class="summary-row">
                                <div class="summary-label">{{ __('Email') }}</div>
                                <div class="summary-value">{{ $currentUser->email ?: '-' }}</div>
                            </div>

                            <div class="summary-row">
                                <div class="summary-label">{{ __('Role') }}</div>
                                <div class="summary-value">{{ $displayRole ?: '-' }}</div>
                            </div>

                            <div class="summary-row">
                                <div class="summary-label">{{ __('Organization') }}</div>
                                <div class="summary-value">{{ $displayOrganization !== '' ? $displayOrganization : '-' }}</div>
                            </div>

                            <div class="summary-row">
                                <div class="summary-label">{{ __('Created At') }}</div>
                                <div class="summary-value">{{ optional($currentUser->created_at)->format('Y-m-d H:i') ?: '-' }}</div>
                            </div>
                        </div>
                    </div>
                </div>

                <div class="col-xl-8 col-lg-7">
                    <div class="card profile-settings-section-card mb-4">
                        <div class="card-body p-4">
                            <div class="settings-card-header">
                                <h5 class="settings-card-title">{{ __('Identity Information') }}</h5>
                                <p class="settings-card-subtitle">{{ __('Name, email, role, and password are synchronized from Keycloak whenever you sign in.') }}</p>
                            </div>

                            <div class="alert alert-info d-flex align-items-start gap-2 mb-3" role="status">
                                <i class="ri-shield-user-line fs-20"></i>
                                <div>
                                    <div class="fw-semibold">{{ __('Managed by UHS Account') }}</div>
                                    <div class="fs-13">{{ __('Open Keycloak to update your name, email, or password. Sign out and sign in again to synchronize your changes to DTS.') }}</div>
                                </div>
                            </div>

                            <div class="row g-3">
                                <div class="col-md-6">
                                    <label for="first_name" class="form-label">{{ __('First Name') }}</label>
                                    <input
                                        type="text"
                                        id="first_name"
                                        name="first_name"
                                        class="form-control @error('first_name') is-invalid @enderror"
                                        value="{{ (string) ($currentUser->first_name ?? '') }}"
                                        readonly
                                    >

                                    @error('first_name')
                                        <span class="field-error-text">{{ $message }}</span>
                                    @enderror
                                </div>

                                <div class="col-md-6">
                                    <label for="last_name" class="form-label">{{ __('Last Name') }}</label>
                                    <input
                                        type="text"
                                        id="last_name"
                                        name="last_name"
                                        class="form-control @error('last_name') is-invalid @enderror"
                                        value="{{ (string) ($currentUser->last_name ?? '') }}"
                                        readonly
                                    >

                                    @error('last_name')
                                        <span class="field-error-text">{{ $message }}</span>
                                    @enderror
                                </div>

                                <div class="col-md-12">
                                    <label for="email" class="form-label">{{ __('Email') }}</label>
                                    <input
                                        type="email"
                                        id="email"
                                        name="email"
                                        class="form-control @error('email') is-invalid @enderror"
                                        value="{{ (string) ($currentUser->email ?? '') }}"
                                        readonly
                                    >

                                    @error('email')
                                        <span class="field-error-text">{{ $message }}</span>
                                    @enderror
                                </div>

                                <div class="col-12 d-none">
                                    <input type="hidden" id="remove_avatar" name="remove_avatar" value="0">
                                    <input
                                        type="file"
                                        id="avatar"
                                        name="avatar"
                                        accept="image/png,image/jpeg,image/jpg"
                                        class="@error('avatar') is-invalid @enderror"
                                    >
                                </div>

                                @error('avatar')
                                    <div class="col-12">
                                        <span class="field-error-text">{{ $message }}</span>
                                    </div>
                                @enderror
                            </div>
                        </div>
                    </div>

                    <div class="card profile-settings-section-card">
                        <div class="card-body p-4">
                            <div class="settings-card-header">
                                <h5 class="settings-card-title">{{ __('Account Security') }}</h5>
                                <p class="settings-card-subtitle">{{ __('Password and authentication settings are managed by Keycloak.') }}</p>
                            </div>
                            <div class="d-flex flex-column flex-sm-row align-items-sm-center justify-content-between gap-3">
                                <div class="text-muted fs-13">
                                    {{ __('Manage your profile details, password, sessions, and account security on the UHS Account page.') }}
                                </div>
                                <a href="{{ $keycloakAccountUrl }}" target="_blank" rel="noopener noreferrer" class="btn btn-primary flex-shrink-0">
                                    <i class="ri-external-link-line me-1"></i>{{ __('Open UHS Account') }}
                                </a>
                            </div>
                        </div>
                    </div>

                    <div class="d-flex justify-content-end mt-4">
                        <button type="submit" class="btn btn-primary save-profile-btn">
                            {{ __('Save Profile Photo') }}
                        </button>
                    </div>
                </div>
            </div>
        </form>
    </div>
    @endif
@endsection

@section('script')
    <script src="{{ URL::asset('build/libs/sweetalert2/sweetalert2.min.js') }}" data-turbo-eval="false"></script>

    @if($activeSettingsTab !== 'profile')
        @if(session('success'))
        <script>
            (function showSettingsSuccessMessage() {
                if (typeof Swal === 'undefined') return;
                Swal.fire({
                    title: '{{ __('Saved') }}',
                    text: @json((string) session('success')),
                    icon: 'success',
                    confirmButtonText: '{{ __('OK') }}',
                    customClass: { confirmButton: 'btn btn-primary w-xs mt-2' },
                    buttonsStyling: false
                });
            })();
        </script>
        @endif
        @if(session('error'))
        <script>
            (function showSettingsErrorMessage() {
                if (typeof Swal === 'undefined') return;
                Swal.fire({
                    title: '{{ __('Action Failed') }}',
                    text: @json((string) session('error')),
                    icon: 'error',
                    confirmButtonText: '{{ __('OK') }}',
                    customClass: { confirmButton: 'btn btn-primary w-xs mt-2' },
                    buttonsStyling: false
                });
            })();
        </script>
        @endif
    @endif

    @if($activeSettingsTab === 'profile')
    @include('profile.partials.settings-script')
    @endif
@endsection