bfg-common 1.5.732 → 1.5.735

package/components/common/vm/snapshots/new/contextMenuView/ContextMenuView.vue

@@ -1,96 +1,96 @@
-<template>
-  <div class="snapshot-context-menu-view">
-    <common-context
-      :action-loading="null"
-      :context-menu="contextMenu"
-      @select-item="onSelectContextMenuItem"
-      @hide="onHideContextMenu"
-    />
-  </div>
-</template>
-
-<script setup lang="ts">
-import type { UI_I_Localization } from '~/lib/models/interfaces'
-import type {
-  UI_I_ContextMenu,
-  UI_I_ContextMenuItem,
-} from '~/components/common/context/lib/models/interfaces'
-import type { UI_I_ContextData } from '~/components/common/vm/snapshots/new/lib/models/interfaces'
-import type { UI_T_SnapshotActionType } from '~/components/common/vm/snapshots/lib/models/types'
-import { contextMenuItemsFunc } from '~/components/common/vm/snapshots/new/contextMenuView/lib/config/contextMenuItems'
-
-const props = defineProps<{
-  contextData: UI_I_ContextData
-  show: number
-}>()
-
-const emits = defineEmits<{
-  (event: 'select-action', value: UI_T_SnapshotActionType): void
-}>()
-
-const localization = computed<UI_I_Localization>(() => useLocal())
-
-const contextMenu = ref<UI_I_ContextMenu<'snapshot'>>({
-  x: -9999,
-  y: -9999,
-  id: '',
-  type: 'snapshot',
-  titleText: '',
-  titleIconClassName: '',
-  items: contextMenuItemsFunc(localization.value),
-})
-
-const showContextMenu = (data: UI_I_ContextData): void => {
-  const event = data.event
-  const node = data.node
-
-  if (!event || !node) return
-
-  event.preventDefault()
-
-  contextMenu.value.x = event.clientX
-  contextMenu.value.y = event.clientY
-  contextMenu.value.id = '' + node.id
-  contextMenu.value.type = node.type
-  contextMenu.value.titleText = node.name
-  contextMenu.value.titleIconClassName = node.iconClassName
-}
-
-watch(
-  () => props.show,
-  () => {
-    showContextMenu(props.contextData)
-  }
-)
-
-const onHideContextMenu = (): void => {
-  contextMenu.value.x = -9999
-  contextMenu.value.y = -9999
-}
-
-const onSelectContextMenuItem = (item: UI_I_ContextMenuItem): void => {
-  emits('select-action', item.actionType)
-}
-</script>
-
-<style scoped lang="scss">
-.snapshot-context-menu-view {
-  :deep(.menu-item) {
-    .context-icon {
-      display: none;
-    }
-
-    .item-ui-icon {
-      margin-right: 8px;
-    }
-
-    &:last-child {
-      color: #ea3223;
-
-      .context-link:hover {
-        color: #ea3223;
-      }
-    }
-  }
-}
-</style>
+<template>
+  <div class="snapshot-context-menu-view">
+    <common-context
+      :action-loading="null"
+      :context-menu="contextMenu"
+      @select-item="onSelectContextMenuItem"
+      @hide="onHideContextMenu"
+    />
+  </div>
+</template>
+
+<script setup lang="ts">
+import type { UI_I_Localization } from '~/lib/models/interfaces'
+import type {
+  UI_I_ContextMenu,
+  UI_I_ContextMenuItem,
+} from '~/components/common/context/lib/models/interfaces'
+import type { UI_I_ContextData } from '~/components/common/vm/snapshots/new/lib/models/interfaces'
+import type { UI_T_SnapshotActionType } from '~/components/common/vm/snapshots/lib/models/types'
+import { contextMenuItemsFunc } from '~/components/common/vm/snapshots/new/contextMenuView/lib/config/contextMenuItems'
+
+const props = defineProps<{
+  contextData: UI_I_ContextData
+  show: number
+}>()
+
+const emits = defineEmits<{
+  (event: 'select-action', value: UI_T_SnapshotActionType): void
+}>()
+
+const localization = computed<UI_I_Localization>(() => useLocal())
+
+const contextMenu = ref<UI_I_ContextMenu<'snapshot'>>({
+  x: -9999,
+  y: -9999,
+  id: '',
+  type: 'snapshot',
+  titleText: '',
+  titleIconClassName: '',
+  items: contextMenuItemsFunc(localization.value),
+})
+
+const showContextMenu = (data: UI_I_ContextData): void => {
+  const event = data.event
+  const node = data.node
+
+  if (!event || !node) return
+
+  event.preventDefault()
+
+  contextMenu.value.x = event.clientX
+  contextMenu.value.y = event.clientY
+  contextMenu.value.id = '' + node.id
+  contextMenu.value.type = node.type
+  contextMenu.value.titleText = node.name
+  contextMenu.value.titleIconClassName = node.iconClassName
+}
+
+watch(
+  () => props.show,
+  () => {
+    showContextMenu(props.contextData)
+  }
+)
+
+const onHideContextMenu = (): void => {
+  contextMenu.value.x = -9999
+  contextMenu.value.y = -9999
+}
+
+const onSelectContextMenuItem = (item: UI_I_ContextMenuItem): void => {
+  emits('select-action', item.actionType)
+}
+</script>
+
+<style scoped lang="scss">
+.snapshot-context-menu-view {
+  :deep(.menu-item) {
+    .context-icon {
+      display: none;
+    }
+
+    .item-ui-icon {
+      margin-right: 8px;
+    }
+
+    &:last-child {
+      color: #ea3223;
+
+      .context-link:hover {
+        color: #ea3223;
+      }
+    }
+  }
+}
+</style>

