bfg-common 1.5.218 → 1.5.220

package/components/common/backup/storage/actions/add/temp/readyComplete/ReadyComplete.vue

@@ -7,7 +7,7 @@
         <common-details-item :has-children="true" open-by-default>
           <template #stackBlockKey>
             <span class="list__labels">{{
-                item.label
+                localization.common.chosenDatastoreName
             }}</span>
           </template>
 

package/components/common/backup/storage/actions/add/temp/readyComplete/lib/config/propertiesDetails.ts

@@ -72,8 +72,7 @@ const localDetailsFunc = (
       items: [
         {
           label: localization.common.datastoreName,
-          // value: isSphereWizard ? event.name : event,
-          value: event.name || event,
+          value: isSphereWizard ? event.name : event,
           items: [],
         },
       ],
@@ -82,18 +81,10 @@ const localDetailsFunc = (
   ]
 
   if (isSphereWizard) {
-    data.push({
-      label: localization.common.hostsAccessibility,
-      value: '',
-      items: [
-        {
-          label: localization.common.hosts,
-          value: '',
-          data: event.hosts,
-          items: [],
-        },
-      ],
-      actions: [],
+    data[0].items.push({
+      label: localization.common.host,
+      value: event.host,
+      items: [],
     })
   }
   return data
@@ -102,9 +93,8 @@ const localDetailsFunc = (
 const sharedStormDetailsFunc = (
   localization: UI_I_Localization,
   event: any | string,
-  isSphereWizard: boolean
 ): UI_I_DetailsItem[] => {
-  const details: UI_I_DetailsItem[] = [
+  return [
     {
       label: localization.common.selectName,
       value: '',
@@ -122,7 +112,7 @@ const sharedStormDetailsFunc = (
       value: '',
       items: [
         {
-          label: localization.datastoreWizard.storageName,
+          label: localization.common.storageName,
           value: event.storm_name,
           items: [],
         },
@@ -130,22 +120,6 @@ const sharedStormDetailsFunc = (
       actions: [],
     },
   ]
-  if (isSphereWizard) {
-    details.push({
-      label: localization.common.hostsAccessibility,
-      value: '',
-      items: [
-        {
-          label: localization.common.hosts,
-          value: '',
-          data: event.hosts,
-          items: [],
-        },
-      ],
-      actions: [],
-    })
-  }
-  return details
 }
 
 export const constructDataReadyViewFunc = <T>(

package/components/common/backup/storage/actions/add/temp/samba/accessibility/lib/models/types.ts

@@ -1,5 +1,5 @@
 export type T_HostsAccessibilityTab = 'compatible-hosts' | 'incompatible-hosts'
 
-export type T_CompatibleHostsTableKeys = 'name' | 'cluster'
+export type T_CompatibleHostsTableKeys = 'host' | 'cluster'
 
-export type T_IncompatibleHostsTableKeys = 'name' | 'cluster' | 'host_incompatibility_reason'
+export type T_IncompatibleHostsTableKeys = 'host' | 'cluster' | 'host_incompatibility_reason'

package/components/common/backup/storage/actions/add/temp/samba/accessibility/tablesView/lib/config/tableKeys.ts

@@ -4,12 +4,12 @@ import type {
 } from '~/components/common/backup/storage/actions/add/temp/samba/accessibility/lib/models/types'
 
 export const compatibleHostsTableKeys: T_CompatibleHostsTableKeys[] = [
-  'name',
+  'host',
   'cluster',
 ]
 
 export const incompatibleHostsTableKeys: T_IncompatibleHostsTableKeys[] = [
-  'name',
+  'host',
   'cluster',
   'host_incompatibility_reason',
 ]

package/components/common/backup/storage/actions/add/temp/samba/configuration/Configuration.vue

@@ -350,7 +350,7 @@ const accessMode = ref<boolean>(false)
 //   // if (nfsVersion === 'nfs-4.1') server.value = ''
 // }
 
-const alertInfo = ref<boolean>(true)
+const alertInfo = ref<boolean>(props.mode === 'procurator')
 
 const resetValidation = (): void => {
   isInitNameValidation.value =

package/components/common/backup/storage/actions/add/temp/sharedStorm/SharedStorm.vue

@@ -1,20 +1,12 @@
 <template>
   <div class="shared-storm-step h-full">
     <!--    TODO move to common-->
-    <!--    <common-backup-storage-actions-add-temp-local-create-name-->
-    <!--      v-show="props.stepPosition === 1"-->
-    <!--      :local-create-name-submit="props.createNameSubmit"-->
-    <!--      test-id="shared-storm"-->
-    <!--      @loading="(e) => emits('loading', e)"-->
-    <!--      @submit="onChangeName"-->
-    <!--    />-->
     <common-backup-storage-actions-add-temp-local-create-name
       v-show="props.stepPosition === 1"
-      :mode="props.mode"
       :local-create-name-submit="props.createNameSubmit"
       test-id="shared-storm"
       @loading="(e) => emits('loading', e)"
-      @submit="onChangeName($event)"
+      @submit="onChangeName"
     />
 
     <common-backup-storage-actions-add-temp-shared-storm-storage
@@ -25,62 +17,47 @@
       :storage-submit="storageSubmitLocal"
       @change="onChangeStorage"
     />
-
-    <templates-inventory-actions-backup-storage-add-temp-nfs-accessibility
-        v-if="mode === 'sphere' && props.stepPosition === 3"
-        :host-accessibility-submit="props.hostAccessibilitySubmit"
-        :hosts="props.hosts"
-        @next="onChangeAccessibilityAndNext"
-    />
   </div>
 </template>
 
 <script lang="ts" setup>
 import type { UI_I_TablePayload } from '~/lib/models/table/interfaces'
 import type { UI_I_DatastoreTableItem } from '~/lib/models/store/storage/interfaces'
-import type { UI_T_Project } from '~/lib/models/types'
 import type { I_SharedStormData } from '~/components/common/backup/storage/actions/add/temp/lib/models/interfaces'
 
 const props = defineProps<{
-  mode: UI_T_Project
-  hosts: any
   stepPosition: number
   createNameSubmit: number
   storageSubmit: number
-  hostAccessibilitySubmit: number
-  datastore: UI_I_DatastoreTableItem[]
-  getDatastoreTableFunc: (payload: UI_I_TablePayload) => Promise<void>
 }>()
 const emits = defineEmits<{
   (event: 'loading', value: boolean): void
   (event: 'submit', value: I_SharedStormData): void
 }>()
 
-// const { $store }: any = useNuxtApp()
+const { $store } = useNuxtApp()
 
 const storage = ref<UI_I_DatastoreTableItem | null>(null)
 const onChangeStorage = (data: UI_I_DatastoreTableItem | null): void => {
   storage.value = data
 }
-// const datastore = computed<UI_I_DatastoreTableItem[]>(
-//   () => $store.getters['storage/getDatastoreTable'] || []
-// )
-// const getDatastoreTableFunc = async (
-//   payload: UI_I_TablePayload
-// ): Promise<void> => {
-//   await $store.dispatch('storage/A_GET_DATASTORE_TABLE', payload)
-// }
-
-const sendData: any = {
-  name: '',
-  storm_id: '',
-  storm_name: '',
-  hosts: []
+const datastore = computed<UI_I_DatastoreTableItem[]>(
+  () => $store.getters['storage/getDatastoreTable'] || []
+)
+const getDatastoreTableFunc = async (
+  payload: UI_I_TablePayload
+): Promise<void> => {
+  await $store.dispatch('storage/A_GET_DATASTORE_TABLE', payload)
 }
 
+const storageName = ref<string>('')
 const onChangeName = (name: string): void => {
-  sendData.name = name
-  emits('submit', sendData)
+  storageName.value = name
+  emits('submit', {
+    name: storageName.value,
+    storm_id: storage.value?.id,
+    storm_name: storage.value?.name,
+  })
 }
 
 const storageSubmitLocal = ref<Function | null>(null)
@@ -89,18 +66,15 @@ watch(
   () => {
     storageSubmitLocal.value = (isValid: boolean): void => {
       if (isValid) {
-        sendData.storm_id = storage.value?.id
-        sendData.storm_name = storage.value?.name
-        emits('submit', sendData)
+        emits('submit', {
+          name: storageName.value,
+          storm_id: storage.value?.id,
+          storm_name: storage.value?.name,
+        })
       }
     }
   }
 )
-
-const onChangeAccessibilityAndNext = (hosts: string[]): void => {
-  sendData.hosts = hosts
-  emits('submit', sendData)
-}
 </script>
 
 <style lang="scss" scoped></style>

package/components/common/backup/storage/actions/add/temp/sharedStorm/createName/CreateName.vue

@@ -0,0 +1,156 @@
+<template>
+  <div class="create-datastore-name">
+    <atoms-alert
+      v-show="errors.length"
+      test-id="datastore-creat-name"
+      status="alert-danger"
+      :items="errors"
+      @remove="onRemoveValidationErrors"
+    />
+
+    <div class="clr-form-control clr-row flex flex-row">
+      <label for="datastore-name" class="clr-control-label clr-col-md-2">{{
+        localization.common.datastoreName
+      }}</label>
+
+      <div class="clr-control-container" :class="nameErrorText && 'clr-error'">
+        <div class="flex-align-center">
+          <input
+            id="datastore-name"
+            v-model.trim="form.name.value"
+            data-id="shared-storm-backup-storage-name-input"
+            type="text"
+            class="clr-input"
+            @blur="onBlurInputName"
+            @input="onInputName"
+          />
+          <atoms-the-icon class="error-icon" name="info-circle" />
+        </div>
+
+        <div class="clr-subtext ng-star-inserted">
+          {{ nameErrorText }}
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script lang="ts" setup>
+// TODO refactoring
+import type { UI_I_ValidationTouchResult } from '~/lib/models/plugins/validation/interfaces'
+import type { UI_I_Localization } from '~/lib/models/interfaces'
+import { defaultFormFunc } from '~/components/common/backup/storage/actions/add/temp/local/createName/lib/config/defaultForm'
+import { checkValidityName } from '~/components/common/backup/storage/actions/add/temp/lib/utils'
+
+const props = defineProps<{
+  localCreateNameSubmit: number
+}>()
+const emits = defineEmits<{
+  (event: 'loading', value: boolean): void
+  (event: 'submit', value: string): void
+}>()
+
+const localization = computed<UI_I_Localization>(() => useLocal())
+const { $validation } = useNuxtApp()
+
+const validation = $validation.call({})
+const defaultForm: any = defaultFormFunc(localization.value)
+const form = ref<any>(useDeepCopy(defaultForm))
+
+const setForm = (): void => {
+  form.value = useDeepCopy(defaultForm)
+  validation.setForm(form)
+}
+setForm()
+
+const validForm = ref<UI_I_ValidationTouchResult | null>(null)
+
+/* Validation for Name input */
+const isInitNameValidation = ref<boolean>(false)
+const onBlurInputName = (): void => {
+  validForm.value = validation.touch()
+  isInitNameValidation.value = true
+}
+const onInputName = (): void => {
+  validForm.value = validation.touch()
+}
+const nameErrorText = computed<string>(() => {
+  if (!isInitNameValidation.value) return ''
+  return validForm.value?.errors?.name?.[0] || ''
+})
+/* Validation Name input end */
+
+const errors = ref<string[]>([])
+const showValidationErrors = (data: string[]): void => {
+  errors.value = data
+}
+const onRemoveValidationErrors = (): void => {
+  errors.value = []
+}
+const submit = async (): Promise<void> => {
+  const name = form.value.name.value
+
+  if (!name) {
+    validForm.value = validation.touch()
+    isInitNameValidation.value = true
+    if (nameErrorText.value) return
+  }
+
+  if (name) {
+    emits('loading', true)
+
+    const { valid, msg } = await checkValidityName(name)
+
+    emits('loading', false)
+
+    if (!valid) {
+      showValidationErrors([msg])
+      return
+    }
+  }
+
+  onRemoveValidationErrors()
+  emits('submit', name)
+}
+watch(
+  () => props.localCreateNameSubmit,
+  () => {
+    submit()
+  }
+)
+</script>
+
+<style lang="scss" scoped>
+.create-datastore-name {
+  &__alert-info {
+    :deep(.alert-text) {
+      font-size: 11px;
+      letter-spacing: normal;
+    }
+  }
+  .clr-form-control {
+
+    .clr-control-container {
+      min-height: 48px;
+      input {
+        width: 375px;
+      }
+      &.clr-error {
+        .clr-subtext,
+        .error-icon {
+          display: block;
+        }
+      }
+      .clr-subtext,
+      .error-icon {
+        display: none;
+      }
+      .error-icon {
+        fill: #db2100;
+        width: 24px;
+        height: 24px;
+      }
+    }
+  }
+}
+</style>

package/components/common/backup/storage/actions/add/temp/sharedStorm/createName/lib/config/defaultForm.ts

@@ -0,0 +1,15 @@
+import type { UI_I_Localization } from '~/lib/models/interfaces'
+
+export const defaultFormFunc = (localization: UI_I_Localization): any => {
+  return {
+    name: {
+      value: '',
+      validations: [
+        {
+          value: 'required',
+          errorText: localization.common.specifyDatastoreName,
+        },
+      ],
+    },
+  }
+}

package/components/common/backup/storage/actions/add/temp/types/Types.vue

@@ -40,7 +40,7 @@ import type {
 import { datastoreTypesFunc } from '~/components/common/backup/storage/actions/add/temp/types/lib/config/typeOptions'
 
 const props = defineProps<{
-  // project: UI_T_Project
+  project: UI_T_Project
   type: UI_T_DatastoreType
 }>()
 const emits = defineEmits<{
@@ -49,8 +49,7 @@ const emits = defineEmits<{
 const localization = computed<UI_I_Localization>(() => useLocal())
 
 const datastoreTypes = ref<UI_I_RadioOption[]>(
-  datastoreTypesFunc(localization.value)
-  // datastoreTypesFunc(localization.value, props.project)
+  datastoreTypesFunc(localization.value, props.project)
 )
 
 const selectedType = computed<UI_T_DatastoreType>({

package/components/common/backup/storage/actions/add/temp/types/lib/config/typeOptions.ts

@@ -1,22 +1,12 @@
 import type { UI_I_Localization } from '~/lib/models/interfaces'
-// import type { UI_T_Project } from '~/lib/models/types'
+import type { UI_T_Project } from '~/lib/models/types'
 import type { UI_I_RadioOption } from '~/components/common/select/radio/lib/models/interfaces'
 
 export const datastoreTypesFunc = (
   localization: UI_I_Localization,
-  // project: UI_T_Project
+  project: UI_T_Project
 ): UI_I_RadioOption[] => {
-  // const types = [
-  return [
-    {
-      label: localization.common.localStorage,
-      value: 'local',
-      disabled: false,
-      description: localization.common.localDesc,
-      isTooltip: false,
-      tooltipContent: localization.common.localStorageHelpDesc,
-      testId: 'datastore-type-local',
-    },
+  const types = [
     {
       label: localization.common.nfs,
       value: 'nfs',
@@ -46,17 +36,17 @@ export const datastoreTypesFunc = (
     },
   ]
 
-  // if (project === 'procurator') {
-  //   types.unshift({
-  //     label: localization.common.localStorage,
-  //     value: 'local',
-  //     disabled: false,
-  //     description: localization.common.localDesc,
-  //     isTooltip: false,
-  //     tooltipContent: localization.common.localStorageHelpDesc,
-  //     testId: 'datastore-type-local',
-  //   })
-  // }
+  if (project === 'procurator') {
+    types.unshift({
+      label: localization.common.localStorage,
+      value: 'local',
+      disabled: false,
+      description: localization.common.localDesc,
+      isTooltip: false,
+      tooltipContent: localization.common.localStorageHelpDesc,
+      testId: 'datastore-type-local',
+    })
+  }
 
-  // return types
+  return types
 }

package/components/common/browse/blocks/lib/models/types.ts

@@ -1 +1 @@
-export type UI_T_BlocksWidth = [number, number, number]
+export type UI_T_BlocksWidth = [number, number, number]

package/components/common/browse/lib/models/interfaces.ts

@@ -1,5 +1,5 @@
-export interface UI_I_FileInfo {
-  type: string
-  title: string
-  value: string | number
-}
+export interface UI_I_FileInfo {
+  type: string
+  title: string
+  value: string | number
+}

package/components/common/diagramMain/adapter/AdapterItems.vue

@@ -1,61 +1,61 @@
-<template>
-  <g data-title="adapter-items-group">
-    <template v-if="props.adaptersWithPositions.toggle">
-      <template
-        v-for="(adapter, key) in props.adaptersWithPositions.adapters"
-        :key="adapter.id"
-      >
-        <common-diagram-main-adapter-item
-          :adapter="adapter"
-          :selected-port="props.selectedPort"
-          :selected-adapter="props.selectedAdapter"
-          :networks-count="props.networksCount"
-          :is-dark-mode="props.isDarkMode"
-          :networks-with-positions="props.networksWithPositions"
-          @select-adapter="onSelectAdapter"
-          @show-modal="onShowModal"
-        />
-      </template>
-    </template>
-  </g>
-</template>
-
-<script setup lang="ts">
-import {
-  UI_I_AdaptersWithPositions,
-  UI_I_ModalsInitialData,
-  UI_I_SelectedAdapter,
-  UI_I_SelectedPort,
-  UI_I_NetworksWithPositions,
-} from '~/components/common/diagramMain/lib/models/interfaces'
-
-const props = defineProps<{
-  adaptersWithPositions: UI_I_AdaptersWithPositions
-  networksWithPositions: UI_I_NetworksWithPositions[]
-  selectedPort: UI_I_SelectedPort
-  selectedAdapter: UI_I_SelectedAdapter
-  networksCount: number
-  isDarkMode: boolean
-}>()
-
-const emits = defineEmits<{
-  (event: 'select-adapter', adapterId: string): void
-  (
-    event: 'show-modal',
-    value: string,
-    properties?: UI_I_ModalsInitialData
-  ): void
-}>()
-
-const onSelectAdapter = (adapterId: string): void => {
-  emits('select-adapter', adapterId)
-}
-const onShowModal = (
-  value: string,
-  properties?: UI_I_ModalsInitialData
-): void => {
-  emits('show-modal', value, properties)
-}
-</script>
-
-<style scoped lang="scss"></style>
+<template>
+  <g data-title="adapter-items-group">
+    <template v-if="props.adaptersWithPositions.toggle">
+      <template
+        v-for="(adapter, key) in props.adaptersWithPositions.adapters"
+        :key="adapter.id"
+      >
+        <common-diagram-main-adapter-item
+          :adapter="adapter"
+          :selected-port="props.selectedPort"
+          :selected-adapter="props.selectedAdapter"
+          :networks-count="props.networksCount"
+          :is-dark-mode="props.isDarkMode"
+          :networks-with-positions="props.networksWithPositions"
+          @select-adapter="onSelectAdapter"
+          @show-modal="onShowModal"
+        />
+      </template>
+    </template>
+  </g>
+</template>
+
+<script setup lang="ts">
+import {
+  UI_I_AdaptersWithPositions,
+  UI_I_ModalsInitialData,
+  UI_I_SelectedAdapter,
+  UI_I_SelectedPort,
+  UI_I_NetworksWithPositions,
+} from '~/components/common/diagramMain/lib/models/interfaces'
+
+const props = defineProps<{
+  adaptersWithPositions: UI_I_AdaptersWithPositions
+  networksWithPositions: UI_I_NetworksWithPositions[]
+  selectedPort: UI_I_SelectedPort
+  selectedAdapter: UI_I_SelectedAdapter
+  networksCount: number
+  isDarkMode: boolean
+}>()
+
+const emits = defineEmits<{
+  (event: 'select-adapter', adapterId: string): void
+  (
+    event: 'show-modal',
+    value: string,
+    properties?: UI_I_ModalsInitialData
+  ): void
+}>()
+
+const onSelectAdapter = (adapterId: string): void => {
+  emits('select-adapter', adapterId)
+}
+const onShowModal = (
+  value: string,
+  properties?: UI_I_ModalsInitialData
+): void => {
+  emits('show-modal', value, properties)
+}
+</script>
+
+<style scoped lang="scss"></style>