<div class="drawers aside-inset">
    <details open>
        <summary>{{ __('General settings') }}</summary>
        <menu class="content pagelinks">
            <li>
                <x-app.pagelink
                    href="{{ route('calendar.settings.display') }}"
                    :active="request()->routeIs('calendar.settings.display')"
                    :label="__('calendar.settings.display.title')"
                    icon="preferences"
                />
            </li>
        </menu>
    </details>
    <details open>
        <summary>{{ __('Add a calendar') }}</summary>
        <menu class="content pagelinks">
            <li>
                <x-app.pagelink
                    href="{{ route('calendar.settings.create') }}"
                    :active="request()->routeIs('calendar.settings.create')"
                    :label="__('calendar.settings.create.title')"
                    icon="calendar-plus"
                />
            </li>
            <li>
                <x-app.pagelink
                    href="{{ route('calendar.settings.subscribe') }}"
                    :active="request()->routeIs('calendar.settings.subscribe')"
                    :label="__('calendar.settings.subscribe.title')"
                    icon="calendar-sync"
                />
            </li>
        </menu>
    </details>
    <details open>
        <summary>{{ __('calendar.settings.my_calendars') }}</summary>
        <menu class="content pagelinks">
            @foreach ($calendars as $cal)
            <li>
                <x-app.calendarlink
                    :href="route('calendar.settings.calendars.show', $cal->uri)"
                    :active="request()->routeIs('calendar.settings.calendars.show') && request()->route('calendarUri') === $cal->uri"
                    :label="$cal['displayname']"
                    icon="circle-small"
                    :color="$cal['calendarcolor']"
                    :remote="$cal['is_remote']"
                />
            </li>
            @endforeach
        </menu>
    </details>
</div>
