81 lines
2.0 KiB
JavaScript
81 lines
2.0 KiB
JavaScript
// eslint-disable-next-line
|
|
const preact = require('preact');
|
|
const { Component } = require('preact')
|
|
const { connect } = require('preact-redux');
|
|
const linkState = require('linkstate').default;
|
|
|
|
const { postData, errorToast } = require('../utils');
|
|
|
|
const addState = connect(
|
|
(state) => {
|
|
const {
|
|
ws
|
|
} = state;
|
|
function submitLogin(name, password) {
|
|
postData('/account/login', { name, password })
|
|
.then(res => res.json())
|
|
.then(data => {
|
|
if (data.error) return errorToast(data.error);
|
|
console.log(data.message);
|
|
ws.connect();
|
|
})
|
|
.catch(error => errorToast(error));
|
|
}
|
|
|
|
return {
|
|
submitLogin,
|
|
}
|
|
},
|
|
);
|
|
|
|
|
|
function Login(args) {
|
|
const {
|
|
submitLogin,
|
|
} = args;
|
|
|
|
const { password, name } = this.state;
|
|
|
|
const loginSubmit = (event) => {
|
|
event.preventDefault();
|
|
submitLogin(name, password);
|
|
this.setState({ name: '', password: '' });
|
|
};
|
|
|
|
const loginDisabled = () => {
|
|
return !(password && name);
|
|
};
|
|
|
|
return (
|
|
<div class="login">
|
|
<label for="username">Username</label>
|
|
<input
|
|
class="login-input"
|
|
type="email"
|
|
placeholder="username"
|
|
tabIndex={1}
|
|
value={name}
|
|
onInput={linkState(this, 'name')}
|
|
/>
|
|
<label for="password">Password</label>
|
|
<input
|
|
class="login-input"
|
|
type="password"
|
|
placeholder="password"
|
|
tabIndex={2}
|
|
value={password}
|
|
onInput={linkState(this, 'password')}
|
|
/>
|
|
<button
|
|
class="login-btn"
|
|
tabIndex={4}
|
|
disabled={loginDisabled()}
|
|
onClick={loginSubmit}>
|
|
Login
|
|
</button>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
module.exports = addState(Login);
|