Feature/properties diff

assets/js/src/core/constants/versionConstants.ts

@@ -10,5 +10,6 @@
 
 export enum VersionCategoryName {
   SYSTEM_DATA = 'systemData',
+  PROPERTIES = 'properties',
   META = 'meta'
 }

assets/js/src/core/modules/data-object/editor/shared-tab-manager/tabs/versions/components/object-versions-fields-view/object-versions-fields-view.tsx

@@ -29,7 +29,7 @@ interface IObjectVersionsFieldsViewProps {
   isExpandedUnmodifiedFields: boolean
 }
 
-const SECTIONS_WITH_TRANSLATION: string[] = [VersionCategoryName.SYSTEM_DATA]
+const SECTIONS_WITH_TRANSLATION: string[] = [VersionCategoryName.SYSTEM_DATA, VersionCategoryName.PROPERTIES]
 const SECTIONS_WITH_COMPLEX_TYPES: string[] = [DynamicTypesList.BLOCK, DynamicTypesList.FIELD_COLLECTIONS]
 
 export const ObjectVersionsFieldsView = ({ breadcrumbsList, versionViewData, versionKeysList, isExpandedUnmodifiedFields }: IObjectVersionsFieldsViewProps): React.JSX.Element => {
@@ -64,7 +64,8 @@ export const ObjectVersionsFieldsView = ({ breadcrumbsList, versionViewData, ver
   const renderFieldTitle = ({ key, locale, isCommonSection }: { key: string, locale: string, isCommonSection: boolean }): React.JSX.Element => {
     if (isEmptyValue(key)) return <></>
 
-    const textValue = isCommonSection ? t(`version.${key}`) : t(key)
+    const isSystemDataField = breadcrumbKey === VersionCategoryName.SYSTEM_DATA
+    const textValue = isSystemDataField ? t(`version.${key}`) : t(key)
 
     return (
       <Text className={ styles.fieldTitle }>
@@ -76,7 +77,7 @@ export const ObjectVersionsFieldsView = ({ breadcrumbsList, versionViewData, ver
   return (
     <>
       {breadcrumbsList?.map((breadcrumb, index) => {
-        const isCommonSection = breadcrumb.key === VersionCategoryName.SYSTEM_DATA
+        const isCommonSection = breadcrumb.key === VersionCategoryName.SYSTEM_DATA || breadcrumb.key === VersionCategoryName.PROPERTIES
 
         return (
           <div key={ `${index}-${breadcrumb.key}` }>

assets/js/src/core/modules/data-object/editor/shared-tab-manager/tabs/versions/details-functions.ts

@@ -82,10 +82,41 @@ export const getFormattedDataStructure = async ({ objectId, layout, versionData,
     return result
   }
 
+  const getPropertiesData = (): IFormattedDataStructureData[] => {
+    return versionData.properties.map((property) => {
+      let fieldtype = 'input'
+      let fieldValue = property.data
+
+      if (['asset', 'document', 'object'].includes(property.type)) {
+        if (property.data && typeof property.data === 'object' && 'id' in property.data) {
+          fieldValue = `${property.type} [ID: ${property.data.id}]`
+        } else {
+          fieldValue = property.data
+        }
+      } else if (property.type === 'bool') {
+        fieldtype = 'checkbox'
+      }
+
+      return {
+        fieldBreadcrumbTitle: 'properties',
+        fieldData: {
+          title: property.key,
+          name: property.key,
+          fieldtype,
+          config: property.config
+        } as any,
+        fieldValue,
+        versionId,
+        versionCount
+      }
+    })
+  }
+
   const layoutData = await processLayoutData({ data: layout })
   const generalSystemData = getGeneralSystemData()
+  const propertiesData = getPropertiesData()
 
-  return [...generalSystemData, ...layoutData]
+  return [...generalSystemData, ...propertiesData, ...layoutData]
 }
 
 const getUniqFieldKey = (item: any): string => {

assets/js/src/core/modules/element/editor/shared-tab-manager/tabs/versions/version-api-slice.gen.ts

@@ -1,4 +1,5 @@
 import { api } from "@sdk/api";
+import { DataProperty } from "../properties/properties-api-slice-enhanced";
 export const addTagTypes = ["Versions"] as const;
 const injectedRtkApi = api
     .enhanceEndpoints({