GithubHelp home page GithubHelp logo

zed-wong / mvg-bridge Goto Github PK

View Code? Open in Web Editor NEW
5.0 3.0 1.0 100.36 MB

💰 MVG bridge classic: A bridge interface for MVM Mainnet

Home Page: https://mvg.finance

License: GNU General Public License v3.0

SCSS 0.05% JavaScript 9.52% Vue 88.47% TypeScript 1.96%
mixin mvm

mvg-bridge's Introduction

MVG Bridge

https://bridge.mvg.fi

A bridge interface for MVM Mainnet powered by MVG.

How it works

For Tokens

Deposit

  1. from Mixin Mainnet

Transfer to proxy mainnet user.

  1. from Other Network

Deposit to proxy mainnet user.

Withdrawal

  1. to Mixin Mainnet

For assets other than ETH, Call the asset contract's transferWithExtra method with extra constructed by getExtra in ~/helpers/registry.js .

For ETH, Call the bridge contract's release method also with extra constructed by getExtra in ~/helpers/registry.js.

  1. to Other Network

Used a proxy service that automatically swaps the user's withdrawal asset to the fee asset. And do the withdrawal process when the swap is completed. The code is also open source.

For NFTs

Deposit

  1. from Mixin Mainnet

OAuth user first, filter UTXO through Mixin API with user's token, get each token information by API.

When depositing, selected token is an object contains token and output, these two will be used for creating a collectible request. After calling the createCollectibleRequest function, a code_id would be generated for user to pay. Then loop output with parameter state=signed, when output_id found, send raw tx to mainnet. The deposit is complete.

Withdrawal

  1. to Mixin Mainnet

Get user tokens from https://scan.mvm.dev API, filter ERC721 tokens, get tokenURI from contract, display token image.

When withdrawing, selected token is an object contains tokenId, contractAddress and token info fetched from tokenURI. contractAddress will be used to initialize contract instance. call safeTransferFrom(address,address,uint256,bytes) to withdraw NFT. Those arguments are (from:User Metamask Address,to:Mirror Contract Address,tokenId:Fetched from tokenOfOwnerByIndex of collectible contract,data: Metamask proxy user address + extra generated from /extra API).

Structure

bridge

File: /pages/index.vue

Route: /

Main page of the asset bridge.

nft

File: /pages/nft.vue

Route: /nft

NFT bridge.

Submit your application

Append your app in the following format to assets/applications.json, and create a pull request.

{
    "name": "",           // Name of your app
    "icon": "",           // Icon link of your app
    "link": "",           // Link to your app
    "description": ""     // One line description of your app
},

mvg-bridge's People

Contributors

zed-wong avatar

Stargazers

 avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar

Forkers

eouo

mvg-bridge's Issues

Load Mixin NFT procedure

Load Mixin NFT procedure:

  1. Load UTXO and token information after OAuth, sync with available NFTs

  2. Select returns the object of the NFT, { UTXO, token:{TOKEN} }, sync with storage

  3. When clicking on Deposit button, generate a sign request and QR. Then, loop UTXO with state === 'signed', if have same token id, submit mainnet tx.

  4. After submitted, show deposit success dialog.

Code format

The current code format is kind of shitty and hard to maintain. But considering the functionality of a bridge wouldn't change much, it's still acceptable. I might try to adapt better formatting in the next project.

Network bar

Alert user if is not connected to the from network (e.g. Deposit. From Ethereum, connected to Polygon/MVM; WIthdrawal, From MVM, connected to Ethereum)

Withdraw to Mixin user

Get recipient userID:

Pop up OAuth dialog, userMe

Or

getMixinContext, conversationID to userID

Balance format

Balance: 8.36600000
Remove unnecessary decimals

Check balance after withdrawal tx (after the close of withdrawal dialog).

Deposit qr code

Generate a mixin payment code when the target network is mixin network. So the app can trace the state afterwards.

Withdrawal dialogs

A dialog for every single step, make every step visible. Including errors. After the wallet payment confirmation.

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.