@isset($DiscordProvider)
    <div id="middle_panel_links" style="top:250px;height: 390px;">

        <a data-toggle="collapse" href="#discord_widget" role="button" aria-expanded="false" aria-controls="collapseExample">
            <div class="middle_panel_links_button" id="middle_panel_links_stats_button">
                <i class="fab fa-fw fa-discord"></i>
                <h3>{{ __('sidebar.discord.title') }}</h3>
                <h4>{{ __('sidebar.discord.title') }}</h4>
            </div>
        </a>

        <div class="collapse" id="discord_widget" style="max-height: 390px;overflow: scroll;">
            <p class="font-weight-light font-weight-bold pt-3">
                {{ __('sidebar.discord.title') }}
                <span style="color:goldenrod">
                    {{ __('sidebar.discord.online', ['online' => $DiscordProvider['presence_count']]) }}
                </span>
                @if (array_key_exists('instant_invite', $DiscordProvider))
                    @if ($DiscordProvider['instant_invite'] !== null)
                        <span class="float-right">
                            <a href="{{ $DiscordProvider['instant_invite'] }}" target="_blank" rel="noopener">
                                {{ __('sidebar.discord.join') }}
                            </a>
                        </span>
                    @endif
                @endif
            </p>
            <ul class="list-group small overflow-auto py-1 pl-1">
                @forelse($DiscordProvider['members'] as $discord)
                    <li class="pb-1 border-bottom text-break">
                        <span class="pull-left">
                            <img src="{{ $discord['avatar_url'] }}" class="img-fluid img-rounded" loading="lazy"
                                style="max-width: 20px" />
                        </span>
                        {{ $discord['username'] }}
                        @if (array_key_exists('game', $discord))
                            <span class="float-right small pt-1 pr-2">
                                {{ $discord['game']['name'] }}
                            </span>
                        @endif
                    </li>
                @empty
                    {{ __('sidebar.discord.empty') }}
                @endforelse
                <div class="text-center">
                    <a href="https://discordapp.com/invite/XGxHXwxFQX" class="btn btn-custom w-100 bg-warning text-secondary fw-900" target="_blank"
                        rel="noopener">
                        Join Discord </a>
                </div>
            </ul>
        </div>

    </div>
@endisset