@extends('laravelticket::layouts.master')

@section('page', trans('laravelticket::admin.config-index-title'))

@section('laravelticket_header')
    {{ html()->a(route($setting->grab('admin_route').'.configuration.create'), trans('laravelticket::admin.btn-create-new-config'))
        ->class('inline-flex items-center px-4 py-2 bg-blue-600 hover:bg-blue-700 text-white text-sm font-medium rounded-md transition-colors') }}
@stop

@section('laravelticket_content_parent_class', 'p-0')

@section('laravelticket_content')
    @if($configurations->isEmpty())
        <div class="p-6 text-center text-gray-500 dark:text-gray-400">{{ trans('laravelticket::admin.config-index-no-settings') }}</div>
    @else
        <div x-data="{ tab: 'init' }">
            <div class="flex flex-wrap border-b border-gray-200 dark:border-gray-700">
                @foreach([
                    ['init',   trans('laravelticket::admin.config-index-initial')],
                    ['ticket', trans('laravelticket::admin.config-index-tickets')],
                    ['email',  trans('laravelticket::admin.config-index-notifications')],
                    ['perms',  trans('laravelticket::admin.config-index-permissions')],
                    ['editor', trans('laravelticket::admin.config-index-editor')],
                    ['other',  trans('laravelticket::admin.config-index-other')],
                ] as [$key, $label])
                    <button @click="tab = '{{ $key }}'"
                            :class="tab === '{{ $key }}' ? 'border-b-2 border-blue-500 text-blue-600 dark:text-blue-400 font-medium' : 'text-gray-600 dark:text-gray-400 hover:text-gray-800 dark:hover:text-gray-200'"
                            class="px-4 py-3 text-sm transition-colors">
                        {{ $label }}
                    </button>
                @endforeach
            </div>

            <div x-show="tab === 'init'">@include('laravelticket::admin.configuration.tables.init_table')</div>
            <div x-show="tab === 'ticket'" style="display:none">@include('laravelticket::admin.configuration.tables.ticket_table')</div>
            <div x-show="tab === 'email'" style="display:none">@include('laravelticket::admin.configuration.tables.email_table')</div>
            <div x-show="tab === 'perms'" style="display:none">@include('laravelticket::admin.configuration.tables.perms_table')</div>
            <div x-show="tab === 'editor'" style="display:none">@include('laravelticket::admin.configuration.tables.editor_table')</div>
            <div x-show="tab === 'other'" style="display:none">@include('laravelticket::admin.configuration.tables.other_table')</div>
        </div>
    @endif
@endsection