diff --git a/hivemq-edge/src/frontend/src/api/hooks/useDomainModel/__handlers__/index.ts b/hivemq-edge/src/frontend/src/api/hooks/useDomainModel/__handlers__/index.ts
index 4874ed1f7a..ba3d446fc4 100644
--- a/hivemq-edge/src/frontend/src/api/hooks/useDomainModel/__handlers__/index.ts
+++ b/hivemq-edge/src/frontend/src/api/hooks/useDomainModel/__handlers__/index.ts
@@ -23,7 +23,7 @@ export const GENERATE_DATA_MODELS = (short = false, title?: string): RJSFSchema
type: 'string',
title: short ? 'First String' : 'firstName',
default: 'Chuck',
- examples: 'firstName',
+ examples: ['firstName'],
},
lastName: {
type: 'string',
@@ -40,11 +40,11 @@ export const GENERATE_DATA_MODELS = (short = false, title?: string): RJSFSchema
subItems: {
type: 'object',
title: 'subItems',
- examples: 'subItems',
+ examples: ['subItems'],
properties: {
name: {
- examples: 'name',
+ examples: ['name'],
type: 'string',
title: 'name',
default: 'Default name',
diff --git a/hivemq-edge/src/frontend/src/components/rjsf/MqttTransformation/components/schema/PropertyItem.spec.cy.tsx b/hivemq-edge/src/frontend/src/components/rjsf/MqttTransformation/components/schema/PropertyItem.spec.cy.tsx
index f860907199..f349f9ff38 100644
--- a/hivemq-edge/src/frontend/src/components/rjsf/MqttTransformation/components/schema/PropertyItem.spec.cy.tsx
+++ b/hivemq-edge/src/frontend/src/components/rjsf/MqttTransformation/components/schema/PropertyItem.spec.cy.tsx
@@ -47,7 +47,7 @@ describe('PropertyItem', () => {
it('should render examples properly', () => {
cy.mountWithProviders(
-
+
)
cy.getByAriaLabel('Property').should('have.attr', 'data-type', 'object')
diff --git a/hivemq-edge/src/frontend/src/components/rjsf/MqttTransformation/components/schema/PropertyItem.tsx b/hivemq-edge/src/frontend/src/components/rjsf/MqttTransformation/components/schema/PropertyItem.tsx
index 562e3286a8..a58ea882d5 100644
--- a/hivemq-edge/src/frontend/src/components/rjsf/MqttTransformation/components/schema/PropertyItem.tsx
+++ b/hivemq-edge/src/frontend/src/components/rjsf/MqttTransformation/components/schema/PropertyItem.tsx
@@ -3,7 +3,7 @@ import type { IconType } from 'react-icons'
import { useTranslation } from 'react-i18next'
import type { JSONSchema7TypeName } from 'json-schema'
import { draggable } from '@atlaskit/pragmatic-drag-and-drop/element/adapter'
-import { Badge, Code, HStack, Tooltip, Box, Icon } from '@chakra-ui/react'
+import { Badge, Code, HStack, Tooltip, Box, Icon, Text, VStack } from '@chakra-ui/react'
import { DataTypeIcon } from '@/components/rjsf/MqttTransformation/utils/data-type.utils.ts'
import { FlatJSONSchema7 } from '@/components/rjsf/MqttTransformation/utils/json-schema.utils.ts'
@@ -13,6 +13,7 @@ interface PropertyItemProps {
isDraggable?: boolean
hasTooltip?: boolean
hasExamples?: boolean
+ hasDescription?: boolean
}
const PropertyItem: FC = ({
@@ -20,6 +21,7 @@ const PropertyItem: FC = ({
isDraggable = false,
hasTooltip = false,
hasExamples = false,
+ hasDescription = false,
}) => {
const { t } = useTranslation('components')
const draggableRef = useRef(null)
@@ -40,6 +42,9 @@ const PropertyItem: FC = ({
const propertyName = property.title
const path = [...property.path, property.key].join('.')
+ // TODO[NVL] Only extracting the first value of any examples. Might want to provide something more user-friendly
+ const examples = Array.isArray(property.examples) ? property.examples[0] : property.examples
+
return (
= ({
tabIndex={isDraggable ? 0 : undefined}
py="3px"
justifyContent="flex-end"
+ alignItems="flex-start"
role="group"
aria-label={t('GenericSchema.structure.property')}
>
@@ -74,20 +80,27 @@ const PropertyItem: FC = ({
- {property.examples && hasExamples && (
-
- {property.examples.toString()}
-
- )}
+
+ {examples && hasExamples && (
+
+ {examples.toString()}
+
+ )}
+ {hasDescription && (
+
+ {property.description}
+
+ )}
+
)
}
diff --git a/hivemq-edge/src/frontend/src/components/rjsf/MqttTransformation/utils/json-schema.utils.spec.ts b/hivemq-edge/src/frontend/src/components/rjsf/MqttTransformation/utils/json-schema.utils.spec.ts
index 83c06287c6..37bd82529e 100644
--- a/hivemq-edge/src/frontend/src/components/rjsf/MqttTransformation/utils/json-schema.utils.spec.ts
+++ b/hivemq-edge/src/frontend/src/components/rjsf/MqttTransformation/utils/json-schema.utils.spec.ts
@@ -107,7 +107,7 @@ describe('reducerSchemaExamples', () => {
expect.objectContaining({
properties: expect.objectContaining({
age: {
- examples: 1,
+ examples: [1],
title: 'Age',
type: 'integer',
},
@@ -125,13 +125,13 @@ describe('reducerSchemaExamples', () => {
nestedObject: expect.objectContaining({
properties: expect.objectContaining({
age: {
- examples: 100,
+ examples: [100],
title: 'Age',
type: 'integer',
},
name: {
default: 'Default name',
- examples: 'test2',
+ examples: ['test2'],
type: 'string',
},
}),
@@ -156,7 +156,7 @@ describe('payloadToSchema', () => {
'test/topic1': {
properties: {
age: {
- examples: 1,
+ examples: [1],
type: 'integer',
},
},
diff --git a/hivemq-edge/src/frontend/src/components/rjsf/MqttTransformation/utils/json-schema.utils.ts b/hivemq-edge/src/frontend/src/components/rjsf/MqttTransformation/utils/json-schema.utils.ts
index 4574a9eefb..5ce55e184c 100644
--- a/hivemq-edge/src/frontend/src/components/rjsf/MqttTransformation/utils/json-schema.utils.ts
+++ b/hivemq-edge/src/frontend/src/components/rjsf/MqttTransformation/utils/json-schema.utils.ts
@@ -92,7 +92,7 @@ export const reducerSchemaExamples = (state: RJSFSchema, event: JsonNode) =>
})
.with(P._, ([allStates, examples]) => {
if (!examples) return allStates
- return { ...allStates, examples: examples }
+ return { ...allStates, examples: [examples] }
})
.exhaustive()