diff --git a/src/components/sections/NewArrivalsSection.tsx b/src/components/sections/NewArrivalsSection.tsx new file mode 100644 index 0000000..270120c --- /dev/null +++ b/src/components/sections/NewArrivalsSection.tsx @@ -0,0 +1,92 @@ +'use client' + +import { useVulaContent } from '@/hooks/useVulaContent' +import Image from 'next/image' +import Link from 'next/link' +import { Card, CardContent, CardTitle } from '@/components/ui/Card' +import Badge from '@/components/ui/Badge' +import Button from '@/components/ui/Button' + +export default function NewArrivalsSection() { + const { items, loading } = useVulaContent('product_carousels') + + if (loading) { + return ( +
+
+
+ ) + } + + if (items.length === 0) return null + + return ( +
+
+
+ Fresh Drops +

New Arrivals

+

Straight from the design studio to the pavement.

+
+ +
+ {items.map((item) => { + const d = item.data as { title?: string; description?: string; price?: number; image?: string } + return ( + +
+ {d.image ? ( + {d.title + ) : ( +
+ No Image +
+ )} +
+ + + {d.title || ''} + + {d.description && ( +

{d.description}

+ )} +
+ {d.price !== undefined && ( + + R{Number(d.price || 0).toFixed(2)} + + )} + + + +
+
+
+ ) + })} +
+ +
+ + + +
+
+
+ ) +}