Page Comparison

Wallet View

• Links

  • Wrap

    • On click

      • Display Wrap FIO View

Wrap FIO Tokens

• Display

  • Wallet name

  • Wrapping Network

  • Links

    • Paste Public Address

      • On click

        • Paste the Public Address from Users Clipboard

    • Connect Wallet

      • On click

        • Display Wallet Modal with the option to connect to the users wallet

    • Max FIO Wrap Amount

      • On click

        • Display maximum amount of FIO to be wrapped

    • Wrap FIO Tokens

      • On click

        • Collect PIN

        • Execute /wrap_fio_tokens

        • On processing

          • Display Transaction Processing View

        • On success

          • Display FIO Request Confirmation Page

  • Transaction cost

    • Fee cost

      • max_oracle_fees

      • max_fee

• Collect

  • FIO Public Address for Wrapping

    • Via Clipboard Paste

    • Via Wallet Connection

  • FIO Wrap Amount

    • Amount denominated in FIO

• Validate

  • Wrap Amount

    • Validate onfocusout

      • On validation error

        • Display error message:

          • Please enter valid amount

    • Validation rules

      • Format

        • Numeric

        • Max 9 decimals

  • Fee transaction count

    • If <2 display Low balance banner prevent clicking Stake FIO Tokens

Wallet Connection

• Links

  • MetaMask Wallet Connection

    • On click

      • Connect to the users browser based MetaMask Wallet

  • Close

    • On Click

      • Closes wallet connection modal

Public Address Displayed

• Wallet Connected

  • Display Connected MetaMask Wallet

  • Links

    • Cancel

      • On Click

        • Cancels the wallet connection

• Pasted Public Address

  • Display Public Address from Clipboard

  • Links

    • Cancel

      • On Click

        • Clears the pasted public address

Confirm Wrapping

• Collect

  • PIN code

• Display Transaction Processing Page

• Wrap using /wrap_fio_tokens

• Display Wrapping Confirmation Page

FIO Tokens Wrapped - With Fees

• Display

  • Wrapping Transaction Information

    • Wrap Chain - chain_code

    • Public Address - public_address

    • FIO Wrapped - amount

    • Fee cost and corresponding USDC

      • max_oracle_fee - oracle_fee_collected

      • max_fee - fee_collected

    • FIO ID - tpid

  • Links

    • Close and X

      • On click

        • Display Wallet Detail View

Error State - Low FIO Balance

In the scenario where the user has an associated address and a balance which is to low display the following:

• Additional Display

  • Display low FIO balance banner