@extends('main.layouts.main')

@section('content')
    <div class="friends">
        <h2>Друзья</h2>
        <ul class="tabs">
            <li>
                <a href="#">Новые заявки <span class="count">3</span></a>
            </li>
            <li>
                <a href="#" class="active">Друзья</a>
            </li>
            <li>
                <a href="#">Подписчики</a>
            </li>
        </ul>
        @csrf
        <div class="content">
            <div class="search">
                <form action="">
                    <input type="text" onkeyup="searchFriends(event)" placeholder="Введите имя пользователя">
                </form>
            </div>
            <h4>Ваши друзья</h4>
            <ul class="list">
                @foreach($friends as $friend)
                    <li>
                        <div class="user-info">
                            <img src="{{ $friend->user()->avatar_url }}" alt="">
                            <a href="/u/{{ $friend->user()->username }}"><h3>{{ $friend->user()->name }} {{ $friend->user()->surname }}</h3></a>
                        </div>
                        <ul class="actions">
                            <li>
                                <a href="#">Удалить из друзей</a>
                            </li>
                        </ul>
                    </li>
                @endforeach
            </ul>
            <h4>Найдены</h4>
            <ul class="list search-friends">

            </ul>
        </div>

    </div>
@endsection