diff --git a/src/hooks/useProduct.ts b/src/hooks/useProduct.ts index 3407f3a..33d7dc6 100644 --- a/src/hooks/useProduct.ts +++ b/src/hooks/useProduct.ts @@ -1,45 +1,48 @@ -"use client"; +import { useState, useEffect } from 'react'; +import { getProductById } from '@/lib/api/product'; -import { useEffect, useState } from "react"; -import { Product, fetchProduct } from "@/lib/api/product"; - -export function useProduct(productId: string) { - const [product, setProduct] = useState(null); - const [isLoading, setIsLoading] = useState(true); - const [error, setError] = useState(null); - - useEffect(() => { - let isMounted = true; - - async function loadProduct() { - if (!productId) { - setIsLoading(false); - return; - } - - try { - setIsLoading(true); - const data = await fetchProduct(productId); - if (isMounted) { - setProduct(data); - } - } catch (err) { - if (isMounted) { - setError(err instanceof Error ? err : new Error("Failed to fetch product")); - } - } finally { - if (isMounted) { - setIsLoading(false); - } - } - } - - loadProduct(); - - return () => { - isMounted = false; - }; - }, [productId]); - - return { product, isLoading, error }; +interface ProductState { + product: unknown | null; + isLoading: boolean; + error: string | null; } + +const useProduct = (productId: string) => { + const [state, setState] = useState({ + product: null, + isLoading: false, + error: null, + }); + + useEffect(() => { + if (!productId) return; + + const fetchProduct = async () => { + setState((prev) => ({ + ...prev, + isLoading: true, + })); + + try { + const product = await getProductById(productId); + setState((prev) => ({ + ...prev, + isLoading: false, + product, + })); + } catch (err) { + setState((prev) => ({ + ...prev, + isLoading: false, + error: 'Failed to fetch product', + })); + } + }; + + fetchProduct(); + }, [productId]); + + return state; +}; + +export default useProduct;