added a component to list posts

app/View/Components/ListPost.php

@@ -0,0 +1,28 @@
+<?php
+
+namespace App\View\Components;
+
+use Closure;
+use Illuminate\Contracts\View\View;
+use Illuminate\View\Component;
+
+class ListPost extends Component
+{
+    public $posts;
+
+    /**
+     * Create a new component instance.
+     */
+    public function __construct($posts)
+    {
+        $this->posts = $posts;
+    }
+
+    /**
+     * Get the view / contents that represent the component.
+     */
+    public function render(): View|Closure|string
+    {
+        return view('components.list-post');
+    }
+}

resources/views/components/list-post.blade.php

@@ -0,0 +1,15 @@
+<div>
+    @if ($posts->count())
+        <div class="grid md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 gap-6">
+            @foreach ($posts as $post)
+                <div>
+                    <a href="{{ route('posts.show', ['post' => $post, 'user' => $post->user]) }}">
+                        <img src="{{ asset('uploads') . '/' . $post->image }}" alt="{{ $post->title }}">
+                    </a>
+                </div>
+            @endforeach
+        </div>
+    @else
+        <p class="text-center">No posts yet. Be the first one!</p>
+    @endif
+</div>

resources/views/dashboard.blade.php

@@ -75,22 +75,6 @@
     <section class="container mx-auto mt-10">
         <h2 class="text-4xl text-center font-black my-10">Posts</h2>
 
-        @if ($posts->count())
-            <div class="grid md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 gap-6">
-                @foreach ($posts as $post)
-                    <div>
-                        <a href="{{ route('posts.show', ['post' => $post, 'user' => $user]) }}">
-                            <img src="{{ asset('uploads') . '/' . $post->image }}" alt="{{ $post->title }}">
-                        </a>
-                    </div>
-                @endforeach
-            </div>
-
-            <div class="my-10">
-                {{ $posts->links() }}
-            </div>
-        @else
-            <p class="text-gray-600 uppercase text-sm text-center font-bold">No posts yet</p>
-        @endif
+        <x-list-post :posts="$posts" />
     </section>
 @endsection

resources/views/home.blade.php

@@ -4,18 +4,6 @@
 
 @section('content')
 
-    @if ($posts->count())
-        <div class="grid md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 gap-6">
-            @foreach ($posts as $post)
-                <div>
-                    <a href="{{ route('posts.show', ['post' => $post, 'user' => $post->user]) }}">
-                        <img src="{{ asset('uploads') . '/' . $post->image }}" alt="{{ $post->title }}">
-                    </a>
-                </div>
-            @endforeach
-        </div>
-    @else
-        <p class="text-center">No posts yet. Be the first one!</p>
-    @endif
+    <x-list-post :posts="$posts" />
 
 @endsection