46 lines
1.2 KiB
TypeScript
46 lines
1.2 KiB
TypeScript
import * as React from "react"
|
|
|
|
import { cn } from "@/lib/utils"
|
|
import { MTGCardProps } from "@/components/ui/mtg-card"
|
|
import { MTGCard } from '@/components/ui/mtg-card'
|
|
|
|
interface carte_from_stats {
|
|
id: string,
|
|
name: string,
|
|
normal_image: string,
|
|
sanitized_name: string,
|
|
nbr_decks: number,
|
|
total_decks: number,
|
|
percent_decks: number,
|
|
price: string,
|
|
cardmarket_uri: string
|
|
}
|
|
|
|
interface CardGroupProps {
|
|
className?: string,
|
|
groupName: string,
|
|
cards: carte_from_stats[],
|
|
showPrice?: boolean,
|
|
showStats?: boolean
|
|
}
|
|
|
|
const CardGroup = ({ className, groupName, cards, showPrice=true, showStats=true}: CardGroupProps) => {
|
|
return (
|
|
<div>
|
|
<h1>{groupName}</h1>
|
|
<div
|
|
className={cn(
|
|
"flex flex-row flex-wrap gap-4 p-8",
|
|
className
|
|
)}
|
|
>
|
|
|
|
{cards.map((card: carte_from_stats) => (
|
|
<MTGCard key={card.id} cardname={card.name} imageURI={card.normal_image} url={"/card/" + card.sanitized_name} nbrDecks={card.nbr_decks} totalDecks={card.total_decks} percentDecks={card.percent_decks} price={card.price} cardmarketURI={card.cardmarket_uri}/>
|
|
))}
|
|
</div>
|
|
</div>
|
|
)}
|
|
MTGCard.displayName = "MTGCard"
|
|
|
|
export { CardGroup }
|