Added related products

chec · Feb 10, 2021 · 48e60d7 · 48e60d7
1 parent ef92886
commit 48e60d7
Showing 1 changed file with 27 additions and 1 deletion.
diff --git a/src/components/product/listing/ProductListing.tsx b/src/components/product/listing/ProductListing.tsx
@@ -1,4 +1,5 @@
 import { IonCard, IonCol, IonGrid, IonRow } from "@ionic/react";
+import ProductCard from "../product-card/ProductCard";
 import ProductDescription from "./description/ProductDescription";
 import "./ProductListing.css";
 
@@ -33,7 +34,7 @@ const ProductListing: React.FC<ProductListingProps> = ({ product }) => {
  );
  })}
  </IonRow>
- <IonRow className="meta">
+ <IonRow className="meta ion-hide-md-down">
  {(meta.attributes || []).map((fileName) => {
  return (
  <IonCol
@@ -57,6 +58,31 @@ const ProductListing: React.FC<ProductListingProps> = ({ product }) => {
  <ProductDescription product={product} />
  </IonCol>
  </IonRow>
+ <IonRow>
+ <IonCol>
+ <IonGrid>
+ <IonRow>
+ <h3>Some other things you might like</h3>
+ </IonRow>
+ <IonRow>
+ {related_products.map((related_product) => {
+ return (
+ <IonCol
+ size="12"
+ sizeSm="6"
+ sizeMd="6"
+ sizeLg="3"
+ sizeXl="3"
+ key={related_product.id}
+ >
+ <ProductCard product={related_product} />
+ </IonCol>
+ );
+ })}
+ </IonRow>
+ </IonGrid>
+ </IonCol>
+ </IonRow>
  </IonGrid>
  );
 };