starred/yaak-mountain-loop
1
0
Fork 0
mirror of https://github.com/mountain-loop/yaak.git synced 2026-04-18 14:59:42 +02:00
Code Issues 8 Packages Projects Releases 10 Wiki Activity

Better highlight on JSON tree

Browse Source
This commit is contained in:
Gregory Schier
2024-02-13 16:31:38 -08:00
parent 2cd184f0c7
commit bd084cdf02
1 changed files with 7 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
src-web/components/core/JsonAttributeTree.tsx
View File

@@ -39,8 +39,8 @@ export const JsonAttributeTree = ({ depth = 0, attrKey, attrValue, attrKeyJsonPa
/> />
)) ))
: null, : null,
isExpandable: true, isExpandable: Object.keys(attrValue).length > 0,
label: isExpanded ? '{ }' : `{⋯}`, label: isExpanded ? `{${Object.keys(attrValue).length || ' '}}` : `{⋯}`,
labelClassName: 'text-gray-600', labelClassName: 'text-gray-600',
}; };
} else if (jsonType === '[object Array]') { } else if (jsonType === '[object Array]') {
@@ -57,8 +57,8 @@ export const JsonAttributeTree = ({ depth = 0, attrKey, attrValue, attrKeyJsonPa
/> />
)) ))
: null, : null,
isExpandable: true, isExpandable: attrValue.length > 0,
label: isExpanded ? '[ ]' : `[⋯]`, label: isExpanded ? `[${attrValue.length || ' '}]` : `[⋯]`,
labelClassName: 'text-gray-600', labelClassName: 'text-gray-600',
}; };
} else { } else {
@@ -90,12 +90,12 @@ export const JsonAttributeTree = ({ depth = 0, attrKey, attrValue, attrKeyJsonPa
size="xs" size="xs"
icon="chevronRight" icon="chevronRight"
className={classNames( className={classNames(
'left-0 absolute transition-transform text-gray-600 flex items-center', 'left-0 absolute transition-transform flex items-center',
'group-hover:text-gray-900', 'text-gray-600 group-hover:text-gray-900',
isExpanded ? 'rotate-90' : '', isExpanded ? 'rotate-90' : '',
)} )}
/> />
<span className="text-violet-600 mr-1.5 whitespace-nowrap"> <span className="text-violet-600 group-hover:text-violet-700 mr-1.5 whitespace-nowrap">
{attrKey === undefined ? '$' : attrKey}: {attrKey === undefined ? '$' : attrKey}:
</span> </span>
{labelEl} {labelEl}