From e50d63e76564f9f41af9ffb8891b37769311989d Mon Sep 17 00:00:00 2001 From: Crypto Minion <154598612+jrwbabylonlab@users.noreply.github.com> Date: Thu, 26 Sep 2024 11:47:51 +1000 Subject: [PATCH 1/2] feat: hide points if the config url is not present (#168) * feat: hide points if the config url is not present --------- Co-authored-by: jeremy-babylonchain --- README.md | 2 +- package-lock.json | 4 +- package.json | 2 +- src/app/components/Delegations/Delegation.tsx | 16 ++++--- .../components/Delegations/Delegations.tsx | 12 +++-- .../components/Points/DelegationPoints.tsx | 46 ++++++++++++------- src/app/components/Summary/Summary.tsx | 3 +- .../context/api/DelegationsPointsProvider.tsx | 4 +- src/config/index.ts | 6 +++ 9 files changed, 61 insertions(+), 34 deletions(-) diff --git a/README.md b/README.md index 03db1c9d..9b97fce3 100644 --- a/README.md +++ b/README.md @@ -21,7 +21,7 @@ where, - `NEXT_PUBLIC_API_URL` specifies the back-end API to use for the staking system queries - `NEXT_PUBLIC_POINTS_API_URL` specifies the Points API to use for the points - system + system (Optional) - `NEXT_PUBLIC_NETWORK` specifies the BTC network environment - `NEXT_PUBLIC_DISPLAY_TESTING_MESSAGES` boolean value to indicate whether display testing network related message. Default to true diff --git a/package-lock.json b/package-lock.json index a54c9859..e92f5988 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,12 +1,12 @@ { "name": "simple-staking", - "version": "0.3.0", + "version": "0.3.1", "lockfileVersion": 3, "requires": true, "packages": { "": { "name": "simple-staking", - "version": "0.3.0", + "version": "0.3.1", "dependencies": { "@babylonlabs-io/btc-staking-ts": "0.3.0", "@bitcoin-js/tiny-secp256k1-asmjs": "2.2.3", diff --git a/package.json b/package.json index 8b8a1e0c..b35f0c10 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "simple-staking", - "version": "0.3.0", + "version": "0.3.1", "private": true, "scripts": { "dev": "next dev", diff --git a/src/app/components/Delegations/Delegation.tsx b/src/app/components/Delegations/Delegation.tsx index 310a8724..05e7fb81 100644 --- a/src/app/components/Delegations/Delegation.tsx +++ b/src/app/components/Delegations/Delegation.tsx @@ -7,6 +7,7 @@ import { Tooltip } from "react-tooltip"; import { useHealthCheck } from "@/app/hooks/useHealthCheck"; import { DelegationState, StakingTx } from "@/app/types/delegations"; import { GlobalParamsVersion } from "@/app/types/globalParams"; +import { shouldDisplayPoints } from "@/config"; import { getNetworkConfig } from "@/config/network.config"; import { satoshiToBtc } from "@/utils/btcConversions"; import { durationTillNow } from "@/utils/formatTime"; @@ -45,6 +46,8 @@ export const Delegation: React.FC = ({ const { startTimestamp } = stakingTx; const [currentTime, setCurrentTime] = useState(Date.now()); const { isApiNormal, isGeoBlocked } = useHealthCheck(); + const shouldShowPoints = + isApiNormal && !isGeoBlocked && shouldDisplayPoints(); useEffect(() => { const timerId = setInterval(() => { @@ -126,7 +129,9 @@ export const Delegation: React.FC = ({

overflow

)} -
+

