Merge pull request #995 from oraichain/fix/ton-amount

Fix/ton-amount
oraichain · Sep 12, 2024 · 23fdb90 · 23fdb90
2 parents 88ec977 + 67657fc
commit 23fdb90
Show file tree

Hide file tree

Showing 27 changed files with 29,858 additions and 437 deletions.
diff --git a/package.json b/package.json
@@ -13,7 +13,7 @@
 		"analyze": "source-map-explorer 'build/static/js/*.js'",
 		"vendor": "node scripts/vendor.js",
 		"start": "cross-env GENERATE_SOURCEMAP=false react-app-rewired start",
-		"postinstall": "patch-package",
+		"postinstall": "patch-package && node script.js",
 		"build": "cross-env GENERATE_SOURCEMAP=false DISABLE_ESLINT_PLUGIN=true react-app-rewired build",
 		"delete-maps": "yarn run delete-references-to-map-files && yarn run delete-map-files",
 		"delete-map-files": "find ./build -name '*.map' -delete",
@@ -39,7 +39,7 @@
 		"@material-ui/lab": "^4.0.0-alpha.57",
 		"@material-ui/styles": "^4.9.0",
 		"@oraichain/cosmos-messages": "0.0.3",
-		"@oraichain/oraidex-common": "^1.0.43",
+		"@oraichain/oraidex-common": "^1.1.3",
 		"@sentry/react": "^7.36.0",
 		"@sentry/tracing": "^7.36.0",
 		"@sentry/webpack-plugin": "^1.20.0",
@@ -134,6 +134,9 @@
 	"eslintConfig": {
 		"extends": "react-app"
 	},
