useActivity

(Available from v1.2.15)

A hook that fetches and manages transaction activity (fund, send, receive, etc.) from the Glyph widget. Supports filtering by transaction type and pagination.

Import

import {
  useActivity,
  ActivityType,
  DB_OFFCHAIN_TX_TYPE,
  DB_ONCHAIN_TX_TYPE,
} from "@use-glyph/sdk-react";

Usage

import { useEffect } from "react";

function ActivityList() {
  const {
    transactionGroups,
    fetchTransactions,
    loadMore,
    reset,
    hasMore,
    isLoading,
  } = useActivity(10);

  useEffect(() => {
    fetchTransactions(true);
  }, []);

  return (
    <div>
      {transactionGroups.map((group) => (
        <div key={group.label}>
          <h3>{group.label}</h3>
          {group.transactions.map((tx) => (
            <div key={tx.id}>
              {tx.type_text}: {tx.amount} {tx.amount_currency}
            </div>
          ))}
        </div>
      ))}
      {hasMore && (
        <button onClick={loadMore} disabled={isLoading}>
          Load more
        </button>
      )}
    </div>
  );
}

Filtering by Transaction Type

Pass an optional filter as the second argument to restrict activity to specific transaction types:

// Only show funding transactions
const { transactionGroups, fetchTransactions } = useActivity(10, {
  types: [DB_OFFCHAIN_TX_TYPE.FUND],
});

// Only show send and receive
const { transactionGroups } = useActivity(10, {
  types: [DB_ONCHAIN_TX_TYPE.SEND, DB_ONCHAIN_TX_TYPE.RECEIVE],
});

Return Type

Property	Type	Description
transactionGroups	ActivityGroup[]	Groups of transactions, typically grouped by date.
fetchTransactions	(reset?: boolean) => Promise<ActivityGroup[] | null>	Fetches transactions. Pass true to reset and fetch from the beginning.
loadMore	() => Promise<boolean>	Loads the next page of transactions. Returns true if more were loaded.
reset	() => Promise<void>	Resets and refetches from the beginning.
hasMore	boolean	Whether more transactions are available to load.
isLoading	boolean	Whether a fetch is in progress.

Types

ActivityType

Transaction types from DB_OFFCHAIN_TX_TYPE and DB_ONCHAIN_TX_TYPE:

Offchain: FUND, SWAP, WITHDRAW
Onchain: SEND, RECEIVE, TRANSFER, PAY

ActivityItem

Property	Type	Description
id	string	Unique transaction ID.
chain_id	number	Chain ID where the transaction occurred.
type	ActivityType	Transaction type.
type_text	string	Human-readable type label.
status	string	Transaction status.
status_text	string | null	Human-readable status.
status_color	string	Color hint for the status badge.
symbol	string	Token symbol.
value	string	Display value.
amount	string	Amount.
amount_currency	string	Currency/symbol for amount.
name_on_list	string | null	Display name for the transaction.
allowIdCopy	boolean	Whether the transaction ID can be copied.
detail_rows	string[]	Additional detail lines.
blockExplorerTxns	ActivityBlockExplorerItem[] | undefined	Links to block explorer.

ActivityBlockExplorerItem

Property	Type	Description
url	string	URL to the block explorer transaction.
text	string	Display text for the link.

ActivityGroup

Property	Type	Description
label	string	Group label (e.g. date).
transactions	ActivityItem[]	Transactions in this group.

Notes

• This hook must be used within a GlyphProvider.
• Activity is fetched for the current chain, or across all chains when fetchForAllNetworks is enabled.
• The hook supports both grouped and legacy (ungrouped) API response formats.