In progress changes for auth.

client/src/components/sign-in/sign-in.component.jsx

@@ -0,0 +1,76 @@
+import React from "react";
+
+import FormInput from "../form-input/form-input.component";
+import CustomButton from "../custom-button/custom-button.component";
+
+import { auth, signInWithGoogle } from "../../firebase/firebase.utils";
+
+//Styling imports
+import { Typography } from "antd";
+import { Input } from "antd";
+import { Button } from "antd";
+
+class SignIn extends React.Component {
+  constructor(props) {
+    super(props);
+
+    this.state = {
+      email: "",
+      password: ""
+    };
+  }
+
+  handleSubmit = async event => {
+    event.preventDefault();
+
+    const { email, password } = this.state;
+
+    try {
+      await auth.signInWithEmailAndPassword(email, password);
+      this.setState({ email: "", password: "" });
+    } catch (error) {
+      console.log(error);
+    }
+  };
+
+  handleChange = event => {
+    const { value, name } = event.target;
+
+    this.setState({ [name]: value });
+  };
+
+  render() {
+    return (
+      <div className="sign-in">
+        <Typography.Title>Sign In</Typography.Title>
+        <form onSubmit={this.handleSubmit}>
+          <Input
+            placeholder="Email"
+            name="Email"
+            type="email"
+            handleChange={this.handleChange}
+            value={this.state.email}
+            label="email"
+            required
+          />
+          <Input.Password
+            name="password"
+            type="password"
+            value={this.state.password}
+            handleChange={this.handleChange}
+            label="password"
+            required
+          />
+          <div className="buttons">
+            <Button type="submit"> Sign in </Button>
+            <Button onClick={signInWithGoogle}>
+              Sign in with Google
+            </Button>
+          </div>
+        </form>
+      </div>
+    );
+  }
+}
+
+export default SignIn;