45 lines
1.4 KiB
TypeScript
45 lines
1.4 KiB
TypeScript
"use client";
|
||
|
||
import React, { useState, useEffect } from "react";
|
||
import FlipbookCatalog from "../../components/catalog/FlipbookCatalog";
|
||
import { productService } from "../../lib/services/productService";
|
||
import { Product } from "../../lib/data/products";
|
||
|
||
export default function CatalogClient() {
|
||
const [products, setProducts] = useState<Product[]>([]);
|
||
const [loading, setLoading] = useState(true);
|
||
|
||
useEffect(() => {
|
||
productService.getProducts({ limit: 999 })
|
||
.then(res => {
|
||
if (res.data && res.data.length > 0) {
|
||
setProducts(res.data);
|
||
} else {
|
||
setProducts([]);
|
||
}
|
||
})
|
||
.catch(err => {
|
||
console.error("Catalog fetch error:", err);
|
||
setProducts([]);
|
||
})
|
||
.finally(() => setLoading(false));
|
||
}, []);
|
||
|
||
if (loading) {
|
||
return (
|
||
<div className="min-h-screen bg-slate-900 text-slate-100 flex items-center justify-center font-vazir">
|
||
<div className="text-center space-y-4">
|
||
<div className="w-12 h-12 border-4 border-amber-400 border-t-transparent rounded-full animate-spin mx-auto" />
|
||
<p className="text-sm font-bold text-slate-300">در حال بارگذاری کاتالوگ دیجیتال Canina Pharma...</p>
|
||
</div>
|
||
</div>
|
||
);
|
||
}
|
||
|
||
return (
|
||
<div className="w-full min-h-screen bg-slate-950">
|
||
<FlipbookCatalog products={products} />
|
||
</div>
|
||
);
|
||
}
|