From 54ae1c724ed0d06c8eeb6a8011ccc1d2495da28c Mon Sep 17 00:00:00 2001
From: Fabian Steeg <steeg@hbz-nrw.de>
Date: Thu, 16 Dec 2021 17:35:21 +0100
Subject: [PATCH] Show products in member pages (#445)

---
 gatsby/lobid/src/components/member.html.js   |  3 +++
 gatsby/lobid/src/components/products.html.js | 24 ++++++++++++++++++
 gatsby/lobid/src/templates/member.js         | 26 ++++++++++++++++++++
 3 files changed, 53 insertions(+)
 create mode 100644 gatsby/lobid/src/components/products.html.js

diff --git a/gatsby/lobid/src/components/member.html.js b/gatsby/lobid/src/components/member.html.js
index 064aa6b..29195d5 100644
--- a/gatsby/lobid/src/components/member.html.js
+++ b/gatsby/lobid/src/components/member.html.js
@@ -4,6 +4,7 @@ import md5 from 'md5';
 import Header from "./header.html";
 import Footer from "./footer.html";
 import Publications from "./publications.html";
+import Products from "./products.html";
 
 import "./css/lobid.css";
 import "./css/bootstrap.min.css";
@@ -66,6 +67,8 @@ export class Member extends React.Component {
               <img alt={this.props.member.name.label} id="index-image" src={this.props.member.image || `https://gravatar.com/avatar/${md5(this.props.member.email)}?s=300&d=identicon`} />
             </div>
           </div>
+          <p className="lead">{this.props.makesOfferName}</p>
+          <Products products={this.props.products} lang={this.props.lang}/>
           <Publications pubs={this.props.pubs} publications={this.props.publications} />
           <Footer companyDetails={this.props.companyDetails} privacy={this.props.privacy} />
         </div>
diff --git a/gatsby/lobid/src/components/products.html.js b/gatsby/lobid/src/components/products.html.js
new file mode 100644
index 0000000..9ce1a4a
--- /dev/null
+++ b/gatsby/lobid/src/components/products.html.js
@@ -0,0 +1,24 @@
+import React from "react";
+import { getImage, simpleId } from './helpers.js'
+
+export default class Products extends React.Component {
+  render() {
+    return (
+      <div className="container">
+        {this.props.products.map((product) =>
+          <div key={product.id}>
+            {getImage(product.id, product.image)}
+            <p className="details">
+              <a href={"/product/" + simpleId(product.id)}>
+                {product.name && product.name[this.props.lang]}
+              </a>
+              <br />
+              {(product.slogan && product.slogan[this.props.lang]) || (product.name && product.name[this.props.lang])}
+            </p>
+          </div>
+        )}
+        <p />
+      </div>
+    );
+  }
+}
diff --git a/gatsby/lobid/src/templates/member.js b/gatsby/lobid/src/templates/member.js
index 0313212..ada4c57 100644
--- a/gatsby/lobid/src/templates/member.js
+++ b/gatsby/lobid/src/templates/member.js
@@ -6,6 +6,10 @@ export default function MemberPage({ data, location, pageContext }) {
   const member = data.allFile.edges[0].node.childTeamJson
   return (<Member
     member={member}
+    products={data.allProductJson.edges
+      .map(edge => edge.node)
+      .filter(p => p.membership.find(m => m.member.id === member.id))
+    }
     pubs={data.allPublicationJson.edges
       .map(edge => edge.node)
       .filter(p => p.creator.find(c => c.id === member.id))
@@ -22,6 +26,7 @@ export default function MemberPage({ data, location, pageContext }) {
     companyDetails="Impressum"
     privacy="Datenschutz"
     contactPointId="mailto:lobid-admin@hbz-nrw.de"
+    lang="de"
   />);
 }
 
@@ -66,5 +71,26 @@ export const query = graphql`
         }
       }
     }
+    allProductJson {
+      edges {
+        node {
+          id
+          image
+          name {
+            de
+            en
+          }
+          slogan {
+            de
+            en
+          }
+          membership {
+            member {
+              id
+            }
+          }
+        }
+      }
+    }
   }
 `;