52 lines
1.6 KiB
JavaScript
52 lines
1.6 KiB
JavaScript
import { Form, Input, SubmitButton } from '../components/form'
|
|
import * as Yup from 'yup'
|
|
import { Alert, InputGroup } from 'react-bootstrap'
|
|
import { useMe } from '../components/me'
|
|
import LayoutCenter from '../components/layout-center'
|
|
import { useState } from 'react'
|
|
import { gql, useMutation } from '@apollo/client'
|
|
|
|
export const SettingsSchema = Yup.object({
|
|
tipDefault: Yup.number().typeError('must be a number').required('required')
|
|
.positive('must be positive').integer('must be whole')
|
|
})
|
|
|
|
export default function Settings () {
|
|
const me = useMe()
|
|
const [success, setSuccess] = useState()
|
|
const [setSettings] = useMutation(
|
|
gql`
|
|
mutation setSettings($tipDefault: Int!) {
|
|
setSettings(tipDefault: $tipDefault)
|
|
}`
|
|
)
|
|
|
|
return (
|
|
<LayoutCenter>
|
|
<h2 className='mb-5 text-left'>settings</h2>
|
|
<Form
|
|
initial={{
|
|
tipDefault: me?.tipDefault || 21
|
|
}}
|
|
schema={SettingsSchema}
|
|
onSubmit={async ({ tipDefault }) => {
|
|
await setSettings({ variables: { tipDefault: Number(tipDefault) } })
|
|
setSuccess('settings saved')
|
|
}}
|
|
>
|
|
{success && <Alert variant='info' onClose={() => setSuccess(undefined)} dismissible>{success}</Alert>}
|
|
<Input
|
|
label='tip default'
|
|
name='tipDefault'
|
|
required
|
|
autoFocus
|
|
append={<InputGroup.Text className='text-monospace'>sats</InputGroup.Text>}
|
|
/>
|
|
<div className='d-flex'>
|
|
<SubmitButton variant='info' className='ml-auto mt-1 px-4'>save</SubmitButton>
|
|
</div>
|
|
</Form>
|
|
</LayoutCenter>
|
|
)
|
|
}
|