fix: add nested objects check for compact class

Author: JoshuaKGoldberg

static/app/views/explore/components/traceItemAttributes/attributesTreeValue.spec.tsx

@@ -208,6 +208,18 @@ describe('AttributesTreeValue', () => {
     expect(pre).toHaveClass('compact');
   });
 
+  it('renders short JSON with nested objects without compact class', () => {
+    const jsonContent = {
+      ...defaultProps.content,
+      value: '{"a":{"b":{"c":{"d":1}}}}',
+    };
+
+    render(<AttributesTreeValue {...defaultProps} content={jsonContent} />);
+
+    const pre = screen.getByText('a').closest('pre');
+    expect(pre).not.toHaveClass('compact');
+  });
+
   it('renders long JSON without compact class', () => {
     const jsonContent = {
       ...defaultProps.content,

static/app/views/explore/components/traceItemAttributes/attributesTreeValue.tsx

@@ -28,6 +28,14 @@ function tryParseJson(value: unknown) {
   }
 }
 
+function hasNestedObject(value: unknown) {
+  if (typeof value !== 'object' || value === null) {
+    return false;
+  }
+  const values = Array.isArray(value) ? value : Object.values(value);
+  return values.some(v => typeof v === 'object' && v !== null);
+}
+
 export function AttributesTreeValue<RendererExtra extends RenderFunctionBaggage>({
   config,
   content,
@@ -79,7 +87,9 @@ export function AttributesTreeValue<RendererExtra extends RenderFunctionBaggage>
         data={parsedJson}
         maxDefaultDepth={2}
         withAnnotatedText={false}
-        className={value.length <= 48 ? 'compact' : undefined}
+        className={
+          value.length <= 48 && !hasNestedObject(parsedJson) ? 'compact' : undefined
+        }
       />
     );
   }