diff --git a/CHANGELOG.md b/CHANGELOG.md index de5ac718d..fd2dc3b6c 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -39,6 +39,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0 ### Features +- [#720](https://github.com/alleslabs/celatone-frontend/pull/720) Add delegations for contract detail - [#684](https://github.com/alleslabs/celatone-frontend/pull/684) Add nft page - [#717](https://github.com/alleslabs/celatone-frontend/pull/717) Add total value for contract detail - [#711](https://github.com/alleslabs/celatone-frontend/pull/711) Refactor assetInfos and add movePoolInfos to tx details diff --git a/public/PilatWide-Bold.woff2 b/public/PilatWide-Bold.woff2 deleted file mode 100644 index d91e8f17e..000000000 Binary files a/public/PilatWide-Bold.woff2 and /dev/null differ diff --git a/public/validator.svg b/public/validator.svg deleted file mode 100644 index fb754fce2..000000000 --- a/public/validator.svg +++ /dev/null @@ -1,6 +0,0 @@ - - - - - - diff --git a/src/lib/components/TotalValue.tsx b/src/lib/components/TotalValue.tsx index ed410ce5c..0506fab4c 100644 --- a/src/lib/components/TotalValue.tsx +++ b/src/lib/components/TotalValue.tsx @@ -19,9 +19,9 @@ export const TotalValue = ({ {label} @@ -36,8 +36,8 @@ export const TotalValue = ({ /> ) : ( ; badgeSize?: ImageProps["boxSize"]; @@ -55,7 +55,7 @@ export const ValidatorBadge = ({ src={valImgSrc} alt={validator.moniker} borderRadius="50%" - fallbackSrc={validatorDefaultImg.src} + fallbackSrc="https://assets.alleslabs.dev/webapp-assets/placeholder/validator.svg" fallbackStrategy="beforeLoadOrError" /> )} diff --git a/src/lib/pages/account-details/components/delegations/DelegationInfo.tsx b/src/lib/components/delegations/DelegationInfo.tsx similarity index 91% rename from src/lib/pages/account-details/components/delegations/DelegationInfo.tsx rename to src/lib/components/delegations/DelegationInfo.tsx index d8671622a..73ca25443 100644 --- a/src/lib/pages/account-details/components/delegations/DelegationInfo.tsx +++ b/src/lib/components/delegations/DelegationInfo.tsx @@ -1,6 +1,7 @@ import { Button, Flex, Heading } from "@chakra-ui/react"; import type { MouseEventHandler } from "react"; +import { TableTitle } from "../table"; import { AmpEvent, track } from "lib/amplitude"; import { useMobile } from "lib/app-provider"; import { CustomIcon } from "lib/components/icon"; @@ -21,8 +22,8 @@ export const DelegationInfo = ({ onViewMore, }: DelegationInfoProps) => { const isMobile = useMobile(); - const isMobileOverview = isMobile && !!onViewMore; + return ( <> {isMobileOverview ? ( @@ -43,16 +44,8 @@ export const DelegationInfo = ({ ) : ( - - - Delegations - + + ; const redelegationCount = redelegations?.length ?? 0; + return ( { if (error) return ; @@ -26,7 +28,8 @@ export const AssetSectionContent = ({ ) : ( - This address does not hold any supported assets + This {isAccount ? "address" : "contract"} does not hold any supported + assets ); }; diff --git a/src/lib/pages/account-details/components/asset/UserAssetInfoCard.tsx b/src/lib/pages/account-details/components/asset/UserAssetInfoCard.tsx index 00bf539c2..0b339a68f 100644 --- a/src/lib/pages/account-details/components/asset/UserAssetInfoCard.tsx +++ b/src/lib/pages/account-details/components/asset/UserAssetInfoCard.tsx @@ -22,6 +22,7 @@ export const UserAssetInfoCard = ({ {helperText} void; + isAccount?: boolean; } -export const AssetsSection = ({ address, onViewMore }: AssetsSectionProps) => { +export const AssetsSection = ({ + address, + onViewMore, + isAccount = false, +}: AssetsSectionProps) => { const isMobile = useMobile(); const isMobileOverview = isMobile && !!onViewMore; @@ -44,7 +49,7 @@ export const AssetsSection = ({ address, onViewMore }: AssetsSectionProps) => { @@ -65,7 +70,7 @@ export const AssetsSection = ({ address, onViewMore }: AssetsSectionProps) => { ) : ( <> - {isMobile && tableTitle} + {tableTitle} { )} - - - {accountData?.publicInfo?.description && ( - - - - - Public Account Description + + + {accountData?.publicInfo?.description && ( + + + + + Public Account Description + + + + {accountData.publicInfo.description} - - {accountData.publicInfo.description} - - - )} - - - - - - {!disableDelegation && ( + )} + + - - )} + {!disableDelegation && ( + + + + )} + {nft.enabled && ( )} - - + + - + diff --git a/src/lib/pages/account-details/types.ts b/src/lib/pages/account-details/types.ts index b1e6f67ab..5daa2e93a 100644 --- a/src/lib/pages/account-details/types.ts +++ b/src/lib/pages/account-details/types.ts @@ -1,7 +1,6 @@ import { z } from "zod"; import { zAddr } from "lib/types"; -import type { TokenWithValue, Validator } from "lib/types"; export enum TabIndex { Overview = "overview", @@ -27,32 +26,3 @@ export const zAccountDetailsQueryParams = z.object({ .transform(() => TabIndex.Overview), ]), }); - -export interface StakingParams { - unbondingTime: string; // e.g. "14 days" - maxEntries: number; - bondDenoms: TokenWithValue[]; -} - -export interface Delegation { - validator: Validator; - balances: TokenWithValue[]; -} - -export interface Unbonding { - validator: Validator; - completionTime: Date; - balances: TokenWithValue[]; -} - -export interface Redelegation { - srcValidator: Validator; - dstValidator: Validator; - completionTime: Date; - balances: TokenWithValue[]; -} - -export interface NonRedelegatable { - dstValidator: Validator; - completionTime: Date; -} diff --git a/src/lib/pages/contract-details/components/ContractTop.tsx b/src/lib/pages/contract-details/components/ContractTop.tsx index c13f6df47..379ce4b51 100644 --- a/src/lib/pages/contract-details/components/ContractTop.tsx +++ b/src/lib/pages/contract-details/components/ContractTop.tsx @@ -132,7 +132,7 @@ export const ContractTop = ({ > @@ -162,41 +162,30 @@ export const ContractTop = ({ {displayName} - - - Contract Address - - - - - - Label - - - {contract.label} - - - {publicInfo?.name && ( + + + Contract Address + + + + - Public Name + Label - {publicInfo.name} + {contract.label} - )} - {publicInfo?.github && ( - - )} + {publicInfo?.name && ( + + + Public Name + + + {publicInfo.name} + + + )} + {publicInfo?.github && ( + + )} + ; - isBalancesLoading: boolean; - supportedAssets: TokenWithValue[]; - onViewMore?: () => void; -} - -export const SupportedTokensSection = ({ - total, - isBalancesLoading, - supportedAssets, - onViewMore, -}: SupportedTokensSectionProps) => { - if (isBalancesLoading) return ; - if (!total) - return ( - - This contract does not hold any assets - - ); - return ( - <> - - {supportedAssets.slice(0, onViewMore ? 4 : undefined).map((balance) => ( - - ))} - - - {supportedAssets.length > 4 && onViewMore && ( - - )} - - ); -}; diff --git a/src/lib/pages/contract-details/components/contract-balances/index.tsx b/src/lib/pages/contract-details/components/contract-balances/index.tsx deleted file mode 100644 index 13747e5bf..000000000 --- a/src/lib/pages/contract-details/components/contract-balances/index.tsx +++ /dev/null @@ -1,52 +0,0 @@ -import { Flex, Heading } from "@chakra-ui/react"; - -import { UnsupportedTokensModal } from "lib/components/modal"; -import { ErrorFetching } from "lib/components/state/ErrorFetching"; -import { useBalanceInfos } from "lib/services/balanceService"; -import type { BechAddr32 } from "lib/types"; - -import { SupportedTokensSection } from "./SupportedTokensSection"; - -interface ContractBalancesProps { - contractAddress: BechAddr32; - amptrackPage?: string; - onViewMore?: () => void; -} - -export const ContractBalances = ({ - contractAddress, - amptrackPage, - onViewMore, -}: ContractBalancesProps) => { - const { supportedAssets, unsupportedAssets, isLoading, totalData, error } = - useBalanceInfos(contractAddress); - - if (error) return ; - - return ( - - - - Assets - - - - - - ); -}; diff --git a/src/lib/pages/contract-details/components/contract-description/index.tsx b/src/lib/pages/contract-details/components/contract-description/index.tsx index 1ccb30cc7..ab40c996e 100644 --- a/src/lib/pages/contract-details/components/contract-description/index.tsx +++ b/src/lib/pages/contract-details/components/contract-description/index.tsx @@ -22,13 +22,7 @@ export const ContractDesc = ({ const isMobile = useMobile(); return ( - + {publicInfo?.description && ( Overview - + Assets + + Delegations + Transactions & Histories @@ -122,17 +135,35 @@ const ContractDetailsBody = observer( - {/* Contract Description Section */} - - {/* Tokens Section */} - + + + + + + + + + {/* Query/Execute commands section */} - + + + + - + diff --git a/src/lib/pages/contract-details/types.ts b/src/lib/pages/contract-details/types.ts index c16229969..0d4ea39f7 100644 --- a/src/lib/pages/contract-details/types.ts +++ b/src/lib/pages/contract-details/types.ts @@ -5,6 +5,7 @@ import { zBechAddr32 } from "lib/types"; export enum TabIndex { Overview = "overview", Assets = "assets", + Delegations = "delegations", TxsHistories = "txs-histories", States = "states", } diff --git a/src/lib/types/delegation.ts b/src/lib/types/delegation.ts new file mode 100644 index 000000000..1b14e1df8 --- /dev/null +++ b/src/lib/types/delegation.ts @@ -0,0 +1,31 @@ +import type { TokenWithValue } from "./asset"; +import type { Validator } from "./validator"; + +export interface StakingParams { + unbondingTime: string; // e.g. "14 days" + maxEntries: number; + bondDenoms: TokenWithValue[]; +} + +export interface Delegation { + validator: Validator; + balances: TokenWithValue[]; +} + +export interface Unbonding { + validator: Validator; + completionTime: Date; + balances: TokenWithValue[]; +} + +export interface Redelegation { + srcValidator: Validator; + dstValidator: Validator; + completionTime: Date; + balances: TokenWithValue[]; +} + +export interface NonRedelegatable { + dstValidator: Validator; + completionTime: Date; +} diff --git a/src/lib/types/index.ts b/src/lib/types/index.ts index c69d84533..0614e62cf 100644 --- a/src/lib/types/index.ts +++ b/src/lib/types/index.ts @@ -10,6 +10,7 @@ export * from "./common"; export * from "./contract"; export * from "./contractState"; export * from "./converter"; +export * from "./delegation"; export * from "./json"; export * from "./LVPair"; export * from "./nft";