turkey/cv4
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Reading history

Browse Source
This commit is contained in:
User
2024-12-28 13:32:46 -05:00
parent c722f4f9e6
commit 38ad983d6d
11 changed files with 156 additions and 87 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
resources/js/Pages/Comic/Chapters.jsx
View File

@@ -1,18 +1,18 @@
import { useState } from 'react';
import { Head, Link, router } from '@inertiajs/react';
import { Moon, Plus, Star, ArrowDownNarrowWide, ArrowUpNarrowWide } from 'lucide-react';
import { Plus, Star, ArrowDownNarrowWide, ArrowUpNarrowWide } from 'lucide-react';
import AppLayout from '@/Layouts/AppLayout.jsx';
import { Badge } from "@/components/ui/badge";
import { BreadcrumbItem, BreadcrumbPage, BreadcrumbSeparator } from '@/components/ui/breadcrumb';
import { Button } from '@/components/ui/button';
import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@/components/ui/card';
import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card';
import { Tabs, TabsContent, TabsList, TabsTrigger } from '@/components/ui/tabs';
import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from '@/components/ui/tooltip';
import { useToast } from '@/hooks/use-toast';
import { Badge } from "@/components/ui/badge.jsx";
export default function Chapters({ auth, comic, chapters }) {
export default function Chapters({ auth, comic, chapters, histories }) {
const [group, setGroup] = useState('default');
const [favourites, setFavourites] = useState(auth.user.favourites);
@@ -42,12 +42,13 @@ export default function Chapters({ auth, comic, chapters }) {
const ComicChapterLink = (props) => {
const isNew = Date.now() - Date.parse(props.datetime_created) < 6.048e+8;
const isRead = histories.includes(props.uuid);
return (
<TooltipProvider>
<Tooltip>
<TooltipTrigger asChild>
<Button className="" size="sm" variant="outline" asChild>
<Button size="sm" variant="outline" asChild className={ isRead ? 'bg-gray-200 hover:bg-gray-300' : '' }>
<Link className="relative" href={ `/comic/${ comic.comic.path_word }/${ props.uuid }` }>
{ props.name }
{ isNew && <Plus size={ 16 } className="text-xs absolute right-0 top-0" /> }
@@ -64,7 +65,6 @@ export default function Chapters({ auth, comic, chapters }) {
const toggleAscending = (e) => {
setAscending(!ascending);
}
return (

2
resources/js/Pages/Comic/Favourites.jsx
View File

@@ -17,8 +17,6 @@ export default function Favourites({ auth, favourites }) {
const favouriteOnClickHandler = (pathword) => {
axios.post(route('comics.postFavourite'), { pathword: pathword }).then(res => {
setStateFavourites(stateFavourites.filter(f => f.pathword !== pathword));
console.log(stateFavourites);
//setFavourites(res.data);
});
toast({

116
resources/js/Pages/Comic/Histories.jsx Normal file
View File

@@ -0,0 +1,116 @@
import { useState } from "react";
import { Head, router } from '@inertiajs/react';
import AppLayout from '@/Layouts/AppLayout.jsx';
import { BreadcrumbItem, BreadcrumbPage, BreadcrumbSeparator } from "@/components/ui/breadcrumb";
import { Button } from '@/components/ui/button';
import Checkbox from "@/components/Checkbox";
import { Pagination, PaginationContent, PaginationItem, PaginationLink, PaginationNext, PaginationPrevious } from "@/components/ui/pagination"
import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from "@/components/ui/table";
import { useToast } from "@/hooks/use-toast.js";
export default function Histories({ auth, histories }) {
const { toast } = useToast();
const [ids, setIds] = useState([]);
const checkboxOnChangeHandler = (e) => {
if (e.target.checked) {
// Add to ids
setIds([...ids, e.target.dataset.hid]);
} else {
setIds(ids.filter(id => id !== e.target.dataset.hid));
}
}
const deleteButtonOnClickHandler = (e) => {
if (ids.length === 0) {
toast({
title: "Error",
description: `No items selected.`,
});
return;
}
router.visit(route('comics.destroyHistories'), {
data: { ids: ids },
method: "PATCH",
only: ['histories'],
onSuccess: data => {
toast({
title: "All set",
description: `The histories has been deleted.`,
});
}
});
}
return (
<AppLayout auth={ auth } header={
<>
<BreadcrumbSeparator />
<BreadcrumbItem>
<BreadcrumbPage>Histories</BreadcrumbPage>
</BreadcrumbItem>
</>
}>
<Head>
<title>Histories</title>
</Head>
<div className="p-3 pt-1 w-[90%] mx-auto">
<div className="flex justify-end">
<Button size="sm" onClick={ () => deleteButtonOnClickHandler() }>Delete Selected</Button>
</div>
<Table>
<TableHeader>
<TableRow>
<TableHead>Select</TableHead>
<TableHead>Comic</TableHead>
<TableHead>Chapter</TableHead>
<TableHead>Read at</TableHead>
</TableRow>
</TableHeader>
<TableBody>
{ histories.data.map((h, i) => (
<TableRow key={ i }>
<TableCell>
<label>
<Checkbox data-hid={ h.hid } defaultChecked={ false }
name={ `checkbox-${ h.hid }` }
onChange={ (e) => checkboxOnChangeHandler(e) } />
</label>
</TableCell>
<TableCell>{ h.name }</TableCell>
<TableCell>{ h.comic.name }</TableCell>
<TableCell>{ h.created_at }</TableCell>
</TableRow>
)) }
</TableBody>
</Table>
<div>
<Pagination className="justify-end">
<PaginationContent>
{ histories.current_page > 1 && (
<PaginationItem>
<PaginationPrevious href={ histories.prev_page_url } only={['histories']} />
</PaginationItem>
) }
<PaginationItem>
<PaginationLink href="#">{ histories.current_page }</PaginationLink>
</PaginationItem>
<PaginationItem>
</PaginationItem>
<PaginationItem>
{ histories.current_page < histories.last_page && (
<PaginationItem>
<PaginationNext href={ histories.next_page_url } only={['histories']} />
</PaginationItem>
) }
</PaginationItem>
</PaginationContent>
</Pagination>
</div>
</div>
</AppLayout>
);
}