grand commit

components/shared/home/feature-cards.tsx

@@ -1,34 +1,22 @@
-import Image from 'next/image'
-import * as React from 'react'
-
-import {cards} from '@/lib/data'
-import {Card, CardContent} from '@/ui/card'
+import FeatureCardFront from '@/components/shared/store/feature-card-front'
+import {CategoryPageSqlSchema} from '@/lib/data/models/sqlSchemas'
 import {Carousel, CarouselContent, CarouselItem} from '@/ui/carousel'
 
-export default function FeatureCards() {
+export default function FeatureCards({
+	items
+}: {
+	items: CategoryPageSqlSchema[]
+}) {
 	return (
 		<Carousel className='mx-auto w-full'>
 			<CarouselContent className='-ml-2 md:-ml-4'>
-				{cards.map((card: any) => (
+				{items.map((card: any) => (
 					<CarouselItem
 						key={card.title}
-						className='pl-3 md:basis-1/3 lg:basis-1/4 xl:basis-1/5'
+						className='py-4 pl-3 md:basis-1/3 lg:basis-1/4'
 					>
 						<div className='p-1'>
-							<Card className='border-[2px] border-brand-violet'>
-								<CardContent className='aspect-card flex items-center justify-center p-1'>
-									<CarouselItem>
-										<Image
-											src={card.image}
-											width={256}
-											height={256}
-											className='object-scale-down'
-											priority
-											alt={''}
-										/>
-									</CarouselItem>
-								</CardContent>
-							</Card>
+							<FeatureCardFront card={card} />
 						</div>
 					</CarouselItem>
 				))}