109 lines
2.7 KiB
JavaScript
109 lines
2.7 KiB
JavaScript
import { useMutation, useQuery } from '@apollo/react-hooks'
|
|
import { makeStyles } from '@material-ui/core'
|
|
import gql from 'graphql-tag'
|
|
import React, { useState } from 'react'
|
|
|
|
import { SupportLinkButton, Button } from 'src/components/buttons'
|
|
import { RadioGroup } from 'src/components/inputs'
|
|
import { P, H4 } from 'src/components/typography'
|
|
import FormRenderer from 'src/pages/Services/FormRenderer'
|
|
import schema from 'src/pages/Services/schemas'
|
|
|
|
import styles from './Shared.styles'
|
|
|
|
const useStyles = makeStyles({
|
|
...styles,
|
|
radioGroup: styles.radioGroup,
|
|
radioLabel: {
|
|
...styles.radioLabel,
|
|
width: 200
|
|
}
|
|
})
|
|
|
|
const GET_CONFIG = gql`
|
|
{
|
|
accounts
|
|
}
|
|
`
|
|
const SAVE_ACCOUNTS = gql`
|
|
mutation SaveAccountsBC($accounts: JSONObject) {
|
|
saveAccounts(accounts: $accounts)
|
|
}
|
|
`
|
|
|
|
const options = [
|
|
{
|
|
code: 'enable',
|
|
display: 'I will enable cash-out'
|
|
},
|
|
{
|
|
code: 'disable',
|
|
display: "I won't enable cash-out"
|
|
}
|
|
]
|
|
|
|
const Blockcypher = ({ addData }) => {
|
|
const classes = useStyles()
|
|
|
|
const { data } = useQuery(GET_CONFIG)
|
|
const [saveConfig] = useMutation(SAVE_ACCOUNTS, {
|
|
onCompleted: () => addData({ zeroConf: 'blockcypher' })
|
|
})
|
|
|
|
const [selected, setSelected] = useState(null)
|
|
const [error, setError] = useState(false)
|
|
|
|
const accounts = data?.accounts ?? []
|
|
|
|
const onSelect = e => {
|
|
setSelected(e.target.value)
|
|
setError(false)
|
|
}
|
|
|
|
const save = blockcypher => {
|
|
const accounts = { blockcypher }
|
|
return saveConfig({ variables: { accounts } })
|
|
}
|
|
|
|
return (
|
|
<>
|
|
<H4 className={error && classes.error}>Blockcypher</H4>
|
|
<P>
|
|
If you are enabling cash-out services, create a Blockcypher account.
|
|
</P>
|
|
<SupportLinkButton
|
|
link="https://support.lamassu.is/hc/en-us/articles/115001209472-Blockcypher"
|
|
label="Configuring Blockcypher"
|
|
/>
|
|
<RadioGroup
|
|
labelClassName={classes.radioLabel}
|
|
className={classes.radioGroup}
|
|
options={options}
|
|
value={selected}
|
|
onChange={onSelect}
|
|
/>
|
|
<div className={classes.mdForm}>
|
|
{selected === 'disable' && (
|
|
<Button
|
|
size="lg"
|
|
onClick={() => addData({ zeroConf: 'all-zero-conf' })}
|
|
className={classes.button}>
|
|
Continue
|
|
</Button>
|
|
)}
|
|
{selected === 'enable' && (
|
|
<FormRenderer
|
|
value={accounts.blockcypher}
|
|
save={save}
|
|
elements={schema.blockcypher.elements}
|
|
validationSchema={schema.blockcypher.validationSchema}
|
|
buttonLabel={'Continue'}
|
|
buttonClass={classes.formButton}
|
|
/>
|
|
)}
|
|
</div>
|
|
</>
|
|
)
|
|
}
|
|
|
|
export default Blockcypher
|