useTokens - Alphscan

useTokens fetches the token list from the Alphscan API (GET /token/all) using the client from context. It manages page index, loading, error, and refetch.

When to use

Inside AlphscanProvider.
When you need a paginated list of tokens with loading/error state and page control.

Signature

function useTokens(options?: UseTokensOptions): UseTokensResult

UseTokensOptions

Option	Type	Default	Description
page	number	0	Initial page (0-based).
pageSize	number	20	Page size.
enabled	boolean	true	If false, no request is sent.

UseTokensResult

Field	Type	Description
tokens	TokenEntry[]	Current page of tokens.
total	number	Total count.
page	number	Current page (0-based).
pageSize	number	Page size.
totalPages	number	Total pages.
loading	boolean	Request in progress.
error	Error or null	Error if request failed.
setPage	(page: number) => void	Set current page (triggers refetch).
refetch	`() => Promise<void>`	Refetch current page.

Example

import { useTokens } from "@alphscan/sdk-react";

function TokenList() {
  const { tokens, total, page, setPage, totalPages, pageSize, loading, error } =
    useTokens({ pageSize: 20, enabled: true });
  const offset = page * pageSize;

  if (loading) return <p>Loading…</p>;
  if (error) return <p>Error: {error.message}</p>;

  return (
    <div>
      <ul>
        {tokens.map((t) => (
          <li key={t.id}>{t.symbol} – {t.name}</li>
        ))}
      </ul>
      <p>Page {page + 1} / {totalPages} ({total} total)</p>
      <button onClick={() => setPage(page - 1)} disabled={page === 0}>Prev</button>
      <button onClick={() => setPage(page + 1)} disabled={page >= totalPages - 1}>Next</button>
    </div>
  );
}

The hook uses 0-based page internally and sends page + 1 to the API.