@extends('layouts.app')

@section('title') @lang('translation.analytics') @endsection
@section('css')
@endsection

@section('content')
<div class="container">
    @if($selectedMenu)
        <h2>{{ ucfirst($selectedMenu) }} - Submenu</h2>
        <ul>
            @foreach($menuItems[$selectedMenu] as $item)
                <li>{{ $item }}</li>
            @endforeach
        </ul>
        <button wire:click="goBack" class="btn btn-secondary mt-4">Back to Menu</button>
    @else
        <h2>Main Menu</h2>
        <div class="table-responsive text-nowrap">
            <table class="table">
                <thead>
                <tr>
                    <th class="fw-semibold">Menu</th>
                    <th class="fw-semibold">Menu Items</th>
                </tr>
                </thead>
                <tbody>
                @foreach($menuItems as $menuKey => $subMenu)
                    <tr>
                        <td>
                            <a href="#" class="text-decoration-underline" wire:click.prevent="selectMenu('{{ $menuKey }}')">
                                {{ ucfirst($menuKey) }}
                            </a>
                        </td>
                        <td>&nbsp;</td>
                    </tr>
                @endforeach
                </tbody>
            </table>
        </div>
    @endif
</div>
@endsection