From ea69032c4a8468a24f105f79d3ab6742e07da1cd Mon Sep 17 00:00:00 2001
From: Maksym Bykovskyy <maksym@ecadlabs.com>
Date: Mon, 9 Dec 2019 19:48:28 +0000
Subject: [PATCH] Fix for broken images

---
 gitlab-pages/website/pages/en/404.js     | 25 +++++++++++++++++++-----
 gitlab-pages/website/pages/en/contact.js | 20 +++++++++++--------
 gitlab-pages/website/pages/en/index.js   | 14 +++++++------
 3 files changed, 40 insertions(+), 19 deletions(-)

diff --git a/gitlab-pages/website/pages/en/404.js b/gitlab-pages/website/pages/en/404.js
index 9fab36f59..070e50391 100644
--- a/gitlab-pages/website/pages/en/404.js
+++ b/gitlab-pages/website/pages/en/404.js
@@ -5,11 +5,26 @@ module.exports = props => {
   return (
     <div id="pageNotFoundPage" className="centered">
       <div id="mural">
-        <img className="muralPolygon1" src="img/404-mural/polygon1.svg" />
-        <img className="muralPolygon2" src="img/404-mural/polygon2.svg" />
-        <img className="muralPolygon3" src="img/404-mural/polygon3.svg" />
-        <img className="muralPolygon4" src="img/404-mural/polygon4.svg" />
-        <img className="muralPolygon5" src="img/404-mural/polygon5.svg" />
+        <img
+          className="muralPolygon1"
+          src={`${props.config.baseUrl}img/404-mural/polygon1.svg`}
+        />
+        <img
+          className="muralPolygon2"
+          src={`${props.config.baseUrl}img/404-mural/polygon2.svg`}
+        />
+        <img
+          className="muralPolygon3"
+          src={`${props.config.baseUrl}img/404-mural/polygon3.svg`}
+        />
+        <img
+          className="muralPolygon4"
+          src={`${props.config.baseUrl}img/404-mural/polygon4.svg`}
+        />
+        <img
+          className="muralPolygon5"
+          src={`${props.config.baseUrl}img/404-mural/polygon5.svg`}
+        />
       </div>
       <div id="message">
         <div className="title">404</div>
diff --git a/gitlab-pages/website/pages/en/contact.js b/gitlab-pages/website/pages/en/contact.js
index cb7a7fb67..3a41f6cd1 100644
--- a/gitlab-pages/website/pages/en/contact.js
+++ b/gitlab-pages/website/pages/en/contact.js
@@ -63,7 +63,7 @@ const COMMUNICATION_CHANNELS = [
   }
 ];
 
-const Portrait = props => {
+const Portrait = (config, props) => {
   return (
     <a
       href={props.link}
@@ -72,7 +72,7 @@ const Portrait = props => {
       target="_blank"
       rel="noopener noreferrer"
     >
-      <img className="portrait" src={props.image} />
+      <img className="portrait" src={`${config.baseUrl}${props.image}`} />
       <div className="overlay">
         <span>{props.firstName}</span>
         <span>{props.lastName}</span>
@@ -81,7 +81,7 @@ const Portrait = props => {
   );
 };
 
-const CommunicationChannel = props => {
+const CommunicationChannel = (config, props) => {
   return (
     <a
       className="option"
@@ -89,13 +89,13 @@ const CommunicationChannel = props => {
       target="_blank"
       rel="noopener noreferrer"
     >
-      <img className="icon" src={props.icon} />
+      <img className="icon" src={`${config.baseUrl}${props.icon}`} />
       {props.description}
     </a>
   );
 };
 
-module.exports = () => {
+module.exports = props => {
   const pinnedMembers = TEAM.filter(member => member.pinned);
   const membersCeilCount = Math.ceil(pinnedMembers.length / 2);
   const membersInFistColumn = pinnedMembers.slice(0, membersCeilCount);
@@ -104,15 +104,19 @@ module.exports = () => {
   return (
     <div id="contactPage" className="centered">
       <div id="mural">
-        <div className="column">{membersInFistColumn.map(Portrait)}</div>
+        <div className="column">
+          {membersInFistColumn.map(entry => Portrait(props.config, entry))}
+        </div>
         <div className="offset column">
-          {membersInSecondColumn.map(Portrait)}
+          {membersInSecondColumn.map(entry => Portrait(props.config, entry))}
         </div>
       </div>
       <div id="message">
         <div className="title">Talk to us</div>
         <div className="communicationOptions">
-          {COMMUNICATION_CHANNELS.map(CommunicationChannel)}
+          {COMMUNICATION_CHANNELS.map(entry =>
+            CommunicationChannel(props.config, entry)
+          )}
         </div>
       </div>
     </div>
diff --git a/gitlab-pages/website/pages/en/index.js b/gitlab-pages/website/pages/en/index.js
index c48ebb92b..a9bc41277 100644
--- a/gitlab-pages/website/pages/en/index.js
+++ b/gitlab-pages/website/pages/en/index.js
@@ -43,22 +43,22 @@ const PARTNERS = [
   }
 ];
 
-const Feature = props => (
+const Feature = (config, props) => (
   <div className="feature" key={props.title}>
-    <img src={props.image} />
+    <img src={`${config.baseUrl}${props.image}`} />
     <h1>{props.title}</h1>
     <p>{props.content}</p>
   </div>
 );
 
-const Partner = props => (
+const Partner = (config, props) => (
   <a
     href={props.link}
     title={props.name}
     target="_blank"
     rel="noopener noreferrer"
   >
-    <img src={props.image} />
+    <img src={`${config.baseUrl}${props.image}`} />
   </a>
 );
 
@@ -83,13 +83,15 @@ module.exports = props => {
         </div>
       </div>
       <div id="features" className="centered">
-        {FEATURES.map(Feature)}
+        {FEATURES.map(entry => Feature(props.config, entry))}
       </div>
       <div id="partners">
         <div className="centered wrapper">
           <span id="heading">Our Partners</span>
           <div id="list">
-            {PARTNERS.filter(entry => entry.pinned).map(Partner)}
+            {PARTNERS.filter(entry => entry.pinned).map(entry =>
+              Partner(props.config, entry)
+            )}
           </div>
         </div>
       </div>