[libeufin] branch master updated: List existing bank connections + cleanup

[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 855e415  List existing bank connections + cleanup
855e415 is described below

commit 855e4152323a6e34222b2f5cfb5d9bc23fc8d42b
Author: tanhengyeow <E0032242@u.nus.edu>
AuthorDate: Thu Jun 11 02:34:28 2020 +0800

    List existing bank connections + cleanup
---
 frontend/src/App.tsx                            |  5 +--
 frontend/src/components/activity/Index.tsx      |  2 +-
 frontend/src/components/bank-accounts/Index.tsx | 45 +++++++++++++++++++++++--
 frontend/src/components/home/Index.tsx          | 33 ++----------------
 frontend/src/components/navbar/Index.tsx        |  3 +-
 frontend/src/index.tsx                          |  8 ++---
 frontend/src/reducers/auth.tsx                  | 22 ------------
 frontend/src/routes/AuthenticatedRoute.tsx      |  9 +++--
 frontend/src/routes/UnauthenticatedRoute.tsx    |  5 +--
 frontend/src/types.tsx                          |  2 +-
 10 files changed, 65 insertions(+), 69 deletions(-)

diff --git a/frontend/src/App.tsx b/frontend/src/App.tsx
index ca9b5b8..0cd063a 100644
--- a/frontend/src/App.tsx
+++ b/frontend/src/App.tsx
@@ -4,7 +4,7 @@ import { Route, Router } from 'react-router-dom';
 import history from './history';
 import Pages from './routes/Pages';
 import { checkAuthentication } from './actions/auth';
-import { Auth } from './types';
+import { Store } from './types';
 import './App.less';
 
 interface Props {
@@ -27,7 +27,8 @@ const App = ({ checkAuthenticationConnect, isAuthenticated }: 
Props) => {
   return <div className="App">{app}</div>;
 };
 
-const mapStateToProps = (state: Auth) => ({
+const mapStateToProps = (state: Store) => ({
+  ...state,
   isAuthenticated: state.isAuthenticated,
 });
 
diff --git a/frontend/src/components/activity/Index.tsx 
b/frontend/src/components/activity/Index.tsx
index 81ef583..9f6590c 100644
--- a/frontend/src/components/activity/Index.tsx
+++ b/frontend/src/components/activity/Index.tsx
@@ -1,5 +1,5 @@
 import * as React from 'react';
 
-const Activity = () => <p>Activity</p>;
+const Activity = () => <h1>Activity</h1>;
 
 export default Activity;
diff --git a/frontend/src/components/bank-accounts/Index.tsx 
b/frontend/src/components/bank-accounts/Index.tsx
index 7d80648..ccb37b9 100644
--- a/frontend/src/components/bank-accounts/Index.tsx
+++ b/frontend/src/components/bank-accounts/Index.tsx
@@ -1,5 +1,46 @@
-import * as React from 'react';
+import React, { useState } from 'react';
 
-const BankAccounts = () => <p>Bank Accounts</p>;
+const BankAccounts = () => {
+  const [connectionsList, setConnectionsList] = useState([]);
+
+  React.useEffect(() => {
+    const fetchBankConnections = async () => {
+      const authHeader = await window.localStorage.getItem('authHeader');
+      await fetch(`/bank-connections`, {
+        headers: new Headers({
+          Authorization: `Basic ${authHeader}`,
+        }),
+      })
+        .then((response) => {
+          if (response.ok) {
+            return response.json();
+          }
+          throw 'Cannot fetch bank connections';
+        })
+        .then((response) => {
+          setConnectionsList(response.bankConnections);
+        })
+        .catch((err) => {
+          throw new Error(err);
+        });
+    };
+    fetchBankConnections();
+  }, []);
+
+  return (
+    <>
+      <h1>Bank Accounts</h1>
+      <h2>Bank connections</h2>
+      {connectionsList
+        ? connectionsList.map((bankConnection) => (
+            <div>
+              <p>Name: {bankConnection['name']}</p>
+              <p>Type: {bankConnection['type']}</p>
+            </div>
+          ))
+        : null}
+    </>
+  );
+};
 
 export default BankAccounts;
diff --git a/frontend/src/components/home/Index.tsx 
b/frontend/src/components/home/Index.tsx
index 29af137..27fa3b0 100644
--- a/frontend/src/components/home/Index.tsx
+++ b/frontend/src/components/home/Index.tsx
@@ -1,34 +1,5 @@
 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 = () => <h1>Home</h1>;
 
-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);
+export default Home;
diff --git a/frontend/src/components/navbar/Index.tsx 
b/frontend/src/components/navbar/Index.tsx
index 9a24137..0d8f4ba 100644
--- a/frontend/src/components/navbar/Index.tsx
+++ b/frontend/src/components/navbar/Index.tsx
@@ -1,4 +1,4 @@
-import * as React from 'react';
+import React from 'react';
 import { Menu, Button } from 'antd';
 import { connect } from 'react-redux';
 import { LogoutOutlined } from '@ant-design/icons';
@@ -36,6 +36,7 @@ const NavBar = ({ logoutConnect }: Props) => {
       <Menu
         className="menu"
         mode="horizontal"
+        selectedKeys={[]}
         onClick={({ key }) => handleClick(key)}
       >
         <Menu.Item key="1">Home</Menu.Item>
diff --git a/frontend/src/index.tsx b/frontend/src/index.tsx
index d2c60e7..2128016 100644
--- a/frontend/src/index.tsx
+++ b/frontend/src/index.tsx
@@ -6,8 +6,8 @@ import { applyMiddleware, compose, createStore } from 'redux';
 import thunkMiddleware from 'redux-thunk-recursion-detect';
 
 import App from './App';
-import authReducer from './reducers/auth';
-import { Auth } from './types';
+import rootReducer from './reducers/index';
+import { Store } from './types';
 
 let composeEnhancers;
 if (
@@ -19,8 +19,8 @@ if (
   composeEnhancers = compose;
 }
 
-const store = createStore<Auth, any, any, any>(
-  authReducer,
+const store = createStore<Store, any, any, any>(
+  rootReducer,
   undefined,
   composeEnhancers(applyMiddleware(thunkMiddleware))
 );
diff --git a/frontend/src/reducers/auth.tsx b/frontend/src/reducers/auth.tsx
deleted file mode 100644
index cf97e40..0000000
--- a/frontend/src/reducers/auth.tsx
+++ /dev/null
@@ -1,22 +0,0 @@
-import { Authenticate, Unauthenticate } from '../actions/auth';
-import { AUTHENTICATE, UNAUTHENTICATE } from '../constants';
-import { Auth } from '../types';
-
-export default function authReducer(
-  state: Auth = {
-    isAuthenticated: null,
-  },
-  action: Authenticate | Unauthenticate
-): Auth {
-  switch (action.type) {
-    case AUTHENTICATE:
-      return {
-        ...state,
-        isAuthenticated: true,
-      };
-    case UNAUTHENTICATE:
-      return { ...state, isAuthenticated: false };
-    default:
-      return state;
-  }
-}
diff --git a/frontend/src/routes/AuthenticatedRoute.tsx 
b/frontend/src/routes/AuthenticatedRoute.tsx
index 2a14cc0..366dc60 100644
--- a/frontend/src/routes/AuthenticatedRoute.tsx
+++ b/frontend/src/routes/AuthenticatedRoute.tsx
@@ -3,8 +3,10 @@ import * as React from 'react';
 import { connect } from 'react-redux';
 import { Route } from 'react-router-dom';
 import history from '../history';
-import { Auth } from '../types';
+import { Store } from '../types';
 
+import './Layout.less';
+import NavBar from '../components/navbar/Index';
 import Footer from '../components/footer/Index';
 
 interface Props {
@@ -26,7 +28,7 @@ const AuthenticatedRoute = ({
   return (
     <>
       <div className="container">
-        <header>Nav Bar</header>
+        <NavBar />
         <Route
           render={() => (
             <>
@@ -40,7 +42,8 @@ const AuthenticatedRoute = ({
   );
 };
 
-const mapStateToProps = (state: Auth) => ({
+const mapStateToProps = (state: Store) => ({
+  ...state,
   isAuthenticated: state.isAuthenticated,
 });
 
diff --git a/frontend/src/routes/UnauthenticatedRoute.tsx 
b/frontend/src/routes/UnauthenticatedRoute.tsx
index 12fc32a..d468441 100644
--- a/frontend/src/routes/UnauthenticatedRoute.tsx
+++ b/frontend/src/routes/UnauthenticatedRoute.tsx
@@ -4,7 +4,7 @@ import { connect } from 'react-redux';
 import { Route } from 'react-router-dom';
 
 import history from '../history';
-import { Auth } from '../types';
+import { Store } from '../types';
 
 interface Props {
   exact?: boolean;
@@ -35,7 +35,8 @@ const UnauthenticatedRoute = ({
   );
 };
 
-const mapStateToProps = (state: Auth) => ({
+const mapStateToProps = (state: Store) => ({
+  ...state,
   isAuthenticated: state.isAuthenticated,
 });
 
diff --git a/frontend/src/types.tsx b/frontend/src/types.tsx
index 33e6ff2..da79f4d 100644
--- a/frontend/src/types.tsx
+++ b/frontend/src/types.tsx
@@ -1,3 +1,3 @@
-export interface Auth {
+export interface Store {
   isAuthenticated: boolean | null;
 }

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