diff --git a/packages/twenty-ui/src/json-visualizer/components/JsonNestedNode.tsx b/packages/twenty-ui/src/json-visualizer/components/JsonNestedNode.tsx index 7b6fbc814..6af495070 100644 --- a/packages/twenty-ui/src/json-visualizer/components/JsonNestedNode.tsx +++ b/packages/twenty-ui/src/json-visualizer/components/JsonNestedNode.tsx @@ -4,6 +4,7 @@ import { IconComponent } from '@ui/display'; import { JsonArrow } from '@ui/json-visualizer/components/internal/JsonArrow'; import { JsonList } from '@ui/json-visualizer/components/internal/JsonList'; import { JsonNodeLabel } from '@ui/json-visualizer/components/internal/JsonNodeLabel'; +import { JsonNodeValue } from '@ui/json-visualizer/components/internal/JsonNodeValue'; import { JsonNode } from '@ui/json-visualizer/components/JsonNode'; import { useJsonTreeContextOrThrow } from '@ui/json-visualizer/hooks/useJsonTreeContextOrThrow'; import { JsonNodeHighlighting } from '@ui/json-visualizer/types/JsonNodeHighlighting'; @@ -82,7 +83,7 @@ export const JsonNestedNode = ({ depth={depth} > {elements.length === 0 ? ( - {emptyElementsText} + ) : ( elements.map(({ id, label, value }) => { const nextKeyPath = isNonEmptyString(keyPath) diff --git a/packages/twenty-ui/src/json-visualizer/components/internal/JsonNodeValue.tsx b/packages/twenty-ui/src/json-visualizer/components/internal/JsonNodeValue.tsx index 9a8a82829..f3f0f06df 100644 --- a/packages/twenty-ui/src/json-visualizer/components/internal/JsonNodeValue.tsx +++ b/packages/twenty-ui/src/json-visualizer/components/internal/JsonNodeValue.tsx @@ -5,12 +5,16 @@ import { JsonNodeHighlighting } from '@ui/json-visualizer/types/JsonNodeHighligh const StyledText = styled.span<{ highlighting: JsonNodeHighlighting | undefined; }>` + align-items: center; + box-sizing: border-box; color: ${({ theme, highlighting }) => highlighting === 'blue' ? theme.adaptiveColors.blue4 : highlighting === 'red' ? theme.adaptiveColors.red4 : theme.font.color.tertiary}; + display: inline-flex; + height: 24px; `; export const JsonNodeValue = ({