From 55414d56a407a44a4877b21eb2a66efa4ac5adc3 Mon Sep 17 00:00:00 2001
From: User <turkey@yumj.in>
Date: Sat, 28 Dec 2024 17:16:05 -0500
Subject: [PATCH] Breadcrumb Fix

---
 resources/js/Pages/Comic/Favourites.jsx |  2 +-
 resources/js/Pages/Comic/Histories.jsx  | 18 +++++++++++++++---
 resources/js/Pages/Comic/Read.jsx       | 20 +++++++++-----------
 3 files changed, 25 insertions(+), 15 deletions(-)

diff --git a/resources/js/Pages/Comic/Favourites.jsx b/resources/js/Pages/Comic/Favourites.jsx
index d421409..866250b 100644
--- a/resources/js/Pages/Comic/Favourites.jsx
+++ b/resources/js/Pages/Comic/Favourites.jsx
@@ -70,7 +70,7 @@ export default function Favourites({ auth, favourites }) {
     return (
         <AppLayout auth={ auth } header={
             <>
-                <BreadcrumbSeparator />
+                <BreadcrumbSeparator className="hidden lg:block" />
                 <BreadcrumbItem>
                     <BreadcrumbPage>Favourites</BreadcrumbPage>
                 </BreadcrumbItem>
diff --git a/resources/js/Pages/Comic/Histories.jsx b/resources/js/Pages/Comic/Histories.jsx
index 67dd464..54b3d24 100644
--- a/resources/js/Pages/Comic/Histories.jsx
+++ b/resources/js/Pages/Comic/Histories.jsx
@@ -24,6 +24,18 @@ export default function Histories({ auth, histories }) {
         }
     }
 
+    const datetimeConversion = (iso8601) => {
+        const date = new Date(iso8601);
+
+        const year = date.getUTCFullYear();
+        const month = String(date.getUTCMonth() + 1).padStart(2, '0'); // Months are 0-based
+        const day = String(date.getUTCDate()).padStart(2, '0');
+        const hours = String(date.getUTCHours()).padStart(2, '0');
+        const minutes = String(date.getUTCMinutes()).padStart(2, '0');
+
+        return  `${year}-${month}-${day} ${hours}:${minutes}`;
+    }
+
     const deleteButtonOnClickHandler = () => {
         router.visit(route('comics.destroyHistories'), {
             data: (ids.length > 0) ? { ids: ids } : { ids: 'all' },
@@ -41,7 +53,7 @@ export default function Histories({ auth, histories }) {
     return (
         <AppLayout auth={ auth } header={
             <>
-                <BreadcrumbSeparator />
+                <BreadcrumbSeparator className="hidden lg:block" />
                 <BreadcrumbItem>
                     <BreadcrumbPage>Histories</BreadcrumbPage>
                 </BreadcrumbItem>
@@ -62,7 +74,7 @@ export default function Histories({ auth, histories }) {
                             <TableHead>Select</TableHead>
                             <TableHead>Chapter</TableHead>
                             <TableHead>Comic</TableHead>
-                            <TableHead>Read at</TableHead>
+                            <TableHead className="hidden lg:block">Read at</TableHead>
                         </TableRow>
                     </TableHeader>
                     <TableBody>
@@ -85,7 +97,7 @@ export default function Histories({ auth, histories }) {
                                         { h.comic.name }
                                     </Link>
                                 </TableCell>
-                                <TableCell>{ h.created_at }</TableCell>
+                                <TableCell className="hidden lg:block">{ datetimeConversion(h.created_at) }</TableCell>
                             </TableRow>
                         )) }
                     </TableBody>
diff --git a/resources/js/Pages/Comic/Read.jsx b/resources/js/Pages/Comic/Read.jsx
index 00649ad..c0758c4 100644
--- a/resources/js/Pages/Comic/Read.jsx
+++ b/resources/js/Pages/Comic/Read.jsx
@@ -258,17 +258,15 @@ export default function Read({ auth, comic, chapter }) {
     return (
         <AppLayout auth={ auth } header={
             <>
-                <span className="hidden lg:block">
-                    <BreadcrumbSeparator />
-                    <BreadcrumbItem>
-                        <BreadcrumbLink asChild>
-                            <Link href={ route('comics.chapters', [comic.comic.path_word]) }>
-                                { comic.comic.name }
-                            </Link>
-                        </BreadcrumbLink>
-                    </BreadcrumbItem>
-                    <BreadcrumbSeparator />
-                </span>
+                <BreadcrumbSeparator className="hidden lg:block"/>
+                <BreadcrumbItem className="hidden lg:block">
+                    <BreadcrumbLink asChild>
+                        <Link href={ route('comics.chapters', [comic.comic.path_word]) }>
+                            { comic.comic.name }
+                        </Link>
+                    </BreadcrumbLink>
+                </BreadcrumbItem>
+                <BreadcrumbSeparator className="hidden lg:block" />
                 <BreadcrumbItem>
                     <BreadcrumbPage>{ chapter.chapter.name }</BreadcrumbPage>
                 </BreadcrumbItem>