ver productos y detalles

apps/web/feactures/inventory/actions/actions.ts

@@ -5,7 +5,8 @@ import {
   InventoryTable,
   productMutate,
   // editInventory,
-  productApiResponseSchema
+  productApiResponseSchema,
+  getProduct
 } from '../schemas/inventory';
 
 import { auth } from '@/lib/auth';
@@ -81,7 +82,7 @@ export const getAllProducts = async (params: {
   );
 
   if (error) {
-    console.error('Error:', error);
+    console.error('Errorrrrr:', error.details);
     throw new Error(error.message);
   }
 
@@ -100,6 +101,21 @@ export const getAllProducts = async (params: {
   };
 };
 
+export const getProductById = async (id: number) => {
+  const [error, data] = await safeFetchApi(
+    getProduct,
+    `/products/id/${id}`,
+    'GET',
+  );
+
+  if (error) {
+    console.error('❌ Error en la API:', error);
+    throw new Error(error.message);
+  }
+
+  return data;
+};
+
 export const createProductAction = async (payload: InventoryTable) => {
   const session = await auth()
   const userId = session?.user?.id

apps/web/feactures/inventory/components/inventory/product-tables/columns.tsx

@@ -9,9 +9,9 @@ export const columns: ColumnDef<InventoryTable>[] = [
     accessorKey: 'urlImg',
     header: 'img',
     cell: ({ row }) => {
-      const status = row.getValue("urlImg") as string | undefined;
+      const url = row.getValue("urlImg") as string | undefined;
         return (
-          <img src={`http://localhost:3000/${status}`} alt="Image" width={64} height={64} className="rounded"/> 
+          <img src={`http://localhost:3000/${url}`} alt="" width={64} height={64} className="rounded"/> 
         )
     },
   },

apps/web/feactures/inventory/components/products/product-list.tsx

@@ -1,67 +1,54 @@
-// Este componente maneja la lista de encuestas en el panel de administración
-// Funcionalidades:
-// - Muestra todas las encuestas en una tabla
-// - Permite editar encuestas existentes
-// - Permite eliminar encuestas con confirmación
-// - Muestra el estado (publicada/borrador), fechas y conteo de respuestas
-
-
 'use client';
 
-import { Button } from '@repo/shadcn/button';
 import {
   Card,
   CardContent,
-  CardDescription,
   CardFooter,
   CardHeader,
   CardTitle,
 } from '@repo/shadcn/card';
 import { useRouter } from 'next/navigation';
-// import { useSurveysForUserQuery } from '@/feactures/surveys/hooks/use-query-surveys';
 import { useAllProductQuery } from '@/feactures/inventory/hooks/use-query-products';
 import { allProducts } from '../../schemas/inventory';
-import { Badge } from '@repo/shadcn/badge';
-import { BadgeCheck } from 'lucide-react';
-
-export function SurveyList() {
+import { ImageIcon } from 'lucide-react';
 
+export function ProductList() {
   const router = useRouter();
-  const {data: produts} = useAllProductQuery()
+  const { data: produts } = useAllProductQuery();
 
-  const handleRespond = (surveyId: number) => {
-    router.push(`/dashboard/productos/${surveyId}`);
+  const handle = (id: number) => {
+    router.push(`/dashboard/productos/${id}`);
   };
 
-  // console.log(produts?.data)
   return (
-    <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
+    <div className="w-full grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-4 xl:grid-cols-5 gap-4">
       {produts?.meta.totalPages === 0 ? (
-        <div className="col-span-full text-center py-10">
-          <p className="text-muted-foreground">No hay productos disponibles en este momento.</p>
-        </div>
+        <section className="col-span-full text-center py-10">
+          <p className="text-muted-foreground">
+            No hay productos disponibles en este momento.
+          </p>
+        </section>
       ) : (
         produts?.data.map((data: allProducts) => (
-          
-          <Card key={data.id} className="flex flex-col">
+          <Card
+            key={data.id}
+            className="cursor-pointer flex flex-col"
+            onClick={() => handle(Number(data.id))}
+          >
             <CardHeader>
-              <CardTitle>{data.title}</CardTitle>
-              <CardDescription>{data.description}</CardDescription>
+              <CardTitle className="text-base font-bold truncate">
+                {data.title.charAt(0).toUpperCase() + data.title.slice(1)}
+              </CardTitle>
             </CardHeader>
-            <CardContent className="flex-grow">
-              <div className="space-y-2 text-sm">
-                <div className="flex justify-between">
-                  <img src="/data:image/png;base64, iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAQAAAC1HAwCAAAAC0lEQVR42mP8/x8AAwMCAO+ip1sAAAAASUVORK5CYII" alt="" />
-                </div>
-              </div>
+            <CardContent className="p-0 flex-grow">
+              <img
+                className="object-cover w-full h-full aspect-square"
+                src={`http://localhost:3000/${data.urlImg}`}
+                alt=""
+              />
             </CardContent>
-            <CardFooter className="flex justify-center">
-                <Button 
-                  className="w-full" 
-                  onClick={() => handleRespond(Number(data.id))}
-                >
-                  Ver
-                </Button>
+            <CardFooter className="flex justify-between items-center p-4">
+              <p className="font-semibold text-lg">$ {data.price}</p>
             </CardFooter>
           </Card>
         ))

apps/web/feactures/inventory/schemas/inventory.ts

@@ -16,7 +16,7 @@ export const product = z.object({
   stock: z.number(),
   price: z.string(),
   urlImg: z.string(),
-  userId: z.number().optional(),
+  userId: z.number().optional()
 });
 
 export const editInventory = z.object({
@@ -38,10 +38,8 @@ export const allProducts = z.object({
   stock: z.number(),
   price: z.string(),
   urlImg: z.string(),
-  user: z.object({
-    userId: z.number(),
-    username: z.string(),
-  })
+  userId: z.number(),
+  fullname: z.string()
 })
 
 export const ApiResponseSchema = z.object({
@@ -77,4 +75,9 @@ export const productApiResponseSchema = z.object({
 export const productMutate = z.object({
   message: z.string(),
   data: product,
+})
+
+export const getProduct = z.object({
+  message: z.string(),
+  data: allProducts,
 })