This commit is contained in:
User
2025-01-21 19:57:07 -05:00
parent befc90dd02
commit d9f57e4e86
17 changed files with 206 additions and 230 deletions

View File

@@ -1,6 +1,6 @@
import { useState } from 'react';
import { Head, Link, router } from '@inertiajs/react';
import { Plus, Star, ArrowDownNarrowWide, ArrowUpNarrowWide, ChevronsLeft, ChevronsRight, Trash2 } from 'lucide-react';
import { Plus, Star, ArrowDownNarrowWide, ArrowUpNarrowWide, ChevronsLeft, ChevronsRight, Trash2, RefreshCw } from 'lucide-react';
import AppLayout from '@/Layouts/AppLayout.jsx';
@@ -47,6 +47,13 @@ export default function Chapters({ auth, comic, chapters, histories, offset }) {
});
}
const forceReload = (pathword) => {
router.get(`/comic/${ comic.comic.path_word }?reload=true`, {}, {
only: ['chapters'],
preserveState: true,
});
}
const groupOnClickHandler = (pathword) => {
router.get(`/comic/${ comic.comic.path_word }?group=${ pathword }`, {}, {
only: ['chapters'],
@@ -97,7 +104,8 @@ export default function Chapters({ auth, comic, chapters, histories, offset }) {
<Head>
<title>{ comic.comic.name }</title>
</Head>
<div className="p-3 pt-1">
<div className="p-3 pt-1 pb-1 flex flex-wrap justify-center" scroll-region="true"
style={{ overflowAnchor: "none", height: "calc(100dvh - 90px)", overflowY: "scroll" }}>
<Card>
<CardHeader>
<CardTitle className="flex flex-row content-end items-center">
@@ -188,6 +196,19 @@ export default function Chapters({ auth, comic, chapters, histories, offset }) {
</Tooltip>
</TooltipProvider>
<TooltipProvider>
<Tooltip>
<TooltipTrigger asChild>
<Button variant="link" size="icon" onClick={ () => forceReload(comic.comic.path_word) }>
<RefreshCw />
</Button>
</TooltipTrigger>
<TooltipContent>
<p>Force reload</p>
</TooltipContent>
</Tooltip>
</TooltipProvider>
<TooltipProvider>
<Tooltip>
<TooltipTrigger asChild>
@@ -205,7 +226,7 @@ export default function Chapters({ auth, comic, chapters, histories, offset }) {
<TabsContent value={ group }>
<div
className="w-full grid grid-cols-1 md:grid-cols-2 lg:grid-cols-6 2xl:grid-cols-12 gap-1">
{ (chapters.total > chapters.limit && chapters.offset > 0) && (
{ (chapters.total > (chapters.limit + chapters.offset) && chapters.offset > 0) && (
<Button size="sm" variant="outline" asChild>
<Link href="?" only={['chapters', 'offset']} headers={{ offset: parseInt(chapters.offset) - chapters.limit }}>
<ChevronsLeft /> Prev

View File

@@ -73,7 +73,7 @@ export default function Histories({ auth, histories }) {
<div className="p-3 pt-1 w-[90%] mx-auto">
<div className="flex justify-end gap-2">
<Button size="sm" variant="destructive" onClick={ () => deleteButtonOnClickHandler() }>
{ ids.length > 0 ? `Delete selected (${ids.length})` : "Delete All" }
{ ids.length > 0 ? `Delete selected (${ ids.length })` : "Delete All" }
</Button>
<Button size="sm" variant="destructive" onClick={ () => removeDuplicatedButtonOnClickHandler() }>

View File

@@ -1,4 +1,4 @@
import { useState } from 'react';
import React, { useState } from 'react';
import { Head, Link } from '@inertiajs/react';
import { Star } from 'lucide-react';
@@ -82,21 +82,24 @@ export default function Index({ comics, offset, auth }) {
<Head>
<title>Home</title>
</Head>
<div className="p-3 pt-1 grid 2xl:grid-cols-6 xl:grid-cols-4 sm:grid-cols-2 gap-2">
<ComicCards { ...comics } />
</div>
<Pagination className="justify-end pb-2">
<PaginationContent>
{ parseInt(offset) !== 0 &&
<div className="p-3 pt-1 pb-1 flex flex-wrap justify-center" scroll-region="true"
style={{ overflowAnchor: "none", height: "calc(100dvh - 90px)", overflowY: "scroll" }}>
<div className="grid 2xl:grid-cols-6 xl:grid-cols-4 sm:grid-cols-2 gap-2">
<ComicCards { ...comics } />
</div>
<Pagination className="justify-end pt-2">
<PaginationContent>
{ parseInt(offset) !== 0 &&
<PaginationItem>
<PaginationPrevious href={ `${ url.pathname }?${ url.searchParams }` } only={['comics', 'offset']} headers={{ offset: parseInt(offset) - 30 }} />
</PaginationItem>
}
<PaginationItem>
<PaginationPrevious href={ `${ url.pathname }?${ url.searchParams }` } only={['comics', 'offset']} headers={{ offset: parseInt(offset) - 30 }} />
<PaginationNext href={ `${ url.pathname }?${ url.searchParams }` } only={['comics', 'offset']} headers={{ offset: parseInt(offset) + 30 }} />
</PaginationItem>
}
<PaginationItem>
<PaginationNext href={ `${ url.pathname }?${ url.searchParams }` } only={['comics', 'offset']} headers={{ offset: parseInt(offset) + 30 }} />
</PaginationItem>
</PaginationContent>
</Pagination>
</PaginationContent>
</Pagination>
</div>
</AppLayout>
);
}

View File

@@ -137,7 +137,7 @@ export default function Read({ auth, comic, chapter, chapters }) {
if (img.innerKey === 0 && chapter.chapter.prev) {
router.visit(route('comics.read', [comic.comic.path_word, chapter.chapter.prev]));
} else {
document.getElementById(`image-${img.innerKey - 1}`)?.scrollIntoView();
document.getElementById(`image-${ img.innerKey - 1 }`)?.scrollIntoView();
}
}
@@ -145,7 +145,7 @@ export default function Read({ auth, comic, chapter, chapters }) {
if (img.innerKey >= chapter.sorted.length - 1 && chapter.chapter.next) {
router.visit(route('comics.read', [comic.comic.path_word, chapter.chapter.next]));
} else {
document.getElementById(`image-${img.innerKey + 1}`)?.scrollIntoView();
document.getElementById(`image-${ img.innerKey + 1 }`)?.scrollIntoView();
}
}
@@ -370,7 +370,7 @@ export default function Read({ auth, comic, chapter, chapters }) {
<Head>
<title>{ chapter.chapter.name.concat(" - ", comic.comic.name) }</title>
</Head>
<div className="p-3 pt-1 pb-1 flex flex-wrap justify-center" id="mvp" ref={ ref }
<div className="p-3 pt-1 pb-1 flex flex-wrap justify-center" id="mvp" ref={ ref } scroll-region="true"
style={{ overflowAnchor: "none", height: "calc(100dvh - 90px)", overflowY: "scroll" }}>
{ chapter.sorted.map((img, j) => <ImageForComic key={ j } innerKey={ j } { ...img } />) }
</div>

View File

@@ -13,7 +13,19 @@ export default function Updates({ auth }) {
<div className="p-3 pt-1">
<Card className="w-[90%] m-3 mx-auto">
<CardHeader>
<CardTitle>0.1.3</CardTitle>
<CardTitle>0.1.4</CardTitle>
<CardDescription>Release: 21 Jan 2025</CardDescription>
</CardHeader>
<CardContent>
<ul>
<li>Ability for force refetch on chapters</li>
<li>Fixed top toolbar on comic pages</li>
</ul>
</CardContent>
</Card>
<Card className="w-[90%] m-3 mx-auto">
<CardHeader>
<CardTitle>0.1.3 / 0.1.3A</CardTitle>
<CardDescription>Release: 19 Jan 2025 / 18 Jan 2025</CardDescription>
</CardHeader>
<CardContent>

View File

@@ -86,7 +86,7 @@ export function AppSidebar({ auth }) {
</div>
<div className="flex flex-col gap-0.5 leading-none">
<span className="font-semibold">Comic</span>
<span>0.1.3A</span>
<span>0.1.4</span>
</div>
</Link>
</SidebarMenuButton>