From c5c2ae99f6e9b91526ea5896b3029ab8a7480c6f Mon Sep 17 00:00:00 2001
From: Sukanya Pandey <sukapan1@in.ibm.com>
Date: Wed, 9 Dec 2020 16:14:19 +0530
Subject: Show asset name in the app header

Signed-off-by: Sukanya Pandey <sukapan1@in.ibm.com>
Change-Id: If5394604d6c91b3604eaadb33178376fe6da672c
---
 src/components/AppHeader/AppHeader.vue | 16 +++++++++++++++-
 1 file changed, 15 insertions(+), 1 deletion(-)

(limited to 'src/components/AppHeader')

diff --git a/src/components/AppHeader/AppHeader.vue b/src/components/AppHeader/AppHeader.vue
index 68de7d90..5b36cf85 100644
--- a/src/components/AppHeader/AppHeader.vue
+++ b/src/components/AppHeader/AppHeader.vue
@@ -26,13 +26,21 @@
           />
         </b-button>
         <b-navbar-nav>
-          <b-navbar-brand to="/" data-test-id="appHeader-container-overview">
+          <b-navbar-brand
+            class="mr-0"
+            to="/"
+            data-test-id="appHeader-container-overview"
+          >
             <img
               class="header-logo"
               src="@/assets/images/logo-header.svg"
               :alt="altLogo"
             />
           </b-navbar-brand>
+          <div v-if="assetTag" class="asset-tag">
+            <span class="pr-2">|</span>
+            <span>{{ assetTag }}</span>
+          </div>
         </b-navbar-nav>
         <!-- Right aligned nav items -->
         <b-navbar-nav class="ml-auto helper-menu">
@@ -120,6 +128,9 @@ export default {
     };
   },
   computed: {
+    assetTag() {
+      return this.$store.getters['global/assetTag'];
+    },
     isAuthorized() {
       return this.$store.getters['global/isAuthorized'];
     },
@@ -280,6 +291,9 @@ export default {
     .nav-link {
       transition: $focus-transition;
     }
+    .asset-tag {
+      color: theme-color-level(light, 3);
+    }
   }
 
   .nav-trigger {
-- 
cgit v1.2.3