Init

resources/views/livewire/watched.blade.php

@@ -0,0 +1,28 @@
+<div>
+    <div class="relative mx-auto sm:px-6 lg:px-8  text-gray-900 dark:text-white xl:max-w-[95%] 2xl:max-w-[90%]"
+        wire:keydown.right.window="nextPage" wire:keydown.left.window="previousPage">
+        <ol class="border-l border-neutral-300 dark:border-neutral-500">
+            @foreach ($watchedGrouped as $day => $episodes)
+                <li>
+                    <div class="flex items-center pt-3 flex-start">
+                        <div class="-ml-[5px] mr-3 h-[9px] w-[9px] rounded-full bg-neutral-300 dark:bg-neutral-500">
+                        </div>
+                        <p class="text-sm text-neutral-500 dark:text-neutral-300">
+                            {{ $episodes->first()->created_at->diffForHumans(['parts' => 1]) }}
+                        </p>
+                    </div>
+                    <div class="flex justify-center">
+                        <div class="grid grid-cols-1 gap-2 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 2xl:grid-cols-5">
+                            @foreach ($episodes as $episode)
+                                <div class="mt-2 mb-6 ml-4">
+                                    <x-episode-thumbnail :episode="$episode->episode" />
+                                </div>
+                            @endforeach
+                        </div>
+                    </div>
+                </li>
+            @endforeach
+        </ol>
+        {{ $watched->links('pagination::tailwind') }}
+    </div>
+</div