import { useState, useEffect } from "react";
import { listDishes } from "@/utils/api/dishApi"
import { DishType } from "@/types/DishType"

export const useFetchDishes = () => {
    const [dishes, setDishes] = useState<DishType[]>([]);
    const [isLoading, setIsLoading] = useState<boolean>(true);
    const [error, setError] = useState<string | null>(null);

    useEffect(() => {
        const fetchDishes = async () => {
            listDishes()
                .then((dishes: DishType[]) => setDishes(dishes))
                .catch((err) => setError((err as Error).message || "An error occurred."))
                .finally(() => setIsLoading(false));
        };

        fetchDishes();
    }, []);

    return { dishes, isLoading, error };
};