intrepidshape/elm-web3-ui/3.0.0

NOTE: the latest version is 4.0.0

Web3.Ui.ContractRead

Render a Solidity view / pure function call as a typed form: function name header, one AbiInput per argument, a "Read" button, and a result panel that pattern-matches on the current Status.

Like every primitive in this lib, the component is stateless -- the caller owns the args (one AbiInput.Config per argument) and the status and passes them in on every render. The lib renders, the caller wires the result back through update.

Pair with Web3.Contract.Call to actually fire the read:

-- in update
Read fn ->
    ( { model | reads = Dict.insert fn Pending model.reads }
    , web3Cmd
        (Call.encode
            (Call.readCall
                { contract = tokenAddress
                , method = "balanceOf(address)"
                , args = [ resolvedArg ]
                , decoder = Decode.uint256
                , id = fn
                }
            )
        )
    )


-- in view
Web3.Ui.ContractRead.view []
    { name = "balanceOf"
    , solType = "uint256"
    , args = [ holderArgConfig ]
    , status = Maybe.withDefault Idle (Dict.get "balanceOf" model.reads)
    , onRead = Read "balanceOf"
    , readLabel = "Read"
    }

CSS classes: web3-contract-read, web3-contract-read__header, web3-contract-read__name, web3-contract-read__return-type, web3-contract-read__args, web3-contract-read__button, web3-contract-read__pending, web3-contract-read__result, web3-contract-read__result--success, web3-contract-read__result--failed.

view : List (Attribute msg) -> Config msg -> Html msg

Render the read form.

type alias Config msg =
{ name : String
, solType : String
, args : List (Config msg)
, status : Status
, onRead : msg
, readLabel : String
}

Configuration for view.

  • name -- the function name to display (e.g. "balanceOf").
  • solType -- the return type string for display (e.g. "uint256").
  • args -- one AbiInput config per ABI argument.
  • status -- current lifecycle state.
  • onRead -- message dispatched when the user clicks the read button.
  • readLabel -- button label when idle / terminal (e.g. "Read" or "Refresh").
type Status
= Idle
| Pending
| Success String
| Failed String

Lifecycle of a single read.

Success String carries the rendered result -- the caller stringifies the typed value (using whatever Web3.Abi.Decode-produced value they decoded). This keeps ContractRead agnostic to the result type.

isIdle : Status -> Bool

True for Idle.

isPending : Status -> Bool

True for Pending.

isTerminal : Status -> Bool

True for Success _ and Failed _.