Merge pull request #5 from DefichainCommunity/main

add native token support to v2 and v3

Author: skutcher

frontend/Cargo.toml

@@ -16,6 +16,7 @@ log = "0.4"
 console_log = "1.0"
 alloy = {version = "1.1", default-features = false }
 dioxus-primitives = { git = "https://github.com/DioxusLabs/components", version = "0.0.1", default-features = false }
+enum-table = "2.1"
 
 [profile]
 

frontend/src/app.rs

@@ -139,9 +139,9 @@ pub fn App() -> Element {
 
             // ---- FIXED TOP BAR ----
             div {
-                class: "fixed top-0 left-0 w-full flex items-center justify-between
-                    px-8 py-4 backdrop-blur-sm bg-black/20 z-50",
-
+                // class: "fixed top-0 left-0 w-full flex items-center justify-between
+                //     px-8 py-4 backdrop-blur-sm bg-black/20 z-50",
+                class: "w-full flex flex-wrap items-center justify-between gap-2 p-4",
                 div { class: "relative",
                       h1 {
                           class: "text-xl font-bold tracking-wide text-defichain",
@@ -159,7 +159,7 @@ pub fn App() -> Element {
                 }
 
                 // Tabs
-                div { class: "flex space-x-4 mt-6",
+                div { class: "flex flex-wrap flex-grow justify-center gap-2 mt-6",
                       button {
                           class: button_class(Tab::Wrap, active_tab()),
                           onclick: move |_| active_tab.set(Tab::Wrap),

frontend/src/main.rs

@@ -1,4 +1,5 @@
 mod app;
+mod config;
 mod components;
 mod metamask;
 mod vanillaswap;

frontend/src/metamask.js

@@ -27,7 +27,9 @@ const wrapperRouterAbi = [
 // Uniswap V2
 const uniswapV2RouterAbi = [
     "function factory() view returns (address)",
-    "function swapExactTokensForTokensSupportingFeeOnTransferTokens(uint256 amountIn, uint256 amountOutMin, address[] calldata path, address to, uint256 deadline) returns (uint256[])"
+    "function swapExactTokensForTokensSupportingFeeOnTransferTokens(uint256 amountIn, uint256 amountOutMin, address[] calldata path, address to, uint256 deadline) returns (uint256[])",
+    "function swapExactTokensForETHSupportingFeeOnTransferTokens(uint256 amountIn, uint256 amountOutMin, address[] calldata path, address to, uint256 deadline)",
+    "function swapExactETHForTokensSupportingFeeOnTransferTokens(uint256 amountOutMin, address[] calldata path, address to, uint256 deadline) payable"
 ];
 const uniswapV2FactoryAbi = [
     "function allPairsLength() view returns (uint256)",
@@ -43,10 +45,12 @@ const uniswapV2PairAbi = [
 const uniswapV3PairAbi = [ "function slot0() view returns (uint160 sqrtPriceX96, int24, uint16, uint16, uint16, uint8, bool)", "function liquidity() view returns (uint128)" ];
 
 const uniswapV3RouterAbi = [
-  // exactInputSingle params in struct form
-    //"function exactInputSingle((address,address,uint24,address,uint256,uint256,uint160)) external payable returns (uint256 amountOut)",
     "function exactInput((bytes path,address recipient,uint256 amountIn,uint256 amountOutMinimum)) external payable returns (uint256 amountOut)"
 ];
+const wethAbi = [
+  "function withdraw(uint256 wad) external",
+  "function balanceOf(address owner) view returns (uint256)"
+];
 
 /**
  * helper JSON stringify that converts BigInt to string
@@ -102,14 +106,20 @@ export function js_on_accounts_changed(callback) {
 }
 
 // ERC20
-export async function js_get_token_balance(user, token) {
+export async function js_get_token_balance(user, token, isNative) {
     try {
         if (!window.ethereum) throw new Error("MetaMask not installed");
         await window.ethereum.request({ method: 'eth_requestAccounts' });
         let provider = new ethers.BrowserProvider(window.ethereum);
 
-        const erc20 = new ethers.Contract(token, erc20Abi, provider);
-        const [bal, decimals] = await Promise.all([erc20.balanceOf(user), 18]);
+        let bal, decimals;
+
+        if (isNative) {
+            [bal, decimals] = await Promise.all([provider.getBalance(user), 18]);
+        }else{
+            const erc20 = new ethers.Contract(token, erc20Abi, provider);
+            [bal, decimals] = await Promise.all([erc20.balanceOf(user), erc20.decimals()]);
+        }
         return {
             ok: true,
             value: JSON.stringify(ethers.formatUnits(bal, decimals))
@@ -337,37 +347,61 @@ export async function js_get_uniswap_v2_pairs(routerAddr) {
     }
 }
 
-export async function js_uniswap_v2_swap_tokens(tokenIn, tokenOut, amountIn, amountOutMin, routerAddress) {
+export async function js_uniswap_v2_swap_tokens(tokenIn, tokenOut, amountIn, amountOutMin, routerAddress, isNativeIn, isNativeOut) {
     try {
         if (!window.ethereum) throw new Error("MetaMask not installed");
         await window.ethereum.request({ method: 'eth_requestAccounts' });
         let provider = new ethers.BrowserProvider(window.ethereum);
         let signer = await provider.getSigner();
 
-
         const router = new ethers.Contract(routerAddress, uniswapV2RouterAbi, signer);
 
         const tokenInContract = new ethers.Contract(tokenIn, erc20Abi, signer);
         const decimals = await tokenInContract.decimals();
-        const amount_in_u256 = amountIn;//thers.parseUnits(amountIn,decimals);
-
-        // Approve
-        const allowance = await tokenInContract.allowance(signer, routerAddress);
-        if (allowance < amount_in_u256){
-            const approve_tx = await tokenInContract.approve(routerAddress, amount_in_u256);
-            await approve_tx.wait();
-        }
+        const amount_in_u256 = amountIn;
 
         const path = [tokenIn, tokenOut];
         const deadline = Math.floor(Date.now() / 1000) + 60 * 10;
 
-        const tx = await router.swapExactTokensForTokensSupportingFeeOnTransferTokens(
-            amountIn,
-            amountOutMin,
-            path,
-            await signer.getAddress(),
-            deadline,
-        );
+        let tx;
+        if (isNativeIn){
+            tx = await router.swapExactETHForTokensSupportingFeeOnTransferTokens(
+                amountOutMin,
+                path,
+                await signer.getAddress(),
+                deadline,
+                {
+                    value: amountIn
+                }
+            );
+        }else{
+            // Approve
+            const allowance = await tokenInContract.allowance(signer, routerAddress);
+            if (allowance < amount_in_u256){
+                const approve_tx = await tokenInContract.approve(routerAddress, amount_in_u256);
+                await approve_tx.wait();
+            }
+
+
+            if (isNativeOut){
+                tx = await router.swapExactTokensForETHSupportingFeeOnTransferTokens(
+                    amountIn,
+                    amountOutMin,
+                    path,
+                    await signer.getAddress(),
+                    deadline,
+                );
+            }else{
+                tx = await router.swapExactTokensForTokensSupportingFeeOnTransferTokens(
+                    amountIn,
+                    amountOutMin,
+                    path,
+                    await signer.getAddress(),
+                    deadline,
+                );
+            }
+
+        }
         const receipt = await tx.wait();
 
         return {
@@ -428,7 +462,7 @@ function encodePath(tokenIn, fee, tokenOut) {
     ]);
 }
 
-export async function js_uniswap_v3_swap_tokens(tokenIn, tokenOut, amountIn, amountOutMin, fee, routerAddress) {
+export async function js_uniswap_v3_swap_tokens(tokenIn, tokenOut, amountIn, amountOutMin, fee, routerAddress, isNativeIn, isNativeOut) {
     try {
         if (!window.ethereum) throw new Error("MetaMask not installed");
         await window.ethereum.request({ method: 'eth_requestAccounts' });
@@ -450,17 +484,23 @@ export async function js_uniswap_v3_swap_tokens(tokenIn, tokenOut, amountIn, amo
         }
 
         const path = encodePath(tokenIn,fee,tokenOut);
-        console.log("Path len ",path.length);
         const recipient = await signer.getAddress();
         const params = {
             path:path,
             recipient:recipient,
             amountIn:amount_in_u256,
             amountOutMinimum: amountOutMin
         };
-        const tx = await router.exactInput(params,{value: 0n});
+        const tx = await router.exactInput(params,isNativeIn ? { value: amountIn } : {});
         const receipt = await tx.wait();
-
+        if (isNativeOut) {
+            const wethContract = new ethers.Contract(tokenOut, wethAbi, signer);
+            const balance = await wethContract.balanceOf(recipient);
+            if (balance > 0n) {
+                const unwrapTx = await wethContract.withdraw(balance);
+                await unwrapTx.wait();
+            }
+        }
         return {
             ok: true,
             value: JSON.stringify(`${receipt.hash}`)

frontend/src/metamask.rs

@@ -15,7 +15,7 @@ extern "C" {
     async fn js_connect_metamask() -> JsValue;
     pub fn js_on_chain_changed(callback: &Closure<dyn FnMut(u32)>);
     pub fn js_on_accounts_changed(callback: &Closure<dyn FnMut(Vec<JsValue>)>);
-    async fn js_get_token_balance(user: &str, token: &str) -> JsValue;
+    async fn js_get_token_balance(user: &str, token: &str, is_native: bool) -> JsValue;
 }
 
 pub fn js_parse<T: DeserializeOwned>(js: JsValue) -> Result<T, String> {
@@ -53,6 +53,6 @@ pub async fn connect_metamask()  -> Result<MetamaskInfo, Box<dyn Error>>{
         js_try!(js_connect_metamask() => MetamaskInfo)
 }
 
-pub async fn get_token_balance(user: &str, token: &str) -> Result<String,Box<dyn Error>>{
-    js_try!(js_get_token_balance(user, token) => String)
+pub async fn get_token_balance(user: &str, token: &str, is_native: bool) -> Result<String,Box<dyn Error>>{
+    js_try!(js_get_token_balance(user, token, is_native) => String)
 }

frontend/src/metamask/uniswap_v2.rs

@@ -13,7 +13,7 @@ extern "C" {
     // uniswap v2
     async fn js_get_uniswap_v2_pairs(router_address: &str) -> JsValue;
     async fn js_uniswap_v2_swap_tokens(token_in: &str, token_out: &str, amount_in: &str,
-                            amount_out_min: &str, router_address: &str) -> JsValue;
+                            amount_out_min: &str, router_address: &str, is_native_in: bool, is_native_out: bool) -> JsValue;
 }
 
 
@@ -43,6 +43,8 @@ pub async fn uniswap_v2_swap_tokens(
     amount_in: &str,
     amount_out_min: &str,
     router_address: &str,
+    is_native_in: bool,
+    is_native_out: bool,
 ) -> Result<String, String> {
-    js_try!(js_uniswap_v2_swap_tokens(token_in,token_out,amount_in,amount_out_min,router_address) => String)
+    js_try!(js_uniswap_v2_swap_tokens(token_in,token_out,amount_in,amount_out_min,router_address, is_native_in, is_native_out) => String)
 }

frontend/src/metamask/uniswap_v3.rs

@@ -13,7 +13,7 @@ extern "C" {
     //uniswap v3
     async fn js_get_uniswap_v3_pool_states(pools: Vec<JsValue>) -> JsValue;
     async fn js_uniswap_v3_swap_tokens(token_in: &str, token_out: &str, amount_in: &str,
-                            amount_out_min: &str, fee: &str, router_address: &str) -> JsValue;
+                            amount_out_min: &str, fee: &str, router_address: &str, is_native_in: bool, is_native_out: bool) -> JsValue;
 }
 
 
@@ -40,6 +40,8 @@ pub async fn uniswap_v3_swap_tokens(
     amount_out_min: &str,
     fee: &str,
     router_address: &str,
+    is_native_in: bool,
+    is_native_out: bool,
 ) -> Result<String, String> {
-    js_try!(js_uniswap_v3_swap_tokens(token_in,token_out,amount_in,amount_out_min,fee,router_address) => String)
+    js_try!(js_uniswap_v3_swap_tokens(token_in,token_out,amount_in,amount_out_min,fee,router_address, is_native_in, is_native_out) => String)
 }

frontend/src/vanillaswap/pools_v2.rs

@@ -4,56 +4,12 @@ use alloy::primitives::{utils::parse_units,U256};
 use crate::components::switch::{Switch, SwitchThumb};
 use crate::metamask::uniswap_v2::{V2PairInfo, get_uniswap_v2_pairs};
 use crate::wallet_context::use_wallet;
-use super::v2::use_v2_pools;
-
-fn is_zero_or_empty(v: &Option<String>) -> bool {
-    match v.as_deref() {
-        None => true,
-        Some("") => true,
-        Some("0") => true,
-        Some("0.0") => true,
-        Some(s) => {
-            // also handle cases like "0.0000"
-            s.trim().parse::<f64>().map(|n| n == 0.0).unwrap_or(false)
-        }
-    }
-}
+use super::v2::{use_v2_pools, is_zero_or_empty};
 
 #[component]
 pub fn PoolV2Pairs() -> Element {
-    // let mut is_loading = use_signal(|| false);
-    // let mut pairs = use_signal(|| Vec::<PairInfo>::new());
-    // let mut error = use_signal(|| None::<String>);
     let mut show_zero_liq = use_signal(|| false);
-    // let mut router_address = use_signal(|| "".to_string());
     let pools = use_v2_pools();
-    // use_effect(move || {
-    //     let wallet = use_wallet();
-    //     let _info = (wallet.info)().clone();
-    //     spawn_local(async move {
-    //         let info =( wallet.info)().clone();
-    //         log::debug!("Chain ID:{}", info.chain_id);
-    //         pairs.set(vec![]);
-    //         if info.chain_id == 1130{ // MainNet
-    //             router_address.set("0x3E8C92491fc73390166BA00725B8F5BD734B8fba".to_string());
-    //         }else if  info.chain_id == 1131{ // TestNet
-    //             router_address.set("0x79208eADd9FbC29116108433a38Af62D0fD83850".to_string());
-    //         }else{
-    //             router_address.set("".to_string());
-    //         }
-
-    //         if !info.address.is_empty() && !router_address.is_empty() {
-    //             is_loading.set(true);
-    //             log::debug!("Router address {}", router_address);
-    //             match get_uniswap_v2_pairs(&router_address()).await {
-    //                 Ok(list) => pairs.set(list),
-    //                 Err(e) => error.set(Some(e.to_string())),
-    //             }
-    //             is_loading.set(false);
-
-    //         }
-    //     })
-    // });
 
     rsx! {
         div { class: "p-8 mt-12 glass w-full max-w-4xl flex flex-col gap-6 items-stretch flex-col-sm",
@@ -78,12 +34,6 @@ pub fn PoolV2Pairs() -> Element {
               div { class: "flex flex-col gap-3",
                     for pair in pools.pairs.read().iter().filter(|p| {
                         show_zero_liq() || (!is_zero_or_empty(&p.reserve0) && !is_zero_or_empty(&p.reserve1))
-                        // if show_zero_liq() {
-                        //     true
-                        // } else {
-                        //     !is_zero_or_empty(&p.reserve0) &&
-                        //     !is_zero_or_empty(&p.reserve1)
-                        // }
                     }) {
                         div { class: "p-4 bg-gray-900/60 border border-gray-800 rounded-xl shadow-md
                                     flex flex-col gap-2 hover:bg-gray-900 transition-colors duration-200",