Skip to content

Commit

Permalink
Merge pull request #976 from oraichain/fix/est-apr
Browse files Browse the repository at this point in the history
fix est apr
  • Loading branch information
quangdz1704 committed Mar 14, 2024
2 parents 777bf95 + 1c76058 commit bcd3818
Show file tree
Hide file tree
Showing 3 changed files with 51 additions and 51 deletions.
Original file line number Diff line number Diff line change
@@ -1,14 +1,14 @@
import * as React from "react";
import cn from "classnames/bind";
import {formatNumber} from "src/lib/scripts";
import {useFetch, useTimer} from "src/hooks";
import { formatNumber } from "src/lib/scripts";
import { useFetch, useTimer } from "src/hooks";
import consts from "src/constants/consts";
import moment from "moment";
import {setAgoTime} from "src/lib/scripts";
import { setAgoTime } from "src/lib/scripts";
// component
import Skeleton from "react-skeleton-loader";
// redux
import {useSelector} from "react-redux";
import { useSelector } from "react-redux";
// svgs
import down_rd from "src/assets/common/arrow_down.svg";
import up_gr from "src/assets/common/arrow_up.svg";
Expand All @@ -28,7 +28,7 @@ export default function(props) {
<div className={cx("footer")}>{data !== null ? setAgoTime(data?.timestamp) : ""}</div>
</div>
<div className={cx("card")}>
<div className={cx("title")}>Average Blocktime (All)</div>
<div className={cx("title")}>Average Block time (All)</div>
<div className={cx("content")}>{data !== null ? data?.block_time?.toFixed(2) : ""}</div>
<div className={cx("footer")}>seconds</div>
</div>
Expand Down
50 changes: 25 additions & 25 deletions src/components/ValidatorList/ValidatorTable/ValidatorTable.js
Original file line number Diff line number Diff line change
@@ -1,23 +1,23 @@
// @ts-nocheck
/* eslint-disable react-hooks/exhaustive-deps */
import React, {useState, memo, useMemo} from "react";
import {NavLink} from "react-router-dom";
import {Tooltip} from "antd";
import {QuestionCircleOutlined} from "@ant-design/icons";
import React, { useState, memo, useMemo } from "react";
import { NavLink } from "react-router-dom";
import { Tooltip } from "antd";
import { QuestionCircleOutlined } from "@ant-design/icons";
import classNames from "classnames/bind";
import {_} from "src/lib/scripts";
import {tableThemes} from "src/constants/tableThemes";
import {sortDirections} from "src/constants/sortDirections";
import { _ } from "src/lib/scripts";
import { tableThemes } from "src/constants/tableThemes";
import { sortDirections } from "src/constants/sortDirections";
import consts from "src/constants/consts";
import {formatPercentage, formatInteger, formatOrai} from "src/helpers/helper";
import {compareTwoValues} from "src/helpers/compare";
import { formatPercentage, formatInteger, formatOrai } from "src/helpers/helper";
import { compareTwoValues } from "src/helpers/compare";
import Delegate from "src/components/common/Delegate";
import ThemedTable from "src/components/common/ThemedTable";
import sortNoneIcon from "src/assets/common/sort_none_ic.svg";
import sortAscIcon from "src/assets/common/sort_asc_ic.svg";
import sortDescIcon from "src/assets/common/sort_desc_ic.svg";
import {logoBrand} from "src/constants/logoBrand";
import {Progress} from "antd";
import { logoBrand } from "src/constants/logoBrand";
import { Progress } from "antd";
import styles from "./ValidatorTable.module.scss";
import "./style.css";

Expand Down Expand Up @@ -51,8 +51,8 @@ const getCumulativeShareCell = (previousValue, currentValue, totalValue) => {

return (
<>
<div className={cx("previous-graph")} style={{width: previousPercent + "%"}}></div>
<div className={cx("current-graph")} style={{left: previousPercent + "%", width: currentPercent + "%"}}></div>
<div className={cx("previous-graph")} style={{ width: previousPercent + "%" }}></div>
<div className={cx("current-graph")} style={{ left: previousPercent + "%", width: currentPercent + "%" }}></div>
<div className={cx("total-value")}>{totalPercent} %</div>
</>
);
Expand All @@ -66,7 +66,7 @@ const toggleDirection = direction => {
}
};

const ValidatorTable = memo(({data = []}) => {
const ValidatorTable = memo(({ data = [] }) => {
const [sortField, setSortField] = useState(sortFields.SELFBONDED);
const [sortDirection, setSortDirection] = useState(sortDirections.DESC);
const [canSort, setCanSort] = useState(false);
Expand Down Expand Up @@ -128,7 +128,7 @@ const ValidatorTable = memo(({data = []}) => {
<div className={cx("header-cell", "align-right")}>
Self Bonded
<Tooltip
style={{paddingLeft: "10px"}}
style={{ paddingLeft: "10px" }}
title='The self bonded value is the number of tokens this validator self-delegates. A trustworthy validator will have a high self-bonded value'
className={cx("tooltip-header-cell")}>
<QuestionCircleOutlined />
Expand Down Expand Up @@ -194,15 +194,15 @@ const ValidatorTable = memo(({data = []}) => {
delegateHeaderCell,
];
const headerCellStyles = [
{width: "5.4%"}, // Rank
{width: "17.7%"}, // Validator
{width: "11.8%"}, // Voting Power
{width: "13.1%"}, // Self Bonded
{width: "12.3%"}, // Cumulative Share
{width: "9%"}, // Uptime
{width: "11.7%"}, // Commission
{width: "9%"}, // EstAPRCell
{width: "10%"}, // Delegate
{ width: "5.4%" }, // Rank
{ width: "17.7%" }, // Validator
{ width: "11.8%" }, // Voting Power
{ width: "13.1%" }, // Self Bonded
{ width: "12.3%" }, // Cumulative Share
{ width: "9%" }, // Uptime
{ width: "11.7%" }, // Commission
{ width: "9%" }, // EstAPRCell
{ width: "10%" }, // Delegate
];
return {
headerCells,
Expand Down Expand Up @@ -298,7 +298,7 @@ const ValidatorTable = memo(({data = []}) => {
<div className={cx("commission-data-cell", "align-right")}>{item?.commission_rate ? formatPercentage(item.commission_rate, 2) + "%" : "-"}</div>
);

const estAPR = item?.apr.toFixed(2);
const estAPR = ((item?.apr || 0) * 1.05).toFixed(2);

const estAPRnDataCell = <div className={cx("commission-data-cell", "align-right")}>{estAPR} %</div>;

Expand Down
42 changes: 21 additions & 21 deletions src/components/common/Delegate/Delegate.js
Original file line number Diff line number Diff line change
@@ -1,33 +1,33 @@
// @ts-nocheck
import React, {memo, useState, useEffect} from "react";
import React, { memo, useState, useEffect } from "react";
import cn from "classnames/bind";
import {Tooltip} from "antd";
import {QuestionCircleOutlined} from "@ant-design/icons";
import {useForm, FormProvider} from "react-hook-form";
import {withStyles} from "@material-ui/core/styles";
import {useSelector} from "react-redux";
import { Tooltip } from "antd";
import { QuestionCircleOutlined } from "@ant-design/icons";
import { useForm, FormProvider } from "react-hook-form";
import { withStyles } from "@material-ui/core/styles";
import { useSelector } from "react-redux";
import Dialog from "@material-ui/core/Dialog";
import MuiDialogContent from "@material-ui/core/DialogContent";
import MuiDialogActions from "@material-ui/core/DialogActions";
import {Divider, Input, Spin} from "antd";
import { Divider, Input, Spin } from "antd";
import * as yup from "yup";
import {yupResolver} from "@hookform/resolvers/yup";
import { yupResolver } from "@hookform/resolvers/yup";
import _ from "lodash";
import BigNumber from "bignumber.js";

import {InputNumberOrai} from "src/components/common/form-controls";
import { InputNumberOrai } from "src/components/common/form-controls";
import LoadingOverlay from "src/components/common/LoadingOverlay";
import {Fee, Gas} from "src/components/common/Fee";
import {ReactComponent as ExchangeIconGrey} from "src/assets/icons/exchange-grey.svg";
import { Fee, Gas } from "src/components/common/Fee";
import { ReactComponent as ExchangeIconGrey } from "src/assets/icons/exchange-grey.svg";
import consts from "src/constants/consts";
import {useFetch, useHistory} from "src/hooks";
import { useFetch, useHistory } from "src/hooks";
import styles from "./Delegate.module.scss";
import "./Delegate.css";
import {formatOrai, formatPercentage , amountCoinDecimal} from "src/helpers/helper";
import {walletStation} from "src/lib/walletStation";
import {handleTransactionResponse} from "src/helpers/transaction";
import {notification} from "antd";
import {handleErrorMessage} from "../../../lib/scripts";
import { formatOrai, formatPercentage, amountCoinDecimal } from "src/helpers/helper";
import { walletStation } from "src/lib/walletStation";
import { handleTransactionResponse } from "src/helpers/transaction";
import { notification } from "antd";
import { handleErrorMessage } from "../../../lib/scripts";

const cx = cn.bind(styles);

Expand Down Expand Up @@ -283,7 +283,7 @@ const Delegate = memo(({ a, openButtonText = "Delegate for this validator", oper
}

if (id === 2) {
const {amount, monthlyORAI, yearlyORAI} = rewardCalculator;
const { amount, monthlyORAI, yearlyORAI } = rewardCalculator;
return (
<>
<DialogContent>
Expand All @@ -292,7 +292,7 @@ const Delegate = memo(({ a, openButtonText = "Delegate for this validator", oper
<div className={cx("left")}>Amount (ORAI)</div>
<div className={cx("right")}>
{" "}
<ExchangeIconGrey /> <span className={cx("dollar")}>$ {formatUSD(amount)} </span>
<ExchangeIconGrey /> <span className={cx("dollar")}>$ {formatUSD(amount || 0)} </span>
</div>
</div>
<div className={cx("amount-reward")}>
Expand Down Expand Up @@ -334,9 +334,9 @@ const Delegate = memo(({ a, openButtonText = "Delegate for this validator", oper

<Dialog onClose={closeDialog} aria-labelledby='delegate-dialog' open={open} maxWidth='sm' fullWidth={true}>
<div className={cx("tab-wrapper")}>
{TABS.map(({id, name}, index) => {
{TABS.map(({ id, name }, index) => {
return (
<button className={cx({selected: id === activeTabId})} onClick={() => setActiveTabId(id)} key={"tab-" + index}>
<button className={cx({ selected: id === activeTabId })} onClick={() => setActiveTabId(id)} key={"tab-" + index}>
<p> {name} </p>
</button>
);
Expand Down

0 comments on commit bcd3818

Please sign in to comment.