added new chains, added select for token type

diekuche · Aug 14, 2023 · d33e819 · d33e819
1 parent f8f7508
commit d33e819
Show file tree

Hide file tree

Showing 16 changed files with 334 additions and 31 deletions.
diff --git a/src/components/CreatePage/CreatePage.module.css b/src/components/CreatePage/CreatePage.module.css
@@ -38,4 +38,35 @@
   font-size: 95px;
   color: rgba(115, 237, 201, 0.07);
   transform: rotate(-90deg);
+}
+
+.tokenTypeSelect {
+  display: flex;
+  color: white;
+  gap: 20px;
+  margin-bottom: 15px;
+}
+.tokenTypeSelect label span {
+  font-weight: 400;
+  font-size: 14px;
+  line-height: 18px;
+  color: rgba(246, 248, 254, 0.8);
+}
+.tokenTypeSelect label {
+  display: flex;
+  gap: 7px;
+}
+.tokenTypeSelect input {
+  margin: 0;
+  padding: 0;
+  padding-top: 3px;
+}
+
+.tabBox {
+  background: #12262d;
+  border: solid 1px rgba(115, 237, 201, 0.1);
+  border-radius: 0px 16px 16px;
+  backdrop-filter: blur(10px);
+  width: 100%;
+  padding: 35px 45px 35px 45px;
 }
diff --git a/src/components/CreatePage/CreatePage.tsx b/src/components/CreatePage/CreatePage.tsx
@@ -1,6 +1,6 @@
 /* eslint-disable no-await-in-loop */
 /* eslint-disable no-restricted-syntax */
-import { useRef, useState } from "react";
+import { useMemo, useRef, useState } from "react";
 import { Tabs, Tab } from "ui/CreatePage/Tabs";
 import NTT from "ui/CreatePage/NTT";
 import NFT from "ui/CreatePage/NFT";
