From a5ae2653d8ccdaf00270c0c8c8a30b88d7955114 Mon Sep 17 00:00:00 2001
From: Jan Tuomi <jan.tuomi@eficode.com>
Date: Sat, 1 Feb 2020 16:33:56 +0200
Subject: Do stuff

---
 frontend/src/Register.js | 52 ++++++++++++++++++++++++++++++++++++++++++++++++
 1 file changed, 52 insertions(+)
 create mode 100644 frontend/src/Register.js

(limited to 'frontend/src/Register.js')

diff --git a/frontend/src/Register.js b/frontend/src/Register.js
new file mode 100644
index 0000000..e49b4ea
--- /dev/null
+++ b/frontend/src/Register.js
@@ -0,0 +1,52 @@
+import React, { useState } from 'react';
+import { useForm } from 'react-hook-form';
+import { navigate } from '@reach/router';
+
+import axios from './axios';
+import userState from './UserState';
+
+const Register = () => {
+  const { register, handleSubmit, watch, errors } = useForm();
+  const [ loginError, setLoginError ] = useState(null);
+
+  const onSubmit = async data => {
+    if (data.password !== data.confirm_password) {
+      setLoginError('Passwords do not match.');
+      return;
+    }
+    try {
+      const resp = await axios.post('/register', data);
+      const { username } = resp.data;
+      userState.authError = null;
+      userState.username = username;
+      navigate('/');
+    } catch (err) {
+      if (err.response && err.response.data) {
+        setLoginError(err.response.data.error);
+      } else {
+        console.error(err);
+        setLoginError('Unknown error occurred. See console for details.');
+      }
+    }
+  };
+
+  return (
+    <form onSubmit={handleSubmit(onSubmit)}>
+      <h1>Register new account</h1>
+      <label>
+        Username <input name="username" type="text" ref={register} required />
+      </label>
+      <label>
+        Password <input name="password" type="password" ref={register} required />
+      </label>
+      <label>
+        Confirm password <input name="confirm_password" type="password" ref={register} required />
+      </label>
+      <button type="submit">Register</button>
+      <div className="error">{loginError}</div>
+      {/* <div className="error">{errors}</div> */}
+    </form>
+  );
+};
+
+export default Register;
-- 
cgit v1.3