eatvio-infra/resources/views/livewire/feed/index.blade.php

<section class="py-5" id="main">
    <div id="recordsList" class="container p-0 --mw-1000" wire:key="posts-result">
        @foreach($posts as $post)
        @php
            $author = $post->author()->first();
            $authorPhoto = $author->profile_photo_url;
            $image = Storage::url($post->image);
            $blogPostViewsCount = views($post)->unique()->count();
            $type = Str::afterLast($post->getMorphClass(), 'Models\\');

            $postShowRoute =  route(Str::snake($type) . ".show", $post->id);
        @endphp
        <div class="mb-4 p-3 --bg_white --shadow --radius --no_wrap" data-record_type="user" wire:key="post_{{ $post->id }}" id="post_id_{{ $post->id }}">
            <div class="d-flex mb-4 align-items-center justify-content-between">
                <div class="d-flex align-items-center">
                    <a href="{{ route('profile.show', $author->id) }}" class="d-none d-sm-block overflow-hidden rounded-full mr-4">
                        <div class="centered-bg-img" style="background-image: url('{{ $authorPhoto }}')"></div>
                    </a>
                    <small>
                        <span class="d-block --f_bold lh-1"><a href="{{ route('profile.show', $author->id) }}" class="text-black">{{ $author->name }}</a></span>
                        <span class="--f_grey">
                            <a class="text-black" data-post-created-at="{{ $post->created_at }}" href="{{ route('blog_post.show', $post->id) }}">{{ $post->created_at->diffForHumans() }}</a>
                        </span>
                    </small>
                </div>
                <ul class="navbar-nav" style="--bs-scroll-height:100px;">
                    <li class="nav-item dropdown">
                        <a id="dLabel" class="nav-link py-0 dropdown-toggle-js" href="#" data-bs-toggle="dropdown" aria-expanded="false" role="button">
                            <svg width="18" height="4">
                                <use xlink:href="#Dots"></use>
                            </svg>
                        </a>
                        <ul class="dropdown-menu" aria-labelledby="navbarScrollingDropdown">
                            <li><a class="dropdown-item" href="{{ route('blog_post.edit', $post->id) }}">Edit</a></li>
                            <li><a class="dropdown-item" href="{{ $postShowRoute }}">Show</a></li>
                            <li>
                                <hr class="dropdown-divider">
                            </li>
                            <li><a class="dropdown-item" href="#">Что-то еще</a></li>
                        </ul>
                    </li>
                </ul>
            </div>
            @if($type == "Recipe")
                <div class="d-flex justify-content-between align-items-center mb-3">
                    <div class="d-flex align-items-center --f_bold">
                        <svg width="22" height="22" class="me-1">
                            <use xlink:href="#KdjIcon"></use>
                        </svg>
                        139.9 ккал
                    </div>
                    <div class="d-flex align-items-center --f_bold">
                        <svg width="22" height="22" class="me-1">
                            <use xlink:href="#TimeBlack"></use>
                        </svg>
                        {{ $post->cooking_time }}
                    </div>
                    <div class="d-flex align-items-center --f_bold">
                        <svg width="22" height="26" class="me-1">
                            <use xlink:href="#Footprints"></use>
                        </svg>
                        {{ $post->steps->count() }} этапов
                    </div>
                </div>
            @endif

            <div class="h6 --f_bold --no_wrap_normal"><a class="text-black" href="{{ $postShowRoute }}">{{ $post->title }}</a></div>
            <small class="d-block --no_wrap_normal my-3">{!! $post->description !!}</small>
            <div class="d-flex justify-center position-relative post_img">
                <img src="{{ $image }}" class="w-8/12 --radius">
                <div class="post_v_l w-100 d-flex justify-content-center align-items-center position-absolute --f_white">
                    <svg width="20" height="14" class="me-2">
                        <use xlink:href="#Eye_White"></use>
                    </svg>
                    <span class="me-3">{{ $blogPostViewsCount }}</span>
                    @if($type == "BlogPost")
                    <svg width="16" height="14" class="me-2">
                        <use xlink:href="#Heart_White"></use>
                    </svg>
                    <livewire:blog-post.like-count :blogPost="$post" wire:key="post-likes-count-key-{{ $post->id }}" />
                    @endif

                </div>
            </div>
            <div class="d-flex mt-4 mb-3 align-items-center justify-content-between justify-content-sm-center --f_bold">
                <a href="{{ $postShowRoute }}#commentsList" class="d-flex align-items-center me-4 me-sm-5 --f_main">
                    <small>
                        <svg width="21" height="20" class="me-1">
                            <use xlink:href="#ActionComment"></use>
                        </svg>
                        Комментировать
                    </small>
                </a>
                @if($type == "BlogPost")
                <livewire:blog-post.like :blogPost="$post" wire:key="post-like-key-{{ $post->id }}" />
                @endif
                <a href="#" class="d-flex align-items-center --f_main">
                    <small>
                        <svg width="21" height="22" class="me-1">
                            <use xlink:href="#Share"></use>
                        </svg>
                        <span class="d-none d-sm-inline">Поделится</span>
                    </small>
                </a>
            </div>
        </div>
        @endforeach
        {{-- $blogPosts->links() --}}
    </div>
</section>