import { useState, useEffect } from "react";
import axios from "axios";
import { GET_PROVINCE_LISTS } from "@/core/utils/routes";

const useProvinces = () => {
    const [provinces, setProvinces] = useState([]);
    const [loadingProvinces, setLoadingProvinces] = useState(true);
    const [errorProvinces, setErrorProvinces] = useState(null);

    useEffect(() => {
        const fetchCities = async () => {
            try {
                const response = await axios.get(`${GET_PROVINCE_LISTS}`); // Fetch the cities from the API
                setProvinces(response.data.data); // Set the cities data
                setLoadingProvinces(false); // Set loading to false after successful fetch
            } catch (e) {
                console.error("Error fetching cities:", e);
                setErrorProvinces(e);
                setLoadingProvinces(false);
            }
        };

        fetchCities(); // Call the fetch function
    }, []); // Empty dependency array to ensure it only runs once

    return { provinces, loadingProvinces, errorProvinces };
};

export default useProvinces;
