@php
    $appbuilder_array = explode(',', $current_user_role_info->appbuilder_permissions);
    if (in_array('3-view_installed_kanpai_themes', $appbuilder_array)) {        
        $index_val = '3-install_kanpai_themes';
    } else {
        if (in_array('3-install_kanpai_themes', $appbuilder_array)) {
            $index_val = '3-view_installed_kanpai_themes';
        } else {
            $index_val = '3-custom_html_theme';
        }
    }
@endphp
<div class="card-body">
    <ul class="nav nav-pills">
        
        @if (in_array('3-install_kanpai_themes', $appbuilder_array))
            <li class="nav-item">
                <a class="nav-link @if ($index_val == '3-install_kanpai_themes') active @endif" data-bs-toggle="tab"
                    href="#kanpaithemes">
                    <span class="p-tab-name"><i class="bx bx-store"></i>
                        Theme Store</span>
                    <i class="bx bx-store font-24 d-sm-none"></i>
                </a>
            </li>
        @endif
        @if (in_array('3-view_installed_kanpai_themes', $appbuilder_array))
            <li class="nav-item">
                <a class="nav-link @if ($index_val == '3-view_installed_kanpai_themes') active @endif" id="createdthemes-tab"
                    data-bs-toggle="tab" href="#installedthemes">
                    <span class="p-tab-name"><i class="bx bx-cloud-download"></i>
                        Installed Themes</span>
                    <i class="bx bxs-cloud-download font-24 d-sm-none"></i>
                </a>
            </li>
        @endif
        @if (in_array('3-custom_html_theme', $appbuilder_array))
            <li class="nav-item">
                <a class="nav-link @if ($index_val == '3-configure_custom_html_theme') active @endif" id="createdthemes-tab"
                    data-bs-toggle="tab" href="#createdthemes">
                    <span class="p-tab-name"><i class="bx bx-brush"></i>
                        Custom Themes</span>
                    <i class="bx bxs-brush font-24 d-sm-none"></i>
                </a>
            </li>
        @endif
    </ul>
    <div class="tab-content mt-3">
        @if (in_array('3-view_installed_kanpai_themes', $appbuilder_array))
            <div class="tab-pane fade @if ($index_val == '3-view_installed_kanpai_themes') show active @endif" id="installedthemes">
                <div class="card shadow-none border mb-0 radius-15">
                    <div class="card-body">
                        <div class="row pt-3 text-center">
                            @if (count($installed_themes) > 0)
                                @foreach ($installed_themes as $key => $availabletheme)
                                    <div class="col-md-4">
                                        <div class="card">
                                            <div class="card-body"
                                                style="border: solid 1px #e4e4e4;border-radius: 10px;">
                                                <h5 class="card-title" style="text-transform:capitalize;">
                                                                                                        {{ $availabletheme->title }}

                                                    <div class="form-check form-switch" style="float: right;">
                                                        <input class="form-check-input" type="checkbox"
                                                            onChange="update_primarytheme_status(this)"
                                                            value="{{ $availabletheme->id }}" data-bs-toggle="tooltip"
                                                            data-bs-placement="top" title="Set As Primary"
                                                            >
                                                    </div>
                                                </h5>
                                                <img class="pt-3" src="{{ $availabletheme->banner }}"
                                                    alt="{{ $availabletheme->title }}" style="width:100%;" />
                                                <hr />
                                                {{-- <p class="card-text">{{ $availabletheme->theme_desc }}.
                                                                    </p> --}}
                                                @php
                                                    $path = public_path('frontend/' . $availabletheme->slug . '/');
                                                    $assets_type = \App\Models\Asset::where(
                                                        'theme_id',
                                                        $availabletheme->id,
                                                    )->get();
                                                @endphp
                                                @if (!file_exists($path))
                                                    <a href="{{ route('create-theme-step-2', $availabletheme->slug) }}"
                                                        class="btn btn-outline-primary btn-sm m-1 px-5 radius-30">Upload
                                                        Your
                                                        Assets</a>
                                                @else
                                                    @if (count($assets_type) > 0)
                                                        <a href="{{ route('widgets', $availabletheme->id) }}"
                                                            class="btn btn-outline-primary btn-sm m-1 px-5 radius-30">Manage
                                                            Widgets</a>
                                                        <a href="{{ route('create-theme-step-3', $availabletheme->slug) }}"
                                                            class="btn btn-outline-secondary btn-sm m-1 px-5 radius-30">Manage
                                                            Assets</a>
                                                    @else
                                                        <a href="{{ route('create-theme-step-3', $availabletheme->slug) }}"
                                                            class="btn btn-outline-primary btn-sm m-1 px-5 radius-30">Load
                                                            Your
                                                            Asset</a>
                                                    @endif
                                                @endif
                                                <a href="{{ route('forcedelete-theme', $availabletheme->id) }}"
                                                    class="btn btn-outline-danger btn-sm m-1 px-5 radius-30"
                                                    onclick="return confirm('Are you sure you want to delete?');">
                                                    <i class="bx bx-trash"></i> Uninstall</a>
                                            </div>
                                        </div>
                                    </div>
                                @endforeach
                            @else
                                <i class="bx bx-sad" style="font-size:5rem;color: #a2a3a5;"></i>
                                <h3 style="color: #a2a3a5;">Nothing found</h3>
                            @endif
                        </div>
                    </div>
                </div>
            </div>
        @endif
        @if (in_array('3-install_kanpai_themes', $appbuilder_array))
            <div class="tab-pane fade @if ($index_val == '3-install_kanpai_themes') show active @endif" id="kanpaithemes">
                <div class="card shadow-none border mb-0 radius-15">
                    <div class="card-body">
                        <div class="row pt-3 text-center">
                            @if (count($jsonData) > 0)
                                @foreach ($jsonData as $key => $availabletheme)
                                    @php
                                        $theme_info = \App\Models\Theme::where('installed_id', $availabletheme['id'])
                                            ->where('via', 'kanpai-api')
                                            ->get();
                                    @endphp
                                    @if (count($theme_info) < 1)
                                        <div class="col-md-4">
                                            <div class="card">
                                                <div class="card-body"
                                                    style="border: solid 1px #e4e4e4;border-radius: 10px;">
                                                    <img src="https://kanpaithemes.com/public/uploads/themes/thumbnail/{{ $availabletheme['thumbnail'] }}"
                                                        alt="{{ $availabletheme['title'] }}" style="width:100%;" />
                                                    <h5 class="card-title pt-3" style="text-transform:capitalize;">
                                                        {{ $availabletheme['title'] }}
                                                    </h5>
                                                    <hr />
                                                    {{-- <p class="card-text">
                                                                            {{ $availabletheme['short_desc'] }}.
                                                                        </p> --}}
                                                    <a class="btn btn-outline-primary btn-sm m-1 px-4"
                                                        data-bs-toggle="modal"
                                                        data-bs-target="#installTemplate{{ $availabletheme['id'] }}"
                                                        data-bs-placement="top" title=""
                                                        data-bs-original-title="Install {{ $availabletheme['title'] }} Theme"><i
                                                            class="bx bx-cloud-download"></i>
                                                        Install</a>
                                                    <a href="#" class="btn btn-outline-dark btn-sm m-1 px-4"><i
                                                            class="bx bx-info-circle"></i>
                                                        Preview</a>
                                                </div>
                                            </div>
                                        </div>
                                    @endif
                                    @include('backend.dynamic-modals.install-themes')
                                @endforeach
                            @else
                                <i class="bx bx-sad" style="font-size:5rem;color: #a2a3a5;"></i>
                                <h3 style="color: #a2a3a5;">Nothing found</h3>
                            @endif
                        </div>
                    </div>
                </div>
            </div>
        @endif
        @if (in_array('3-custom_html_theme', $appbuilder_array))
            <div class="tab-pane fade @if ($index_val == '3-custom_html_theme') show active @endif" id="createdthemes">
                <div class="card shadow-none border mb-0 radius-15">
                    <div class="card-body">
                        @if (in_array('3-configure_custom_html_theme', $appbuilder_array))
                            <div class="row text-center pt-2">
                                <div class="col-xl-4 mx-auto">
                                    <div class="card radius-15">
                                        <a href="{{ route('create-theme') }}" class="btn btn-primary radius-10"><i
                                                class='bx bx-layer-plus'></i> Configure Your
                                            HTML
                                            Theme</a>
                                    </div>
                                </div>
                            </div>
                        @endif
                        <div class="row pt-3 text-center">
                            @if (count($available_themes) > 0)
                                @foreach ($available_themes as $key => $availabletheme)
                                    <div class="col-md-4">
                                        <div class="card">
                                            <div class="card-body">
                                                <h5 class="card-title" style="text-transform:capitalize;">
                                                                                                        {{ $availabletheme->title }}
                                                    @if (in_array('3-setprimary', $appbuilder_array))
                                                        <div class="form-check form-switch" style="float: right;">
                                                            <input class="form-check-input" type="checkbox"
                                                                onChange="update_primarytheme_status(this)"
                                                                value="{{ $availabletheme->id }}"
                                                                data-bs-toggle="tooltip" data-bs-placement="top"
                                                                title="Set As Primary" >
                                                        </div>
                                                    @endif
                                                </h5>
                                                <hr />
                                                <p class="card-text">
                                                    {{ $availabletheme->theme_desc }}.
                                                </p>
                                                @php
                                                    $path = public_path('frontend/' . $availabletheme->slug . '/');
                                                    $assets_type = \App\Models\Asset::where(
                                                        'theme_id',
                                                        $availabletheme->id,
                                                    )->get();
                                                @endphp
                                                @if (!file_exists($path))
                                                    @if (in_array('3-upload_assets', $appbuilder_array))
                                                        <a href="{{ route('create-theme-step-2', $availabletheme->slug) }}"
                                                            class="btn btn-outline-primary btn-sm m-1 px-5 radius-30">Upload
                                                            Your
                                                            Assets</a>
                                                    @endif
                                                @else
                                                    @if (count($assets_type) > 0)
                                                        @if (in_array('3-manage_widget', $appbuilder_array))
                                                            <a href="{{ route('widgets', $availabletheme->id) }}"
                                                                class="btn btn-outline-primary btn-sm m-1 px-5 radius-30">Manage
                                                                Widgets</a>
                                                        @endif
                                                        @if (in_array('3-manage_assets', $appbuilder_array))
                                                            <a href="{{ route('create-theme-step-3', $availabletheme->slug) }}"
                                                                class="btn btn-outline-secondary btn-sm m-1 px-5 radius-30">Manage
                                                                Assets</a>
                                                        @endif
                                                    @else
                                                        @if (in_array('3-load_assets', $appbuilder_array))
                                                            <a href="{{ route('create-theme-step-3', $availabletheme->slug) }}"
                                                                class="btn btn-outline-primary btn-sm m-1 px-5 radius-30">Load
                                                                Your
                                                                Asset</a>
                                                        @endif
                                                    @endif
                                                @endif
                                                @if (in_array('3-rename', $appbuilder_array) or in_array('3-delete', $appbuilder_array))
                                                    <div class="pt-2">
                                                        @if (in_array('3-rename', $appbuilder_array))
                                                            <a class="btn btn-outline-dark m-1 btn-sm"
                                                                data-bs-toggle="modal"
                                                                data-bs-target="#renameTemplate{{ $availabletheme->id }}"
                                                                data-bs-placement="top" title=""
                                                                data-bs-original-title="Rename"><i
                                                                    class="bx bx-edit-alt"></i></a>
                                                        @endif
                                                        @if (in_array('3-delete', $appbuilder_array))
                                                            <a href="{{ route('forcedelete-theme', $availabletheme->id) }}"
                                                                class="btn btn-outline-danger m-1 btn-sm"
                                                                data-bs-toggle="tooltip" data-bs-placement="top"
                                                                title="" data-bs-original-title="Force Delete"
                                                                onclick="return confirm('Are you sure you want to delete?');"><i
                                                                    class="bx bx-trash"></i></a>
                                                        @endif
                                                    </div>
                                                @endif
                                                @if (in_array('3-rename', $appbuilder_array))
                                                    @include('backend.dynamic-modals.rename-themes')
                                                @endif
                                            </div>
                                        </div>
                                    </div>
                                @endforeach
                            @else
                                <i class="bx bx-sad" style="font-size:5rem;color: #a2a3a5;"></i>
                                <h3 style="color: #a2a3a5;">You haven't created any themes yet
                                </h3>
                            @endif
                        </div>
                    </div>
                </div>
            </div>
        @endif
    </div>
</div>