Giter VIP home page Giter VIP logo

mento-web's People

Contributors

aaronmgdr avatar bayological avatar chapati23 avatar denviljclarke avatar dependabot[bot] avatar jeanregisser avatar jmrossy avatar nvtaveras avatar philbow61 avatar tobikuhlmann avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar

mento-web's Issues

Mento interface branding & content update

Description
Update mento interface branding & content to be consistent with main mento.org site

Logo file can be taken from here

Acceptance Criteria

  • Favicon is the same as mento.org
  • Main logo in header is the same as the logo used on mento.org
  • Link to documentation in about tab should point to https://docs.mento.org/
  • Youtube social link in footer is removed
  • Twitter social link in footer points to mento twitter account

BUG: When swapping cUSD to axlUSDC, changing token out to CELO changes token in to axlUSDC

Description
When attempting to swap cUSD to axlUSDC, changing the token out from axlUSDC to CELO results in the input token(cUSD) changing to axlUSDC.

Steps To Reproduce

  1. Navigate to the application
  2. Select cUSD as the input token
  3. Select axlUSDC as the output token
  4. Select CELO as the output token

Expected Result

  • Celo should be selected as the output token, and cUSD should remain selected as the input token.

Actual Result

  • The input token changes to axlUSDC, which leaves the app in an invalid state and causes errors to occur from attempts to get an estimate

Additional Info
USDCFlip

Reversing selected assets triggers swap confirmation

Description

