summaryrefslogtreecommitdiff
path: root/libeufin/frontend.rst
blob: 19fba47966c1eeed5098ee243c57d03f46d77b2f (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
###################
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.