Merge branch 'main' of https://github.com/oraidex/oraiswap-frontend i…

…nto feat/connect-tron-owallet
oraidex · Jan 15, 2025 · 3cb804f · 3cb804f
2 parents f1fd011 + 71678b6
commit 3cb804f
Show file tree

Hide file tree

Showing 280 changed files with 6,145 additions and 7,866 deletions.
diff --git a/.env.example b/.env.example
@@ -7,7 +7,7 @@ VITE_APP_BASE_API_URL=https://api.oraidex.io
 VITE_APP_KADO_API_KEY=df0d2b3f-d829-4453-a4f6-1d6e8870e8f4
 VITE_APP_MIX_PANEL_ENVIRONMENT=acbafd21a85654933cbb0332c5a6f4f8
 VITE_APP_STRAPI_BASE_URL=https://nice-fireworks-d26703b63e.strapiapp.com
-
+VITE_APP_SENTRY_ENVIRONMENT=production
 VITE_APP_SOLANA_RPC=
 VITE_APP_SOLANA_WEBSOCKET=
 VITE_APP_SOLANA_RELAYER_ADDRESS=
diff --git a/.vscode/settings.json b/.vscode/settings.json
@@ -15,5 +15,8 @@
   },
   "[shellscript]": {
     "editor.defaultFormatter": "foxundermoon.shell-format"
+  },
+  "[typescriptreact]": {
+    "editor.defaultFormatter": "esbenp.prettier-vscode"
   }
 }
diff --git a/index.html b/index.html
@@ -4,15 +4,15 @@
     <meta charset="utf-8" />
     <link rel="icon" href="/favicon.svg" />
     <!-- Global site tag (gtag.js) - Google Analytics -->
-    <script async src="https://www.googletagmanager.com/gtag/js?id=G-8T22XRLHXY"></script>
+    <!-- <script async src="https://www.googletagmanager.com/gtag/js?id=G-8T22XRLHXY"></script>
     <script>
       window.dataLayer = window.dataLayer || [];
       function gtag() {
         dataLayer.push(arguments);
       }
       gtag('js', new Date());
       gtag('config', 'G-8T22XRLHXY');
-    </script>
+    </script> -->
     <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no" />
     <title>%VITE_APP_SITE_TITLE%</title>
 
@@ -33,7 +33,6 @@
     <meta name="twitter:title" content="%VITE_APP_SITE_TITLE%" />
     <meta name="twitter:description" content="%VITE_APP_SITE_DESC%" />
     <meta name="twitter:image" content="%PUBLIC_URL%/thumbnail_oraidex_final.png" />
-
     <meta property="twitter:url" content="%PUBLIC_URL%" />
     <meta property="twitter:domain" content="%PUBLIC_URL%" />
     <script>
@@ -43,9 +42,8 @@
   </head>
   <body>
     <div id="oraiswap"></div>
-    <script src="https://do.featurebase.app/js/sdk.js" id="featurebase-sdk"></script>
     <script type="module" src="/src/index.tsx"></script>
-    <script type="text/javascript">
+    <!-- <script type="text/javascript">
       (function (c, l, a, r, i, t, y) {
         c[a] =
           c[a] ||
@@ -58,6 +56,6 @@
         y = l.getElementsByTagName(r)[0];
         y.parentNode.insertBefore(t, y);
       })(window, document, 'clarity', 'script', 'jnp2ipoqck');
-    </script>
+    </script> -->
   </body>
 </html>
diff --git a/package.json b/package.json
@@ -20,14 +20,17 @@
     "@lucky-canvas/react": "^0.1.13",
     "@oraichain/bitcoin-bridge-contracts-sdk": "^1.1.9",
     "@oraichain/bitcoin-bridge-lib-js": "^1.1.9",
-    "@oraichain/common": "1.2.4",
     "@oraichain/common-contracts-sdk": "^1.0.31",
     "@oraichain/ethereum-multicall": "^1.0.2",
     "@oraichain/kawaiiverse-txs": "^0.0.3",
     "@oraichain/orai-bitcoin": "2.0.0",
+    "@oraichain/oraidex-common": "2.0.6",
+    "@oraichain/orai-token-inspector": "^0.2.7",
     "@oraichain/oraidex-common-ui": "1.0.11",
     "@oraichain/oraidex-contracts-sdk": "1.0.55",
-    "@oraichain/oraidex-universal-swap": "1.1.25",
+    "@oraichain/oraidex-universal-swap": "1.3.1",
+    "@oraichain/oraiswap-v3": "1.2.0-beta26",
+    "@oraichain/proto": "^0.0.7",
     "@oraichain/ton-bridge-contracts": "^0.15.8",
     "@oraichain/tonbridge-contracts-sdk": "^1.3.1",
     "@oraichain/tonbridge-sdk": "^1.3.6",
