@intuitionrobotics/user-account
Version:
63 lines • 2.34 kB
JavaScript
import * as React from "react";
import {} from "react";
import { _keys, addItemToArray } from "@intuitionrobotics/ts-common";
import { AccountModule } from "../modules/AccountModule.js";
import {} from "../../shared/api.js";
import { ToastModule, TS_Input } from "@intuitionrobotics/thunderstorm/frontend";
const style = {
"height": "38px",
"borderRadius": "25px",
"backgroundColor": "#9c9ccd",
"borderWidth": "0",
"textAlign": "left",
"padding": "0 15px",
"color": "white",
"marginTop": "10px"
};
const form = {
email: {
type: "text",
hint: "email",
label: "Email",
},
password: {
type: "password",
hint: "****",
label: "Password",
}
};
export class Component_Login extends React.Component {
state = {
data: {},
};
render() {
const data = this.state.data;
return React.createElement(React.Fragment, null,
React.createElement("div", { className: 'll_v_c', style: { justifyContent: 'space-evenly' } }, _keys(form).map(key => {
const field = form[key];
return React.createElement(TS_Input, { id: key, key: key, value: data[key], type: field.type, placeholder: field.hint, onChange: this.onValueChanged, onAccept: this.loginClicked });
})),
React.createElement("div", { className: 'll_h_c', style: { justifyContent: 'center' } },
React.createElement("button", { onClick: this.loginClicked, className: `clickable`, style: style }, "Login")));
}
onValueChanged = (value, id) => {
this.setState(state => {
state.data[id] = value;
return state;
});
};
loginClicked = () => {
const data = this.state.data;
const errors = _keys(form).map(key => {
const field = form[key];
return data[key] ? undefined : ` * missing ${field.label}`;
}).filter(error => !!error);
const validateError = this.props.validate && this.props.validate(data);
if (validateError)
addItemToArray(errors, validateError);
if (errors.length > 0)
return ToastModule.toastError(`Wrong input:\n${errors.join("\n")}`);
AccountModule.login(this.state.data);
};
}
//# sourceMappingURL=Component_Login.js.map