From 21508a3514500f8f38ddaa8bef7a9cd420d76628 Mon Sep 17 00:00:00 2001
From: HombreLaser <sebastian-440@live.com>
Date: Mon, 22 May 2023 21:18:20 -0600
Subject: Añade carrito
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/routes/account/cart.tsx | 41 +++++++++++++++++++++++++++++++++++++++++
 1 file changed, 41 insertions(+)
 create mode 100644 src/routes/account/cart.tsx

(limited to 'src/routes/account/cart.tsx')

diff --git a/src/routes/account/cart.tsx b/src/routes/account/cart.tsx
new file mode 100644
index 0000000..a98cf20
--- /dev/null
+++ b/src/routes/account/cart.tsx
@@ -0,0 +1,41 @@
+import { useLoaderData } from "react-router-dom";
+import { cartLoader } from "../../clients/loaders";
+import ProductCart from "../../components/product_cart";
+import { Product } from "../../models/product";
+import MainContentLayout from "../../components/main_content_layout";
+import { CartXFill } from "react-bootstrap-icons";
+
+export default function Cart() {
+  let products;
+  const data = useLoaderData() as Array<Product>;
+
+  if(data.length > 0) {
+    products = data.map(product =>
+      <ul>
+        <li key={product.id}>
+          <ProductCart product={product}/>
+        </li>
+      </ul>
+    );
+  }
+  else {
+    products = (
+      <div>
+        <div className="flex justify-center my-4 w-4/6">
+          <CartXFill color="rgb(55 65 81)" size={256}/>
+        </div>
+        <div className="flex justify-center my-4 w-4/6 text-2xl text-gray-900 my-2">
+          Su carrito está vacío, añada algunos productos para empezar a comprar.
+        </div>
+      </div>
+    );
+  }
+
+  return(
+    <>
+      <MainContentLayout>
+        {products}
+      </MainContentLayout>
+    </>
+  );
+}
\ No newline at end of file
-- 
cgit v1.2.3