ui: confirm on reset configurations (#10745)

ui/public/locales/en.json

@@ -2672,6 +2672,7 @@
 "message.confirm.remove.vmware.datacenter": "Please confirm you want to remove VMware datacenter.",
 "message.confirm.remove.vpc.offering": "Are you sure you want to remove this VPC offering?",
 "message.confirm.replace.acl.new.one": "Do you want to replace the ACL with a new one?",
+"message.confirm.reset.configuration.value": "Are you sure you want reset configuration - %x?",
 "message.confirm.reset.network.permissions": "Are you sure you want to reset this Network permissions?",
 "message.confirm.scale.up.router.vm": "Do you really want to scale up the router Instance?",
 "message.confirm.scale.up.system.vm": "Do you really want to scale up the system VM?",

ui/src/components/view/ListView.vue

@@ -459,7 +459,7 @@
           iconTwoToneColor="#52c41a" />
         <tooltip-button
           :tooltip="$t('label.reset.config.value')"
-          @onClick="resetConfig(record)"
+          @onClick="$resetConfigurationValueConfirm(item, resetConfig)"
           v-if="editableValueKey !== record.key"
           icon="reload-outlined"
           :disabled="!('updateConfiguration' in $store.getters.apis)" />

ui/src/components/view/SettingsTab.vue

@@ -66,7 +66,7 @@
             iconTwoToneColor="#52c41a" />
           <tooltip-button
             :tooltip="$t('label.reset.config.value')"
-            @onClick="resetConfig(item)"
+            @onClick="$resetConfigurationValueConfirm(item, resetConfig)"
             v-if="editableValueKey !== index"
             icon="reload-outlined"
             :disabled="!('updateConfiguration' in $store.getters.apis)" />

ui/src/main.js

@@ -35,7 +35,8 @@ import {
   resourceTypePlugin,
   fileSizeUtilPlugin,
   genericUtilPlugin,
-  localesPlugin
+  localesPlugin,
+  dialogUtilPlugin
 } from './utils/plugins'
 import { VueAxios } from './utils/request'
 import directives from './utils/directives'
@@ -51,6 +52,7 @@ vueApp.use(resourceTypePlugin)
 vueApp.use(fileSizeUtilPlugin)
 vueApp.use(localesPlugin)
 vueApp.use(genericUtilPlugin)
+vueApp.use(dialogUtilPlugin)
 vueApp.use(extensions)
 vueApp.use(directives)
 

ui/src/utils/plugins.js

@@ -18,7 +18,7 @@
 import _ from 'lodash'
 import { i18n } from '@/locales'
 import { api } from '@/api'
-import { message, notification } from 'ant-design-vue'
+import { message, notification, Modal } from 'ant-design-vue'
 import eventBus from '@/config/eventBus'
 import store from '@/store'
 import { sourceToken } from '@/utils/request'
@@ -527,3 +527,18 @@ export function createPathBasedOnVmType (vmtype, virtualmachineid) {
 
   return path + virtualmachineid
 }
+
+export const dialogUtilPlugin = {
+  install (app) {
+    app.config.globalProperties.$resetConfigurationValueConfirm = function (configRecord, callback) {
+      Modal.confirm({
+        title: i18n.global.t('label.reset.config.value'),
+        content: `${i18n.global.t('message.confirm.reset.configuration.value').replace('%x', configRecord.name)}`,
+        okText: i18n.global.t('label.yes'),
+        cancelText: i18n.global.t('label.no'),
+        okType: 'primary',
+        onOk: () => callback(configRecord)
+      })
+    }
+  }
+}

ui/src/views/setting/ConfigurationValue.vue

@@ -179,7 +179,7 @@
           :disabled="valueLoading" />
         <tooltip-button
           :tooltip="$t('label.reset.config.value')"
-          @onClick="resetConfigurationValue(configrecord)"
+          @onClick="$resetConfigurationValueConfirm(configrecord, resetConfigurationValue)"
           v-if="editableValueKey === null"
           icon="reload-outlined"
           :disabled="(!('resetConfiguration' in $store.getters.apis) || configDisabled || valueLoading)" />

ui/tests/common/index.js

@@ -31,7 +31,8 @@ import {
   showIconPlugin,
   resourceTypePlugin,
   fileSizeUtilPlugin,
-  genericUtilPlugin
+  genericUtilPlugin,
+  dialogUtilPlugin
 } from '@/utils/plugins'
 
 function createMockRouter (newRoutes = []) {
@@ -88,6 +89,7 @@ function createFactory (component, options) {
         resourceTypePlugin,
         fileSizeUtilPlugin,
         genericUtilPlugin,
+        dialogUtilPlugin,
         StoragePlugin
       ],
       mocks