Skip to content

Commit 034cf8d

Browse files
MananTankMananTank
committed
Dashboard: Published Contract page UI improvements, Fix audit link
1 parent cf401be commit 034cf8d

File tree

18 files changed

+304
-325
lines changed

18 files changed

+304
-325
lines changed

‎apps/dashboard/src/@/components/blocks/TokenSelector.tsx

Lines changed: 5 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -11,9 +11,9 @@ import { SelectWithSearch } from "@/components/blocks/select-with-search";
1111
import { Badge } from "@/components/ui/badge";
1212
import { useAllChainsData } from "@/hooks/chains/allChains";
1313
import { useTokensData } from "@/hooks/tokens";
14-
import { replaceIpfsUrl } from "@/lib/sdk";
1514
import { cn } from "@/lib/utils";
1615
import { fallbackChainIcon } from "@/utils/chain-icons";
16+
import { resolveSchemeWithErrorHandler } from "@/utils/resolveSchemeWithErrorHandler";
1717
import { Spinner } from "../ui/Spinner/Spinner";
1818

1919
type Option = { label: string; value: string };
@@ -122,7 +122,10 @@ export function TokenSelector(props: {
122122
return option.label;
123123
}
124124
const resolvedSrc = token.iconUri
125-
? replaceIpfsUrl(token.iconUri, props.client)
125+
? resolveSchemeWithErrorHandler({
126+
client: props.client,
127+
uri: token.iconUri,
128+
})
126129
: fallbackChainIcon;
127130

128131
return (

‎apps/dashboard/src/@/components/contract-components/contract-deploy-form/platform-fee-fieldset.tsx

Lines changed: 9 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,8 @@
1-
import Link from "next/link";
21
import type { ThirdwebClient } from "thirdweb";
32
import { BasisPointsInput } from "@/components/blocks/BasisPointsInput";
43
import { FormFieldSetup } from "@/components/blocks/FormFieldSetup";
54
import { SolidityInput } from "@/components/solidity-inputs";
5+
import { UnderlineLink } from "@/components/ui/UnderlineLink";
66
import { Fieldset } from "./common";
77
import type { CustomContractDeploymentForm } from "./custom-contract";
88

@@ -78,30 +78,28 @@ export const PlatformFeeFieldset: React.FC<PlatformFeeFieldsetProps> = ({
7878
</FormFieldSetup>
7979
</>
8080
) : isMarketplace ? (
81-
<p className="mb-3 pt-4 text-muted-foreground text-sm italic">
81+
<p className="text-muted-foreground text-sm leading-relaxed">
8282
A 2.5% platform fee is deducted from each sale to support ongoing
83-
platform operations and improvements.{" "}
84-
<Link
85-
className="text-blue-500 underline"
83+
platform operations and improvements. <br />
84+
<UnderlineLink
8685
href={"https://thirdweb.com/pricing"}
8786
rel="noopener noreferrer"
8887
target="_blank"
8988
>
9089
See fee breakdown on pricing page.
91-
</Link>
90+
</UnderlineLink>
9291
</p>
9392
) : (
94-
<p className="mb-3 pt-4 text-muted-foreground text-sm italic">
93+
<p className="text-muted-foreground text-sm leading-relaxed">
9594
A 2.5% platform fee is deducted from each primary sale price to
96-
support ongoing platform operations and improvements.{" "}
97-
<Link
98-
className="text-blue-500 underline"
95+
support ongoing platform operations and improvements. <br />
96+
<UnderlineLink
9997
href={"https://thirdweb.com/pricing"}
10098
rel="noopener noreferrer"
10199
target="_blank"
102100
>
103101
See fee breakdown on pricing page.
104-
</Link>
102+
</UnderlineLink>
105103
</p>
106104
)}
107105
</div>

‎apps/dashboard/src/@/components/contract-components/publisher/publisher-header.tsx

Lines changed: 56 additions & 65 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,11 @@
11
"use client";
22

3-
import { ExternalLinkIcon } from "lucide-react";
3+
import { Edit3Icon } from "lucide-react";
44
import Link from "next/link";
55
import { type ThirdwebClient, ZERO_ADDRESS } from "thirdweb";
66
import {
77
AccountAddress,
88
AccountAvatar,
9-
AccountBlobbie,
109
AccountName,
1110
AccountProvider,
1211
} from "thirdweb/react";
@@ -15,77 +14,69 @@ import { useEns } from "@/hooks/contract-hooks";
1514
import { replaceDeployerAddress } from "@/lib/publisher-utils";
1615
import { shortenIfAddress } from "@/utils/usedapp-external";
1716

18-
interface PublisherHeaderProps {
19-
wallet: string;
20-
client: ThirdwebClient;
21-
}
22-
export const PublisherHeader: React.FC<PublisherHeaderProps> = ({
17+
export function PublisherLink({
2318
wallet,
2419
client,
25-
}) => {
20+
}: {
21+
wallet: string;
22+
client: ThirdwebClient;
23+
}) {
2624
const ensQuery = useEns({
2725
addressOrEnsName: wallet,
2826
client,
2927
});
3028

3129
return (
32-
<div>
33-
<h4 className="font-medium text-base mb-3">Published by</h4>
34-
<AccountProvider
35-
// passing zero address during loading time to prevent the component from crashing
36-
address={ensQuery.data?.address || ZERO_ADDRESS}
37-
client={client}
38-
>
39-
<div className="flex items-center gap-3 relative">
40-
<div className="translate-y-0.5">
41-
<AccountAvatar
42-
className="size-[34px] rounded-full border border-border border-solid object-cover"
43-
fallbackComponent={
44-
<AccountBlobbie className="size-[34px] rounded-full" />
45-
}
46-
loadingComponent={
47-
<Skeleton className="size-[34px] rounded-full" />
48-
}
49-
/>
50-
</div>
51-
52-
<div className="space-y-1">
53-
<Link
54-
className="hover:underline leading-none before:absolute before:inset-0"
55-
href={replaceDeployerAddress(
56-
`/${ensQuery.data?.ensName || wallet}`,
57-
)}
58-
rel="noopener noreferrer"
59-
target="_blank"
60-
>
61-
<AccountName
62-
className="text-base leading-none font-medium"
63-
fallbackComponent={
64-
// When social profile API support other TLDs as well - we can remove this condition
65-
ensQuery.data?.ensName ? (
66-
<span className="text-base leading-none font-medium">
67-
{ensQuery.data?.ensName}
68-
</span>
69-
) : (
70-
<AccountAddress
71-
formatFn={(addr) =>
72-
shortenIfAddress(replaceDeployerAddress(addr))
73-
}
74-
/>
75-
)
76-
}
77-
formatFn={(name) => replaceDeployerAddress(name)}
78-
loadingComponent={<Skeleton className="h-6 w-40" />}
79-
/>
80-
</Link>
30+
<AccountProvider
31+
// passing zero address during loading time to prevent the component from crashing
32+
address={ensQuery.data?.address || ZERO_ADDRESS}
33+
client={client}
34+
>
35+
<div className="flex items-center gap-2.5 relative">
36+
<div>
37+
<AccountAvatar
38+
className="size-[34px] rounded-full border border-border border-solid object-cover"
39+
fallbackComponent={
40+
<div className="size-[34px] rounded-full flex items-center justify-center border bg-card">
41+
<Edit3Icon className="size-3.5 text-muted-foreground" />
42+
</div>
43+
}
44+
loadingComponent={<Skeleton className="size-[34px] rounded-full" />}
45+
/>
46+
</div>
8147

82-
<span className="text-sm text-muted-foreground flex items-center gap-1.5 leading-none">
83-
View all published contracts{" "}
84-
<ExternalLinkIcon className="size-3 text-muted-foreground" />
85-
</span>
48+
<Link
49+
className="hover:underline before:absolute before:inset-0 space-y-1.5"
50+
href={replaceDeployerAddress(`/${ensQuery.data?.ensName || wallet}`)}
51+
rel="noopener noreferrer"
52+
target="_blank"
53+
>
54+
<div className="text-sm font-medium text-foreground leading-none">
55+
Published by
8656
</div>
87-
</div>
88-
</AccountProvider>
89-
</div>
57+
58+
<AccountName
59+
className="text-sm text-foreground leading-none"
60+
fallbackComponent={
61+
// When social profile API support other TLDs as well - we can remove this condition
62+
ensQuery.data?.ensName ? (
63+
<span className="text-sm text-muted-foreground leading-none">
64+
{ensQuery.data?.ensName}
65+
</span>
66+
) : (
67+
<AccountAddress
68+
className="text-sm text-muted-foreground leading-none"
69+
formatFn={(addr) =>
70+
shortenIfAddress(replaceDeployerAddress(addr))
71+
}
72+
/>
73+
)
74+
}
75+
formatFn={(name) => replaceDeployerAddress(name)}
76+
loadingComponent={<Skeleton className="h-[17px] w-40" />}
77+
/>
78+
</Link>
79+
</div>
80+
</AccountProvider>
9081
);
91-
};
82+
}

‎apps/dashboard/src/@/components/contract-components/shared/contract-id-image.tsx

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@ import Image from "next/image";
55
import type { FetchDeployMetadataResult } from "thirdweb/contract";
66
import { DASHBOARD_THIRDWEB_SECRET_KEY } from "@/constants/server-envs";
77
import { getConfiguredThirdwebClient } from "@/constants/thirdweb.server";
8-
import { replaceIpfsUrl } from "@/lib/sdk";
8+
import { resolveSchemeWithErrorHandler } from "@/utils/resolveSchemeWithErrorHandler";
99
import generalContractIcon from "../../../../../public/assets/tw-icons/general.png";
1010

1111
type ContractIdImageProps = {
@@ -29,13 +29,13 @@ export const ContractIdImage: React.FC<ContractIdImageProps> = ({
2929
className="size-8 rounded-full"
3030
src={
3131
DASHBOARD_THIRDWEB_SECRET_KEY
32-
? replaceIpfsUrl(
33-
logo,
34-
getConfiguredThirdwebClient({
32+
? resolveSchemeWithErrorHandler({
33+
client: getConfiguredThirdwebClient({
3534
secretKey: DASHBOARD_THIRDWEB_SECRET_KEY,
3635
teamId: undefined,
3736
}),
38-
)
37+
uri: logo,
38+
})
3939
: logo
4040
}
4141
/>

‎apps/dashboard/src/@/components/contracts/code-overview.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -657,7 +657,7 @@ export function CodeOverview(props: {
657657

658658
<div className="flex flex-col gap-4">
659659
<div className="space-y-2">
660-
<h2 className="text-lg font-semibold tracking-tight">
660+
<h2 className="text-2xl font-semibold tracking-tight">
661661
{isAccountFactory
662662
? "Direct contract interaction (advanced)"
663663
: chainInfo
@@ -851,7 +851,7 @@ function AccentButton(props: {
851851
return (
852852
<Button
853853
className={cn(
854-
"text-sm justify-start h-auto py-1 px-2 text-muted-foreground",
854+
"text-sm justify-start h-auto py-1.5 px-2 text-muted-foreground font-normal font-mono",
855855
props.isActive && "text-foreground bg-accent",
856856
)}
857857
onClick={props.onClick}

0 commit comments

Comments
 (0)