Skip to content

Instantly share code, notes, and snippets.

@ohac
Created Dec 21, 2020
Embed
What would you like to do?
Monaparty asset image React component
import React from "react"
class Monaparty extends React.Component {
constructor(props) {
super(props)
this.state = {
url: null
}
}
componentDidMount() {
const name = this.props.name
const api = 'https://monapa.electrum-mona.org/_api'
const data = {
"jsonrpc": "2.0",
"id": 0,
"method": "get_assets_info",
"params": {
"assetsList": [
this.props.name
]
}
}
fetch(api, {
method: 'POST',
headers: {
'Content-Type': 'application/json'
},
body: JSON.stringify(data),
})
.then((res) => res.json())
.then(
(result) => {
const gateway = this.props.gateway || 'https://ipfs.io/'
const asset = result.result[0]
const desc = asset.description
if (desc.match(/^ipfs:\/\//)) {
const hash = desc.substr(7)
fetch(gateway + 'ipfs/' + hash)
.then((res) => {
return res.json()
})
.then((result) => {
if (result.image.match(/^ipfs:\/\//)) {
const imagehash = result.image.substr(7)
const url = gateway + 'ipfs/' + imagehash
this.setState({url: url})
}
})
}
},
(error) => {
console.log(error) // TODO
})
}
render() {
return (
<img src={this.state.url} alt={this.props.name} />
)
}
}
export default Monaparty
// Usage: <Monaparty name='SPACEMONA.CAT' gateway='https://ipfs.io/' />
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment