"use client";
import Link from "next/link";
import { useEffect, useState } from "react";
import { motion, useReducedMotion } from "framer-motion";
export type LandingFeature = {
href: string;
title: string;
blurb: string;
cta: string;
icon: "services" | "classifieds" | "jobs" | "explore";
};
const icons = {
services: (
),
classifieds: (
),
jobs: (
),
explore: (
),
};
function FeatureCard({
feature,
index,
ready,
reduce,
}: {
feature: LandingFeature;
index: number;
ready: boolean;
reduce: boolean | null;
}) {
const card = (
{icons[feature.icon]}
{feature.title}
{feature.blurb}
{feature.cta}
→
);
if (!ready || reduce) return card;
return (
{card}
);
}
export function LandingFeatures({
features,
title,
subtitle,
}: {
features: LandingFeature[];
title: string;
subtitle: string;
}) {
const [ready, setReady] = useState(false);
const reduce = useReducedMotion();
useEffect(() => {
setReady(true);
}, []);
return (
La plataforma
{title}
{subtitle}
{features.map((f, i) => (
))}
);
}