You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
64 lines
1.4 KiB
64 lines
1.4 KiB
import React, { useState } from 'react'; |
|
import { Container, Form, Header } from 'semantic-ui-react'; |
|
import { requester } from './utils.js'; |
|
|
|
export function SignForm(props) { |
|
const { token } = props; |
|
const [error, setError] = useState({}); |
|
const [sign, setSign] = useState(''); |
|
const [loading, setLoading] = useState(false); |
|
const [success, setSuccess] = useState(false); |
|
|
|
const handleValues = (e, v) => setSign(v.value); |
|
const handleChange = (e) => handleValues(e, e.currentTarget); |
|
|
|
const handleSubmit = (e) => { |
|
if (loading) return; |
|
setLoading(true); |
|
const data = {sign: sign}; |
|
requester('/stats/sign/', 'POST', token, data) |
|
.then(res => { |
|
setLoading(false); |
|
setSuccess(true); |
|
setError({}); |
|
setSign(''); |
|
}) |
|
.catch(err => { |
|
setLoading(false); |
|
console.log(err); |
|
setError(err.data); |
|
}); |
|
}; |
|
|
|
return ( |
|
<Form onSubmit={handleSubmit}> |
|
<p>Send a message to the sign:</p> |
|
|
|
<Form.Group> |
|
<Form.Input |
|
name='sign' |
|
onChange={handleChange} |
|
value={sign} |
|
error={error.sign} |
|
/> |
|
|
|
<Form.Button loading={loading} error={error.non_field_errors}> |
|
Submit |
|
</Form.Button> |
|
</Form.Group> |
|
{success && <div>Success!</div>} |
|
</Form> |
|
); |
|
}; |
|
|
|
export function Sign(props) { |
|
const { token } = props; |
|
|
|
return ( |
|
<Container> |
|
<Header size='large'>Protospace Sign</Header> |
|
|
|
<SignForm token={token} /> |
|
</Container> |
|
); |
|
};
|
|
|