From 146947a665dbc1d2960d2062a22a106de0c71062 Mon Sep 17 00:00:00 2001
From: eug-vs <eug-vs@keemail.me>
Date: Sat, 21 Mar 2020 15:44:40 +0300
Subject: chore: migrate profile page to Typescript :label:

---
 src/pages/Profile/Registration.tsx | 85 ++++++++++++++++++++++++++++++++++++++
 1 file changed, 85 insertions(+)
 create mode 100644 src/pages/Profile/Registration.tsx

(limited to 'src/pages/Profile/Registration.tsx')

diff --git a/src/pages/Profile/Registration.tsx b/src/pages/Profile/Registration.tsx
new file mode 100644
index 0000000..30e357d
--- /dev/null
+++ b/src/pages/Profile/Registration.tsx
@@ -0,0 +1,85 @@
+import React, {useState} from 'react';
+
+import {
+  TextField,
+  Button,
+  Checkbox,
+  FormControlLabel,
+  Grid,
+} from '@material-ui/core';
+import { User } from '../../types';
+
+import { ContentSection } from 'react-benzin';
+import { get, post } from '../../requests';
+
+
+interface PropTypes {
+  setUser: (user: User) => void;
+}
+
+const Registration: React.FC<PropTypes> = ({ setUser }) => {
+
+  const [username, setUsername] = useState<string>('');
+  const [isRememberMe, setIsRememberMe] = useState<boolean>(false);
+
+  const handleChange = (event: React.ChangeEvent<HTMLInputElement>): void => {
+    setUsername(event.target.value);
+  };
+
+  const handleCheck = (event: React.ChangeEvent<HTMLInputElement>): void => {
+    setIsRememberMe(event.target.checked);
+  };
+
+  const handleSubmit = () => {
+    if (username !== '') {
+      post('users/', { username })
+        .then(response => {
+          const user = response.data;
+          setUser(user);
+          if (isRememberMe) {
+            localStorage.setItem('userId', user.id);
+          }
+        })
+        .catch(err => {
+          get('users/').then(response => {
+            const user = response.data.filter((user: User) => user.username === username)[0];
+            setUser(user);
+            if (isRememberMe) {
+              localStorage.setItem('userId', user.id);
+            }
+          });
+        });
+    }
+  };
+
+  return (
+    <ContentSection sectionName="Tell us who you are">
+      <p> Choose yourself a username to track your progress and compete with others: </p>
+      <Grid container direction="column">
+        <Grid item>
+          <TextField
+            variant="outlined"
+            color="secondary"
+            label="Username"
+            value={username}
+            onChange={handleChange}
+          />
+        </Grid>
+        <Grid item>
+          <FormControlLabel
+            control={<Checkbox color="secondary" onChange={handleCheck} />}
+            label="Remember me"
+          />
+        </Grid>
+        <Grid item>
+          <Button variant="contained" color="secondary" onClick={handleSubmit}>
+            Submit!
+          </Button>
+        </Grid>
+      </Grid>
+    </ContentSection>
+  );
+};
+
+
+export default Registration;
-- 
cgit v1.2.3


From 0267191d92814e753b966ce3bdfbd9b804b313d7 Mon Sep 17 00:00:00 2001
From: eug-vs <eug-vs@keemail.me>
Date: Sat, 21 Mar 2020 16:05:52 +0300
Subject: fix: add missing types

---
 src/pages/Profile/Registration.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

(limited to 'src/pages/Profile/Registration.tsx')

diff --git a/src/pages/Profile/Registration.tsx b/src/pages/Profile/Registration.tsx
index 30e357d..a5e0f3e 100644
--- a/src/pages/Profile/Registration.tsx
+++ b/src/pages/Profile/Registration.tsx
@@ -30,7 +30,7 @@ const Registration: React.FC<PropTypes> = ({ setUser }) => {
     setIsRememberMe(event.target.checked);
   };
 
-  const handleSubmit = () => {
+  const handleSubmit = (): void => {
     if (username !== '') {
       post('users/', { username })
         .then(response => {
-- 
cgit v1.2.3

