calling_ledger_api.jsx

const TestLedgerApi = () => {
  const [apiResult, setApiResult] = useState({});
  const { getTokenSilently } = useAuth0();

  const callLedgerApi = async () => {
    try {
      // Get the access token from auth0
      const audienceOptions = {
        audience: 'https://daml.com/ledger-api'
      };
      const token = await getTokenSilently(audienceOptions);
      
      // Print the token to the console - inspect in on https://jwt.io/
      console.log(token);

      // Call the JSON ledger API with an attached access token
      const response = await fetch("/contracts/search", {
        headers: {
          Authorization: `Bearer ${token}`
        }
      });

      // Process the ledger API response
      const responseData = await response.json();
      setApiResult(responseData);
    } catch (error) {
      console.error(error);
    }
  };

  return (
    <>
      <h1>Call Ledger API</h1>
      <button onClick={callLedgerApi}>Fetch all contracts</button>
      <p><code>{JSON.stringify(apiResult, null, 2)}</code></p>
    </>
  );
};