@@ -164,11 +169,10 @@ export const Delegation: React.FC = ({

- {isApiNormal && !isGeoBlocked && ( -
- -
- )} +
{generateActionButton()}
diff --git a/src/app/components/Delegations/Delegations.tsx b/src/app/components/Delegations/Delegations.tsx index f2282ac4..17a31e3b 100644 --- a/src/app/components/Delegations/Delegations.tsx +++ b/src/app/components/Delegations/Delegations.tsx @@ -15,6 +15,7 @@ import { } from "@/app/types/delegations"; import { ErrorState } from "@/app/types/errors"; import { GlobalParamsVersion } from "@/app/types/globalParams"; +import { shouldDisplayPoints } from "@/config"; import { signUnbondingTx } from "@/utils/delegations/signUnbondingTx"; import { signWithdrawalTx } from "@/utils/delegations/signWithdrawalTx"; import { getIntermediateDelegationsLocalStorageKey } from "@/utils/local_storage/getIntermediateDelegationsLocalStorageKey"; @@ -100,6 +101,8 @@ const DelegationsContent: React.FC = ({ const { isApiNormal, isGeoBlocked } = useHealthCheck(); const [awaitingWalletResponse, setAwaitingWalletResponse] = useState(false); + const shouldShowPoints = + isApiNormal && !isGeoBlocked && shouldDisplayPoints(); // Local storage state for intermediate delegations (withdrawing, unbonding) const intermediateDelegationsLocalStorageKey = getIntermediateDelegationsLocalStorageKey(publicKeyNoCoord); @@ -279,14 +282,14 @@ const DelegationsContent: React.FC = ({ ) : ( <> -
+

Amount

Inception

Transaction hash

Status

- {isApiNormal && !isGeoBlocked && ( -

Points

- )} + {shouldShowPoints &&

Points

}

Action

= ({ stakingValueSat, stakingTx, stakingTxHashHex, - finalityProviderPkHex, state, isOverflow, } = delegation; diff --git a/src/app/components/Points/DelegationPoints.tsx b/src/app/components/Points/DelegationPoints.tsx index e9b1cc39..43c7b78c 100644 --- a/src/app/components/Points/DelegationPoints.tsx +++ b/src/app/components/Points/DelegationPoints.tsx @@ -2,41 +2,53 @@ import React from "react"; import { NumericFormat } from "react-number-format"; import { useDelegationsPoints } from "@/app/context/api/DelegationsPointsProvider"; +import { useHealthCheck } from "@/app/hooks/useHealthCheck"; +import { shouldDisplayPoints } from "@/config"; interface DelegationPointsProps { stakingTxHash: string; + className?: string; } export const DelegationPoints: React.FC = ({ stakingTxHash, + className, }) => { + const { isApiNormal, isGeoBlocked } = useHealthCheck(); const { delegationPoints, isLoading } = useDelegationsPoints(); + // Early return if the API is not normal or the user is geo-blocked + if (!isApiNormal || isGeoBlocked || !shouldDisplayPoints()) { + return null; + } const points = delegationPoints.get(stakingTxHash); - if (isLoading) { return ( -
-
+
+
+
+
); } return ( -
-

- Points: - {points !== undefined ? ( - - ) : ( - "n.a." - )} -

+
+
+

+ Points: + {points !== undefined ? ( + + ) : ( + "n.a." + )} +

+
); }; diff --git a/src/app/components/Summary/Summary.tsx b/src/app/components/Summary/Summary.tsx index ce878803..3a8d193a 100644 --- a/src/app/components/Summary/Summary.tsx +++ b/src/app/components/Summary/Summary.tsx @@ -6,6 +6,7 @@ import { Tooltip } from "react-tooltip"; import { useGlobalParams } from "@/app/context/api/GlobalParamsProvider"; import { useBtcHeight } from "@/app/context/mempool/BtcHeightProvider"; import { useHealthCheck } from "@/app/hooks/useHealthCheck"; +import { shouldDisplayPoints } from "@/config"; import { getNetworkConfig } from "@/config/network.config"; import { satoshiToBtc } from "@/utils/btcConversions"; import { @@ -79,7 +80,7 @@ export const Summary: React.FC = ({

- {isApiNormal && !isGeoBlocked && ( + {isApiNormal && !isGeoBlocked && shouldDisplayPoints() && ( <>
diff --git a/src/app/context/api/DelegationsPointsProvider.tsx b/src/app/context/api/DelegationsPointsProvider.tsx index 816f3493..40a906eb 100644 --- a/src/app/context/api/DelegationsPointsProvider.tsx +++ b/src/app/context/api/DelegationsPointsProvider.tsx @@ -4,6 +4,7 @@ import React, { createContext, useContext, useEffect, useState } from "react"; import { getDelegationPointsByStakingTxHashHexes } from "@/app/api/getPoints"; import { useHealthCheck } from "@/app/hooks/useHealthCheck"; import { Delegation } from "@/app/types/delegations"; +import { shouldDisplayPoints } from "@/config"; interface PointsContextType { delegationPoints: Map; @@ -78,7 +79,8 @@ export const DelegationsPointsProvider: React.FC< isWalletConnected && delegationsAPI.length > 0 && isApiNormal && - !isGeoBlocked, + !isGeoBlocked && + shouldDisplayPoints(), refetchInterval: 300000, // Refetch every 5 minutes refetchOnWindowFocus: false, retry: 1, diff --git a/src/config/index.ts b/src/config/index.ts index ec639445..e8670507 100644 --- a/src/config/index.ts +++ b/src/config/index.ts @@ -12,3 +12,9 @@ export const getNetworkAppUrl = (): string => { ? "https://btcstaking.testnet.babylonchain.io" : "https://btcstaking.babylonlabs.io"; }; + +// shouldDisplayPoints function is used to check if the application should +// display points or not based on the existence of the environment variable. +export const shouldDisplayPoints = (): boolean => { + return !!process.env.NEXT_PUBLIC_POINTS_API_URL; +}; From ac75129dfa28976e2f5ef06f591120f4e7e2e672 Mon Sep 17 00:00:00 2001 From: Crypto Minion <154598612+jrwbabylonlab@users.noreply.github.com> Date: Thu, 26 Sep 2024 23:19:38 +1000 Subject: [PATCH 2/2] chore: hide points FAQ if points url not provided (#177) --- package-lock.json | 4 ++-- package.json | 2 +- src/app/components/FAQ/data/questions.ts | 12 +++++++----- 3 files changed, 10 insertions(+), 8 deletions(-) diff --git a/package-lock.json b/package-lock.json index e92f5988..f33be58f 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,12 +1,12 @@ { "name": "simple-staking", - "version": "0.3.1", + "version": "0.3.2", "lockfileVersion": 3, "requires": true, "packages": { "": { "name": "simple-staking", - "version": "0.3.1", + "version": "0.3.2", "dependencies": { "@babylonlabs-io/btc-staking-ts": "0.3.0", "@bitcoin-js/tiny-secp256k1-asmjs": "2.2.3", diff --git a/package.json b/package.json index b35f0c10..2756104e 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "simple-staking", - "version": "0.3.1", + "version": "0.3.2", "private": true, "scripts": { "dev": "next dev", diff --git a/src/app/components/FAQ/data/questions.ts b/src/app/components/FAQ/data/questions.ts index 975b475c..d3214eaa 100644 --- a/src/app/components/FAQ/data/questions.ts +++ b/src/app/components/FAQ/data/questions.ts @@ -1,4 +1,4 @@ -import { shouldDisplayTestingMsg } from "@/config"; +import { shouldDisplayPoints, shouldDisplayTestingMsg } from "@/config"; export interface Question { title: string; @@ -94,11 +94,13 @@ export const questions = ( title: "Are hardware wallets supported?", content: `

Keystone via QR code is the only hardware wallet supporting Bitcoin Staking. Using any other hardware wallet through any means (such as connection to a software/extension/mobile wallet) can lead to permanent inability to withdraw the stake.

`, }, - { - title: "What are the points?", - content: `

We use points to track staking activity. Points are not blockchain tokens. Points do not, and may never, convert to, accrue to, be used as a basis to calculate, or become tokens, other digital assets, or distributions thereof. Points are virtual calculations with no monetary value. Points do not constitute any currency or property of any type and are not redeemable, refundable, or transferable.

`, - }, ]; + if (shouldDisplayPoints()) { + questionList.push({ + title: "What are the points for?", + content: `

We use points to track staking activity. Points are not blockchain tokens. Points do not, and may never, convert to, accrue to, be used as a basis to calculate, or become tokens, other digital assets, or distributions thereof. Points are virtual calculations with no monetary value. Points do not constitute any currency or property of any type and are not redeemable, refundable, or transferable.

`, + }); + } if (shouldDisplayTestingMsg()) { questionList.push({ title: "What is the goal of this testnet?",