Rename component DefaultPage to Login

Change-Id: I1557ae86013884f791d18146b1234fdf2a7f8284

src/features/home/DefaultPage.js

@@ -1,80 +0,0 @@
-import React, { Component } from 'react';
-import PropTypes from 'prop-types';
-import { bindActionCreators } from 'redux';
-import { connect } from 'react-redux';
-import { Link } from 'react-router-dom';
-import reactLogo from '../../images/react-logo.svg';
-import rekitLogo from '../../images/rekit-logo.svg';
-import * as actions from './redux/actions';
-
-export class DefaultPage extends Component {
-  static propTypes = {
-    home: PropTypes.object.isRequired,
-    actions: PropTypes.object.isRequired,
-  };
-
-  render() {
-    return (
-      <div className="home-default-page">
-        <header className="app-header">
-          <img src={reactLogo} className="app-logo" alt="logo" />
-          <img src={rekitLogo} className="rekit-logo" alt="logo" />
-          <h1 className="app-title">Welcome to React</h1>
-        </header>
-        <div className="app-intro">
-          <h3>To get started:</h3>
-          <ul>
-            <li>
-              Edit component{' '}
-              <a
-                href="http://localhost:6076/element/src%2Ffeatures%2Fhome%2FDefaultPage.js/code"
-                target="_blank"
-                rel="noopener noreferrer"
-              >
-                src/features/home/DefaultPage.js
-              </a>{' '}
-              for this page.
-            </li>
-            <li>
-              Edit component{' '}
-              <a
-                href="http://localhost:6076/element/src%2Ffeatures%2Fhome%2FApp.js/code"
-                target="_blank"
-                rel="noopener noreferrer"
-              >
-                src/features/home/App.js
-              </a>{' '}
-              for the root container layout.
-            </li>
-            <li>
-              To see examples, access:&nbsp;
-              <Link to="/examples">/examples</Link>
-            </li>
-            <li>
-              Rekit Studio is running at:&nbsp;
-              <a href="http://localhost:6076/" target="_blank" rel="noopener noreferrer">
-                http://localhost:6076/
-              </a>.
-            </li>
-          </ul>
-        </div>
-      </div>
-    );
-  }
-}
-
-/* istanbul ignore next */
-function mapStateToProps(state) {
-  return {
-    home: state.home,
-  };
-}
-
-/* istanbul ignore next */
-function mapDispatchToProps(dispatch) {
-  return {
-    actions: bindActionCreators({ ...actions }, dispatch),
-  };
-}
-
-export default connect(mapStateToProps, mapDispatchToProps)(DefaultPage);

src/features/home/DefaultPage.scss

@@ -1,77 +0,0 @@
-@import '../../styles/mixins';
-
-.home-default-page {
-  text-align: center;
-  .app {
-    text-align: center;
-  }
-
-  .app-logo {
-    animation: app-logo-spin infinite 10s linear;
-    height: 80px;
-  }
-
-  .rekit-logo {
-    position: absolute;
-    left: 0px;
-    top: 0px;
-    opacity: 0.08;
-    height: 190px;
-  }
-
-  .app-header {
-    background-color: #222;
-    height: 150px;
-    padding: 20px;
-    color: white;
-    overflow: hidden;
-    position: relative;
-  }
-
-  .app-title {
-    font-size: 1.5em;
-  }
-
-  .app-intro {
-    font-size: large;
-  }
-
-  ul,
-  li {
-    list-style: none;
-    margin: 0;
-    padding: 0;
-  }
-
-  ul {
-    margin-top: 20px;
-  }
-  li {
-    margin-top: 10px;
-  }
-
-  a {
-    color: #0288d1;
-    text-decoration: none;
-    &:hover {
-      text-decoration: underline;
-    }
-  }
-
-  p.memo {
-    width: 500px;
-    color: #999;
-    font-size: 12px;
-    line-height: 150%;
-    margin: auto;
-  }
-
-  @keyframes app-logo-spin {
-    from {
-      transform: rotate(0deg);
-    }
-    to {
-      transform: rotate(360deg);
-    }
-  }
-}

src/features/home/Login.js

@@ -0,0 +1,54 @@
+import React, { Component } from 'react';
+import PropTypes from 'prop-types';
+import { bindActionCreators } from 'redux';
+import { connect } from 'react-redux';
+import { Link } from 'react-router-dom';
+import matrixLogo from '../../images/matrix-logo.svg';
+import * as actions from './redux/actions';
+
+export class Login extends Component {
+  static propTypes = {
+    home: PropTypes.object.isRequired,
+    actions: PropTypes.object.isRequired,
+  };
+
+  render() {
+    return (
+      <div className="home-login">
+        <header className="app-header">
+          <img src={matrixLogo} className="app-logo" alt="logo" />
+          <h1 className="app-title">Welcome to Synapse Admin</h1>
+        </header>
+        <form className="app-login">
+          <table>
+            <tbody>
+              <tr>
+                <th>Username:</th><td><input name="user"/></td>
+              </tr>
+              <tr>
+                <th>Password:</th><td><input name="password" type="password"/></td>
+              </tr>
+            </tbody>
+          </table>
+          <Link to="/user-admin/list">Login</Link>
+        </form>
+      </div>
+    );
+  }
+}
+
+/* istanbul ignore next */
+function mapStateToProps(state) {
+  return {
+    home: state.home,
+  };
+}
+
+/* istanbul ignore next */
+function mapDispatchToProps(dispatch) {
+  return {
+    actions: bindActionCreators({ ...actions }, dispatch),
+  };
+}
+
+export default connect(mapStateToProps, mapDispatchToProps)(Login);

src/features/home/Login.scss

@@ -0,0 +1,31 @@
+@import '../../styles/mixins';
+
+.home-login {
+  text-align: center;
+  .app {
+    text-align: center;
+  }
+
+  .app-logo {
+    animation: app-logo-spin infinite 10s linear;
+    height: 80px;
+  }
+
+  .app-header {
+    background-color: #EEE;
+    height: 150px;
+    padding: 20px;
+    color: black;
+    overflow: hidden;
+    position: relative;
+  }
+
+  .app-title {
+    font-size: 1.5em;
+  }
+
+  .app-login {
+    display: inline-block;
+    padding: 16px;
+  }
+}

src/features/home/index.js

@@ -1,2 +1,2 @@
 export { default as App } from './App';
-export { default as DefaultPage } from './DefaultPage';
+export { default as Login } from './Login';

src/features/home/route.js

@@ -1,14 +1,14 @@
 import {
-  DefaultPage,
+  Login,
 } from './';
 
 export default {
   path: '/',
   name: 'Home',
   childRoutes: [
-    { path: 'default-page',
-      name: 'Default page',
-      component: DefaultPage,
+    { path: 'login',
+      name: 'Login',
+      component: Login,
       isIndex: true,
     },
   ],

src/features/home/style.scss

@@ -1,3 +1,3 @@
 @import '../../styles/mixins';
 @import './App';
-@import './DefaultPage';
+@import './Login';