"use client"; import { useEffect, useState } from "react"; type Service = { id: number; title: string; slug: string; description: string | null; icon: string | null; image: string | null; featured: boolean; active: boolean; }; export default function Services() { const [services, setServices] = useState([]); const [loading, setLoading] = useState(true); useEffect(() => { const getServices = async () => { try { const response = await fetch("/api/services"); if (!response.ok) { throw new Error("Failed to fetch services"); } const result = await response.json(); if (result.success && Array.isArray(result.data)) { setServices( result.data.filter( (service: Service) => service.active ) ); } else { setServices([]); } } catch (error) { console.error("GET SERVICES:", error); setServices([]); } finally { setLoading(false); } }; getServices(); }, []); if (loading) { return ( <>
); } if (services.length === 0) { return null; } return ( <>
{/* ===================================================== HEADER ====================================================== */}