Skip to main content
The useEntity hook provides access to entity data and related operations. You can use it from your frontend to retrieve entity information and manage loading states.
Learn how to setup Autumn hooks in the Getting Started guide.

​
Parameters

​
entityId
string
required
The ID of the entity to retrieve.
​
expand
string[]
Array of additional data to include in the entity response. Currently supports invoices.

​
Returns

​
entity

The entity object containing all entity data. 
import { useEntity } from "autumn-js/react";

export default function EntityProfile() {
  const { entity } = useEntity("entity_abc", { expand: ["invoices"] });

  return (
    <div>
      <h2>User Profile</h2>
      <p>Name: {entity?.name}</p>
      <p>Balance: {entity?.features.chat_messages?.balance}</p>
    </div>
  );
}

​
refetch()

Function to manually refetch the entity data, eg when updating an entity’s state or metadata to display. 
import { useEntity, useCustomer } from "autumn-js/react";

export default function EntityWithRefresh() {
  const { entity, refetch } = useEntity("entity_abc");
  const { track } = useCustomer();

  const updateEntity = async () => {
    // Perform some entity update operation
    await refetch({ expand: ["metadata"] });
  };

  return <button onClick={updateEntity}>Refresh Entity</button>;
}

​
isLoading

Boolean indicating whether the entity data is currently being fetched. 
import { useEntity } from "autumn-js/react";

export default function EntityLoader() {
  const { entity, isLoading } = useEntity("entity_abc");

  if (isLoading) {
    return <div>Loading entity data...</div>;
  }

  return <div>Entity: {entity?.name}</div>;
}

​
error

Any error that occurred while fetching entity data. 
import { useEntity } from "autumn-js/react";

export default function EntityWithError() {
  const { entity, error, isLoading } = useEntity("entity_abc");

  if (error) {
    return <div>Error loading entity: {error.message}</div>;
  }

  if (isLoading) {
    return <div>Loading...</div>;
  }

  return <div>Entity: {entity?.name}</div>;
}