package/components/common/vm/snapshots/new/contextMenuView/lib/config/contextMenuItems.ts

@@ -1,34 +1,34 @@
-import type { UI_I_Localization } from '~/lib/models/interfaces'
-import type { UI_I_ContextMenuItem } from '~/components/common/context/lib/models/interfaces'
-
-export const contextMenuItemsFunc = (
-  localization: UI_I_Localization
-): UI_I_ContextMenuItem[] => [
-  {
-    key: useUniqueId(),
-    name: localization.common.revert,
-    actionType: 'revert',
-    iconClassName: '',
-    iconName: 'revert',
-    testId: 'revert-snapshot-vm',
-    items: [],
-  },
-  {
-    key: useUniqueId(),
-    name: localization.common.edit,
-    actionType: 'edit',
-    iconClassName: '',
-    iconName: 'edit',
-    testId: 'edit-snapshot-vm',
-    items: [],
-  },
-  {
-    key: useUniqueId(),
-    name: localization.common.delete,
-    actionType: 'delete',
-    iconClassName: '',
-    iconName: 'delete',
-    testId: 'delete-snapshot-vm',
-    items: [],
-  },
-]
+import type { UI_I_Localization } from '~/lib/models/interfaces'
+import type { UI_I_ContextMenuItem } from '~/components/common/context/lib/models/interfaces'
+
+export const contextMenuItemsFunc = (
+  localization: UI_I_Localization
+): UI_I_ContextMenuItem[] => [
+  {
+    key: useUniqueId(),
+    name: localization.common.revert,
+    actionType: 'revert',
+    iconClassName: '',
+    iconName: 'revert',
+    testId: 'revert-snapshot-vm',
+    items: [],
+  },
+  {
+    key: useUniqueId(),
+    name: localization.common.edit,
+    actionType: 'edit',
+    iconClassName: '',
+    iconName: 'edit',
+    testId: 'edit-snapshot-vm',
+    items: [],
+  },
+  {
+    key: useUniqueId(),
+    name: localization.common.delete,
+    actionType: 'delete',
+    iconClassName: '',
+    iconName: 'delete',
+    testId: 'delete-snapshot-vm',
+    items: [],
+  },
+]

package/components/common/vm/snapshots/new/lib/models/interfaces.ts

