arch: move web folder into api & move api to top level

frontend/src/Auth/Styles.ts

@@ -0,0 +1,13 @@
+import styled from 'styled-components';
+
+export const Container = styled.div`
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 100vw;
+  height: 100vh;
+`;
+
+export const LoginWrapper = styled.div`
+  width: 60%;
+`;

frontend/src/Auth/index.tsx

@@ -0,0 +1,68 @@
+import React, { useState, useEffect, useContext } from 'react';
+import { useForm } from 'react-hook-form';
+import { useHistory } from 'react-router';
+
+import { setAccessToken } from 'shared/utils/accessToken';
+
+import Login from 'shared/components/Login';
+import { Container, LoginWrapper } from './Styles';
+import UserIDContext from 'App/context';
+import JwtDecode from 'jwt-decode';
+
+const Auth = () => {
+  const [invalidLoginAttempt, setInvalidLoginAttempt] = useState(0);
+  const history = useHistory();
+  const { setUserID } = useContext(UserIDContext);
+  const login = (
+    data: LoginFormData,
+    setComplete: (val: boolean) => void,
+    setError: (field: string, eType: string, message: string) => void,
+  ) => {
+    fetch('http://localhost:3333/auth/login', {
+      credentials: 'include',
+      method: 'POST',
+      body: JSON.stringify({
+        username: data.username,
+        password: data.password,
+      }),
+    }).then(async x => {
+      if (x.status === 401) {
+        setInvalidLoginAttempt(invalidLoginAttempt + 1);
+        setError('username', 'invalid', 'Invalid username');
+        setError('password', 'invalid', 'Invalid password');
+        setComplete(true);
+      } else {
+        const response = await x.json();
+        const { accessToken } = response;
+        const claims: JWTToken = JwtDecode(accessToken);
+        setUserID(claims.userId);
+        setComplete(true);
+        setAccessToken(accessToken);
+
+        history.push('/');
+      }
+    });
+  };
+
+  useEffect(() => {
+    fetch('http://localhost:3333/auth/refresh_token', {
+      method: 'POST',
+      credentials: 'include',
+    }).then(async x => {
+      const { status } = x;
+      if (status === 200) {
+        history.replace('/projects');
+      }
+    });
+  }, []);
+
+  return (
+    <Container>
+      <LoginWrapper>
+        <Login onSubmit={login} />
+      </LoginWrapper>
+    </Container>
+  );
+};
+
+export default Auth;