AlgoSendButton
Clicking the AlgoSend button will open a new MyAlgo window prompting the user to confirm the transaction.
info
The rendered AlgoSend button below is nonfunctional. To see it in action, check out the Transaction Demo!
caution
The AlgoSend button executes transactions on the MainNet by default. To switch to TestNet, check out SwitchNet Component
Upon confirmation, it returns the transaction id to the context and key specified. This component has the largest number of mandatory props. Failing to set them, or setting them incorrectly will result in a transaction not executing.
#
Accessing returned txIDThe returned transaction ID can be accessed several different ways. Setting the context
prop to {this}
and the returnTo
prop to a state
key (as string) will return the txID directly to your parent component's state without the need for additional callback or event handler code. The txID can also be accessed with Pipeline.txID
:
componentDidMount() { this.interval = setInterval(() => this.setState({txID: Pipeline.txID}), 1000); }
or with an onChange
handler:
handleChange = (value) =>{ this.setState({txID: value}) }
render(){ return <AlgoSendButton onChange={this.handleChange} wallet={myAlgoWallet} index={this.state.index} recipient={this.state.recipient} amount={this.state.amount} note={this.state.note} /> }
#
Use Exampleimport {AlgoButton, AlgoSendButton, Pipeline} from 'pipeline-ui'
const myAlgoWallet = Pipeline.init();
<AlgoSendButton index={this.state.index} recipient={this.state.recipient} amount={this.state.amount} note={this.state.note} wallet={myAlgoWallet} context={this} returnTo={"txID"} />
#
PropsProp | Type | Default | Description |
---|---|---|---|
index | integer | 0 | If Algorand, must be 0. If ASA, must be numeric index value |
recipient | string | Address of recipient | |
amount | integer | 1 | amount to send in micro Algos |
note | string | "note" | |
wallet | reference | reference to an instance of Pipeline.init(); that is called ONCE when the app is initialized | |
context | reference | Recommended value: this | |
returnTo | string | string value of state key to return the transaction id | |
onChange | function | Enables callback (see example above) |