diff --git a/ui/src/config/router.js b/ui/src/config/router.js
index 4684e256076..66ef5563fb5 100644
--- a/ui/src/config/router.js
+++ b/ui/src/config/router.js
@@ -41,6 +41,7 @@ export function generateRouterMap (section) {
           params: child.params ? child.params : {},
           columns: child.columns,
           details: child.details,
+          related: child.related,
           actions: child.actions
         },
         component: component,
@@ -57,6 +58,7 @@ export function generateRouterMap (section) {
               resourceType: child.resourceType,
               params: child.params ? child.params : {},
               details: child.details,
+              related: child.related,
               tabs: child.tabs,
               actions: child.actions ? child.actions : []
             },
@@ -101,6 +103,7 @@ export function generateRouterMap (section) {
         resourceType: section.resourceType,
         params: section.params ? section.params : {},
         details: section.details,
+        related: section.related,
         tabs: section.tabs,
         actions: section.actions ? section.actions : []
       },
diff --git a/ui/src/config/section/compute.js b/ui/src/config/section/compute.js
index 940c5fb1c81..65be782bf90 100644
--- a/ui/src/config/section/compute.js
+++ b/ui/src/config/section/compute.js
@@ -15,6 +15,15 @@ export default {
         'cpunumber', 'cpuused', 'cputotal', 'memoryintfreekbs', 'memorytotal',
         'networkread', 'networkwrite', 'diskkbsread', 'diskkbswrite', 'diskiopstotal'
       ],
+      related: [{
+        name: 'vmsnapshot',
+        title: 'VM Snapshots',
+        param: 'virtualmachineid'
+      }, {
+        name: 'affinitygroup',
+        title: 'Affinity Groups',
+        param: 'virtualmachineid'
+      }],
       tabs: [{
         name: 'hardware',
         component: () => import('@/views/compute/InstanceHardware.vue')
@@ -174,7 +183,7 @@ export default {
       ]
     },
     {
-      name: 'affinitygroups',
+      name: 'affinitygroup',
       title: 'Affinity Groups',
       icon: 'swap',
       permission: [ 'listAffinityGroups' ],
diff --git a/ui/src/views/common/InfoCard.vue b/ui/src/views/common/InfoCard.vue
index 82f791ccbde..a6efc73ab4c 100644
--- a/ui/src/views/common/InfoCard.vue
+++ b/ui/src/views/common/InfoCard.vue
@@ -238,6 +238,16 @@
       </div>
     </div>
 
+    <div class="account-center-tags" v-if="$route.meta.related">
+      <span v-for="item in $route.meta.related" :key="item.path">
+        <router-link :to="{ path: '/' + item.name + '?' + item.param + '=' + resource.id }">
+          <a-button style="margin-right: 10px">
+            View {{ $t(item.title) }}
+          </a-button>
+        </router-link>
+      </span>
+    </div>
+
     <div class="account-center-tags" v-if="showKeys">
       <a-divider/>
       <div class="user-keys">