@@ -98,9 +101,8 @@
     "@keplr-wallet/types": "^0.11.38",
     "@oraichain/babel-plugin-operator-overloading": "^1.0.4",
     "@oraichain/common-contracts-build": "1.0.35",
-    "@oraichain/cw-simulate": "^2.8.75",
+    "@oraichain/cw-simulate": "^2.8.108",
     "@oraichain/oraidex-contracts-build": "1.0.22",
-    "@oraichain/oraiswap-v3": "^1.1.2",
     "@sentry/webpack-plugin": "^2.10.3",
     "@testing-library/jest-dom": "^6.5.0",
     "@types/classnames": "^2.2.10",
@@ -136,7 +138,7 @@
   "scripts": {
     "analyze": "source-map-explorer 'build/static/js/*.js'",
     "start": "vite",
-    "build": "NODE_OPTIONS='--max-old-space-size=12288' vite build",
+    "build": "NODE_OPTIONS='--max-old-space-size=15000' vite build",
     "serve": "vite serve",
     "ts-check": "tsc --noEmit",
     "postinstall": "patch-package",
@@ -167,7 +169,9 @@
     "bitcoinjs-lib": "5.2.0",
     "axios": "0.26.1",
     "@sentry/react": "7.99.0",
-    "@oraichain/oraidex-common": "1.1.40"
+    "@cosmjs/amino": "0.32.4",
+    "@oraichain/oraidex-common": "2.0.9",
+    "@oraichain/common": "1.2.8"
   },
   "overrides": {
     "cosmjs-types@>0.7.0 <0.8.0": "0.7.1",

diff --git a/public/mascot.png b/public/mascot.png
diff --git a/public/oraiswap_v3_wasm_bg.wasm b/public/oraiswap_v3_wasm_bg.wasm
diff --git a/src/assets/gif/loading-page.gif b/src/assets/gif/loading-page.gif
diff --git a/src/assets/icons/ic_copy_address.svg b/src/assets/icons/ic_copy_address.svg
diff --git a/src/assets/icons/ic_create_pool_v2.svg b/src/assets/icons/ic_create_pool_v2.svg
diff --git a/src/assets/icons/ic_create_pool_v3.svg b/src/assets/icons/ic_create_pool_v3.svg
diff --git a/src/assets/icons/ic_verified.svg b/src/assets/icons/ic_verified.svg
diff --git a/src/assets/icons/iconoir_coins-add.svg b/src/assets/icons/iconoir_coins-add.svg
diff --git a/src/assets/icons/ion_chevron-up.svg b/src/assets/icons/ion_chevron-up.svg
diff --git a/src/assets/icons/ion_trash-sharp.svg b/src/assets/icons/ion_trash-sharp.svg
diff --git a/src/assets/icons/search-svg-light.svg b/src/assets/icons/search-svg-light.svg
diff --git a/src/assets/icons/search-svg.svg b/src/assets/icons/search-svg.svg
diff --git a/src/assets/images/christmas/balloon.gif b/src/assets/images/christmas/balloon.gif
diff --git a/src/assets/images/christmas/sleigh.gif b/src/assets/images/christmas/sleigh.gif
diff --git a/src/components/DragDropImage/index.module.scss b/src/components/DragDropImage/index.module.scss
@@ -0,0 +1,51 @@
+.form-file-upload {
+  height: 16rem;
+  width: 28rem;
+  max-width: 100%;
+  text-align: center;
+  position: relative;
+
+  .input-file-upload {
+    display: none;
+  }
+
+  .label-file-upload {
+    height: 100%;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    border-width: 2px;
+    border-radius: 1rem;
+    border-style: dashed;
+    border-color: #cbd5e1;
+    background-color: #f8fafc;
+
+    .upload-button {
+      cursor: pointer;
+      padding: 0.25rem;
+      font-size: 1rem;
+      border: none;
+      font-family: 'Oswald', sans-serif;
+      background-color: transparent;
+
+      &:hover {
+        text-decoration-line: underline;
+      }
+    }
+
+    .drag-active {
+      background-color: #ffffff;
+    }
+  }
+
+  .drag-file-element {
+    position: absolute;
+    width: 100%;
+    height: 100%;
+    border-radius: 1rem;
+    top: 0px;
+    right: 0px;
+    bottom: 0px;
+    left: 0px;
+  }
+}
diff --git a/src/components/DragDropImage/index.tsx b/src/components/DragDropImage/index.tsx
@@ -0,0 +1,64 @@
+import React from "react";
+import styles from "./index.module.scss";
+import cn from 'classnames/bind';
+
+const cx = cn.bind(styles);
+
+const ImageInput = ({ }) => {
+    const [dragActive, setDragActive] = React.useState(false);
+    const [imageUrl, setImageUrl] = React.useState('');
+    const inputRef = React.useRef(null);
+
+    const handleDrag = function (e) {
+        e.preventDefault();
+        e.stopPropagation();
+        if (e.type === "dragenter" || e.type === "dragover") {
+            setDragActive(true);
+        } else if (e.type === "dragleave") {
+            setDragActive(false);
+        }
+    };
+
+    const handleDrop = function (e) {
+        e.preventDefault();
+        e.stopPropagation();
+        setDragActive(false);
+        if (e.dataTransfer.files && e.dataTransfer.files[0]) {
+            // handleFiles(e.dataTransfer.files);
+
+        }
+    };
+
+    const handleChange = function (e) {
+        console.log("change", e.target.files)
+        e.preventDefault();
+
+        if (e.target.files && e.target.files[0]) {
+            // handleFiles(e.target.files);
+            console.log(e.target.files[0]);
+            setImageUrl(URL.createObjectURL(e.target.files[0]));
+        }
+    };
+
+    const onButtonClick = () => {
+        inputRef.current.click();
+    };
+
+    return (
+        <form className="form-file-upload" onDragEnter={handleDrag} onSubmit={(e) => e.preventDefault()}>
+            <input ref={inputRef} type="file" className="input-file-upload" multiple={true} onChange={handleChange} />
+            <label className={cx("label-file-upload", dragActive ? "drag-active" : "")} htmlFor="input-file-upload">
+                <div>
+                    {/* <p>Drag and drop your file here or</p>
+                    <button className="upload-button" onClick={onButtonClick}>Upload a file</button> */}
+                </div>
+                <div>
+                    <img src={imageUrl} alt="preview picture" width={150} height={150} />
+                </div>
+            </label>
+            {dragActive && <div className="drag-file-element" onDragEnter={handleDrag} onDragLeave={handleDrag} onDragOver={handleDrag} onDrop={handleDrop}></div>}
+        </form>
+    );
+}
+
+export default ImageInput;
diff --git a/src/components/Input.tsx b/src/components/Input.tsx
@@ -1,4 +1,4 @@
-import React from 'react';
+import React, { forwardRef } from 'react';
 import classNames from 'classnames';
 import styles from './Input.module.scss';
 import debounce from 'lodash/debounce';
@@ -7,16 +7,18 @@ export type InputProps = Input & {
   onSearch?: (text: string) => void;
   isBorder?: boolean;
   theme?: string;
+  ref?: React.Ref<HTMLInputElement>;
 };
 
-const Input: React.FC<InputProps> = ({ className, onSearch, ...props }) => (
+const Input = forwardRef<HTMLInputElement, InputProps>(({ className, onSearch, ...props }, ref) => (
   <input
+    ref={ref}
     className={classNames(styles.input, className)}
     onChange={debounce((e) => {
       onSearch?.(e.target.value);
     }, 500)}
     {...props}
   />
-);
+));
 
 export default Input;
diff --git a/src/components/InputSwap/InputSwap.tsx b/src/components/InputSwap/InputSwap.tsx
@@ -1,12 +1,12 @@
 import styles from './InputSwap.module.scss';
 import cn from 'classnames/bind';
 import NumberFormat from 'react-number-format';
-import { CoinIcon, TokenItemType } from '@oraichain/oraidex-common';
+import { TokenItemType } from '@oraichain/oraidex-common';
 
 const cx = cn.bind(styles);
 
 interface InputSwapProps {
-  Icon: CoinIcon;
+  Icon: any;
   setIsSelectFrom: (value: boolean) => void;
   token: TokenItemType;
   amount: number;

diff --git a/src/components/LuckyDraw/index.tsx b/src/components/LuckyDraw/index.tsx
@@ -32,13 +32,13 @@ import {
 import { handleErrorTransaction } from 'helper';
 import OraiXLightIcon from 'assets/icons/oraix_light.svg?react';
 import CongratulationLottie from 'assets/lottie/congratulation.json';
-import { network } from 'config/networks';
 import classNames from 'classnames';
 import Loader from 'components/Loader';
 import Lottie from 'lottie-react';
 import InputRange from 'pages/CoHarvest/components/InputRange';
 import { numberWithCommas } from 'pages/Pools/helpers';
 import { Spin } from './luckyDrawClient/LuckyWheelContract.types';
+import { network } from 'initCommon';
 
 const LuckyDraw: FC<{}> = () => {
   const [address] = useConfigReducer('address');
@@ -71,7 +71,7 @@ const LuckyDraw: FC<{}> = () => {
 
   const amounts = useSelector((state: RootState) => state.token.amounts);
   const loadOraichainToken = useLoadOraichainTokens();
-  const balance = amounts['oraix'];
+  const balance = amounts['cw20:orai1lus0f0rhx8s03gdllx2n6vhkmf0536dv57wfge:ORAIX'];
 
   const { spinConfig } = useLuckyDrawConfig();
   const { fee = LUCKY_DRAW_FEE, feeDenom = ORAIX_CONTRACT, feeToken } = spinConfig || {};