Page Comparison

Wallet View

• Links

  • Unwrap

    • On click

      • Display Unwrap FIO View

Wallet Connection

• Links

  • MetaMask Wallet Connection

    • On click

      • Connect to the users browser based MetaMask Wallet for signin

  • Close

    • On Click

      • Closes wallet connection modal

Unwrap FIO Tokens

• Display

  • Wallet Name

  • Current wrapped network (Ethereum)

  • Unwrap network (FIO)

  • Links

    • Select FIO Crypto Handle

      • On click

        • Display FIO Crypto Handle Modal with associated handles

    • Unwrap wFIO Tokens

      • On click

        • Trigger MetaMask wallet transaction signing

    • Edit Fees

      • On click

        • Trigger the fee modal with both basic and advanced fee settings based on current network fees

    • Max

      • On click

        • Prepopulates maximum available FIO

  • Transaction cost

    • Fee cost - Fees are determined by the network

• Collect

  • Amount of FIO tokens to unwrap

• Validate

  • wFIO Wrapped Amount

    • Validate onfocusout

      • On validation error

        • Display error message:

          • Please enter valid wFIO amount

    • Validation rules

      • Valid amount of SUFs to unwrap

  • FIO Crypto Handle

    • Validate onfocusout

      • On validation error

        • Display error message:

          • Please enter valid FIO Crypto Handle

    • Validation rules

      • Valid FIO Address where domain should be delivered

Select FIO Crypto Handle

• Choose FIO Crypto Handle

  • Display available FIO crypto handles

  • Links

    • Cancel

      • On Click

        • Cancels the view

    • FIO crypto handle selection

      • On Click

        • Returns the user to the main unwrap view with the selected FIO crypto handle populated

    • Done

      • On Click

        • If the user manually enters a FIO crypto handle, they must click the done CTA to return to the main unwrap view and populate the FIO crypto handle view.

    • Clear

      • On Click

        • Clears the manual FIO crypto handle entry

  • Collect

    • FIO Crypto Handle

      • Via Clipboard Paste

      • Via Manual Entry

Edit Fees

• Overall

  • Links

    • Close

      • On Click

        • Returns the user to the main unwrap view

    • Cancel

      • On Click

        • Cancels the view

    • Advance

      • On Click

        • Displays the advanced fee view to the user

    • Basic

      • On Click

        • Displays the basic fee view to the user

• Basic

  • Display available tiers of network fees

    • Use 60,000 gas limit and gas price from Etherscan API

  • Links

    • Tier Selection

      • On Click

        • Selects the fee tier the user wishes to use

• Advanced

  • Collect

    • Gas Limit and Gas Price

      • Defaults

        • Use 60,000 gas limit and gas price from Etherscan API for high

      • On Entry

        • Allows the user to set fee amount for both gas limit and gas price

        • Return the potential transaction time

      • Validation rules

        • If the user enters in an amount lower than the low threshold, an error state is triggered and the user notified that the transaction could fee with fees being unrecoverable

MetaMask Transaction Signing

• Display

  • Metamask wallet connection and transaction signing experience

FIO Tokens Unwrapped

• Display

  • Unwrapping Transaction Information

    • Unwrap Chain - chain_code

    • Public Address - public_address

    • Receiving FIO Crypto Handle - fio_address

    • Tokens Unwrapped - amount

    • Blockchain Transaction ID - obt_id

  • Links

    • Close and X

      • On click

        • Display Wallet View

Error State -

FIO Token Balance

In the scenario where the user has an associated address and a balance which is to low display the following:less wFIO in their connected wallet than attempting to unwrap

• Additional Display

  • Display low FIO balance banner

    • Content - “Balance! - You are attempting to unwrap more wFIO than available.”