When assets are selected, there is an input amount, and the swap is valid (i.e., the user's balance is sufficient) and the 'reverse asset' button is clicked the swap continuation is triggered, sending the user to the swap confirmation step. The fix should remove this unintended side effect.

Acceptance Criteria

  • When the reverse asset button is clicked, assets should be reversed, triggering a re-fetch of the swap quote with no other side effects

[bug] Swap Error - Rounding issue

Description

There's still a rounding issue causing swaps to fail after approvals and before the swap transaction in the transaction preparation step. This is likely due to a rounding error as it only happens in some cases when the 'use max' feature is used. A quick fix could be to swap slightly less than the max balance, some negligible amount ( .00001 ).

This can be reproduced by having a balance of USDC or any bridged version, selecting it as the input token then clicking the use max button.

Acceptance Criteria

Once swaps are approved they should be approved and executed with no issue

Dashboard of existing pools with Mento assets on Celo

Description

Create a dashboard in MakerDojo that lists all existing pools from various DEXes that include MSAs.
The dashboard should be presented as a table, like:
DEX | pair ticker | token 1 amount | token 2 amount | TVL (combined value in dollars) | Volume 24H | Volume 1 week
I don't know if there is an automated way to parse for all existing pools on all DEXes, if not here is a list of exchanges to be included:

Uni, Sushi, Ube, Mento, Mobius, Symmetric, Curve

Acceptance criteria

  • We have one saved query for each DEX which gives us a table of all pairs traded by the DEX with the following columns:
    pair ticker | token 1 amount | token 2 amount | TVL (combined value in dollars) | Volume 24H | Volume 1 week.
  • We have a query that combines the above and selects pairs with MSAs in them
  • Talk to makerdojo about transforming the per DEX queries in materialized views that refresh with some frequency
  • Come up with a list of pools that are missing in MakerDojo that we need (Curve & Symmetric)

Provide feedback in UI when trading limits have been reached

Description

In the past users have contacted us about not being able to swap and often times the cause of this that trading limits have been reached. This issue is to add some error handling for cases when trading limits have been reach (or any other error which can be deduced from SDK errors), and provide feedback to users in these scenarios.

for additional context
This was inspired by an issue an SDK user experienced

Action Items

  • Add error handling to detect when trading limits have been reached or pools are empty using the Mento SDK
  • Provide some feedback to users in the form of an error message on the UI either of these cases

Acceptance Criteria

  • Error handling in introduced for when trading limits have been reached
  • (optional) Error handling introduced for similar cases which can be deduced from SDK
  • Feedback is added to the UI when these errors occur

Use Max Functionality Incorrectly Sets Output Value After Typing in Output Field

Issue Description:

When using our token swap interface, users can input desired output in the 'output' field to determine the necessary 'input,' or vice versa. However, if a user types a value into the 'output' field and clicks 'use max,' the system mistakenly sets the 'output' field to the maximum number of 'input' tokens. Essentially, it misinterprets the 'output' as the current 'input' because of the recent typing action in that field. The expected behavior should be that the 'use max' functionality sets the 'input' field to the maximum available tokens, irrespective of where the user has previously typed.

Acceptance Criteria:

  • When a user types into the 'output' field and then clicks on the 'use max' button, the system should NOT change the value of the 'output' field based on the 'input' tokens.
  • The 'use max' functionality should consistently set the 'input' field to the maximum available tokens, regardless of where the user has recently typed.

Spin up a self-hosted analytics tool

Description

Set up a self-hosted instance of Plausible analytics for mento.org.

Acceptance criteria

  • We have VM running in Google Cloud
  • The VM should locally run all other components required (like database, cache, etc) in Docker
  • The VM should run Plausible in Docker
  • We have setup a mento.org subdomain for analytics pointing to the VM's external IP

Rebuild app screens based on new design

Description

As part of the Mento brand launch, we have a new, updated design for the Mento app front-end. We need to rebuild the existing site following the design in the linked Figma file. So we can co-ordinate the switch, the new build should not be merged to the main branch. After the rebuild, we need to make sure the regression tests are run to confirm everything is working as expected.

Designs
The design has two animations (one for light version, one for dark), I uploaded .json files with animations to google drive

Acceptance Criteria

  • New version of app page is built according to the designs
  • All elements on the page (buttons, links, etc.) should function correctly without any errors.
  • Regression test pack is executed and all tests pass

Website: Specify which USDC

Description

In the token select dropdown USDC is currently displayed as "USDC". Since USDC is not natively deployed on Celo, it could be referring to different versions of USDC that have been bridged to Celo, such as axlUSDC, USDCet, or any other variant.

We need to modify the site so the difference between versions is clear.

Acceptance criteria

  • Token select dropdown shows the actual symbol for selected USDC variant (e.g. axlUSDC, USDCet)

Image

Allow users to mint/burn stables using CELO or USDCet

Description
The updates to the Mento core contracts now allow the minting/burning of stable assets using any collateral asset controlled by the reserve. Users should be able to interact with the Mento interface in the same way as they do now, with the difference that they should be able to choose CELO or USDCet when minting/burning mento stable assets.

Technical Details
In the previous version of Mento, client applications would need to know the address of the exchange contract for the pair they wished to use for trading. This could previously be retrieved by using contract kit. In this new update, the address for the exchange must be retrieved by using the discovery functions available on the Broker & BiPoolManager contracts. These functions will allow consumers to discover the id of the available exchanges, the address of the exchange provider and which assets can be swapped. The functions will be accessible via the new Mento-sdk. Once the exchange info has been retrieved, swaps can be submitted to the Broker.

Acceptance Criteria

  • Users can swap using all pools that Mento supports
  • The UI is updated to use the SDK for discovery and swapping

Allow users to swap assets from non-Mento protocols

Description
Users should be able to use the interface to find and execute swaps with the best prices across multiple protocols. We will achieve this by integrating 0x API with the Mento Interface. For the initial implementation, we will compare the expected output amount from 0x with MentoV2 and then use the option with the best price.

Tech Notes
0x provides a relatively simple API that allows consumers to execute swaps with the best prices. The logic should be as follows:

  1. User inputs swap info on UI (tokenIn, tokenOut, slippageTolerance, amountIn etc)
  2. Query 0x API using price endpoint to get a price using the swap info
  3. Query MentoV2 broker via SDK to get a price for the given swap info
  4. Return best price info to UI
  5. If user submits swap execute swap using exchange with best price (MentoV2 or 0x)

Additional Info

Token Allowances - The 0x Exchange proxy smart contract needs to have an allowance to spend the users funds. The address for the contract on CELO is 0xdef1c0ded9bec7f1a1670819833240f027b25eff and can be seen here

Ox Api URL for Celo - https://celo.api.0x.org/

Token Lists - Tokens that can be swapped should be configurable but initially should be limited to CELO|USDCet <-> cStables

Acceptance Criteria

  • Users should be able to get quotes for swaps across non-mento exchanges
  • Users should be able to swap tokens across non-mento exchanges

Build a small set of regression tests for the UI

Description

Create a small set of regression tests for our UI to ensure that existing functionality remains stable and unaffected by code changes, updates, or new features. These tests will help maintain a high-quality user experience and minimise risks. The tests should cover executing swaps through all pools using the top-supported wallets.

Acceptance Criteria

  • Test cases created and added to notion page

Product usage dashboard

Description
All metrics should be visualized as daily line graphs if no conflicting requirements are provided for a particular metric.

Each stable asset should be reported separately, there should be a dropdown/toggle to switch between them.

All reports are denominated in $ USD if not stated otherwise.

Product usage metrics (per stablecoin)

Marketcap

Daily trading volume

Velocity (market cap/daily volume)

Transactions per day

Transactions per wallet per day

Daily mint/burn ratio

Acceptance criteria

  • There is a dashboard in Makerdojo with specified above metrics for each of the stable assets.

Deprecate Mento V1 web app

Description

We want to deprecate the old Mento V1 DApp.

Acceptance Criteria

  • https://mento.finance (v1) now redirects to https://app.mento.org (v2)
  • Potential 3rd Party Services have been disabled (i.e. analytics, sentry)
    • UPDATE PP: There are no 3rd party services to disable (checked sentry, no analytics found)
  • Victoria has been informed about takedown ahead of time so she can coordinate potential social media announcements
  • Rossy has been informed
  • https://app.mento.org no longer displays V2 banner
  • Remove mento.finance from Regression Test Steps
  • Last v1 commit has been git-tagged with v1.5.2
  • production-v1 branch in mento-web has been deleted
  • production-v2 branch in mento-web has been deleted

How To Test

Check PR branch here that banner is gone and app still works https://mento-web-git-feat-remove-v2-banner-mentolabs.vercel.app/

Implement light/dark theme switcher

Description

Implement a theme switcher feature on the site that allows users to switch between the light and dark theme. The selected theme should persist across different sessions. The implementation should align with the application's existing technology stack and design guidelines.

Designs
The design has two animations (one for light version, one for dark), I uploaded .json files with animations to google drive

Acceptance criteria

  • Users should be able to switch between light and dark themes using a clearly visible and intuitive switcher on the application.
  • Once a user selects a theme, the choice should persist and remain even after the user logs out and logs back in or refreshes the page.
  • The light and dark themes should be applied consistently across all UI elements within the application, ensuring no component is adversely affected or becomes difficult to see or use.

Add mainnet pools to frontend post CGP execution

** Description **

After MU05 executes on mainnet, add the new pools to the frontend and do a few manual trades.

** Acceptance Criteria **

  • New pools are added to the frontend
  • Swaps work on all directions

Add native USDC pools to frontend

** Description **

After executing MU05 on testnets, add the new pools to the frontend and do a few manual trades.

** Acceptance Criteria **

  • New pools are added to the frontend
  • Swaps work on all directions

Add newsletter sign up form to mento.org

Description

We need to add a subscription component to the website that allows users to sign up for Mento Magazine. This component will be integrated with Mailchimp to manage and store subscriber information. The setup for the Mailchimp integration will be handled by @olenovyk.

The design details for the subscription component can be found here: Designs on Figma

The component will have a two-step interaction:

  1. Initial Call-to-Action (CTA): Display an 'open envelope' graphic alongside a prompt for the user to enter their email address to sign up.
  2. Confirmation State: After successful subscription, show a 'closed envelope' graphic and a thank you message.

Acceptance criteria

  • There is a text input field for users to enter their email addresses.
  • A 'Subscribe' button is present next to the input field.
  • Clicking the 'Subscribe' button triggers the subscription process.
  • On clicking 'Subscribe', if the email is in a valid format, the user's email is sent to Mailchimp.
  • After a successful subscription, the component transitions to display a 'Thank you' message with a 'closed envelope' graphic.
  • If the subscription is unsuccessful (e.g., due to network issues), the user is notified with an error message.
  • Email input is validated for proper format and an error message is displayed for invalid entries.

Make decimal separator consistent and conditional

Description:

Can we add some conditional formatting to the input field? Check app.uniswap.org, it does all of the mentioned below

  • Should allow only entering digits and decimals symbol
  • Treat “.” and “,” (dot and coma) both as decimal symbol, replace coma entered by user with dot.
  • If there is already one decimal symbol in place, don’t allow adding another one
  • Display 6 significant digits, like 123456, or 12.2345, or 122.345, or 0.0000123456

Image

Acceptance Criteria:

  • decimal separators are consistent across the form

Correct rounding issue impacting accurate swapping and displaying of balances

Description

The UI incorrectly rounds numbers with more than four decimal places, leading to an overestimation when preparing to swap assets. For instance, a balance of 3.04567 is being rounded up to 3.0457, causing the system to attempt swaps exceeding the user's actual balance. The fix should accurately display the user balance up to a certain number of decimal places (without rounding) & when the user uses the max balance functionality, their full and accurate max balance should be set as the input amount resulting in a balance of 0 for that asset when the swap is complete. ( e.g sushiswap )

Acceptance Criteria

  • Display accurately reflects the user's balance up 6 decimal places (or whatever number we decide)
  • User can swap max balance

Asset selection resets to default after navigating backwards in the swap process

Description

Currently, when using the 'back' button on the swap confirmation step, the selected assets revert to the default selection. Swap asset selection should remain consistent throughout the swapping process unless explicitly changed.

Acceptance Criteria

  • Asset selection should persist when navigating throughout the swapping process unless the page is refreshed or the user changes the assets

Investigate a bug with app.mento.org

Steps to reproduce

  1. Go to app.mento.org
  2. Connect Metamask.
  3. Start swapping any amount from cEUR > axlUSDC

Expected Result

Swap will be completed successfully

Actual Result

An app throughs an error "Unable to prepare swap transaction"

Screenshot 2024-03-19 at 16.42.29.png

Implement mento.org landing page redesign

Description

As part of Mento brand launch we are giving a fresh look to our website.

Acceptance criteria

  • Light theme is developed according to the design specs and ready to be deployed.

@bayological to add tech acceptance criteria (like which tech stack should we use for landing and all of the web app)

Investigate why WebApp doesn't support Gnosis Safe

Description
It seems like our web app doesn't support GnosisSafe + Wallet Connect.
The increase Allowance transaction does pop up and can be approved but the actual swapIn transaction is not showing up and no error is displayed.

Acceptance Criteria

  • investigate why the WebApp doesn't work as expected when using GnosisSafe

Replace lottie animations in favor of something more efficient

Description

While the Lottie format animations we're using for the swap confirmation are small, the library used to display them is pretty large. As suggested by @jmrossy, it may be a good idea to swap this out for a solution smaller in size and less complex.

size of the current solution: 377K
library lottie-react (315k, gzipped 79k)
62k each animation (31K each animation)

Acceptance Criteria

  • A solution to display swap loading animations that is smaller in size

Update UI to add support for eXOF on Alfajores

Description

We need to add eXOF & axlEUROC to the UI and make changes to allow swapping between them

Configuration:

  • Configure Token Mapping
Add eXOF and axlEUROC to token list
  • Configure eXOF and axlEUROC default state (0)
  • Add & set eXOF and axlEUROC Icons
  • Update the list of bipoolmanager exchanges to add the new pools (currently hardcoded somewhere in a config file)

Swap:

  • Add eXOF and axlEUROC to swap form token list



Other:

  • Update website meta description to display eXOF in the list of stable available?

Function that sets output token to cUSD if input token is USDC variant

Acceptance Criteria

eXOF and axlEUROC can be chosen as tokens in the token lists

. When either axlEUROC or eXOF is chosen, the opposite token input field should default to the opposite token. e.g. When eXOF is chosen for input, the output should change to axlEUROC, and vice versa.

We can swap between axlEUROC and eXOF

UI Support for MU03 on Celo main net

Description
For MU03 the UI needs to be updated to support new exchanges.

Namely:

  • USDC/cBRL
  • USDC/cEUR
  • EUROC/cEUR

Acceptance Criteria

  • UI allows users to swap via the new exchanges on Mainnet

🚧
Blocked by:

🚧

Product analytics: bridges

We want to have an overview of MSAs that are brdiged from Celo to other chain.
Should include date from all know brdiges (Portal, Axelar, Allbridge)

The report should be visualised as a table with next columns:
Bridge name
Destination chain (?)
Total $ amount locked in bridge
$ volume of assets brdiged in 24h;
$ volume of assets brdiged in 24h;
$ volume of assets unbrdiged in 24h;
$ volume of assets unbrdiged in 24h;

Add notification banner to interface(mento-fi) with configurable text

Description
During the migration process, we will have two instances of the Mento interface available. One will allow users to use the legacy mento, this will be the existing mento-fi website, and the other will allow interactions with McMint. To keep users informed, we should add an information banner, which will direct users to a forum post detailing the changes

Example
(There's a newer version of bootstrap 4)
Image

Acceptance Criteria

  • Clickable banner is added to the mento.finance website with configurable text and link destination
  • Info banner displayed on mento fi with text "Mento is getting an upgrade.." with link to forum post

UI support for MU03 on test nets

Description
For MU03 the UI needs to be updated to support new exchanges.
Namely, USDC/cBRL, USDC/cEUR and EUROC/cEUR

Acceptance Criteria

  • UI allows users to swap via the new exchanges on Baklava
  • UI allows users to swap via the new exchanges on Alfajores

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.