Our December update brings you updates on HubSpot's new email subscription synchronization system along with auto-translation capabilities for App Marketplace listings in all supported languages. We've also launched UI Extensions into public beta, introducing React-based app cards, a new serverless API and a publicly available Figma Design Kit. Additional improvements include a consolidated key management area, expanded webhook support for private apps and new API endpoints for checking data model limits.

Please read more below.

Developer Updates for December 2024

HubSpot Email Subscription Status Sync

HubSpot’s email subscription management system now automatically synchronizes global email opt-outs with individual subscription statuses to ensure consistency across all communication preferences. This effectively resolves any 'mixed' subscription states and includes retroactive alignment of historical subscription statuses with contacts' global communication preferences.

New Behavior

When a contact opts out of all email communications, the system automatically sets all subscription types to "unsubscribed" across their portal or Business Unit. This ensures consistent communication preferences regardless of where the "unsubscribe all" action is initiated. 

Data Updates

Existing contacts with 'mixed' states will see their subscription statuses automatically updated to reflect their global communication preferences. Individual subscription timestamps will now align with the original "unsubscribe from all emails" request date. These updates will apply to all subscription types within the affected portal or Business Unit.

Notes

Changes will be applied automatically to HubSpot portals. Users should be aware that some contacts may be added to lists or enrolled in workflows due to the updated subscription statuses.

Auto-translation Now Available for App Marketplace Listings

Auto-translations tools are now available in all HubSpot supported languages, so anyone with an offering in the App Marketplace can display their app listing to customers in their preferred language.

Once an app listing is created and published in its primary language, you can generate listings in other app supported languages by toggling the Auto translate switch to on. See the instructions for creating localized marketplace listings for more details.

Default Module Versioning UI

The new Default Module Versioning UI is a significant enhancement to the HubSpot ecosystem. It provides users with an easy-to-use interface for managing updates to default modules. This feature is embedded within the themes and modules settings, enabling HubSpot users to opt into changes seamlessly.

Accessing the Versioning UI:

• Navigate to the HubSpot settings.
• Go to Tools, click Content, and select Themes and Modules.

Managing Updates:

• Under Alerts, click on "View update" for the relevant module.
• Review the changes and impacted templates before deciding to install the update.

Rolling Back Changes:

• If the changes do not meet expectations, return to the same page and select "Roll back recent update" on the relevant module to revert to a previous version.

Launching this versioning UI marks a step forward in enhancing HubSpot's flexibility and user control. It is an essential tool for ensuring that teams can keep their websites up-to-date with minimal disruption.

New Key Management Area in Developer Portals

We’ve introduced a new "Keys" section to the navigation menu within developer portals. This section consolidates access to programmatic keys, including API and Personal Access Keys (PAKs), into a single, easily discoverable location.

How to Access the New "Keys" Section

• Log in to your developer portal.
• Navigate to the new "Keys" section in the main menu.
• Select Developer API Keys or Personal access keys to view or manage keys.

This update addresses navigation complexity by grouping related key management tools, reducing searching time for specific keys. It also supports a more intuitive developer experience, particularly for those managing multiple key types.

Build Webhooks with Private Apps Using Developer Projects

HubSpot now supports building webhooks with private apps using developer projects. This enhancement streamlines defining, managing, and subscribing to webhook events directly within private app configurations.

Key Changes:

• Webhook Management: 
  • Developers can now define and manage webhook subscriptions using a webhooks.json file located in a dedicated webhooks folder within the app directory.

• Supported Subscription Formats:
  • crmObjects: Applicable for most CRM object types (e.g., contact, company, deal).
  • legacyCrmObjects: For specific legacy objects.
  • hubEvents: Available for specific subscription types such as contact.privacyDeletion.
• App Configuration:
  • Developers have the option to update their private app configuration to directly reference the webhooks.json file, which simplifies the setup process.

Refer to the HubSpot documentation for detailed examples and implementation guidance, including sample JSON structures.

Check Data Model Limits via API

Developers are now able to check a specific portal's progress towards many data model limits via API.

We have added new endpoints that developers can utilize to see:

• A portal's overall data limit
• How much of that limit has been utilized

The following limits are captured:

• Records per specific object type
• Associations per record
• Custom properties
• Calculated properties
• Association Labels
• Custom Objects
• Pipeline limits per object (where relevant)

Note: Some of the limits above are only applicable to particular accounts depending on the tier of their products.

Public Betas

UI Extensions Beta Updates

The HubSpot UI Extensions Beta is now open for self-enrollment, enabling developers to build React-based app cards for public apps in the HubSpot Customer Platform. Other key updates include the new hubspot.serverless API for streamlined serverless function calls and a Figma Design Kit for creating and presenting app card designs.

Read more details below.

CRM Development Tools for Marketplace Apps in Public Beta

HubSpot app partners and developers can join the public beta to build app cards using UI extensions with public apps in the HubSpot Customer Platform. UI extensions are built with React, expanding customization capabilities for app cards. It also includes building webhooks for 25 new objects via code-based JSON configuration, managing the app lifecycle with the HubSpot CLI, and handling app configurations as code to use source control systems like GitHub to collaborate with your development teams. Early access required a request in the past, but now, any developer can self-enroll and begin building right away. To participate in the beta, a developer account is necessary. If you don’t have one, sign up here to begin.

Resources to help you get started:

• Build a new app

• Migrate your existing app or private app

• Public app example
  
  

How to Opt-In:

To join the public beta, visit the app card landing page and click Join Beta to enable the new development model for your apps within your HubSpot account.

New API: hubspot.severless

We are introducing a new, simplified API: hubspot.serverless. This update provides a more streamlined and modern way to call app functions within HubSpot UI extensions. While the existing runServerlessFunction method will continue to work, developers are encouraged to transition to hubspot.serverless for improved readability and ease of use. 

Key Features: 

• Simplified Syntax: A cleaner and more intuitive way to call serverless functions using hubspot.serverless.
• Backward Compatibility: The runServerlessFunction method remains available to maintain support for current implementations; however, it will be deprecated in the future.
• Improved Developer Experience: The API supports both Promise and async/await syntax, providing flexibility for various coding styles.

See the HubSpot UI Extensions Documentation for more examples and details on supported options for hubspot.serverless.

Figma Design Kit is Live

The Figma Design Kit is officially live and available to everyone! No more requests for access—simply click the link on our docs page to get started immediately.

The Figma Design Kit offers a comprehensive visual toolkit for designing React-based app cards within HubSpot's UI extensions. With detailed examples of UI components, wireframes for app card anatomy, and various build locations, it's an invaluable resource for development teams to align efforts and present demos to stakeholders seamlessly.

If you have any inquiries or concerns, please contact us at the #crm-customization-beta channel via the HubSpot Developer Slack.

Questions or comments? Discuss these updates on our developer community forums.