Updating the design for Credit card in Mobile application

[Joys-ileaf]

Currently, we are using a 3rd party application from My fatoorah. Need to make the design similar to the below video https://user-images.githubusercontent.com/86234979/128185764-a4998040-b6d6-4327-88dd-2aaf921999c0.mp4

[Joys-ileaf]

Not recommended.

If we implement this design in the application. Customers need to enter the details on thE new custom page and from there it will pass to the 3rd party application. So the credit card details( number, date, and CVV) will be first stored in Magento's Admin Dashboard and then will get passed to My fatoorah services. There is a huge risk and security factor involved in this.

[Joys-ileaf]

We can store it in myfatoorah and they will provide a token for us. So for next time payment, we will use that token. So there will be no interface for the credit card session in the future for that particular user.

[Joys-ileaf]

As per the request from Bandar, the ILeaf team needs to change the design of the credit card animation. As of now, it is a separate page where customers can enter the details. It needs to be changed to a "slide from bottom" popup.

The main challenge in this system is once a customer clicks on the credit card section, as of now - it is passing to the MyFatoorah page and then all the processes are taken from the MyFatoorah APIs. Once ILeaf team implements this feature - there will be a new page in between where the customer enters the details and it will be saved in the Current Magento backend. and then only it will get uploaded to the MyFatoorah page. If there is hacking or any type of malpractice occurs - all the customer data can be manipulated or stolen from the system.

For this we need assistance from MyFatoorah team to analyse and say whether they have any secure APIs for this processes.

[Joys-ileaf]

Hi Bandar,

We had a discussion with MyFatoorah technical team for checking the new flow for the Credit Card of the Fairyhub Application.

We have 2 Options

1. OTP Process:- Once we select the credit card, the new design will get pop up (bottom-up Pop-up) for providing the Card details. Once the customer enters the card details and submits them, he will remain in the application for the final confirmation. After making final confirmation, it will redirect to the My Fatoorah page to provide the OTP. Once the correct OTP is provided, payment will become successful and the customer will get redirected to Fairyhub App. Then invoice will get generated against the payment like in the existing system. Here the order with pending status needs to create before redirection.
2. Without OTP Process (Tokenization):- After providing the credit card details, there will be no OTP Process. Once a customer entered valid details and submits them, we will keep a payment token for this customer. So the customer will remain in our Application and payment will take once the customer making a final confirmation action. For both these options - we can implement the new design for the Credit cards. The only difference is For the 1st option, it will redirect from our app to the Myfatoorah page and then to Our Application. and for the 2nd Option - there will be no redirection. Every process will be in Our Fairyhub App only.

Discussed this with the Ileaf technical team and my suggestion is to go with the 2nd Option (without any redirections). As per the MyFatoorah technical team, tokens are just an alphanumeric string that is generated from the Fatoorah team, and if someone hacks the system, the token will have no information about the credit card details.

Please let me know your thoughts on this too.

[Joys-ileaf]

Dear Joys

For 1st Option, we’d like to see the scenario in a visual presentation; to understand it better, because the 2nd option bypasses the Security OTP, and we are considering both scenarios, taking factors of ease of use and security in mind.

Thanks and Regards Khaled Mohammad Product Manager

[Joys-ileaf]

https://docs.google.com/document/d/18XYpTIrhKP5tJVkBQ0UlfDH3HY5jQFOnsf8AejDqBm0/edit?usp=sharing