‘use client’
import React, { useEffect, useState } from ‘react’;

export default function Page() {

const [products, setProducts] = useState(null); 

useEffect(() => {
    const fetchData = async () => {
        try {
            const response = await fetch("https://dummyjson.com/products");
            const data = await response.json();
            console.log(data)
            setProducts(data); 
        } catch (error) {
            console.error("Error fetching data:", error);
        }
    };

    fetchData();
}, []);

if (products === null) {
    return <div>Loading...</div>; 
}

return (
    <div>
        <h1>Product List</h1>
        <ul>
            {products.map((product, index) => (
                <li key={index}>{product.name}</li> 
            ))}
        </ul>
    </div>
);

}

Error : unhandled Runtime error

products.map is not a function

why products.map is not a function error got please tell us when i console.log(data) i got api data but not diplay on browser