Форма авторизации

src/public/js/react/site/components/common/private-router.js

+
+const PrivateRoute = ({component: Component, ...rest }) => (
+    <Route
+        {...rest}
+        render={props =>
+          fakeAuth.isAuthenticated ? (
+            <Component {...props} />
+          ) : (
+            <Redirect
+              to={{
+                pathname: "/login",
+                state: { from: props.location }
+              }}
+            />
+          )
+        }
+    />
+);
\ No newline at end of file

src/public/js/react/site/components/layout.js

 
-const PrivateRoute = ({component: Component, ...rest }) => (
-    <Route
-        {...rest}
-        render={props =>
-          fakeAuth.isAuthenticated ? (
-            <Component {...props} />
-          ) : (
-            <Redirect
-              to={{
-                pathname: "/login",
-                state: { from: props.location }
-              }}
-            />
-          )
-        }
-    />
-);
-
 const Header = () => (
     <header className="l-header">
         <nav className="wrapp row xs-no-row row-center">

src/public/js/react/site/components/login.js

 
 class Login extends React.Component {
     state = {
-        redirectToReferrer: false
+        redirectToReferrer: false,
+        'email': '',
+        'password': '',
+        'remember-pass': false
+    };
+    handleChange = (event) => {
+        if (event.target.name == 'remember-pass') {
+            var currentState = this.state['remember-pass'];
+            this.setState({[event.target.name]: !currentState});
+        } else {
+            this.setState({[event.target.name]: event.target.value});
+        }
     };
     login = () => {
         fakeAuth.authenticate(() => {
@@ -20,6 +31,27 @@ class Login extends React.Component {
         return (
             <div>
                 <button onClick={this.login}>Log in</button>
+                <form action="" className="b-popup__login" name="login" data-url="/get-site-data/">
+                    <h1>Вход</h1>
+                    <span className="input input--akira">
+                      <input className="input__field input__field--akira" type="text" id="login-email" name="email" value={this.state.email} onChange={this.handleChange} />
+                      <label className="input__label input__label--akira" htmlFor="login-email">
+                        <span className="input__label-content input__label-content--akira">E-mail</span>
+                      </label>
+                    </span>
+                    <span className="input input--akira">
+                      <input className="input__field input__field--akira" type="password" id="login-password" name="password" value={this.state.password} onChange={this.handleChange} />
+                      <label className="input__label input__label--akira" htmlFor="login-password">
+                        <span className="input__label-content input__label-content--akira">Пароль</span>
+                      </label>
+                      <a href="#" className="link call-password-reset button-open">Забыли?</a>
+                    </span>
+                    <label className="input-checkbox text">
+                        <input type="checkbox" name="remember-pass" checked={this.state['remember-pass']} onChange={this.handleChange} />
+                        <span>Запомнить</span>
+                    </label>
+                    <input type="submit" name="submit" value="Login" />
+                </form>
             </div>
         );
     };

src/public/js/react/site/init-routers.js

@@ -10,4 +10,4 @@ const {
     Link,
     Redirect,
     withRouter
-} = ReactRouterDOM;
+} = ReactRouterDOM

src/templates/layout/layout-default.phtml

@@ -47,6 +47,7 @@
     <script src="/js/react/site/components/sites-list.js" type="text/babel"></script>
     <script src="/js/react/site/components/404.js" type="text/babel"></script>
     <!-- Common components -->
+    <script src="/js/react/site/components/common/private-router.js" type="text/babel"></script>
     <script src="/js/react/site/components/common/blocks-layout.js" type="text/babel"></script>
     <script src="/js/react/site/components/common/auth-button.js" type="text/babel"></script>
     <script src="/js/react/site/components/common/values.js" type="text/babel"></script>