From 9131afd34f4fb92cca87d710bd5a25c4807aa7bb Mon Sep 17 00:00:00 2001
From: Kimmo Puputti <git@kimmo.kpuputti.fi>
Date: Tue, 19 Dec 2017 15:51:01 +0200
Subject: [PATCH] Show custom attribute category in listing page if present

---
 src/containers/ListingPage/ListingPage.css |  2 +-
 src/containers/ListingPage/ListingPage.js  | 10 ++++++++++
 2 files changed, 11 insertions(+), 1 deletion(-)

diff --git a/src/containers/ListingPage/ListingPage.css b/src/containers/ListingPage/ListingPage.css
index bd2c2922..d8ff97c4 100644
--- a/src/containers/ListingPage/ListingPage.css
+++ b/src/containers/ListingPage/ListingPage.css
@@ -332,7 +332,7 @@
 }
 
 .separator {
-  margin: 0 10px;
+  margin: 0 6px;
 }
 
 .contactLink {
diff --git a/src/containers/ListingPage/ListingPage.js b/src/containers/ListingPage/ListingPage.js
index 2859726a..b419ea81 100644
--- a/src/containers/ListingPage/ListingPage.js
+++ b/src/containers/ListingPage/ListingPage.js
@@ -231,6 +231,15 @@ export class ListingPageComponent extends Component {
       title = '',
     } = currentListing.attributes;
 
+    const { customAttributes } = currentListing.attributes;
+    const category =
+      customAttributes && customAttributes.category ? (
+        <span>
+          {customAttributes.category}
+          <span className={css.separator}>•</span>
+        </span>
+      ) : null;
+
     const topbar = <TopbarContainer />;
 
     const loadingTitle = intl.formatMessage({
@@ -503,6 +512,7 @@ export class ListingPageComponent extends Component {
                     <div className={css.heading}>
                       <h1 className={css.title}>{title}</h1>
                       <div className={css.author}>
+                        {category}
                         <FormattedMessage id="ListingPage.hostedBy" values={{ name: hostLink }} />
                         {showContactUser ? (
                           <span className={css.contactWrapper}>