blob: 1fe1c83fed160b6db685670f071da21591d17080 (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
|
.. target audience: core developer
###################
LibEuFin Frontend
###################
Introduction
================
LibEuFin Frontend is a Single Page Application (SPA) built using React that facilitates setting up access to bank accounts, querying/displaying the transaction history of bank accounts and initiating payments.
Architecture
===============
The frontend code sits in the */frontend* folder. Files in the subfolders are highlighted below.
/actions, /reducers folder
--------------------------
Contains code that uses Redux to store the login state. Prevents user from relogging in every time they closed the browser or browser tab.
/routes folder
--------------
Directs the user to the respective pages according to the URL route. Routes are broken down into *UnauthenticatedRoute* and *AuthenticatedRoute*, which corresponds to the user's login state.
/components/login
-----------------
The login page for the user.
/components/navbar
------------------
Reusable navbar component that appears on every page of the project.
/components/footer
------------------
Reusable footer component that appears on every page of the project.
components/home
---------------
The home page showing general information of the users for e.g. bank accounts set up.
/components/activity
--------------------
Shows activity of payments and its transaction history (WIP).
/components/bank-accounts
-------------------------
Shows bank accounts that are imported. A bank account drawer is shown to facilitate setting up of bank accounts. Each bank account is displayed in a card to display extra details for e.g its print document.
|