CrmAssociationStageTracker

The CrmAssociationStageTracker component renders a lifecycle or pipeline stage progress bar and a list of properties. Use this component to show stage progress for records associated with the currently displaying record. Each component instance can fetch data from one type of object (contacts, companies, deals, tickets, or custom objects). You can specify association labels to only display data from associated CRM records with that assigned label. You can also edit the property values inline.

import { CrmAssociationStageTracker } from "@hubspot/ui-extensions/crm";

const Extension = () => {
  return (
    <CrmAssociationStageTracker
      objectTypeId="0-3"
      properties={["dealname", "closed_won_reason", "hs_acv", "hs_arr"]}
      showProperties={true}
      associationLabels={["Decision maker"]}
    />
  );
};

Props

Prop	Type	Description
`associationLabels`	Array	If provided, will only request a list of associated records with the specified label (case sensitive).
`filters`	Array	If provided, the component will request a list of associated records that match the specified criteria. Learn more about filtering in CRM data components.
`objectTypeId`	String	The numeric ID of the type of associated object to display data from (e.g., `0-1` for contacts). See complete list of object IDs.
`properties`	Array	The properties of the associated records to display, up to four.
`showProperties`	Boolean	Whether to display the properties below the progress indicator. When set to `false`, properties will not display.
`sort`	Array	If provided, overrides the default sorting rules used in the search query. In the array, you’ll include an object for the column you want to sort by, which specifies: `columnName`: the column to sort by. `direction`: the direction to sort by. Can be either `1` (ascending) or `-1` (descending). By default, order is ascending.

​Props

​Related components

Props

Related components