Hotfix/cfe (#145)

* rename element key to property + make api safe to consume both variants * lint fix * lint fix --------- Co-authored-by: volar <[email protected]>
anzusystems · Oct 10, 2023 · 418ecf5 · 418ecf5
1 parent 72c00fb
commit 418ecf5
Show file tree

Hide file tree

Showing 12 changed files with 94 additions and 52 deletions.
diff --git a/src/components/coreDam/customMetadata/AssetCustomMetadataElement.vue b/src/components/coreDam/customMetadata/AssetCustomMetadataElement.vue
@@ -11,15 +11,15 @@ const props = withDefaults(
   defineProps<{
     modelValue: any
     config: DamConfigAssetCustomFormElement
-    elementKey: string
+    elementProperty: string
     validationScope?: ValidationScope
   }>(),
   {
     validationScope: undefined,
   }
 )
 const emit = defineEmits<{
-  (e: 'update:modelValue', data: { key: string; value: any }): void
+  (e: 'update:modelValue', data: { property: string; value: any }): void
   (e: 'blur', data: any): void
 }>()
 
@@ -31,7 +31,7 @@ const fixValue = (value: any) => {
 }
 
 const updateModelValue = (value: any) => {
-  emit('update:modelValue', { key: props.elementKey, value: fixValue(value) })
+  emit('update:modelValue', { property: props.elementProperty, value: fixValue(value) })
 }
 
 const modelValueComputed = computed(() => {

diff --git a/src/components/coreDam/customMetadata/AssetCustomMetadataForm.vue b/src/components/coreDam/customMetadata/AssetCustomMetadataForm.vue
@@ -24,9 +24,9 @@ const emit = defineEmits<{
 
 const { showAllMetadata, toggleShowAllMetadata } = useAssetCustomMetadataForm()
 
-const updateModelValue = (data: { key: string; value: any }) => {
+const updateModelValue = (data: { property: string; value: any }) => {
   const updated = {} as { [key: string]: any }
-  updated[data.key] = data.value
+  updated[data.property] = data.value
   emit('update:modelValue', { ...props.modelValue, ...updated })
   emit('anyChange')
 }
@@ -73,8 +73,8 @@ const enableShowHide = computed(() => {
       <VCol>
         <AssetCustomMetadataElement
           :config="element"
-          :element-key="element.key"
-          :model-value="modelValue[element.key]"
+          :element-property="element.property"
+          :model-value="modelValue[element.property]"
           :validation-scope="AssetMetadataValidationScopeSymbol"
           @update:model-value="updateModelValue"
         />
@@ -95,8 +95,8 @@ const enableShowHide = computed(() => {
       <VCol>
         <AssetCustomMetadataElement
           :config="element"
-          :element-key="element.key"
-          :model-value="modelValue[element.key]"
+          :element-property="element.property"
+          :model-value="modelValue[element.property]"
           @update:model-value="updateModelValue"
         />
       </VCol>

diff --git a/src/components/coreDam/customMetadata/AssetCustomMetadataFormMassOperations.vue b/src/components/coreDam/customMetadata/AssetCustomMetadataFormMassOperations.vue
@@ -16,21 +16,21 @@ const props = withDefaults(
 )
 const emit = defineEmits<{
   (e: 'update:modelValue', data: any): void
-  (e: 'fillEmptyField', data: { assetType: AssetType; elementKey: string; value: any }): void
-  (e: 'replaceField', data: { assetType: AssetType; elementKey: string; value: any }): void
+  (e: 'fillEmptyField', data: { assetType: AssetType; elementProperty: string; value: any }): void
+  (e: 'replaceField', data: { assetType: AssetType; elementProperty: string; value: any }): void
 }>()
 
-const updateModelValue = (data: { key: string; value: any }) => {
+const updateModelValue = (data: { property: string; value: any }) => {
   const updated = {} as { [key: string]: any }
-  updated[data.key] = data.value
+  updated[data.property] = data.value
   emit('update:modelValue', { ...props.modelValue, ...updated })
 }
 
-const fillEmptyField = (elementKey: string, value: any) => {
-  emit('fillEmptyField', { assetType: props.assetType, elementKey, value })
+const fillEmptyField = (elementProperty: string, value: any) => {
+  emit('fillEmptyField', { assetType: props.assetType, elementProperty, value })
 }
-const replaceField = (elementKey: string, value: any) => {
-  emit('replaceField', { assetType: props.assetType, elementKey, value })
+const replaceField = (elementProperty: string, value: any) => {
+  emit('replaceField', { assetType: props.assetType, elementProperty, value })
 }
 
 const elements = computed(() => {
@@ -50,16 +50,16 @@ const elements = computed(() => {
         <div class="d-flex">
           <AssetCustomMetadataElement
             :config="element"
-            :element-key="element.key"
-            :model-value="modelValue[element.key]"
+            :element-property="element.property"
+            :model-value="modelValue[element.property]"
             @update:model-value="updateModelValue"
           />
           <VBtn
             icon
             size="small"
             variant="text"
             class="mr-1"
-            @click.stop="fillEmptyField(element.key, modelValue[element.key])"
+            @click.stop="fillEmptyField(element.property, modelValue[element.property])"
           >
             <VIcon icon="mdi-file-arrow-left-right-outline" />
             <VTooltip
@@ -73,7 +73,7 @@ const elements = computed(() => {
             icon
             size="small"
             variant="text"
-            @click.stop="replaceField(element.key, modelValue[element.key])"
+            @click.stop="replaceField(element.property, modelValue[element.property])"
           >
             <VIcon icon="mdi-file-replace-outline" />
             <VTooltip

diff --git a/src/services/DamConfigAssetCustomFormService.ts b/src/services/DamConfigAssetCustomFormService.ts
@@ -1,8 +1,9 @@
 import { ref } from 'vue'
-import type { DamConfigAssetCustomFormElement } from '@/types/coreDam/DamConfigAssetCustomForm'
+import type { DamConfigAssetCustomFormElement, DamConfigAssetCustomFormElementTemp } from '@/types/coreDam/DamConfigAssetCustomForm'
 import { fetchAssetCustomFormElements } from '@/services/api/coreDam/assetCustomFormApi'
 import { AssetType } from '@/model/coreDam/valueObject/AssetType'
 import { useCurrentExtSystem } from '@/composables/system/currentExtSystem'
+import { mapElementsWithKeyToProperty } from '@/services/TempMapCustomFormElementHelper'
 
 export const damConfigAssetCustomFormElementsInitialized = ref(false)
 
@@ -15,12 +16,12 @@ export const damConfigAssetCustomFormElements: {
   document: [],
 }
 
-const setDamConfigAssetCustomFormElements = (responses: Awaited<{ data: DamConfigAssetCustomFormElement[] }>[]) => {
+const setDamConfigAssetCustomFormElements = (responses: Awaited<{ data: DamConfigAssetCustomFormElementTemp[] }>[]) => {
   try {
-    damConfigAssetCustomFormElements.image = responses[0].data
-    damConfigAssetCustomFormElements.audio = responses[1].data
-    damConfigAssetCustomFormElements.video = responses[2].data
-    damConfigAssetCustomFormElements.document = responses[3].data
+    damConfigAssetCustomFormElements.image = mapElementsWithKeyToProperty(responses[0].data)
+    damConfigAssetCustomFormElements.audio = mapElementsWithKeyToProperty(responses[1].data)
+    damConfigAssetCustomFormElements.video = mapElementsWithKeyToProperty(responses[2].data)
+    damConfigAssetCustomFormElements.document = mapElementsWithKeyToProperty(responses[3].data)
 
     damConfigAssetCustomFormElementsInitialized.value = true
   } catch (err) {

diff --git a/src/services/DamConfigDistributionCustomFormService.ts b/src/services/DamConfigDistributionCustomFormService.ts
@@ -1,6 +1,7 @@
 import { type Ref, ref } from 'vue'
 import { fetchDistributionCustomFormElements } from '@/services/api/coreDam/assetCustomFormApi'
 import type { DistributionServiceName } from '@/types/coreDam/DamConfig'
+import { mapElementsWithKeyToProperty } from '@/services/TempMapCustomFormElementHelper'
 
 export const damConfigDistributionCustomFormElements: Ref<Record<DistributionServiceName, any>> = ref({})
 
@@ -12,7 +13,7 @@ export const loadDamConfigDistributionCustomFormElements = (distributionServiceN
     }
     fetchDistributionCustomFormElements(distributionServiceName)
       .then((res) => {
-        damConfigDistributionCustomFormElements.value[distributionServiceName] = res.data
+        damConfigDistributionCustomFormElements.value[distributionServiceName] = mapElementsWithKeyToProperty(res.data)
         resolve(true)
         return
       })

diff --git a/src/services/TempMapCustomFormElementHelper.ts b/src/services/TempMapCustomFormElementHelper.ts
@@ -0,0 +1,28 @@
+// todo will be removed once rename key => property will be implemented
+
+import type {
+  DamConfigAssetCustomFormElement,
+  DamConfigAssetCustomFormElementTemp
+} from '@/types/coreDam/DamConfigAssetCustomForm'
+import { isDefined } from '@anzusystems/common-admin'
+
+export function mapElementsWithKeyToProperty
+(items: Array<DamConfigAssetCustomFormElementTemp>
+): Array<DamConfigAssetCustomFormElement> {
+  return items.map(item => {
+    return {
+      id: item.id,
+      property: isDefined(item.property) ? item.property as string : item.key as string,
+      name: item.name,
+      position: item.position,
+      attributes: item.attributes,
+      createdAt: item.createdAt,
+      modifiedAt: item.modifiedAt,
+      createdBy: item.createdBy,
+      modifiedBy: item.modifiedBy,
+      _system: item._system,
+      _resourceName: item._resourceName,
+    }
+  })
+
+}
diff --git a/src/services/api/coreDam/assetApi.ts b/src/services/api/coreDam/assetApi.ts
@@ -173,7 +173,7 @@ const handleMetadataValidationError = (error: any, assetType: AssetType) => {
   const items = [] as ValidationError[]
   for (const [key, values] of Object.entries(data.fields)) {
     const field = key.split('.').pop()
-    const found = damConfigAssetCustomFormElements[assetType].find((item) => item.key === field)
+    const found = damConfigAssetCustomFormElements[assetType].find((item) => item.property === field)
     if (found) {
       items.push({
         field: found.name,

diff --git a/src/services/api/coreDam/assetCustomFormApi.ts b/src/services/api/coreDam/assetCustomFormApi.ts
@@ -3,15 +3,15 @@ import { apiFetchOne } from '@anzusystems/common-admin'
 import { damClient } from '@/services/api/clients/damClient'
 import { SYSTEM_CORE_DAM } from '@/model/systems'
 import type { AssetType } from '@/model/coreDam/valueObject/AssetType'
-import type { DamConfigAssetCustomFormElement } from '@/types/coreDam/DamConfigAssetCustomForm'
+import type { DamConfigAssetCustomFormElementTemp } from '@/types/coreDam/DamConfigAssetCustomForm'
 import type { DistributionServiceName } from '@/types/coreDam/DamConfig'
 
 const END_POINT = '/adm/v1/asset-custom-form'
 const ENTITY = 'assetCustomForm'
 
 // todo limit set to 100 for now, add load for pagination?
 export const fetchAssetCustomFormElements = (extSystem: IntegerId, assetType: AssetType) =>
-  apiFetchOne<{ data: DamConfigAssetCustomFormElement[] }>(
+  apiFetchOne<{ data: DamConfigAssetCustomFormElementTemp[] }>(
     damClient,
     END_POINT + '/ext-system/:extSystem/type/:assetType/element?order[position]=asc&limit=100',
     { extSystem, assetType },
@@ -21,7 +21,7 @@ export const fetchAssetCustomFormElements = (extSystem: IntegerId, assetType: As
 
 // todo limit set to 100 for now, add load for pagination?
 export const fetchDistributionCustomFormElements = (distributionService: DistributionServiceName) =>
-  apiFetchOne<{ data: DamConfigAssetCustomFormElement[] }>(
+  apiFetchOne<{ data: DamConfigAssetCustomFormElementTemp[] }>(
     damClient,
     END_POINT + '/distribution-service/:distributionService/element?order[position]=asc&limit=100',
     { distributionService },

diff --git a/src/stores/coreDam/uploadQueuesStore.ts b/src/stores/coreDam/uploadQueuesStore.ts
@@ -8,7 +8,7 @@ import type { UploadQueue, UploadQueueItem } from '@/types/coreDam/UploadQueue'
 import { QueueItemStatus, QueueItemType } from '@/types/coreDam/UploadQueue'
 import type { AssetFileNullable } from '@/types/coreDam/File'
 import { LinkType } from '@/types/coreDam/File'
-import type { AssetSearchListItemDto } from '@/types/coreDam/Asset'
+import type { AssetDetailItemDto, AssetSearchListItemDto } from '@/types/coreDam/Asset'
 import { AssetStatus } from '@/model/coreDam/valueObject/AssetStatus'
 import { getAssetTypeByMimeType } from '@/services/upload/mimeTypeService'
 import { AssetType } from '@/model/coreDam/valueObject/AssetType'
@@ -25,7 +25,6 @@ import { useCachedAuthors } from '@/views/coreDam/author/composables/cachedAutho
 import { useCachedKeywords } from '@/views/coreDam/keyword/composables/cachedKeywords'
 import { getAuthorConflicts, updateNewNames } from '@/services/AssetSuggestionsService'
 import { useAssetDetailStore } from '@/stores/coreDam/assetDetailStore'
-import type { AssetDetailItemDto } from '@/types/coreDam/Asset'
 import { fileTypeFix } from '@/services/fileType'
 
 interface State {
@@ -474,15 +473,19 @@ export const useUploadQueuesStore = defineStore('damUploadQueuesStore', {
     },
     queueItemsReplaceEmptyCustomDataValue(
       queueId: string,
-      data: { assetType: AssetType; elementKey: string; value: any },
+      data: { assetType: AssetType; elementProperty: string; value: any },
       forceReplace = false
     ) {
       const items = this.queues[queueId].items
       for (let i = 0; i < items.length; i++) {
         const item = items[i]
         if (item.assetType !== data.assetType) continue
-        if (forceReplace || isUndefined(item.customData[data.elementKey]) || item.customData[data.elementKey] === '') {
-          item.customData[data.elementKey] = data.value
+        if (
+          forceReplace ||
+          isUndefined(item.customData[data.elementProperty]) ||
+          item.customData[data.elementProperty] === ''
+        ) {
+          item.customData[data.elementProperty] = data.value
         }
       }
     },

diff --git a/src/types/coreDam/DamConfigAssetCustomForm.ts b/src/types/coreDam/DamConfigAssetCustomForm.ts
@@ -20,7 +20,16 @@ export interface DamConfigAssetCustomFormAttributes {
 
 export interface DamConfigAssetCustomFormElement extends AnzuUserAndTimeTrackingAware, ResourceNameSystemAware {
   id: DocId
-  key: string
+  property: string
+  name: string
+  position: number
+  attributes: DamConfigAssetCustomFormAttributes
+}
+
+export interface DamConfigAssetCustomFormElementTemp extends AnzuUserAndTimeTrackingAware, ResourceNameSystemAware {
+  id: DocId
+  key?: string
+  property?: string
   name: string
   position: number
   attributes: DamConfigAssetCustomFormAttributes

diff --git a/src/views/coreDam/asset/components/queue/AssetQueueSelectedSidebar.vue b/src/views/coreDam/asset/components/queue/AssetQueueSelectedSidebar.vue
@@ -25,10 +25,10 @@ const panels = ref<Array<string>>(['general'])
 
 const uploadQueuesStore = useUploadQueuesStore()
 
-const fillEmptyField = (data: { assetType: AssetType; elementKey: string; value: any }) => {
+const fillEmptyField = (data: { assetType: AssetType; elementProperty: string; value: any }) => {
   uploadQueuesStore.queueItemsReplaceEmptyCustomDataValue(props.queueId, data)
 }
-const replaceField = (data: { assetType: AssetType; elementKey: string; value: any }) => {
+const replaceField = (data: { assetType: AssetType; elementProperty: string; value: any }) => {
   uploadQueuesStore.queueItemsReplaceEmptyCustomDataValue(props.queueId, data, true)
 }
 const fillEmptyKeywords = () => {
@@ -44,45 +44,45 @@ const replaceAuthors = () => {
   uploadQueuesStore.queueItemsReplaceEmptyAuthors(props.queueId, massOperationsAuthors.value, true)
 }
 const fillAll = (forceReplace = false) => {
-  for (const [elementKey, value] of Object.entries(massOperationsData.value.image)) {
+  for (const [elementProperty, value] of Object.entries(massOperationsData.value.image)) {
     uploadQueuesStore.queueItemsReplaceEmptyCustomDataValue(
       props.queueId,
       {
         assetType: AssetType.Image,
-        elementKey,
+        elementProperty,
         value,
       },
       forceReplace
     )
   }
-  for (const [elementKey, value] of Object.entries(massOperationsData.value.video)) {
+  for (const [elementProperty, value] of Object.entries(massOperationsData.value.video)) {
     uploadQueuesStore.queueItemsReplaceEmptyCustomDataValue(
       props.queueId,
       {
         assetType: AssetType.Video,
-        elementKey,
+        elementProperty,
         value,
       },
       forceReplace
     )
   }
-  for (const [elementKey, value] of Object.entries(massOperationsData.value.audio)) {
+  for (const [elementProperty, value] of Object.entries(massOperationsData.value.audio)) {
     uploadQueuesStore.queueItemsReplaceEmptyCustomDataValue(
       props.queueId,
       {
         assetType: AssetType.Audio,
-        elementKey,
+        elementProperty,
         value,
       },
       forceReplace
     )
   }
-  for (const [elementKey, value] of Object.entries(massOperationsData.value.document)) {
+  for (const [elementProperty, value] of Object.entries(massOperationsData.value.document)) {
     uploadQueuesStore.queueItemsReplaceEmptyCustomDataValue(
       props.queueId,
       {
         assetType: AssetType.Document,
-        elementKey,
+        elementProperty,
         value,
       },
       forceReplace

diff --git a/src/views/coreDam/asset/detail/components/distribution/DistributionCustomMetadataForm.vue b/src/views/coreDam/asset/detail/components/distribution/DistributionCustomMetadataForm.vue
@@ -19,9 +19,9 @@ const emit = defineEmits<{
   (e: 'anyChange'): void
 }>()
 
-const updateModelValue = (data: { key: string; value: any }) => {
+const updateModelValue = (data: { property: string; value: any }) => {
   const updated = {} as { [key: string]: any }
-  updated[data.key] = data.value
+  updated[data.property] = data.value
   emit('update:modelValue', { ...props.modelValue, ...updated })
   emit('anyChange')
 }
@@ -42,8 +42,8 @@ const elements = computed(() => {
       <VCol>
         <AssetCustomMetadataElement
           :config="element"
-          :element-key="element.key"
-          :model-value="modelValue[element.key]"
+          :element-property="element.property"
+          :model-value="modelValue[element.property]"
           :validation-scope="AssetMetadataValidationScopeSymbol"
           @update:model-value="updateModelValue"
         />