import React, { useState } from 'react';
import { Head, Link } from '@inertiajs/react';
import { Star } from 'lucide-react';
import AppLayout from '@/Layouts/AppLayout.jsx';
import { Badge } from '@/components/ui/badge';
import { Button } from '@/components/ui/button'
import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@/components/ui/card';
import { Pagination, PaginationContent, PaginationItem, PaginationNext, PaginationPrevious } from '@/components/ui/pagination';
import { useToast } from '@/hooks/use-toast.js';
export default function Index({ comics, offset, auth }) {
const url = new URL(window.location); // searchParams
const [favourites, setFavourites] = useState(auth.user?.favourites ?? []);
const { toast } = useToast();
/**
* On click handler for the star
* Do posting and make a toast
*
* @param pathword
*/
const favouriteOnClickHandler = (pathword) => {
axios.post(route('comics.postFavourite'), { pathword: pathword }).then(res => {
setFavourites(res.data);
});
toast({
title: "All set",
description: `${comics.list.filter(c => c.path_word === pathword)[0].name} is now in / remove your favorite list.`,
});
}
/**
* Generate info card for comics
* @param props
* @returns {JSX.Element}
* @constructor
*/
const ComicCard = (props) => (
{ props.name }
{ props.author && props.author.map(a => (
{ a.name }
)
) }
);
/**
* Loop and return all info cards
* @param comics
* @returns {*}
* @constructor
*/
const ComicCards = (comics) => {
return comics.list.map((comic, i) => );
}
return (
Home
{ parseInt(offset) !== 0 &&
}
);
}