How it works

• JSON format: Only basic JSON is supported. Nested arrays will not render as nicely in a table format inside the HubSpot extension.
• Automatic Detection: Scans all object properties and filters those containing JSON with more than one top‐level key.
• Dynamic Tables: Renders each JSON property in its own collapsible table with column headers derived from field names.
• Type Formatting: Date and currency values detected by field name (e.g., createdDate, amount) are presented in human‐readable formats.
• Empty & Error States: Displays informative messages when:
  - No JSON properties are found
  - A JSON property contains malformed data
  - A JSON object only has a single key (filtered out)
• Responsive UI: Uses HubSpot UI Extensions components to blend seamlessly with native CRM styling. 

Setup Guide

1) Click the Install APP button above and follow the connection steps

2) Once installed create a property on a contact, company or deal to store your JSON data. (Multi line text is the ideal property type)

3) Save a basic JSON array to the newly created property.

The table header in HubSpot will pull from JSON property names. A row will then be rendered for each array item with the values. Note: nested JSON arrays are not supported.

JSON example below:

4) Add the JSON Viewer card to the middle pane view to your HubSpot object of choice (eg. Contact object)

5) Now return to the record in HubSpot that you have saved some JSON to on your new property and refresh the card. You JSON should now display inside the middle pane card.