regAndLog

src/components/Auth/index.js

@@ -0,0 +1,35 @@
+import React from "react";
+import { reduxForm, Field } from "redux-form";
+import  authValidate  from "../../utils/validate";
+
+const Form = props => {
+  const { handleSubmit,submitting } = props
+    return (
+      <form className="auth__form" onSubmit={handleSubmit}>
+        <label>Login:</label>
+        <div>
+          <Field
+             name="email"
+             component="input"
+             type="email" 
+             label="E-mail:"
+             placeholder="example@email.com"
+
+          />
+        </div>
+        <label>Password:</label>
+        <div>  
+          <Field
+             name="password"
+             component="input" 
+             type="password" 
+              label="Password:" 
+             placeholder ="password"  
+          />
+        </div>
+        <button className="auth__submit-button">Submit</button>
+      </form>
+    );
+}
+
+export default reduxForm({ form: "authForm", validate: authValidate })(Form);

src/components/Auth/registration.js

@@ -0,0 +1,66 @@
+import React from 'react'
+import { Field, reduxForm } from 'redux-form'
+
+const RegistrForm = props => {
+  const { handleSubmit, pristine, reset, submitting } = props
+  return (
+    <form onSubmit={handleSubmit}>
+      <div>
+        <label>Login</label>
+        <div>
+          <Field
+            name="Login"
+            component="input"
+            type="text"
+            placeholder="Login"
+          />
+        </div>
+      </div>
+      <div>
+        <label>Name</label>
+        <div>
+          <Field
+            name="Name"
+            component="input"
+            type="text"
+            placeholder="Name"
+          />
+        </div>
+      </div>
+      <div>
+        <label>Phone</label>
+        <div>
+          <Field
+            name="Phone"
+            component="input"
+            type="text"
+            placeholder="+380XXXXXXXX"
+          />
+        </div>
+      </div>
+      <div>
+        <label>Email</label>
+        <div>
+          <Field
+            name="email"
+            component="input"
+            type="email"
+            placeholder="email@example.com"
+          />
+        </div>
+      </div>
+      <div>
+        <button type="submit" disabled={pristine || submitting}>
+          Submit
+        </button>
+        <button type="button" disabled={pristine || submitting} onClick={reset}>
+          Clear Values
+        </button>
+      </div>
+      </form>
+  )
+}
+
+export default reduxForm({
+  form: 'registrForm'
+})(RegistrForm)

src/components/Header/Myprofile.js

@@ -5,8 +5,8 @@ class Myprofile extends Component {
     render() {
         return (
         <div className="auth">
-            <Link to="/auth" className="link" target="_blank">
-
+            <Link to="/registration" className="link" target="_blank">
+            
                 <div className="avatar">
                     <Avatar icon="user" style={{ backgroundColor: '#1890ff' }}/>
                 </div>

src/router.js

@@ -4,6 +4,7 @@ import { Switch, Route } from "react-router-dom";
 import App from "./container/App";
 import Header from './components/Header'
 import Form from './components/Auth/index'
+import RegistrForm from './components/Auth/registration'
 
 export default () => (
     <div>
@@ -11,6 +12,7 @@ export default () => (
 	        <Switch>
                 <Route path="/" exact component={App} />
                 <Route path="/auth" exact component={Form} />
+                <Route path="/registration" exact component={RegistrForm} />
 
 	        </Switch>
     </div>