From 4210ca41e2734da88d2f0a6dbd1031fdba2228df Mon Sep 17 00:00:00 2001 From: Jennie Alles Date: Tue, 2 May 2023 11:40:21 +0700 Subject: [PATCH 1/2] feat(components): add public account name and description in account detail page --- CHANGELOG.md | 1 + src/lib/pages/account-details/index.tsx | 47 +++++++++++++++++++++++- src/lib/services/publicProjectService.ts | 31 ++++++++++++++++ 3 files changed, 78 insertions(+), 1 deletion(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index 63f15eb46..ef31c98f4 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -64,6 +64,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0 ### Improvements +- [#309](https://github.com/alleslabs/celatone-frontend/pull/309) Add public account name and description in account detail page - [#304](https://github.com/alleslabs/celatone-frontend/pull/304) Remove suffix for token card - [#282](https://github.com/alleslabs/celatone-frontend/pull/282) Change details page top section explorer link to copy link - [#293](https://github.com/alleslabs/celatone-frontend/pull/293) Add comma separator to pagination and total blocks diff --git a/src/lib/pages/account-details/index.tsx b/src/lib/pages/account-details/index.tsx index 49c217c49..af34f3872 100644 --- a/src/lib/pages/account-details/index.tsx +++ b/src/lib/pages/account-details/index.tsx @@ -7,6 +7,7 @@ import { TabPanels, Tabs, Text, + Image, } from "@chakra-ui/react"; import { useRouter } from "next/router"; import { useEffect, useState } from "react"; @@ -15,10 +16,15 @@ import { useValidateAddress } from "lib/app-provider"; import { BackButton } from "lib/components/button"; import { CopyLink } from "lib/components/CopyLink"; import { CustomTab } from "lib/components/CustomTab"; +import { CustomIcon } from "lib/components/icon"; import PageContainer from "lib/components/PageContainer"; import { InvalidState } from "lib/components/state"; import { useAccountDetailsTableCounts } from "lib/model/account"; import { AmpEvent, AmpTrack, AmpTrackUseTab } from "lib/services/amplitude"; +import { + usePublicProjectByAccountAddress, + usePublicProjectBySlug, +} from "lib/services/publicProjectService"; import type { HumanAddr } from "lib/types"; import { formatPrice, getFirstQueryParam, scrollToTop } from "lib/utils"; @@ -53,6 +59,11 @@ const InvalidAccount = () => ; const AccountDetailsBody = ({ accountAddress }: AccountDetailsBodyProps) => { const [tabIndex, setTabIndex] = useState(TabIndex.Overview); const tableHeaderId = "accountDetailsTab"; + const { data: publicInfo } = usePublicProjectByAccountAddress(accountAddress); + const { data: publicInfoBySlug } = usePublicProjectBySlug(publicInfo?.slug); + + const publicDetail = publicInfoBySlug?.details; + const { tableCounts, refetchCodesCount, @@ -70,12 +81,23 @@ const AccountDetailsBody = ({ accountAddress }: AccountDetailsBodyProps) => { scrollToTop(); }; + const displayName = publicInfo?.name || "Account Details"; + return ( <> + {publicDetail?.logo && ( + {publicDetail.name} + )} - Account Details + {displayName} @@ -89,6 +111,29 @@ const AccountDetailsBody = ({ accountAddress }: AccountDetailsBodyProps) => { /> + {publicInfo?.description && ( + + + + + Public Account Description + + + + {publicInfo?.description} + + + )} + +): UseQueryResult => { + const { currentChainRecord } = useWallet(); + const queryFn = useCallback(async () => { + if (!accountAddress) + throw new Error( + "Wallet address not found (usePublicProjectByAccountAddress)" + ); + if (!currentChainRecord) + throw new Error("No chain selected (usePublicProjectByAccountAddress)"); + return axios + .get( + `${CELATONE_API_ENDPOINT}/accounts/${getChainApiPath( + currentChainRecord.chain.chain_name + )}/${currentChainRecord.chain.chain_id}/${accountAddress}` + ) + .then(({ data: projectInfo }) => projectInfo); + }, [accountAddress, currentChainRecord]); + return useQuery( + ["public_project_by_account_address", accountAddress, currentChainRecord], + queryFn, + { + keepPreviousData: true, + enabled: !!accountAddress, + retry: false, + refetchOnWindowFocus: false, + } + ); +}; From ba84bcaf94ef9c2de84fe185e20d98f41502fea1 Mon Sep 17 00:00:00 2001 From: Jennie Alles Date: Tue, 2 May 2023 17:31:56 +0700 Subject: [PATCH 2/2] fix(components): fix as comment --- CHANGELOG.md | 3 --- src/lib/pages/account-details/index.tsx | 2 +- 2 files changed, 1 insertion(+), 4 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index 7752c098b..74db05ccd 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -65,11 +65,8 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0 ### Improvements -<<<<<<< HEAD - [#309](https://github.com/alleslabs/celatone-frontend/pull/309) Add public account name and description in account detail page -======= - [#289](https://github.com/alleslabs/celatone-frontend/pull/289) Add public accounts to public projects ->>>>>>> develop - [#308](https://github.com/alleslabs/celatone-frontend/pull/308) Adjust view more button to full width and fix empty state layout in contract history - [#304](https://github.com/alleslabs/celatone-frontend/pull/304) Remove suffix for token card - [#282](https://github.com/alleslabs/celatone-frontend/pull/282) Change details page top section explorer link to copy link diff --git a/src/lib/pages/account-details/index.tsx b/src/lib/pages/account-details/index.tsx index 2072aff27..21c0747bd 100644 --- a/src/lib/pages/account-details/index.tsx +++ b/src/lib/pages/account-details/index.tsx @@ -82,7 +82,7 @@ const AccountDetailsBody = ({ accountAddress }: AccountDetailsBodyProps) => { scrollToTop(); }; - const displayName = publicInfo?.name || "Account Details"; + const displayName = publicInfo?.name ?? "Account Details"; return ( <>