import React from 'react'
import Link from "next/link";
import { getProducts } from '@/app/lib/api';

const SitemapSect = async () => {
    const product = await getProducts();
    const staticLinks = [
        { name: "Home", slug: "" },
        { name: "Company Profile", slug: "about" },
        { name: "Our Products", slug: "products" },
        { name: "Contact Us", slug: "contact" },
        { name: "Market Place", slug: "location" }
    ];
    return (
        <div className="sitemap py-15 bg-gray-100">
            <div className="container">
                <div className="row">
                    <div className="navigation-links mb-10">
                        <ul className="grid lg:grid-cols-3 md:grid-cols-2 grid-cols-1 gap-4">
                            {
                                staticLinks.map((value, index) => (
                                    <li key={index} ><Link href={`/${value.slug}`} className="btn w-full text-white px-3 py-3 rounded-lg block text-center">{value.name}</Link></li>
                                ))
                            }
                        </ul>
                    </div>

                    <div className="navigation-links">
                        <ul className="grid lg:grid-cols-3 md:grid-cols-2 grid-cols-1 gap-4">
                            {
                                product.map((value, index) => (
                                    <li key={index} ><Link href={`/products/${value.slug}`} className="btn w-full text-white px-3 py-3 rounded-lg block text-center">{value.name}</Link></li>
                                ))
                            }
                        </ul>
                    </div>
                </div>
            </div>
        </div>
    )
}

export default SitemapSect