From 99f3612e8a4a8add35b821f87908f5312cdb642a Mon Sep 17 00:00:00 2001
From: Antreo Pukay <acrosswalker@yahoo.com>
Date: Wed, 9 Jan 2019 18:06:32 -0800
Subject: [PATCH 1/9] SigninForm ready for FormControl to be added

---
 src/components/login/login.component.tsx  |  2 ++
 src/components/signinForm/SignInForm.scss |  0
 src/components/signinForm/SigninForm.js   | 44 +++++++++++++++++++++++
 3 files changed, 46 insertions(+)
 create mode 100644 src/components/signinForm/SignInForm.scss
 create mode 100644 src/components/signinForm/SigninForm.js

diff --git a/src/components/login/login.component.tsx b/src/components/login/login.component.tsx
index 2b4a526..029bbf8 100644
--- a/src/components/login/login.component.tsx
+++ b/src/components/login/login.component.tsx
@@ -4,6 +4,7 @@ import { ReactElement } from "react";
 import { createStore } from "redux";
 import { FirebaseService } from "../../commons/firebase.service";
 import { SVGs } from "../../commons/svg.list";
+import { SigninForm } from "../signinForm/SigninForm"; 
 import { loginReducer } from "./login.reducer";
 
 import './login.style.scss';
@@ -31,6 +32,7 @@ export class LoginComponent extends React.Component {
     return(
       <div className="LoginForm">
         <h1>Please Login</h1>
+        <SigninForm />
         <button className="Button--GoogleSignIn no-underline near-white bg-animate bg-dark-blue hover-bg-gray inline-flex items-center ma2 tc br2 pa0"
                 onClick={this.loginClickHandler}>
           <div className="dib h3 w3 pa1 bg-white">
diff --git a/src/components/signinForm/SignInForm.scss b/src/components/signinForm/SignInForm.scss
new file mode 100644
index 0000000..e69de29
diff --git a/src/components/signinForm/SigninForm.js b/src/components/signinForm/SigninForm.js
new file mode 100644
index 0000000..38b7bf7
--- /dev/null
+++ b/src/components/signinForm/SigninForm.js
@@ -0,0 +1,44 @@
+/* tslint:disable:no-empty */
+import React, { PureComponent } from 'react';
+import PropTypes from 'prop-types';
+
+
+export class SigninForm extends PureComponent {
+
+	state = {
+		email: '',
+		password: '',
+	}
+
+	static propTypes = {
+		action: PropTypes.string.isRequired,
+		allowName: PropTypes.bool,
+		submit: PropTypes.func.isRequired,
+	}
+
+	handleChange = ({ target }) => {
+		this.setState({ [target.email]: target.value }); 
+	}
+	
+	handleSubmit = event => {
+		event.preventDefault();
+		this.props.submit(this.state)
+			.catch(() => {});
+	}
+
+	render() {
+		const { email, password } = this.state;
+
+		return (
+			<div>
+				<h3>Sign in here</h3>
+				<form label="email" onSubmit={this.handleSubmit}>
+					<input name="email" value={email} onChange={this.handleChange}/>
+					<input name="password" value={email} onChange={this.handleChange}/>
+				</form>
+
+			</div>
+
+		);
+	}
+}

From 1c008db7eb87d48d3cc58fec8a3982899667e2de Mon Sep 17 00:00:00 2001
From: Antreo Pukay <acrosswalker@yahoo.com>
Date: Thu, 10 Jan 2019 17:28:39 -0800
Subject: [PATCH 2/9] added FormControl component

---
 src/components/signinForm/SigninForm.js | 35 ++++++++++++++++---------
 src/shared/FormControl.js               | 25 ++++++++++++++++++
 2 files changed, 47 insertions(+), 13 deletions(-)
 create mode 100644 src/shared/FormControl.js

diff --git a/src/components/signinForm/SigninForm.js b/src/components/signinForm/SigninForm.js
index 38b7bf7..cdb5f3b 100644
--- a/src/components/signinForm/SigninForm.js
+++ b/src/components/signinForm/SigninForm.js
@@ -1,4 +1,5 @@
 /* tslint:disable:no-empty */
+import FormControl from '../../shared/FormControl';
 import React, { PureComponent } from 'react';
 import PropTypes from 'prop-types';
 
@@ -12,33 +13,41 @@ export class SigninForm extends PureComponent {
 
 	static propTypes = {
 		action: PropTypes.string.isRequired,
-		allowName: PropTypes.bool,
 		submit: PropTypes.func.isRequired,
 	}
 
-	handleChange = ({ target }) => {
-		this.setState({ [target.email]: target.value }); 
-	}
 	
 	handleSubmit = event => {
 		event.preventDefault();
 		this.props.submit(this.state)
-			.catch(() => {});
+		.catch(() => {});
+	}
+	
+	handleChange = ({ target }) => {
+		this.setState({ [target.email]: target.value }); 
 	}
 
 	render() {
+		const { action } = this.props;
 		const { email, password } = this.state;
 
 		return (
-			<div>
-				<h3>Sign in here</h3>
-				<form label="email" onSubmit={this.handleSubmit}>
-					<input name="email" value={email} onChange={this.handleChange}/>
-					<input name="password" value={email} onChange={this.handleChange}/>
+				<form onSubmit={this.handleSubmit}>
+					<h3>Sign in here</h3>
+
+					<FormControl label="email">
+						<input name="email" value={email} onChange={this.handleChange}/>
+					</FormControl>
+					
+					<FormControl label="password">
+						<input name="password" type="password" 
+							value={password} onChange={this.handleChange}/>
+					</FormControl>
+
+					<FormControl>
+						<button>{action}</button>
+					</FormControl>
 				</form>
-
-			</div>
-
 		);
 	}
 }
diff --git a/src/shared/FormControl.js b/src/shared/FormControl.js
new file mode 100644
index 0000000..5117396
--- /dev/null
+++ b/src/shared/FormControl.js
@@ -0,0 +1,25 @@
+import React, { PureComponent } from 'react';
+import PropTypes from 'prop-types';
+
+class FormControl extends PureComponent {
+
+  static propTypes = {
+    children: PropTypes.element,
+    label: PropTypes.string,
+  };
+
+  render() {
+    const { label, children } = this.props;
+
+    return (
+      <section>
+        { label && <label>{label}:</label> }
+        <section>
+          {children}
+        </section>
+      </section>
+    );
+  }
+}
+
+export default FormControl;
\ No newline at end of file

From f74c6c0af0ebc62f2b35774c07c5c93e8db1474c Mon Sep 17 00:00:00 2001
From: Antreo Pukay <acrosswalker@yahoo.com>
Date: Fri, 11 Jan 2019 09:10:07 -0800
Subject: [PATCH 3/9] started adding CSS

---
 src/components/signinForm/SignInForm.scss | 4 ++++
 src/components/signinForm/SigninForm.js   | 8 ++++----
 2 files changed, 8 insertions(+), 4 deletions(-)

diff --git a/src/components/signinForm/SignInForm.scss b/src/components/signinForm/SignInForm.scss
index e69de29..5d41602 100644
--- a/src/components/signinForm/SignInForm.scss
+++ b/src/components/signinForm/SignInForm.scss
@@ -0,0 +1,4 @@
+.form-boxes {
+  border-width: 2px;
+  border-color: steelblue;
+}
\ No newline at end of file
diff --git a/src/components/signinForm/SigninForm.js b/src/components/signinForm/SigninForm.js
index cdb5f3b..0709b9e 100644
--- a/src/components/signinForm/SigninForm.js
+++ b/src/components/signinForm/SigninForm.js
@@ -2,6 +2,7 @@
 import FormControl from '../../shared/FormControl';
 import React, { PureComponent } from 'react';
 import PropTypes from 'prop-types';
+import './SigninForm.scss';
 
 
 export class SigninForm extends PureComponent {
@@ -33,19 +34,18 @@ export class SigninForm extends PureComponent {
 
 		return (
 				<form onSubmit={this.handleSubmit}>
-					<h3>Sign in here</h3>
 
 					<FormControl label="email">
-						<input name="email" value={email} onChange={this.handleChange}/>
+						<input className="form-boxes" name="email" value={email} onChange={this.handleChange}/>
 					</FormControl>
 					
 					<FormControl label="password">
-						<input name="password" type="password" 
+						<input className="form-boxes" name="password" type="password" 
 							value={password} onChange={this.handleChange}/>
 					</FormControl>
 
 					<FormControl>
-						<button>{action}</button>
+						<button className="form-boxes">{action}</button>
 					</FormControl>
 				</form>
 		);

From 818db5f5cc926fa82006b1292fa0f82b6410d7ea Mon Sep 17 00:00:00 2001
From: Antreo Pukay <acrosswalker@yahoo.com>
Date: Sun, 13 Jan 2019 19:36:41 -0800
Subject: [PATCH 4/9] minor fixes

---
 src/components/login/login.component.tsx | 8 ++++----
 src/components/signinForm/SigninForm.js  | 7 ++++---
 src/shared/FormControl.js                | 2 +-
 3 files changed, 9 insertions(+), 8 deletions(-)

diff --git a/src/components/login/login.component.tsx b/src/components/login/login.component.tsx
index 029bbf8..6d85821 100644
--- a/src/components/login/login.component.tsx
+++ b/src/components/login/login.component.tsx
@@ -38,11 +38,11 @@ export class LoginComponent extends React.Component {
           <div className="dib h3 w3 pa1 bg-white">
             {SVGs.google}
           </div>
-        <span className="f6 ml3 pr2">
-          Sign in with Google
-        </span>
+          <span className="f6 ml3 pr2">
+            Sign in with Google
+          </span>
         </button>
       </div>
     );
   }
-}
\ No newline at end of file
+}
diff --git a/src/components/signinForm/SigninForm.js b/src/components/signinForm/SigninForm.js
index 0709b9e..7268d52 100644
--- a/src/components/signinForm/SigninForm.js
+++ b/src/components/signinForm/SigninForm.js
@@ -36,12 +36,13 @@ export class SigninForm extends PureComponent {
 				<form onSubmit={this.handleSubmit}>
 
 					<FormControl label="email">
-						<input className="form-boxes" name="email" value={email} onChange={this.handleChange}/>
+						<input className="form-boxes" name="email" value={email} 
+							onChange={this.handleChange}/>
 					</FormControl>
 					
 					<FormControl label="password">
-						<input className="form-boxes" name="password" type="password" 
-							value={password} onChange={this.handleChange}/>
+						<input className="form-boxes" name="password" value={password} type="password" 
+							onChange={this.handleChange}/>
 					</FormControl>
 
 					<FormControl>
diff --git a/src/shared/FormControl.js b/src/shared/FormControl.js
index 5117396..ddff13c 100644
--- a/src/shared/FormControl.js
+++ b/src/shared/FormControl.js
@@ -22,4 +22,4 @@ class FormControl extends PureComponent {
   }
 }
 
-export default FormControl;
\ No newline at end of file
+export default FormControl;

From ef9fb5157106048d2eacc1ab6ff0ee0896f46563 Mon Sep 17 00:00:00 2001
From: Antreo Pukay <acrosswalker@yahoo.com>
Date: Mon, 14 Jan 2019 12:19:54 -0800
Subject: [PATCH 5/9] fixed casing on SignInForm

---
 src/components/login/login.component.tsx | 4 ++--
 src/components/signinForm/SigninForm.js  | 4 ++--
 2 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/src/components/login/login.component.tsx b/src/components/login/login.component.tsx
index 6d85821..b36bfd5 100644
--- a/src/components/login/login.component.tsx
+++ b/src/components/login/login.component.tsx
@@ -4,7 +4,7 @@ import { ReactElement } from "react";
 import { createStore } from "redux";
 import { FirebaseService } from "../../commons/firebase.service";
 import { SVGs } from "../../commons/svg.list";
-import { SigninForm } from "../signinForm/SigninForm"; 
+import { SignInForm } from "../signInForm/SignInForm"; 
 import { loginReducer } from "./login.reducer";
 
 import './login.style.scss';
@@ -32,7 +32,7 @@ export class LoginComponent extends React.Component {
     return(
       <div className="LoginForm">
         <h1>Please Login</h1>
-        <SigninForm />
+        <SignInForm />
         <button className="Button--GoogleSignIn no-underline near-white bg-animate bg-dark-blue hover-bg-gray inline-flex items-center ma2 tc br2 pa0"
                 onClick={this.loginClickHandler}>
           <div className="dib h3 w3 pa1 bg-white">
diff --git a/src/components/signinForm/SigninForm.js b/src/components/signinForm/SigninForm.js
index 7268d52..514c0c3 100644
--- a/src/components/signinForm/SigninForm.js
+++ b/src/components/signinForm/SigninForm.js
@@ -2,10 +2,10 @@
 import FormControl from '../../shared/FormControl';
 import React, { PureComponent } from 'react';
 import PropTypes from 'prop-types';
-import './SigninForm.scss';
+import './SignInForm.scss';
 
 
-export class SigninForm extends PureComponent {
+export class SignInForm extends PureComponent {
 
 	state = {
 		email: '',

From 8fa0b42a11bb97bee402e452c553be3cc9c3b2f5 Mon Sep 17 00:00:00 2001
From: Antreo Pukay <acrosswalker@yahoo.com>
Date: Mon, 14 Jan 2019 12:25:15 -0800
Subject: [PATCH 6/9] grouped imports and changed tsconfig.json totrue for
 import helpers

---
 src/components/signinForm/SigninForm.js | 4 +++-
 src/shared/FormControl.js               | 1 +
 tsconfig.json                           | 2 +-
 3 files changed, 5 insertions(+), 2 deletions(-)

diff --git a/src/components/signinForm/SigninForm.js b/src/components/signinForm/SigninForm.js
index 514c0c3..2b662a5 100644
--- a/src/components/signinForm/SigninForm.js
+++ b/src/components/signinForm/SigninForm.js
@@ -1,7 +1,9 @@
 /* tslint:disable:no-empty */
 import FormControl from '../../shared/FormControl';
-import React, { PureComponent } from 'react';
 import PropTypes from 'prop-types';
+
+import React, { PureComponent } from 'react';
+
 import './SignInForm.scss';
 
 
diff --git a/src/shared/FormControl.js b/src/shared/FormControl.js
index ddff13c..4730edb 100644
--- a/src/shared/FormControl.js
+++ b/src/shared/FormControl.js
@@ -1,4 +1,5 @@
 import React, { PureComponent } from 'react';
+
 import PropTypes from 'prop-types';
 
 class FormControl extends PureComponent {
diff --git a/tsconfig.json b/tsconfig.json
index 2a0d8cf..33447b2 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -14,7 +14,7 @@
     "noImplicitReturns": true,
     "noImplicitThis": true,
     "noImplicitAny": true,
-    "importHelpers": true,
+    "importHelpers": false,
     "strictNullChecks": true,
     "suppressImplicitAnyIndexErrors": true,
     "noUnusedLocals": true

From 33d64456d899e02af17e3b97c95e9db7477cb6fc Mon Sep 17 00:00:00 2001
From: Antreo Pukay <acrosswalker@yahoo.com>
Date: Mon, 14 Jan 2019 12:39:47 -0800
Subject: [PATCH 7/9] changes import helper in tsconfig.json to false

---
 tsconfig.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/tsconfig.json b/tsconfig.json
index 33447b2..d8b585d 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -17,7 +17,7 @@
     "importHelpers": false,
     "strictNullChecks": true,
     "suppressImplicitAnyIndexErrors": true,
-    "noUnusedLocals": true
+    "noUnusedLocals": true,
   },
   "exclude": [
     "node_modules",

From 020c08be2f95bc2f70dd3e514969756704b5b6e5 Mon Sep 17 00:00:00 2001
From: Antreo Pukay <37254131+soundparticle@users.noreply.github.com>
Date: Sun, 20 Jan 2019 12:41:34 -0800
Subject: [PATCH 8/9] Update login.component.tsx

---
 src/components/login/login.component.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/login/login.component.tsx b/src/components/login/login.component.tsx
index b36bfd5..4c2dbb6 100644
--- a/src/components/login/login.component.tsx
+++ b/src/components/login/login.component.tsx
@@ -34,7 +34,7 @@ export class LoginComponent extends React.Component {
         <h1>Please Login</h1>
         <SignInForm />
         <button className="Button--GoogleSignIn no-underline near-white bg-animate bg-dark-blue hover-bg-gray inline-flex items-center ma2 tc br2 pa0"
-                onClick={this.loginClickHandler}>
+          onClick={this.loginClickHandler}>
           <div className="dib h3 w3 pa1 bg-white">
             {SVGs.google}
           </div>

From 46937955578fd2895846eb63742879f5a0de6a82 Mon Sep 17 00:00:00 2001
From: Antreo Pukay <37254131+soundparticle@users.noreply.github.com>
Date: Sun, 20 Jan 2019 12:48:57 -0800
Subject: [PATCH 9/9] Update SigninForm.js

---
 src/components/signinForm/SigninForm.js | 44 ++++++++++++-------------
 1 file changed, 21 insertions(+), 23 deletions(-)

diff --git a/src/components/signinForm/SigninForm.js b/src/components/signinForm/SigninForm.js
index 2b662a5..5cd5552 100644
--- a/src/components/signinForm/SigninForm.js
+++ b/src/components/signinForm/SigninForm.js
@@ -6,26 +6,24 @@ import React, { PureComponent } from 'react';
 
 import './SignInForm.scss';
 
-
 export class SignInForm extends PureComponent {
 
-	state = {
-		email: '',
-		password: '',
-	}
+  state = {
+    email: '',
+    password: '',
+  }
 
 	static propTypes = {
 		action: PropTypes.string.isRequired,
 		submit: PropTypes.func.isRequired,
 	}
 
-	
 	handleSubmit = event => {
 		event.preventDefault();
 		this.props.submit(this.state)
 		.catch(() => {});
 	}
-	
+
 	handleChange = ({ target }) => {
 		this.setState({ [target.email]: target.value }); 
 	}
@@ -35,22 +33,22 @@ export class SignInForm extends PureComponent {
 		const { email, password } = this.state;
 
 		return (
-				<form onSubmit={this.handleSubmit}>
-
-					<FormControl label="email">
-						<input className="form-boxes" name="email" value={email} 
-							onChange={this.handleChange}/>
-					</FormControl>
-					
-					<FormControl label="password">
-						<input className="form-boxes" name="password" value={password} type="password" 
-							onChange={this.handleChange}/>
-					</FormControl>
-
-					<FormControl>
-						<button className="form-boxes">{action}</button>
-					</FormControl>
-				</form>
+			<form onSubmit={this.handleSubmit}>
+
+				<FormControl label="email">
+					<input className="form-boxes" name="email" value={email} 
+						onChange={this.handleChange}/>
+				</FormControl>
+
+				<FormControl label="password">
+					<input className="form-boxes" name="password" value={password} type="password" 
+						onChange={this.handleChange}/>
+				</FormControl>
+
+				<FormControl>
+					<button className="form-boxes">{action}</button>
+				</FormControl>
+			</form>
 		);
 	}
 }