Dunia Games - Indihome Gamerhub
Indihome Gamerhub is one of the features of Dunia Games that gives the benefit (the redeem voucher, DG Rings, and so on) to the Indihome users. So a customer of Indihome can claim the benefit that is already their right, directly from Dunia Games.
The journey starts from the Indihome number. The user only needs to enter it, then the page shows all the credentials that are registered to that Indihome number, namely the email and the phone numbers, and the user chooses one of them to receive the OTP. Every credential is masked, so the user still recognizes which one belongs to them but the complete data is not exposed on the screen. And when the data does not match anymore, they are directed to the call center to update it first.
After the OTP is verified, the user arrives at their own benefit, which is grouped by the type, for example the Indihome Gamer Benefit and the Add-On Benefit, so a user who has more than one Indihome number can also switch between them.
Then comes the redeem itself. The benefit is opened together with the items that are curated for it, and the user can take one item or more than one item at the same time, where every item that is chosen opens its own form, for example the Game ID and the Zone ID that have to be filled and validated by themselves. After that comes the confirmation before it is really processed.
The last one is the success page, and this is the part that has to be handled carefully, because in one redeem the result of every item can be different. So the page does not only present the fully success condition, but also the partially success one, where some of the vouchers are already processed while the others are not, complete with the reason and the suggestion to redeem it again, together with the proof of the transaction of every item that can be downloaded.
My job is to create this feature, both slicing (changing the image UI in Figma into html, css, and js code), and also integration (consume API, the OTP verification, the dynamic form and validation of every item, the state of every voucher, empty state, error state, etc.).
NB: Source code cannot be shared because it is a company asset.
