From d21ebfd0017ac6d62542d708c6bb5e17f005612f Mon Sep 17 00:00:00 2001
From: bender <kudin.dima@gmail.com>
Date: Sun, 8 Mar 2026 22:23:34 +0000
Subject: [PATCH] Switch to version 1: modified src/hooks/useProducts.ts

---
 src/hooks/useProducts.ts | 61 +++++++++++++++++++++-------------------
 1 file changed, 32 insertions(+), 29 deletions(-)

diff --git a/src/hooks/useProducts.ts b/src/hooks/useProducts.ts
index ef12004..53609fa 100644
--- a/src/hooks/useProducts.ts
+++ b/src/hooks/useProducts.ts
@@ -1,36 +1,39 @@
-import { useState, useEffect } from 'react';
+"use client";
 
-interface Product {
-  id: string;
-  name: string;
-  price: string;
-  imageSrc: string;
-}
+import { useEffect, useState } from "react";
+import { Product, fetchProducts } from "@/lib/api/product";
 
 export function useProducts() {
-  const [products, setProducts] = useState<Product[]>([]);
-  const [loading, setLoading] = useState(true);
-  const [error, setError] = useState<string | null>(null);
+    const [products, setProducts] = useState<Product[]>([]);
+    const [isLoading, setIsLoading] = useState(true);
+    const [error, setError] = useState<Error | null>(null);
 
-  useEffect(() => {
-    const fetchProducts = async () => {
-      try {
-        setLoading(true);
-        // Simulate fetch
-        const response = await fetch('/api/products');
-        const data = await response.json();
-        setProducts(data);
-        setError(null);
-      } catch (err) {
-        setError('Failed to fetch products');
-        setProducts([]);
-      } finally {
-        setLoading(false);
-      }
-    };
+    useEffect(() => {
+        let isMounted = true;
 
-    fetchProducts();
-  }, []);
+        async function loadProducts() {
+            try {
+                const data = await fetchProducts();
+                if (isMounted) {
+                    setProducts(data);
+                }
+            } catch (err) {
+                if (isMounted) {
+                    setError(err instanceof Error ? err : new Error("Failed to fetch products"));
+                }
+            } finally {
+                if (isMounted) {
+                    setIsLoading(false);
+                }
+            }
+        }
 
-  return { products, loading, error };
+        loadProducts();
+
+        return () => {
+            isMounted = false;
+        };
+    }, []);
+
+    return { products, isLoading, error };
 }