@@ -1,12 +1,12 @@
-import type { UI_I_SnapshotsDetails } from '~/store/inventory/modules/snapshots/lib/models/interfaces'
-
-export interface UI_I_ContextData {
-  event: null | MouseEvent
-  node: null | UI_I_SnapshotsDetails
-}
-
-export interface UI_I_Context {
-  contextMenuShow: Ref<number>
-  contextMenu: Ref<UI_I_ContextData>
-  showContextMenu: any
-}
+import type { UI_I_SnapshotsDetails } from '~/store/inventory/modules/snapshots/lib/models/interfaces'
+
+export interface UI_I_ContextData {
+  event: null | MouseEvent
+  node: null | UI_I_SnapshotsDetails
+}
+
+export interface UI_I_Context {
+  contextMenuShow: Ref<number>
+  contextMenu: Ref<UI_I_ContextData>
+  showContextMenu: any
+}

package/components/common/vm/snapshots/new/lib/utils/contextMenu.ts

@@ -1,29 +1,29 @@
-import type {
-  UI_I_ContextData,
-  UI_I_Context,
-} from '~/components/common/vm/snapshots/new/lib/models/interfaces'
-
-const contextMenuShow = ref<number>(0)
-
-const contextMenu = ref<UI_I_ContextData>({
-  event: null,
-  node: null,
-})
-
-export function getContextMenu(): UI_I_Context {
-  const showContextMenu = (data: UI_I_ContextData | null): void => {
-    if (!data) return
-
-    data.event?.preventDefault()
-
-    contextMenu.value.event = data.event
-    contextMenu.value.node = data.node
-    contextMenuShow.value++
-  }
-
-  return {
-    contextMenuShow,
-    contextMenu,
-    showContextMenu,
-  }
-}
+import type {
+  UI_I_ContextData,
+  UI_I_Context,
+} from '~/components/common/vm/snapshots/new/lib/models/interfaces'
+
+const contextMenuShow = ref<number>(0)
+
+const contextMenu = ref<UI_I_ContextData>({
+  event: null,
+  node: null,
+})
+
+export function getContextMenu(): UI_I_Context {
+  const showContextMenu = (data: UI_I_ContextData | null): void => {
+    if (!data) return
+
+    data.event?.preventDefault()
+
+    contextMenu.value.event = data.event
+    contextMenu.value.node = data.node
+    contextMenuShow.value++
+  }
+
+  return {
+    contextMenuShow,
+    contextMenu,
+    showContextMenu,
+  }
+}

package/components/common/vm/snapshots/new/lib/utils/details.ts

@@ -1,48 +1,48 @@
-import type { UI_I_InfoBlock } from '~/node_modules/bfg-uikit/components/ui/infoBlock/models/interfaces'
-import type { UI_I_Localization } from '~/lib/models/interfaces'
-import type { UI_I_SnapshotsDetails } from '~/store/inventory/modules/snapshots/lib/models/interfaces'
-
-export const constructDetails = (
-  localization: UI_I_Localization,
-  detailData: UI_I_SnapshotsDetails | null
-): UI_I_InfoBlock[] =>
-  !detailData
-    ? []
-    : [
-        {
-          label: localization.common.name,
-          value: detailData.name || '--',
-          items: [],
-          labelIcon: 'icon-snapshotTake',
-        },
-        {
-          label: localization.common.description,
-          value: detailData.description || 'empty-description',
-          items: [],
-          labelIcon: 'file',
-        },
-        {
-          label: localization.common.timestamp,
-          value: detailData.timestamp || '--',
-          items: [],
-          labelIcon: 'clock',
-        },
-        {
-          label: localization.common.size,
-          value: detailData.size || '--',
-          items: [],
-          labelIcon: 'disk',
-        },
-        {
-          label: localization.snapshots.snapshotVMMemory,
-          value: detailData.snapshot_the_virtual_machines_memory || '--',
-          items: [],
-          labelIcon: 'settings',
-        },
-        {
-          label: localization.snapshots.quiesceGuestFileSystem,
-          value: detailData.quiesce_guest_file_system || '--',
-          items: [],
-          labelIcon: 'settings',
-        },
-      ]
+import type { UI_I_InfoBlock } from '~/node_modules/bfg-uikit/components/ui/infoBlock/models/interfaces'
+import type { UI_I_Localization } from '~/lib/models/interfaces'
+import type { UI_I_SnapshotsDetails } from '~/store/inventory/modules/snapshots/lib/models/interfaces'
+
+export const constructDetails = (
+  localization: UI_I_Localization,
+  detailData: UI_I_SnapshotsDetails | null
+): UI_I_InfoBlock[] =>
+  !detailData
+    ? []
+    : [
+        {
+          label: localization.common.name,
+          value: detailData.name || '--',
+          items: [],
+          labelIcon: 'icon-snapshotTake',
+        },
+        {
+          label: localization.common.description,
+          value: detailData.description || 'empty-description',
+          items: [],
+          labelIcon: 'file',
+        },
+        {
+          label: localization.common.timestamp,
+          value: detailData.timestamp || '--',
+          items: [],
+          labelIcon: 'clock',
+        },
+        {
+          label: localization.common.size,
+          value: detailData.size || '--',
+          items: [],
+          labelIcon: 'disk',
+        },
+        {
+          label: localization.snapshots.snapshotVMMemory,
+          value: detailData.snapshot_the_virtual_machines_memory || '--',
+          items: [],
+          labelIcon: 'settings',
+        },
+        {
+          label: localization.snapshots.quiesceGuestFileSystem,
+          value: detailData.quiesce_guest_file_system || '--',
+          items: [],
+          labelIcon: 'settings',
+        },
+      ]

