diff --git a/src/views/assets/locales.ts b/src/views/assets/locales.ts index dc1a4c7..0765522 100644 --- a/src/views/assets/locales.ts +++ b/src/views/assets/locales.ts @@ -8,7 +8,9 @@ export default new LocalizedStrings({ login_userNameTp: "User name", login_passwordTp: "Password", login_wrongPassTp: "Login failed. Check username and password.", - signup_msg: "Signup failed", + signup_processMsg: "Signing up...", + signup_successMsg: "Success. Redirecting to login...", + signup_failMsg: "Signup failed", signup_unknownError: "Unknown error", signup_disabled: "Signup disabled", signup_userExists: "User with this name exists", diff --git a/src/views/signupForm.tsx b/src/views/signupForm.tsx index f688214..6bbddb9 100644 --- a/src/views/signupForm.tsx +++ b/src/views/signupForm.tsx @@ -9,9 +9,10 @@ import strings from "./assets/locales"; import "./styles/signupForm.scss"; enum Status { + UNDEFINED, FAILED, SUCCESS, - UNDEFINED, + IN_PROCESS, } enum Errors { FORBIDDEN = 403, @@ -24,6 +25,22 @@ interface State { httpCode: number; } +interface MsgProps { + message: string; + code: Status; + matchCode: Status; +} +/** + * Used for displaying messages on matching status code. + */ +const Msg: React.FC = (props) => ( + + {props.message} + +); + class SignupForm extends React.PureComponent { state = { name: "", @@ -39,6 +56,7 @@ class SignupForm extends React.PureComponent { } }; signup = () => { + this.setState({ status: Status.IN_PROCESS }); // prettier-ignore req.post("/signup", { name: this.state.name, @@ -107,14 +125,21 @@ class SignupForm extends React.PureComponent {
- {`${strings.signup_msg}: ${message}`} + + +