@@ -23,6 +23,7 @@ const CreatePage = () => {
   const chain = useChain();
   const [creating, setCreating] = useState(false);
   const { account, connect, isConnected } = useAccount();
+  const [tokenType, setTokenType] = useState("cw20");
 
   const {
     addCw20Token,
@@ -196,22 +197,31 @@ const CreatePage = () => {
       }
       form.current?.reset();
     } catch (error) {
-      toast.error(error as string, {
+      toast(`${error}`, {
         type: "error",
       });
-      console.error("error when create token", error);
+      console.error("error when create token");
+      console.log(error);
     } finally {
       setCreating(false);
     }
   };
 
   const onCreateToken = (values: CreateFormValues) => {
-    if (chain.config.features?.includes("tokenfactory")) {
-      return onCreateFactoryToken(values);
+    if (tokenType === "cw20") {
+      return onCreateCw20Token(values);
     }
-    return onCreateCw20Token(values);
+    return onCreateFactoryToken(values);
   };
 
+  const tokenTypes = useMemo(() => [{
+    key: "cw20",
+    label: "CW20",
+  }].concat(chain.config.features?.includes("tokenfactory") ? [{
+    key: "tokenfactory",
+    label: "Tokenfactory",
+  }] : []), [chain]);
+
   return (
     <div className={styles.mainpage}>
       <div className={styles.group}>
@@ -224,13 +234,34 @@ const CreatePage = () => {
           <div className={styles.tabPageContent}>
             {selectedTabId === "token"
             && (
-            <TokenForm
-              isConnected={isConnected}
-              connect={connect}
-              creating={creating}
-              onCreate={onCreateToken}
-              ref={form}
-            />
+              <div className={styles.tabBox}>
+                {tokenTypes.length > 1 && (
+                <div className={styles.tokenTypeSelect}>
+                  {tokenTypes.map((tt) => (
+                    <label>
+                      <span>
+                        {tt.label}
+                      </span>
+                      <input
+                        name="token-type"
+                        type="radio"
+                        value={tt.key}
+                        onChange={(e) => setTokenType(e.target.value)}
+                        checked={tokenType === tt.key}
+                      />
+                    </label>
+                  ))}
+                </div>
+                )}
+                <TokenForm
+                  isLogoEnabled={tokenType === "cw20"}
+                  isConnected={isConnected}
+                  connect={connect}
+                  creating={creating}
+                  onCreate={onCreateToken}
+                  ref={form}
+                />
+              </div>
             )}
             {selectedTabId === "nft" && <NFT />}
             {selectedTabId === "ntt" && <NTT />}

diff --git a/src/components/PoolWindow/Deposit/Deposit.tsx b/src/components/PoolWindow/Deposit/Deposit.tsx
@@ -88,7 +88,7 @@ const Deposit = ({
       // No allowance for this account
       console.log("Error when deposit to pool", pool);
       console.log(e);
-      toast.error("Unknown error");
+      toast.error(`${e}`);
     }).finally(() => setProcessing(false));
   };
   return (
@@ -119,7 +119,11 @@ const Deposit = ({
           </div>
         </div>
         <div className={styles.secondStirngTwoField}>
-          <div className={styles.cash}>$0.00</div>
+          <div className={styles.cash}>
+            {tokenAmountToFloat(reserve1, token1.decimals)}
+            {" "}
+            {token1.symbol}
+          </div>
           <div className={styles.balance}>
             Balance:
             {" "}
@@ -153,7 +157,11 @@ const Deposit = ({
           </div>
         </div>
         <div className={styles.secondStirngTwoField}>
-          <div className={styles.cash}>$0.00</div>
+          <div className={styles.cash}>
+            {tokenAmountToFloat(reserve2, token2.decimals)}
+            {" "}
+            {token2.symbol}
+          </div>
           <div className={styles.balance}>
             Balance:
             {" "}

diff --git a/src/components/PoolWindow/PoolWindow.tsx b/src/components/PoolWindow/PoolWindow.tsx
@@ -27,6 +27,7 @@ const fetch = async (chain: Chain, account: Account, pool: PoolDetails) => {
     chain.query(USER_TOKEN_DETAILS(pool.token1, account.address)),
     chain.query(USER_TOKEN_DETAILS(pool.token2, account.address)),
   ]);
+  console.log("poolInfo", poolInfo);
   return {
     poolInfo,
     tokens,

diff --git a/src/components/Pools/AllPools.tsx b/src/components/Pools/AllPools.tsx
@@ -27,6 +27,7 @@ const AllPools = ({
   const [filter, setFilter] = useState("");
   const [page, setPage] = useState(1);
   const [poolForDeposit, setPoolForDeposit] = useState<PoolDetails | null>(null);
+
   const [modal, setModal] = useState(false);
   const pools = (
     filter
@@ -36,6 +37,7 @@ const AllPools = ({
       )
       : nonFilteredPools
   );
+
   const pagesCount = Math.ceil(pools.length / PAGE_SIZE);
 
   const toggleModal = () => {

diff --git a/src/components/Pools/Pools.tsx b/src/components/Pools/Pools.tsx
@@ -36,6 +36,7 @@ const fetchData = async (
       const token2Denom = (poolInfo.token2_denom as unknown as PoolDenom);
       const token1 = await chain.query(POOL_TOKEN_DETAILS(token1Denom));
       const token2 = await chain.query(POOL_TOKEN_DETAILS(token2Denom));
+      console.log("token1", token1, "token2", token2);
       return {
         address: poolAddress,
         index,

diff --git a/src/config/chains.ts b/src/config/chains.ts
@@ -3,8 +3,11 @@ import { juno } from "./chains/juno";
 import osmoTest from "./chains/osmo-test";
 import JunoTest from "./chains/juno-test";
 import Bostrom from "./chains/bostrom";
+import { DesmosMainnet } from "./chains/desmos";
+import { NeutronMainnet } from "./chains/neutron";
+import { ArchwayMainnet } from "./chains/archway";
 
-export type ChainId = "juno-1" | "uni-6" | "bostrom" | "osmo-test-5";
+export type ChainId = "juno-1" | "uni-6" | "bostrom" | "osmo-test-5" | "desmos-mainnet" | "neutron-1" | "archway-1";
 
 export type ChainConfig = Omit<ChainInfo, "chainId"> & {
   chainId: ChainId;
@@ -18,7 +21,7 @@ export const Chains: Record<ChainId, ChainConfig> = {
     isTestNet: true,
   } as ChainConfig,
   "juno-1": { ...juno, features: ["tokenfactory"] } as ChainConfig,
-  // "archway-1": { ...mainnetChains.archway } as ChainConfig,
+  "archway-1": { ...ArchwayMainnet } as ChainConfig,
   "uni-6": {
     ...JunoTest,
     chainId: "uni-6",
@@ -28,4 +31,14 @@ export const Chains: Record<ChainId, ChainConfig> = {
     ...Bostrom,
     chainId: "bostrom",
   },
+  "desmos-mainnet": {
+    ...DesmosMainnet,
+    chainId: "desmos-mainnet",
+    features: ["cosmwasm"],
+  },
+  "neutron-1": {
+    ...NeutronMainnet,
+    chainId: "neutron-1",
+    features: [],
+  },
 };
diff --git a/src/config/chains/archway.ts b/src/config/chains/archway.ts
@@ -0,0 +1,55 @@
+export const ArchwayMainnet = {
+  bech32Config: {
+    bech32PrefixAccAddr: "archway",
+    bech32PrefixAccPub: "archwaypub",
+    bech32PrefixConsAddr: "archwayvalcons",
+    bech32PrefixConsPub: "archwayvalconspub",
+    bech32PrefixValAddr: "archwayvaloper",
+    bech32PrefixValPub: "archwayvaloperpub",
+  },
+  bip44: {
+    coinType: 118,
+  },
+  chainId: "archway-1",
+  chainName: "Archway",
+  chainSymbolImageUrl: "https://raw.githubusercontent.com/chainapsis/keplr-chain-registry/main/images/archway/chain.png",
+  currencies: [
+    {
+      coinDecimals: 18,
+      coinDenom: "ARCH",
+      coinGeckoId: "archway",
+      coinMinimalDenom: "aarch",
+      coinImageUrl: "https://raw.githubusercontent.com/chainapsis/keplr-chain-registry/main/images/archway/aarch.png",
+    },
+  ],
+  features: ["cosmwasm"],
+  feeCurrencies: [
+    {
+      coinDecimals: 18,
+      coinDenom: "ARCH",
+      coinGeckoId: "archway",
+      coinMinimalDenom: "aarch",
+      gasPriceStep: {
+        low: 1000000000000,
+        average: 1500000000000,
+        high: 2000000000000,
+      },
+      coinImageUrl: "https://raw.githubusercontent.com/chainapsis/keplr-chain-registry/main/images/archway/aarch.png",
+    },
+  ],
+  rest: "https://api.mainnet.archway.io",
+  rpc: "https://rpc.mainnet.archway.io",
+  stakeCurrency: {
+    coinDecimals: 18,
+    coinDenom: "ARCH",
+    coinGeckoId: "archway",
+    coinMinimalDenom: "aarch",
+    coinImageUrl: "https://raw.githubusercontent.com/chainapsis/keplr-chain-registry/main/images/archway/aarch.png",
+  },
+  nodeProvider: {
+    name: "Phi Labs",
+    email: "[email protected]",
+    website: "https://philabs.xyz",
+  },
+  walletUrlForStaking: "https://wallet.keplr.app/chains/archway",
+};
diff --git a/src/config/chains/desmos.ts b/src/config/chains/desmos.ts
@@ -0,0 +1,53 @@
+import { ChainInfo } from "@keplr-wallet/types";
+import { chains } from "chain-registry";
+
+const chain = chains.find(({ chain_name }) => chain_name === "desmos");
+if (!chain) {
+  throw new Error(`Not found chain ${"desmos-mainnet"} in registry`);
+}
+export const DesmosMainnet: ChainInfo = {
+  chainId: "desmos-mainnet",
+  chainName: "Desmos",
+  chainSymbolImageUrl: "https://raw.githubusercontent.com/chainapsis/keplr-chain-registry/main/images/desmos-mainnet/chain.png",
+  rpc: "https://rpc.mainnet.desmos.network",
+  rest: "https://api.mainnet.desmos.network",
+  bip44: {
+    coinType: 852,
+  },
+  bech32Config: {
+    bech32PrefixAccAddr: "desmos",
+    bech32PrefixAccPub: "desmospub",
+    bech32PrefixValAddr: "desmosvaloper",
+    bech32PrefixValPub: "desmosvaloperpub",
+    bech32PrefixConsAddr: "desmosvalcons",
+    bech32PrefixConsPub: "desmosvalconspub",
+  },
+  currencies: [
+    {
+      coinDenom: "DSM",
+      coinMinimalDenom: "udsm",
+      coinDecimals: 6,
+      coinGeckoId: "desmos",
+    },
+  ],
+  feeCurrencies: [
+    {
+      coinDenom: "DSM",
+      coinMinimalDenom: "udsm",
+      coinDecimals: 6,
+      coinGeckoId: "desmos",
+      gasPriceStep: {
+        low: 0.01,
+        average: 0.03,
+        high: 0.05,
+      },
+    },
+  ],
+  stakeCurrency: {
+    coinDenom: "DSM",
+    coinMinimalDenom: "udsm",
+    coinDecimals: 6,
+    coinGeckoId: "desmos",
+  },
+  features: [],
+};