package/components/common/vm/snapshots/tools/Tools.vue

@@ -1,56 +1,56 @@
-<template>
-  <div class="snapshot-actions grid py-0 px-6">
-    <button
-      id="take-snapshot-button"
-      v-permission="'VirtualMachines.TakeSnapshot'"
-      :disabled="isDisabled"
-      data-id="take-snapshot-button"
-      class="btn btn-primary btn-sm"
-      @click="onSelect('take')"
-    >
-      {{ localization.common.takeSnapshot }}...
-    </button>
-    <atoms-tabs
-      :items="tabs"
-      test-id="vm-snapshot-tabs"
-      size="small"
-      class="tabs"
-      @change="onSelect"
-    />
-  </div>
-</template>
-
-<script setup lang="ts">
-import type { UI_I_Localization } from '~/lib/models/interfaces'
-import type { UI_I_CollapseNavItem } from '~/components/atoms/collapse/lib/models/interfaces'
-import type { UI_T_SnapshotActionType } from '~/components/common/vm/snapshots/lib/models/types'
-import { snapshotsTabsFunc } from '~/components/common/vm/snapshots/tools/lib/config/tabsPannel'
-
-const props = defineProps<{
-  snapshotsCount: number
-  snapshotsLoading: boolean
-}>()
-
-const emits = defineEmits<{
-  (event: 'select', value: UI_T_SnapshotActionType): void
-}>()
-
-const localization = computed<UI_I_Localization>(() => useLocal())
-
-const tabs = computed<UI_I_CollapseNavItem[]>(() =>
-  snapshotsTabsFunc(localization.value, isDisabled.value, props.snapshotsCount)
-)
-
-const onSelect = (action: UI_T_SnapshotActionType): void => {
-  emits('select', action)
-}
-
-const isDisabled = computed<boolean>(() => props.snapshotsLoading)
-</script>
-
-<style scoped lang="scss">
-.snapshot-actions {
-  grid-template-columns: auto 1fr;
-  align-items: baseline;
-}
-</style>
+<template>
+  <div class="snapshot-actions grid py-0 px-6">
+    <button
+      id="take-snapshot-button"
+      v-permission="'VirtualMachines.TakeSnapshot'"
+      :disabled="isDisabled"
+      data-id="take-snapshot-button"
+      class="btn btn-primary btn-sm"
+      @click="onSelect('take')"
+    >
+      {{ localization.common.takeSnapshot }}...
+    </button>
+    <atoms-tabs
+      :items="tabs"
+      test-id="vm-snapshot-tabs"
+      size="small"
+      class="tabs"
+      @change="onSelect"
+    />
+  </div>
+</template>
+
+<script setup lang="ts">
+import type { UI_I_Localization } from '~/lib/models/interfaces'
+import type { UI_I_CollapseNavItem } from '~/components/atoms/collapse/lib/models/interfaces'
+import type { UI_T_SnapshotActionType } from '~/components/common/vm/snapshots/lib/models/types'
+import { snapshotsTabsFunc } from '~/components/common/vm/snapshots/tools/lib/config/tabsPannel'
+
+const props = defineProps<{
+  snapshotsCount: number
+  snapshotsLoading: boolean
+}>()
+
+const emits = defineEmits<{
+  (event: 'select', value: UI_T_SnapshotActionType): void
+}>()
+
+const localization = computed<UI_I_Localization>(() => useLocal())
+
+const tabs = computed<UI_I_CollapseNavItem[]>(() =>
+  snapshotsTabsFunc(localization.value, isDisabled.value, props.snapshotsCount)
+)
+
+const onSelect = (action: UI_T_SnapshotActionType): void => {
+  emits('select', action)
+}
+
+const isDisabled = computed<boolean>(() => props.snapshotsLoading)
+</script>
+
+<style scoped lang="scss">
+.snapshot-actions {
+  grid-template-columns: auto 1fr;
+  align-items: baseline;
+}
+</style>

