> ## Documentation Index
> Fetch the complete documentation index at: https://docs.mystockline.xyz/llms.txt
> Use this file to discover all available pages before exploring further.

# React

> Hooks for the app surface.

Wrap viem reads in hooks so the UI can gate buttons on regime and borrowing power without a page reload.

This is not an official SDK. Copy the hook into your app and point it at [Addresses](/resources/addresses).

<Note>
  This section will be completed when a published `@stockline/react` package ships. Use the hook below against the ABIs until then.
</Note>

<CodeGroup>
  ```tsx theme={"system"}
  "use client"
  import { useCallback, useEffect, useState } from "react"
  import { createPublicClient, http, parseAbi } from "viem"
  import { addresses } from "./addresses"

  const client = createPublicClient({ transport: http() })
  const oracleAbi = parseAbi(["function regime() view returns (uint8)"])
  const lensAbi = parseAbi(["function maxBorrow(address account) view returns (uint256)"])

  export function useBorrowGate(account: `0x${string}` | undefined, oracle: `0x${string}`) {
    const [regime, setRegime] = useState<number>()
    const [power, setPower] = useState<bigint>()
    const refresh = useCallback(async () => {
      const [r, p] = await Promise.all([
        client.readContract({ address: oracle, abi: oracleAbi, functionName: "regime" }),
        account
          ? client.readContract({ address: addresses.riskLens, abi: lensAbi, functionName: "maxBorrow", args: [account] })
          : Promise.resolve(0n),
      ])
      setRegime(Number(r))
      setPower(p)
    }, [account, oracle])
    useEffect(() => { refresh() }, [refresh])
    return { canBorrow: regime === 0, power, refresh }
  }
  ```

  ```typescript theme={"system"}
  // Same reads without React. See TypeScript getting started.
  ```

  ```solidity theme={"system"}
  interface IEquityOracle {
      function regime() external view returns (uint8);
  }
  ```
</CodeGroup>

Match app copy when you disable the slider. Market closed: keep repay and add stock. Never a modal.

`regime === 0` is LIVE. DARK is 1. Halted, corporate-action, and sequencer-down revert `price()` and must disable risk-up actions.

## What can go wrong

* Stale hook after a borrow. Refresh on receipt of the tx hash.
* One oracle per book. A multi-stock borrow must AND LIVE across books.
* `borrowingEnabled` is independent of regime. Read both.

Next: [Read the regime](/developers/market-hours).

The Stockline app is Next.js with Privy and viem. This hook is the slice you need if you are not that app: regime plus max borrow, refreshed after every receipt.

Gate the borrow slider on LIVE, not paused, and `borrowingEnabled`. Keep repay and add stock enabled in every state. The app copy for a closed market is: Borrowing opens Monday at 09:30. You can still repay or add stock. Prices are paused at Friday's close. Never a modal.

Multi-stock accounts have one oracle per book. AND the LIVE check across selected books. Read `RiskRegistry.book(id).oracle` and `borrowingEnabled` together.

Until `@stockline/react` ships, copy this hook. Do not invent a second source of truth for numbers. Parameters and Addresses are generated at docs build. Point your constants file at that table.