ui: allow docHelp override using config.json (#4745)

config.json can have a property named 'docHelpMappings' which can be used to override docHelp suffixes.
In config.json admin can add mappings as follows:

"docHelpMappings": {
  "virtual_machine.html": "some.html",
  "some_string": "override_string"
}

UI will use these mappings and will make appropriate replacements in the documentation links for different sections and forms.

Addresses #4731

Signed-off-by: Abhishek Kumar <abhishek.mrt22@gmail.com>

Author: shwstppr

ui/public/config.json

@@ -46,5 +46,6 @@
     "jp": "label.japanese.keyboard",
     "sc": "label.simplified.chinese.keyboard"
   },
+  "docHelpMappings": {},
   "plugins": []
 }

ui/src/components/view/ActionButton.vue

@@ -134,6 +134,9 @@ export default {
   methods: {
     execAction (action) {
       action.resource = this.resource
+      if (action.docHelp) {
+        action.docHelp = this.$applyDocHelpMappings(action.docHelp)
+      }
       this.$emit('exec-action', action)
     },
     handleShowBadge () {

ui/src/config/router.js

@@ -42,7 +42,7 @@ function generateRouterMap (section) {
     name: section.name,
     path: '/' + section.name,
     hidden: section.hidden,
-    meta: { title: section.title, icon: section.icon, docHelp: section.docHelp, searchFilters: section.searchFilters },
+    meta: { title: section.title, icon: section.icon, docHelp: Vue.prototype.$applyDocHelpMappings(section.docHelp), searchFilters: section.searchFilters },
     component: RouteView
   }
 
@@ -63,7 +63,7 @@ function generateRouterMap (section) {
           title: child.title,
           name: child.name,
           icon: child.icon,
-          docHelp: child.docHelp,
+          docHelp: Vue.prototype.$applyDocHelpMappings(child.docHelp),
           permission: child.permission,
           resourceType: child.resourceType,
           filters: child.filters,
@@ -85,7 +85,7 @@ function generateRouterMap (section) {
               title: child.title,
               name: child.name,
               icon: child.icon,
-              docHelp: child.docHelp,
+              docHelp: Vue.prototype.$applyDocHelpMappings(child.docHelp),
               permission: child.permission,
               resourceType: child.resourceType,
               params: child.params ? child.params : {},
@@ -140,7 +140,7 @@ function generateRouterMap (section) {
         title: section.title,
         name: section.name,
         icon: section.icon,
-        docHelp: section.docHelp,
+        docHelp: Vue.prototype.$applyDocHelpMappings(section.docHelp),
         hidden: section.hidden,
         permission: section.permission,
         resourceType: section.resourceType,

ui/src/main.js

@@ -26,7 +26,7 @@ import './core/lazy_use'
 import './core/ext'
 import './permission' // permission control
 import './utils/filter' // global filter
-import { pollJobPlugin, notifierPlugin, toLocaleDatePlugin } from './utils/plugins'
+import { pollJobPlugin, notifierPlugin, toLocaleDatePlugin, configUtilPlugin } from './utils/plugins'
 import { VueAxios } from './utils/request'
 
 Vue.config.productionTip = false
@@ -49,3 +49,5 @@ fetch('config.json').then(response => response.json()).then(config => {
     }).$mount('#app')
   })
 })
+
+Vue.use(configUtilPlugin)

ui/src/utils/plugins.js

@@ -167,3 +167,21 @@ export const toLocaleDatePlugin = {
     }
   }
 }
+
+export const configUtilPlugin = {
+  install (Vue) {
+    Vue.prototype.$applyDocHelpMappings = function (docHelp) {
+      var docHelpMappings = this.$config.docHelpMappings
+      if (docHelp && docHelpMappings &&
+        docHelpMappings.constructor === Object && Object.keys(docHelpMappings).length > 0) {
+        for (var key in docHelpMappings) {
+          if (docHelp.includes(key)) {
+            docHelp = docHelp.replace(key, docHelpMappings[key])
+            break
+          }
+        }
+      }
+      return docHelp
+    }
+  }
+}

ui/tests/common/index.js

@@ -21,10 +21,11 @@ import mockRouter from '../mock/mockRouter'
 
 import localVue from '../setup'
 import { mount } from '@vue/test-utils'
-import { pollJobPlugin, notifierPlugin } from '@/utils/plugins'
+import { pollJobPlugin, notifierPlugin, configUtilPlugin } from '@/utils/plugins'
 
 localVue.use(pollJobPlugin)
 localVue.use(notifierPlugin)
+localVue.use(configUtilPlugin)
 
 function createMockRouter (newRoutes = []) {
   let routes = []