package/components/common/wizards/datastore/add/Old.vue

@@ -12,6 +12,16 @@
       @hide="onHideModal"
       @submit="onCreateDatastore"
     >
+      <template #description="{ selectedStep }">
+        <div class="add-datastore__wizard-description">
+          <h2>{{ selectedStep.subTitle }}</h2>
+
+          <common-wizards-datastore-add-steps-type-mode-tooltip
+            v-if="selectedStep.id === dynamicSteps.type"
+          />
+        </div>
+      </template>
+
       <template #modalBody="{ selectedStep }">
         <common-wizards-datastore-add-steps-type-mode
           v-if="selectedStep.id === dynamicSteps.type"
@@ -112,6 +122,12 @@ const onCreateDatastore = (): void => emits('submit')
     height: 100%;
     padding-left: 24px;
   }
+
+  .add-datastore__wizard-description {
+    display: flex;
+    align-items: center;
+    gap: 10px;
+  }
 }
 
 .finish-block {

package/components/common/wizards/datastore/add/steps/typeMode/TypeModeOld.vue

@@ -1,31 +1,5 @@
 <template>
   <section class="datastore-types">
-    <div class="header-row">
-      <span class="datastore-types__subtitle">
-        {{ localization.common.specifyDatastoreType }}
-      </span>
-      <div id="type-select-help-icon" class="signpost-container relative">
-        <atoms-the-icon
-          data-id="toggle-type-select-help-icon"
-          fill="#0072a3"
-          width="24px"
-          height="24px"
-          name="info-circle"
-          @click="isShowTypeHelp = !isShowTypeHelp"
-        />
-        <atoms-tooltip-signpost
-          v-if="isShowTypeHelp"
-          elem-id="type-select-help-icon"
-          test-id="select-datastore-type"
-          @hide="isShowTypeHelp = false"
-        >
-          <p class="help-desc">
-            {{ localization.common.datastoreTypeHelpDesc }}
-          </p>
-        </atoms-tooltip-signpost>
-      </div>
-    </div>
-
     <common-select-radio-group
       v-model="datastoreTypeModeLocal"
       :options="props.options"
@@ -35,7 +9,6 @@
 </template>
 
 <script lang="ts" setup>
-import type { UI_I_Localization } from '~/lib/models/interfaces'
 import type { UI_I_RadioOption } from '~/components/common/select/radio/lib/models/interfaces'
 
 const datastoreTypeModeLocal = defineModel<number>({ required: true })
@@ -43,29 +16,9 @@ const props = defineProps<{
   options: UI_I_RadioOption[]
 }>()
 
-const localization = computed<UI_I_Localization>(() => useLocal())
-
 const onChangeType = (): void => {
   // model.value.name = 'Datastore' // default value is  'Datastore' every time
 }
-
-const isShowTypeHelp = ref<boolean>(false)
 </script>
 
-<style lang="scss" scoped>
-.datastore-types {
-  .signpost-container {
-    display: flex;
-    cursor: pointer;
-
-    .help-desc-container {
-      max-width: 350px;
-    }
-  }
-  .header-row {
-    display: flex;
-    align-items: center;
-    gap: 10px;
-  }
-}
-</style>
+<style lang="scss" scoped></style>