[DMP 2024]: Enhancements to Payment Hub EE Operations Web UI

[DavidH-1]

Ticket Contents

Description

Mifos Payment Hub EE (PH-EE)is a Modern orchestation engine for digital & real-time payments enabling Digital Financial Service Providers (DFSPs) to connect to and participate in instant inclusive payment systems and for governments to disburse payments in bulk to functional wallet accounts.

Payment Hub EE can be deployed directly by the government or by individual institutions across the ecosystem:

Pay-BB (Payment Building Block) - Engine and Portal which sits between beneficiary management system and payment switch including ID-account mapper capability, bulk processing capability, and payment orchestration to enable disbursement of G2P payments across multiple programs into the functional accounts of beneficiaries.
Payment Hub EE - DFSP Participation Toolkit that is core-banking and payment system agnostic which enables the seamless integration and participation of any DFSP into a payment system through process orchestration
The operations web user interface is a critical tool that enables the users of PH-EE to initiate operations within the Payment Hub EE, view tranaction history, and analyze performance and transaction throughput.

Recently a brand new mono-repo microfrontend-based approach was introduced for PH-EE enabling multiple users and roles with different personas to interact with PH-EE.

Goal of this project would continue to enhance the overall user experience of the PH-EE Operations Web UI

Goals & Mid-Point Milestone

Goals

• [1] [Propose & Design UI/UX enhancements]
• [2] [Document as stories the outstanding UI screens to be implemented from Pay-BB Designs]
• [3] [Extend scope of Keycloak integration]
• [4] [Implement remaining UI screens identfied]
• [5] Implement usabilty enhancements
• [6] Integrate in the kibana/grafana dashboards and data visualizations.
  [Goals Achieved By Mid-point Milestone]

Setup/Installation

https://github.com/openMF/ph-ee-operations-web/blob/master/README.md

Expected Outcome

PH-EE Operations Web UI with improved user experience, greater visibliity into performance status of digital payments, and increased functional coverage for additonal use cases.

Acceptance Criteria

No response

Implementation Details

https://github.com/openMF/ph-ee-operations-web

Improve upon and extend internationalization throughout the application
Introduce new screens that haven't yet been implemented from the design (voucher management, P2G)
Integrate in dashboards/visualizations from Kibana
Improved configurability of look and feel
Deepen integration with KeyCloak for user and role management.
Enhance usability of ID account mapper and bulk payment interface.

Mockups/Wireframes

https://govstack-global.atlassian.net/wiki/spaces/GH/pages/251527172/UI+Design+Wireframes+-+Delivery+Milestone+1
https://mifos.gitbook.io/docs/payment-hub-ee/overview/data-dictionary

Product Name

Mifos Payment Hub EE Operations Web UI

Organisation Name

The Mifos Initiative

Domain

Financial Inclusion

Tech Skills Needed

Angular, HTML, Microservices, RESTful APIs, UI/UX/Design

Mentor(s)

@alberto-art3ch

Category

Frontend

[vilol-04]

Hi @alberto-art3ch . I need some guidance on setting up the backend. Kindly assist me.

[DavidH-1]

@alberto are you able to pick up with Vilol

…

On 18 Apr 2024, at 14:21, vilol-04 ***@***.***> wrote: Hi @alberto-art3ch <https://github.com/alberto-art3ch> . I need some guidance on setting up the backend. Kindly assist me. — Reply to this email directly, view it on GitHub <#87 (comment)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/BBRYA4MLBBNNBIFGN3D6CNTY57CF3AVCNFSM6AAAAABGEY3KSKVHI2DSMVQWIX3LMV43OSLTON2WKQ3PNVWWK3TUHMZDANRTHA2TKOJRGU>. You are receiving this because you authored the thread.

[AbhimanyuSamagra]

Do not ask process related questions about how to apply and who to contact in the above ticket. The only questions allowed are about technical aspects of the project itself. If you want help with the process, you can refer instructions listed on Unstop and any further queries can be taken up on our Discord channel titled DMP queries. Here's a Video Tutorial on how to submit a proposal for a project.

[Cephasgokula]

Hey @DavidH-1. i am interested to work on the ui/ux part of this project . can you assign it to me.

[DavidH-1]

@Cephasgokula you need to apply with a proposal, instructions are here https://unstop.com/competitions/dedicated-mentoring-program-dmp-2024-code-for-govtech-932803?lb=7gWXVfKv

[Cephasgokula]

Hey @DavidH-1 . i have got error in installation.

[karimjindani]

Weekly Goals

Week 1

• Understanding of project operations
• Set up a local development setup for Angular and Keycloak
• Implement enhancements to User Management
  • Create User functionality
  • User Requests handling
  • View User details
  • Integrate Keycloak API with User Management

Week 2

• Implement User Status Options - Active, Inactive, Blocked, Temporarily Disabled
• Add New Fields to the Create User Form - First Name and Last Name instead of Name
• Mask Form Fields with Sample Data
• Enhance Form Error Validation
• Implement user role management and access control
• R&D on Audits logs of keycloak

Week 3

• Update the "Create User" form
  • User Type determines the ID field
  • According Add necessary column in "View User"
• Add individual filtering and sorting functionalities to the "View User" columns
• Research on jBPM (Java Business Process Management) workflow engine.
• Develop a custom event listener to send a welcome email to newly approved users.

[dipandhali2021]

Weekly Learnings & Updates

Week 1

• Understood the basic working and operations of Payment Hub Operations Web UI
• Explored and Implemented Keycloak Rest API
• Learned about the Project structure and area of development
• Learned about the user creation flow

Week 2

• Learned about the basic role management and assignment to individual user
• Increased the learning about Authentication best Practices and building secure app
• Understood the concept of Regular Expression Pattern Recognition

Week 3

• Studied how to create custom event listener for keycloak
• learned about maven package and JAR file
• Setup local SMTP server for mail using mailHog
• Created customised welcome mail for new user
• Started Learning Basics of JBPM Workflow Engine.