From aac6dd375e9a2946279175cdca3c402a703b2268 Mon Sep 17 00:00:00 2001
From: Rohit Yadav <rohit.yadav@shapeblue.com>
Date: Sat, 12 Oct 2019 00:10:08 +0530
Subject: [PATCH] info-card: apikey/secretkey for users

Signed-off-by: Rohit Yadav <rohit.yadav@shapeblue.com>
---
 ui/src/locales/en.json           |  2 +-
 ui/src/views/AutogenView.vue     |  2 +-
 ui/src/views/common/InfoCard.vue | 51 ++++++++++++++++++++++++++++++++
 3 files changed, 53 insertions(+), 2 deletions(-)

diff --git a/ui/src/locales/en.json b/ui/src/locales/en.json
index a7e561351d0..c16c6bcdf3d 100644
--- a/ui/src/locales/en.json
+++ b/ui/src/locales/en.json
@@ -127,7 +127,7 @@
     "cpuused": "CPU Utilized",
     "cpuusedghz": "Used",
     "createNfsCache": "Create NFS secondary staging store",
-    "created": "Date",
+    "created": "Created",
     "credit": "Credit",
     "crossZones": "Cross Zones",
     "current": "isCurrent",
diff --git a/ui/src/views/AutogenView.vue b/ui/src/views/AutogenView.vue
index d38e0f9e197..80060d15580 100644
--- a/ui/src/views/AutogenView.vue
+++ b/ui/src/views/AutogenView.vue
@@ -361,7 +361,7 @@ export default {
         }
         if (this.items.length > 0) {
           this.resource = this.items[0]
-          if (this.items.length === 1 && Object.keys(this.$route.query).length > 0) {
+          if (this.items && this.items.length === 1 && Object.keys(this.$route.query).length > 0) {
             this.dataView = true
           }
         } else {
diff --git a/ui/src/views/common/InfoCard.vue b/ui/src/views/common/InfoCard.vue
index debb5d681c0..04ddeb7f40e 100644
--- a/ui/src/views/common/InfoCard.vue
+++ b/ui/src/views/common/InfoCard.vue
@@ -122,6 +122,40 @@
       </div>
     </div>
 
+    <div class="account-center-tags" v-if="showKeys">
+      <a-divider/>
+      <div class="user-keys">
+        <a-icon type="key" />
+        <strong>
+          {{ $t('apikey') }}
+          <a-tooltip placement="right" >
+            <template slot="title">
+              <span>Copy {{ $t('apikey') }}</span>
+            </template>
+            <a-button shape="circle" type="dashed" size="small" v-clipboard:copy="resource.apikey">
+              <a-icon type="copy"/>
+            </a-button>
+          </a-tooltip>
+        </strong>
+        {{ resource.apikey }}
+      </div> <br/>
+      <div class="user-keys">
+        <a-icon type="lock" />
+        <strong>
+          {{ $t('secretkey') }}
+          <a-tooltip placement="right" >
+            <template slot="title">
+              <span>Copy {{ $t('secretkey') }}</span>
+            </template>
+            <a-button shape="circle" type="dashed" size="small" v-clipboard:copy="resource.apikey">
+              <a-icon type="copy"/>
+            </a-button>
+          </a-tooltip>
+        </strong>
+        {{ resource.secretkey }}
+      </div>
+    </div>
+
     <div class="account-center-tags" v-if="resourceType && 'listTags' in $store.getters.apis">
       <a-divider/>
       <div class="tagsTitle">Tags</div>
@@ -239,6 +273,7 @@ export default {
       tags: [],
       notes: [],
       annotation: '',
+      showKeys: false,
       showNotesInput: false
     }
   },
@@ -247,6 +282,7 @@ export default {
       this.resource = newItem
       this.resourceType = this.$route.meta.resourceType
       this.annotationType = ''
+      this.showKeys = false
 
       switch (this.resourceType) {
         case 'UserVm':
@@ -273,9 +309,21 @@ export default {
       if (this.annotationType) {
         this.getNotes()
       }
+      if ('apikey' in this.resource) {
+        this.getUserKeys()
+      }
     }
   },
   methods: {
+    getUserKeys () {
+      if (!('getUserKeys' in this.$store.getters.apis)) {
+        return
+      }
+      api('getUserKeys', { id: this.resource.id }).then(json => {
+        this.showKeys = true
+        this.resource.secretkey = json.getuserkeysresponse.userkeys.secretkey
+      })
+    },
     getTags () {
       if (!('listTags' in this.$store.getters.apis)) {
         return
@@ -398,6 +446,9 @@ export default {
   margin-left: 10px;
   margin-right: 10px;
 }
+.user-keys {
+  word-wrap: break-word;
+}
 .account-center-tags {
   .ant-tag {
     margin-bottom: 8px;