+	"resolutions": {
+		"@injectivelabs/sdk-ts": "1.12.1"
+	},
 	"browserslist": {
 		"production": [
 			">0.2%",

diff --git a/public/index.html b/public/index.html
@@ -172,16 +172,6 @@
 				font-weight: bold;
 			}
 		</style>
-		<script>
-			window.dataLayer = window.dataLayer || [];
-
-			function gtag() {
-				dataLayer.push(arguments);
-			}
-			gtag("js", new Date());
-
-			gtag("config", "G-4MJXJPXQK7");
-		</script>
 	</head>
 
 	<body>

diff --git a/script.js b/script.js
@@ -0,0 +1,14 @@
+const fs = require("fs");
+
+const fix = dirPath => {
+	if (!fs.existsSync(dirPath)) return;
+	for (const dir of fs.readdirSync(dirPath)) {
+		const jsonFile = dirPath + dir + "/package.json";
+		const packageJson = JSON.parse(fs.readFileSync(jsonFile).toString());
+		packageJson.module = "dist/cjs/index.js";
+		fs.writeFileSync(jsonFile, JSON.stringify(packageJson, null, 2));
+		fix(dirPath + dir + "/" + dirPath);
+	}
+};
+
+fix("node_modules/@injectivelabs/");
diff --git a/src/components/Account/AssetsTable/AssetsTable.js b/src/components/Account/AssetsTable/AssetsTable.js
@@ -8,6 +8,7 @@ import styles from "./AssetsTable.module.scss";
 import { useSelector } from "react-redux";
 import { oraichainTokens } from "@oraichain/oraidex-common/build/token";
 import { toDisplay } from "@oraichain/oraidex-common/build/helper";
+import consts from "src/constants/consts";
 
 const cx = classNames.bind(styles);
 
@@ -31,6 +32,7 @@ export const getHeaderRow = () => {
 
 const AssetsTable = memo(({ data = [] }) => {
 	const priceTokens = useSelector(state => state.blockchain.priceTokens);
+
 	const getDataRows = data => {
 		if (!Array.isArray(data)) {
 			return [];
@@ -39,6 +41,7 @@ const AssetsTable = memo(({ data = [] }) => {
 		return data.map(item => {
 			const validatorAddressSplit = item?.validator_address?.split("/")?.[0] || item?.validator_address;
 			let tokenInfo = amountDecimal18.find(e => e.address?.toLowerCase() == validatorAddressSplit?.toLowerCase());
+
 			const tokenInOraichain = oraichainTokens.find(token => {
 				const arrIncludes = [token?.denom?.toLowerCase(), token?.name?.toLowerCase()];
 				return (
@@ -50,6 +53,7 @@ const AssetsTable = memo(({ data = [] }) => {
 			});
 
 			const tokenUsd = priceTokens[tokenInOraichain?.coinGeckoId] || 0;
+
 			if (!tokenInfo && item.validator_address.includes("erc20")) {
 				tokenInfo = {
 					name: "ERC20",
@@ -68,11 +72,17 @@ const AssetsTable = memo(({ data = [] }) => {
 					decimal: 18,
 				};
 			}
-			const decimalOfToken = tokenInfo?.decimal || tokenInOraichain?.decimals || 6;
+			const decimalOfToken = item.base_denom === consts.TON_TOKENFACTORY_DENOM ? 9 : tokenInfo?.decimal || tokenInOraichain?.decimals || 6;
 			const validatorDataCell = _.isNil(item?.validator_address) ? (
 				<div className={cx("align-left")}>-</div>
 			) : (
-				<div className={cx("denom-data-cell", "align-left")}>{tokenInfo ? tokenInfo.name : reduceStringAssets(item.validator_address, 30, 0)}</div>
+				<div className={cx("denom-data-cell", "align-left")}>
+					{tokenInfo
+						? tokenInfo.name
+						: item.base_denom === consts.TON_TOKENFACTORY_DENOM
+						? reduceStringAssets(item.validator_address, 15, 15)
+						: reduceStringAssets(item.validator_address, 30, 0)}
+				</div>
 			);
 
 			const amountDataCell =
@@ -82,7 +92,13 @@ const AssetsTable = memo(({ data = [] }) => {
 					<div className={cx("amount-data-cell", "align-right")}>
 						<div className={cx("amount")}>
 							<span className={cx("amount-value")}>{formatOrai(item.amount, Math.pow(10, decimalOfToken))}</span>
-							<span className={cx("amount-denom")}>{tokenInfo ? tokenInfo?.name : reduceStringAssets(item.denom, 7, 3)}</span>
+							<span className={cx("amount-denom")}>
+								{tokenInfo
+									? tokenInfo?.name
+									: item.base_denom === consts.TON_TOKENFACTORY_DENOM
+									? item.base_denom.split("/")[2]
+									: reduceStringAssets(item.denom, 7, 3)}
+							</span>
 						</div>
 					</div>
 				);

diff --git a/src/components/Account/DelegationCard/DelegationCard.js b/src/components/Account/DelegationCard/DelegationCard.js
@@ -1,7 +1,7 @@
-import React, {memo, useState, useRef} from "react";
-import {useGet} from "restful-react";
+import React, { memo, useState, useRef } from "react";
+import { useGet } from "restful-react";
 import classNames from "classnames/bind";
-import {useTheme} from "@material-ui/core/styles";
+import { useTheme } from "@material-ui/core/styles";
 import useMediaQuery from "@material-ui/core/useMediaQuery";
 import consts from "src/constants/consts";
 import DelegationTable from "src/components/Account/DelegationTable";
@@ -11,10 +11,11 @@ import DelegationCardListSkeleton from "src/components/Account/DelegationCardLis
 import Pagination from "src/components/common/Pagination";
 import NoResult from "src/components/common/NoResult";
 import styles from "./DelegationCard.module.scss";
+import { formatOrai } from "src/helpers/helper";
 
 const cx = classNames.bind(styles);
 
-const DelegationCard = memo(({account = ""}) => {
+const DelegationCard = memo(({ account = "" }) => {
 	const theme = useTheme();
 	const isLargeScreen = useMediaQuery(theme.breakpoints.up("lg"));
 	const [pageId, setPageId] = useState(1);
@@ -25,7 +26,7 @@ const DelegationCard = memo(({account = ""}) => {
 	};
 
 	const path = `${consts.API.DELEGATIONS}/${account}`;
-	const {data, loading, error} = useGet({
+	const { data, loading, error } = useGet({
 		path: path,
 	});
 
@@ -45,8 +46,13 @@ const DelegationCard = memo(({account = ""}) => {
 				totalPagesRef.current = null;
 			}
 
-			if (Array.isArray(data?.data) && data.data.length > 0) {
-				tableSection = isLargeScreen ? <DelegationTable data={data.data} /> : <DelegationCardList data={data.data} />;
+			const delegateData =
+				Array.isArray(data?.data) && data.data.length > 0
+					? data?.data.filter(delegate => parseInt(delegate.amount) > 0 || parseFloat(formatOrai(delegate.reward)) >= parseFloat(formatOrai(1)))
+					: [];
+
+			if (delegateData.length > 0) {
+				tableSection = isLargeScreen ? <DelegationTable data={delegateData} /> : <DelegationCardList data={delegateData} />;
 			} else {
 				tableSection = <NoResult />;
 			}

diff --git a/src/components/DelegatedValidator/DelegatedClaim/ClaimTable/ClaimTable.js b/src/components/DelegatedValidator/DelegatedClaim/ClaimTable/ClaimTable.js
@@ -1,13 +1,13 @@
 /* eslint-disable react-hooks/exhaustive-deps */
-import React, {memo, useMemo, useState} from "react";
-import {NavLink} from "react-router-dom";
-import {useSelector, useDispatch} from "react-redux";
+import React, { memo, useMemo, useState } from "react";
+import { NavLink } from "react-router-dom";
+import { useSelector, useDispatch } from "react-redux";
 import classNames from "classnames/bind";
 import consts from "src/constants/consts";
-import {_} from "src/lib/scripts";
-import {formatOrai} from "src/helpers/helper";
-import {tableThemes} from "src/constants/tableThemes";
-import {logoBrand} from "src/constants/logoBrand";
+import { _ } from "src/lib/scripts";
+import { formatOrai } from "src/helpers/helper";
+import { tableThemes } from "src/constants/tableThemes";
+import { logoBrand } from "src/constants/logoBrand";
 import ThemedTable from "src/components/common/ThemedTable";
 
 import giftIcon from "src/assets/wallet/gift.svg";
@@ -17,7 +17,7 @@ import styles from "./ClaimTable.module.scss";
 
 const cx = classNames.bind(styles);
 
-const BtnComponent = ({handleClick, buttonName}) => {
+const BtnComponent = ({ handleClick, buttonName }) => {
 	return (
 		<div className={cx("claim-data-cell", "align-center", "claim-btn")}>
 			<button className={cx("button")} onClick={handleClick}>
@@ -28,8 +28,8 @@ const BtnComponent = ({handleClick, buttonName}) => {
 	);
 };
 
-const ClaimTable = memo(({data, totalStaked, totalRewards}) => {
-	const {address, account} = useSelector(state => state.wallet);
+const ClaimTable = memo(({ data, totalStaked, totalRewards }) => {
+	const { address, account } = useSelector(state => state.wallet);
 	// const dispatch = useDispatch();
 
 	// const handleClickClaimAll = (validatorAddress, claimableRewards) => {
@@ -89,12 +89,12 @@ const ClaimTable = memo(({data, totalStaked, totalRewards}) => {
 					delegatedData={data}
 					validatorAddress={data[0]?.validator_address}
 					withdrawable={totalRewards}
-					BtnComponent={({handleClick}) => <BtnComponent handleClick={handleClick} buttonName={"Claim All"} />}
+					BtnComponent={({ handleClick }) => <BtnComponent handleClick={handleClick} buttonName={"Claim All"} />}
 				/>
 			</div>
 		);
 		const headerCells = [validatorHeaderCell, stakedHeaderCell, claimableRewardsHeaderCell, claimHeaderCell];
-		const headerCellStyles = [{width: "auto"}, {width: "auto"}, {width: "auto"}, {width: "140px"}];
+		const headerCellStyles = [{ width: "auto" }, { width: "auto" }, { width: "auto" }, { width: "140px" }];
 		return {
 			headerCells,
 			headerCellStyles,
@@ -149,7 +149,7 @@ const ClaimTable = memo(({data, totalStaked, totalRewards}) => {
 
 		return data.map((item, index) => {
 			// const validatorIcon = logoBrand.find(logoBrandItem => item?.validator === logoBrandItem.operatorAddress)?.logo ?? aiIcon;
-			const logoItem = logoBrand.find(it => it.operatorAddress === item?.validator_address) || {customLogo: null};
+			const logoItem = logoBrand.find(it => it.operatorAddress === item?.validator_address) || { customLogo: null };
 			const logoURL = item.moniker_image ? item.moniker_image : logoItem.logo ? logoItem.logo : false;
 			const logoName = item.validator || "";
 			const validatorDataCell = item?.validator ? (
@@ -180,7 +180,7 @@ const ClaimTable = memo(({data, totalStaked, totalRewards}) => {
 				<ClaimRwBtn
 					validatorAddress={item?.validator_address}
 					withdrawable={item.claimable_rewards}
-					BtnComponent={({handleClick}) => BtnComponent({handleClick, buttonName: "Claim"})}
+					BtnComponent={({ handleClick }) => BtnComponent({ handleClick, buttonName: "Claim" })}
 					validatorName={item.validator}
 				/>
 			);

diff --git a/src/components/DelegatedValidator/DelegatedClaim/DelegatedClaim.js b/src/components/DelegatedValidator/DelegatedClaim/DelegatedClaim.js
@@ -1,8 +1,8 @@
 // @ts-nocheck
 import React from "react";
-import {useGet} from "restful-react";
+import { useGet } from "restful-react";
 import cn from "classnames/bind";
-import {useTheme} from "@material-ui/core/styles";
+import { useTheme } from "@material-ui/core/styles";
 import useMediaQuery from "@material-ui/core/useMediaQuery";
 import consts from "src/constants/consts";
 import ClaimTable from "src/components/DelegatedValidator/DelegatedClaim/ClaimTable/ClaimTable";
@@ -12,25 +12,31 @@ import ClaimCardListSkeleton from "src/components/DelegatedValidator/DelegatedCl
 import NoResult from "src/components/common/NoResult";
 import arrowIcon from "src/assets/wallet/arrow.svg";
 import styles from "./DelegatedClaim.module.scss";
+import { formatOrai } from "src/helpers/helper";
 
 const cx = cn.bind(styles);
 
-export default function({setActiveTab, address}) {
+export default function({ setActiveTab, address }) {
 	const theme = useTheme();
 	const isLargeScreen = useMediaQuery(theme.breakpoints.up("lg"));
 	const path = consts.API.WALLET.CLAIM_REWARD + "/" + address;
-	const {data} = useGet({
+	const { data } = useGet({
 		path: path,
 	});
 
 	let tableSection;
 
 	if (data) {
-		if (Array.isArray(data?.claim_reward) && data.claim_reward.length > 0) {
+		const claimData =
+			Array.isArray(data?.claim_reward) && data.claim_reward.length > 0
+				? data?.claim_reward.filter(claim => parseInt(claim.staked) > 0 || parseFloat(formatOrai(claim.claimable_rewards)) >= parseFloat(formatOrai(1)))
+				: [];
+
+		if (claimData.length > 0) {
 			tableSection = isLargeScreen ? (
-				<ClaimTable data={data.claim_reward} totalStaked={data?.total_staked} totalRewards={data?.total_rewards} />
+				<ClaimTable data={claimData} totalStaked={data?.total_staked} totalRewards={data?.total_rewards} />
 			) : (
-				<ClaimCardList data={data.claim_reward} totalStaked={data?.total_staked} totalRewards={data?.total_rewards} />
+				<ClaimCardList data={claimData} totalStaked={data?.total_staked} totalRewards={data?.total_rewards} />
 			);
 		} else {
 			tableSection = <NoResult />;

diff --git a/src/components/DelegatedValidator/DelegatedWithdraw/DelegatedWithdraw.js b/src/components/DelegatedValidator/DelegatedWithdraw/DelegatedWithdraw.js
@@ -1,8 +1,8 @@
 // @ts-nocheck
 import React from "react";
-import {useGet} from "restful-react";
+import { useGet } from "restful-react";
 import cn from "classnames/bind";
-import {useTheme} from "@material-ui/core/styles";
+import { useTheme } from "@material-ui/core/styles";
 import useMediaQuery from "@material-ui/core/useMediaQuery";
 import consts from "src/constants/consts";
 import NoResult from "src/components/common/NoResult";
@@ -12,22 +12,28 @@ import WithdrawCardList from "src/components/DelegatedValidator/DelegatedWithdra
 import WithdrawCardListSkeleton from "src/components/DelegatedValidator/DelegatedWithdraw/WithdrawCardList/WithdrawCardListSkeleton";
 import arrowIcon from "src/assets/wallet/arrow.svg";
 import styles from "./DelegatedWithdraw.module.scss";
+import { formatOrai } from "src/helpers/helper";
 
 const cx = cn.bind(styles);
 
-export default function({setActiveTab, address}) {
+export default function({ setActiveTab, address }) {
 	const theme = useTheme();
 	const isLargeScreen = useMediaQuery(theme.breakpoints.up("lg"));
 	const path = consts.API.WALLET.WITHDRAW + "/" + address;
-	const {data} = useGet({
+	const { data } = useGet({
 		path: path,
 	});
 
 	let tableSection;
 
 	if (data) {
-		if (Array.isArray(data?.withdraw) && data.withdraw.length > 0) {
-			tableSection = isLargeScreen ? <WithdrawTable data={data.withdraw} /> : <WithdrawCardList data={data.withdraw} />;
+		const withdrawData =
+			Array.isArray(data?.withdraw) && data.withdraw.length > 0
+				? data?.withdraw.filter(withdraw => withdraw.staked > 0 || parseFloat(formatOrai(withdraw.rewards)) >= parseFloat(formatOrai(1)))
+				: [];
+
+		if (withdrawData.length > 0) {
+			tableSection = isLargeScreen ? <WithdrawTable data={withdrawData} /> : <WithdrawCardList data={withdrawData} />;
 		} else {
 			tableSection = (
 				<div className={cx("no-result-wrapper")}>

diff --git a/src/components/Footer/Footer/Footer.js b/src/components/Footer/Footer/Footer.js
@@ -114,14 +114,30 @@ const Footer = memo(() => {
 									<li className={cx("nav-item")}>
 										<a className={cx("nav-link")} href='https://docs.orai.io/vrf/introduction' target='_blank'>
 											Oraichain VRF 2.0
+
+										</a>
+									</li>
+									{/* <li className={cx("nav-item")}>
+										<a
+											className={cx("nav-link")}
+											href='https://blog.orai.io/oraichain-data-hub-the-fundamental-hub-to-empower-data-economy-4b560bdc4752'
+											target='_blank'>
+											Data Hub
 										</a>
 									</li>
 									<li className={cx("nav-item")}>
 										<a className={cx("nav-link")} href='https://airight.io/' target='_blank'>
 											aiRight
 										</a>
+									</li> */}
+									<li className={cx("nav-item")}>
+										<a className={cx("nav-link")} href='https://kawaii.global/' target='_blank'>
+											Kawaiiverse
+										</a>
 									</li>
+
 									<li className={cx("nav-item")}>
+
 										<a className={cx("nav-link")} href='https://kawaii.global/' target='_blank'>
 											Kawaiiverse
 										</a>