diff --git a/package.json b/package.json index f0fa95c..813a000 100644 --- a/package.json +++ b/package.json @@ -1,7 +1,7 @@ { "name": "ghost-dao-interface", "private": true, - "version": "0.4.0", + "version": "0.4.1", "type": "module", "scripts": { "dev": "vite", diff --git a/src/components/Swap/SwapCollection.jsx b/src/components/Swap/SwapCollection.jsx index c45c5c1..444a22f 100644 --- a/src/components/Swap/SwapCollection.jsx +++ b/src/components/Swap/SwapCollection.jsx @@ -30,7 +30,6 @@ const StyledArrow = styled(Box)( const SwapCollection = ({ UpperSwapCard, LowerSwapCard, arrowOnClick, iconNotNeeded, maxWidth}) => { const theme = useTheme(); - return ( {UpperSwapCard} diff --git a/src/components/Tooltip/Tooltip.jsx b/src/components/Tooltip/Tooltip.jsx index 34c891e..9494afc 100644 --- a/src/components/Tooltip/Tooltip.jsx +++ b/src/components/Tooltip/Tooltip.jsx @@ -38,8 +38,8 @@ const Tooltip = ({ message, children }) => { onResizeCapture={undefined} slotProps={undefined} slots={undefined} - > - + > + {typeof message === "string" ? ( {message} diff --git a/src/containers/Bridge/Bridge.jsx b/src/containers/Bridge/Bridge.jsx index 73e78f9..d5c138a 100644 --- a/src/containers/Bridge/Bridge.jsx +++ b/src/containers/Bridge/Bridge.jsx @@ -242,12 +242,12 @@ const Bridge = ({ chainId, address, config, connect }) => { let certainty = 0n; for (let i = 0; i < length; i++) { const commit = latestCommits.at(i); - if (commit.disabled) { + if (commit.disabled || blockNumber < blocksInFourHours) { continue; } certainty += (commit?.lastStoredBlock ?? 0n) - (blockNumber - blocksInFourHours); } - return Number(certainty * 100n / (blocksInFourHours * BigInt(length))); + return Math.max(Number(certainty * 100n / (blocksInFourHours * BigInt(length))), 0); }, [latestCommits, blockNumber]); const timeToNextEpoch = useMemo(() => { @@ -284,7 +284,7 @@ const Bridge = ({ chainId, address, config, connect }) => { timestamp: Date.now() } - const newStoredTransactions = [...storedTransactions, transaction]; + const newStoredTransactions = [transaction, ...storedTransactions]; setStoredTransactions(newStoredTransactions); localStorage.setItem(STORAGE_PREFIX, JSON.stringify(newStoredTransactions)); setActiveTxIndex(newStoredTransactions.length - 1) @@ -322,7 +322,7 @@ const Bridge = ({ chainId, address, config, connect }) => { @@ -362,6 +362,7 @@ const Bridge = ({ chainId, address, config, connect }) => { /> )} + style={{ height: "434px" }} fullWidth enableBackground > @@ -383,6 +384,7 @@ const Bridge = ({ chainId, address, config, connect }) => { /> : { } } + style={{ height: "434px" }} enableBackground fullWidth > diff --git a/src/containers/Bridge/BridgeCard.jsx b/src/containers/Bridge/BridgeCard.jsx index ccf33a6..1f3b2b9 100644 --- a/src/containers/Bridge/BridgeCard.jsx +++ b/src/containers/Bridge/BridgeCard.jsx @@ -13,6 +13,7 @@ import { TableCell, Modal, useTheme, + useMediaQuery, } from "@mui/material"; import { useConfig } from "wagmi"; @@ -23,7 +24,6 @@ import { PrimaryButton } from "../../components/Button"; import GhostStyledIcon from "../../components/Icon/GhostIcon"; import SwapCard from "../../components/Swap/SwapCard"; import SwapCollection from "../../components/Swap/SwapCollection"; -import InfoTooltip from "../../components/Tooltip/InfoTooltip"; import { ghost } from "../../hooks/staking"; import { useBalance } from "../../hooks/tokens"; @@ -158,9 +158,10 @@ export const BridgeCardAction = ({ }, [receiver]) return ( - + )} {!gatekeeperAddressEmpty && ( - <> + {!isVerySmallScreen && Gatekeeper:} {sliceString(gatekeeperAddress, 10, -8)} - + )} @@ -248,12 +249,15 @@ export const BridgeCardAction = ({ export const BridgeCardHistory = ({ isSemiSmallScreen, + isBigScreen, filteredStoredTransactions, ghstSymbol, blockNumber, finalityDelay, setActiveTxIndex }) => { + const isVeryBigScreen = useMediaQuery("(max-width: 1360px)"); + const theme = useTheme(); const background = (index) => { return index % 2 === 1 ? "" : theme.colors.gray[750]; @@ -274,9 +278,9 @@ export const BridgeCardHistory = ({ - + {!(isBigScreen ^ isVeryBigScreen) && Transaction - + } Datetime @@ -294,7 +298,7 @@ export const BridgeCardHistory = ({ data-testid={idx + `--tx-history`} onClick={() => setActiveTxIndex(idx)} > - + {!(isBigScreen ^ isVeryBigScreen) && {formatCurrency( @@ -311,7 +315,7 @@ export const BridgeCardHistory = ({ )} - + } diff --git a/src/containers/Bridge/BridgeHeader.jsx b/src/containers/Bridge/BridgeHeader.jsx index f20306b..6bbc32a 100644 --- a/src/containers/Bridge/BridgeHeader.jsx +++ b/src/containers/Bridge/BridgeHeader.jsx @@ -3,6 +3,7 @@ import { Box, Paper, Grid, Typography, LinearProgress, useTheme } from "@mui/mat import Metric from "../../components/Metric/Metric"; import Countdown from "../../components/Countdown/Countdown"; +import InfoTooltip from "../../components/Tooltip/InfoTooltip"; import { formatNumber } from "../../helpers"; export const BridgeHeader = ({ @@ -91,12 +92,12 @@ export const BridgeHeader = ({ 14400 ? "∞" : formatTime(transactionEta)} label="Max Bridge ETA" tooltip="Maximum estimated time for finalizing bridge transactions based on the latest update." /> - + + + 0% - 50%: Bridge Stability ❌ Do NOT Bridge + 50% - 70%: Bridge Stability ⚠️ Critical Risk + 70% - 80%: Bridge Stability ⚠️ High Risk + 80% - 90%: Bridge Stability ✅ Moderate Risk + 90% - 100%: Bridge Stability ✅ Safe + + } /> diff --git a/src/containers/Bridge/BridgeModal.jsx b/src/containers/Bridge/BridgeModal.jsx index cf9cfbd..b7a0254 100644 --- a/src/containers/Bridge/BridgeModal.jsx +++ b/src/containers/Bridge/BridgeModal.jsx @@ -300,7 +300,10 @@ export const BridgeModal = ({ } - Executed at: + + Executed at: + + { new Date(currentRecord ? currentRecord.timestamp : 0).toLocaleString('en-US') } @@ -378,7 +381,7 @@ export const BridgeConfirmModal = ({ }} target="_blank" rel="noopener noreferrer" - href="https://google.com" + href="https://ghostchain.io/bridge-disclaimer" > Learn more. diff --git a/src/containers/Bridge/ValidatorTable.jsx b/src/containers/Bridge/ValidatorTable.jsx index 7653e22..a90fb81 100644 --- a/src/containers/Bridge/ValidatorTable.jsx +++ b/src/containers/Bridge/ValidatorTable.jsx @@ -10,6 +10,7 @@ import { TableHead, TableRow, Typography, + Link, LinearProgress, } from "@mui/material"; import { useTheme } from "@mui/material/styles"; @@ -39,11 +40,12 @@ export const ValidatorTable = ({ }, [bridgeStability]); return ( - - {!providerDetail && + + {!providerDetail && GHOST Wallet is not detected on your browser! - Download GHOST Wallet Extension to see real-time validator stats for bridging transaction. + Download GHOST Wallet Extension for real-time visibility into validator status and related transaction risks. + Important: The GHOST Wallet Extension is optional, but be aware that your bridge transaction will succeed or fail irreversibly based on the condition of the validators. window.open('https://git.ghostchain.io/ghostchain/ghost-extension-wallet/releases', '_blank', 'noopener,noreferrer')}> Get GHOST Extension @@ -53,7 +55,7 @@ export const ValidatorTable = ({ component={Paper} className="custom-scrollbar" sx={{ - height: "320px", + height: "310px", overflowY: 'scroll', msOverflowStyle: "thin !important", scrollbarWidth: "thin !important", @@ -86,6 +88,18 @@ export const ValidatorTable = ({
} + + + See Validator Telemetry + + ) } diff --git a/src/containers/NotFound/NotFound.jsx b/src/containers/NotFound/NotFound.jsx index 39bc59c..d132362 100644 --- a/src/containers/NotFound/NotFound.jsx +++ b/src/containers/NotFound/NotFound.jsx @@ -7,6 +7,7 @@ import Paper from "../../components/Paper/Paper"; import GhostIcon from "../../assets/icons/ghost-nav-header.svg?react"; import EthIcon from "../../assets/tokens/ETH.svg?react"; +import { parseKnownToken } from "../../components/Token/Token" import { useSwitchChain } from 'wagmi'; import toast from "react-hot-toast"; @@ -92,7 +93,7 @@ export default function NotFound({ alignItems="center" gap="15px" > - + {chain.name}