[libeufin] branch master updated: Add components folder with Login page

[gnunet]

This is an automated email from the git hooks/post-receive script.

heng-yeow pushed a commit to branch master
in repository libeufin.

The following commit(s) were added to refs/heads/master by this push:
     new 0b58df0  Add components folder with Login page
0b58df0 is described below

commit 0b58df0a8c6ae3b113335b1f14d6df836e34f89b
Author: tanhengyeow <E0032242@u.nus.edu>
AuthorDate: Thu Jun 4 03:17:52 2020 +0800

    Add components folder with Login page
---
 frontend/src/components/NotFound.tsx               |   5 ++
 frontend/src/components/activity/Index.tsx         |   5 ++
 frontend/src/components/bank-accounts/Index.tsx    |   5 ++
 frontend/src/components/home/Index.tsx             |  34 +++++++++++
 frontend/src/components/login/Index.tsx            |  63 +++++++++++++++++++++
 frontend/src/components/login/Login.less           |  15 +++++
 .../src/components/login/libeufin-logo-large.png   | Bin 0 -> 4148 bytes
 7 files changed, 127 insertions(+)

diff --git a/frontend/src/components/NotFound.tsx 
b/frontend/src/components/NotFound.tsx
new file mode 100644
index 0000000..a01a48e
--- /dev/null
+++ b/frontend/src/components/NotFound.tsx
@@ -0,0 +1,5 @@
+import * as React from 'react';
+
+const NotFound = () => <p>Not Found</p>;
+
+export default NotFound;
diff --git a/frontend/src/components/activity/Index.tsx 
b/frontend/src/components/activity/Index.tsx
new file mode 100644
index 0000000..81ef583
--- /dev/null
+++ b/frontend/src/components/activity/Index.tsx
@@ -0,0 +1,5 @@
+import * as React from 'react';
+
+const Activity = () => <p>Activity</p>;
+
+export default Activity;
diff --git a/frontend/src/components/bank-accounts/Index.tsx 
b/frontend/src/components/bank-accounts/Index.tsx
new file mode 100644
index 0000000..7d80648
--- /dev/null
+++ b/frontend/src/components/bank-accounts/Index.tsx
@@ -0,0 +1,5 @@
+import * as React from 'react';
+
+const BankAccounts = () => <p>Bank Accounts</p>;
+
+export default BankAccounts;
diff --git a/frontend/src/components/home/Index.tsx 
b/frontend/src/components/home/Index.tsx
new file mode 100644
index 0000000..29af137
--- /dev/null
+++ b/frontend/src/components/home/Index.tsx
@@ -0,0 +1,34 @@
+import * as React from 'react';
+import { connect } from 'react-redux';
+import { Link } from 'react-router-dom';
+import { logout } from '../../actions/auth';
+
+interface Props {
+  logoutConnect: () => void;
+}
+
+const Home = ({ logoutConnect }: Props) => (
+  <>
+    <p>Home page</p>
+    <ul>
+      <li>
+        <Link to="/activity">Activity</Link>
+      </li>
+      <li>
+        <Link to="/bank-accounts">Bank Accounts</Link>
+      </li>
+      <li>
+        <Link to="/non-existent-link">Non existent link</Link>
+      </li>
+    </ul>
+    <button type="button" onClick={logoutConnect}>
+      Logout
+    </button>
+  </>
+);
+
+const mapDispatchToProps = {
+  logoutConnect: logout,
+};
+
+export default connect(null, mapDispatchToProps)(Home);
diff --git a/frontend/src/components/login/Index.tsx 
b/frontend/src/components/login/Index.tsx
new file mode 100644
index 0000000..261eca3
--- /dev/null
+++ b/frontend/src/components/login/Index.tsx
@@ -0,0 +1,63 @@
+import React, { useState } from 'react';
+import { connect } from 'react-redux';
+import { Form, Input, Button } from 'antd';
+import { LoginOutlined } from '@ant-design/icons';
+import { login } from '../../actions/auth';
+import largeLogo from './libeufin-logo-large.png';
+import './Login.less';
+
+interface Props {
+  loginConnect: (nexusURL: string, username: string, password: string) => void;
+}
+
+const Login = ({ loginConnect }: Props) => {
+  const [nexusURL, setNexusURL] = useState('localhost:5000');
+  const [username, setUsername] = useState('user1');
+  const [password, setPassword] = useState('user1');
+
+  const layout = {
+    wrapperCol: { span: 32 },
+  };
+
+  return (
+    <div className="login">
+      <img className="img" src={largeLogo} alt="LibEuFin large logo" />
+      <Form {...layout} size="large">
+        <Form.Item>
+          <Input
+            placeholder="Nexus Server URL"
+            defaultValue="localhost:5000"
+            onChange={(e) => setNexusURL(e.target.value)}
+          />
+        </Form.Item>
+        <Form.Item>
+          <Input
+            placeholder="Username"
+            onChange={(e) => setUsername(e.target.value)}
+          />
+        </Form.Item>
+        <Form.Item>
+          <Input.Password
+            placeholder="Password"
+            onChange={(e) => setPassword(e.target.value)}
+          />
+        </Form.Item>
+        <div className="button">
+          <Button
+            type="primary"
+            icon={<LoginOutlined />}
+            onClick={() => loginConnect(nexusURL, username, password)}
+          >
+            Login
+          </Button>
+        </div>
+      </Form>
+    </div>
+  );
+};
+
+const mapDispatchToProps = {
+  loginConnect: login,
+};
+
+export default connect(null, mapDispatchToProps)(Login);
diff --git a/frontend/src/components/login/Login.less 
b/frontend/src/components/login/Login.less
new file mode 100644
index 0000000..bd8cb22
--- /dev/null
+++ b/frontend/src/components/login/Login.less
@@ -0,0 +1,15 @@
+.img {
+  margin-bottom: 24px;
+}
+
+.login {
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  transform: translate(-50%, -50%);
+}
+
+.button {
+  display: flex;
+  justify-content: flex-end;
+}
diff --git a/frontend/src/components/login/libeufin-logo-large.png 
b/frontend/src/components/login/libeufin-logo-large.png
new file mode 100644
index 0000000..d9c6a70
Binary files /dev/null and 
b/frontend/src/components/login/libeufin-logo-large.png differ

-- 
To stop receiving notification emails like this one, please contact
gnunet@gnunet.org.