Skip to content

Commit d4a63a4

Browse files
MananTankMananTank
committed
[PRO-90] Dashboard: Project > Bridge page changes
1 parent eca4ce2 commit d4a63a4

File tree

18 files changed

+217
-247
lines changed

18 files changed

+217
-247
lines changed

‎apps/dashboard/src/@/components/ui/link-with-copy-button.tsx‎

Lines changed: 10 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -12,6 +12,7 @@ export function LinkWithCopyButton(props: {
1212
textToCopy: string;
1313
copyTooltip: string;
1414
className?: string;
15+
linkIconClassName?: string;
1516
}) {
1617
const [isCopied, setIsCopied] = useState(false);
1718
const Icon = isCopied ? CheckIcon : CopyIcon;
@@ -37,8 +38,15 @@ export function LinkWithCopyButton(props: {
3738
target="_blank"
3839
className="text-sm text-muted-foreground hover:underline flex items-center gap-1 tabular-nums flex-1 truncate hover:text-foreground group"
3940
>
40-
<span className="max-w-full truncate">{props.textToShow}</span>
41-
<ArrowUpRightIcon className="size-3.5 opacity-70 shrink-0 group-hover:opacity-100" />
41+
<span className="max-w-full truncate tabular-nums">
42+
{props.textToShow}
43+
</span>
44+
<ArrowUpRightIcon
45+
className={cn(
46+
"size-3.5 opacity-70 shrink-0 group-hover:opacity-100",
47+
props.linkIconClassName,
48+
)}
49+
/>
4250
</Link>
4351
</div>
4452
);

‎apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/bridge/QuickstartSection.client.tsx‎

Lines changed: 17 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -24,40 +24,43 @@ export function QuickStartSection(props: {
2424
</div>
2525
<div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-6">
2626
<FeatureCard
27-
title="Cross-chain Swap Tokens"
27+
title="Buy Widget Component"
2828
icon={ArrowRightLeftIcon}
29-
setupTime={5}
3029
id="swap_tokens"
31-
features={["Swap any token", "Cross-chain swap"]}
32-
description="Swap tokens cross-chain with dedicated swapping endpoints."
30+
features={[
31+
"React component",
32+
"Cross-chain token swaps across 85+ blockchains",
33+
"Fiat onramp support to buy tokens with credit/debit cards",
34+
"Customizable UI",
35+
]}
36+
description={undefined}
3337
link={{
3438
href: `https://portal.thirdweb.com/bridge/swap`,
35-
label: "Setup Swap",
39+
label: "Get Started",
3640
}}
3741
/>
3842

3943
<FeatureCard
40-
title="Earn Fees"
41-
description="Setup fees to earn any time a user swaps or bridges funds."
44+
title="Bridge Widget Script"
45+
description={undefined}
4246
icon={BadgeDollarSignIcon}
4347
id="fees"
44-
setupTime={1}
4548
features={[
46-
"Fees on every purchase",
47-
"Custom percentage",
48-
"Directly to your wallet",
49+
"Integrate with a script tag",
50+
"Cross-chain token swaps across 85+ blockchains",
51+
"Fiat onramp support to buy tokens with credit/debit cards",
52+
"Customizable UI",
4953
]}
5054
link={{
51-
href: `/team/${props.teamSlug}/${props.projectSlug}/settings/payments`,
52-
label: "Configure Fees",
55+
href: `/team/${props.teamSlug}/${props.projectSlug}/bridge/configuration`,
56+
label: "Get Started",
5357
}}
5458
/>
5559

5660
<FeatureCard
5761
title="Webhooks"
5862
description="Create Webhooks to get notified on each purchase or transaction."
5963
icon={WebhookIcon}
60-
setupTime={5}
6164
id="webhooks"
6265
features={["Instant events", "Transaction verification"]}
6366
link={{

‎apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/settings/payments/PayConfig.tsx‎ renamed to ‎apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/bridge/configuration/PayConfig.tsx‎

File renamed without changes.

‎apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/settings/payments/page.tsx‎ renamed to ‎apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/bridge/configuration/page.tsx‎

Lines changed: 11 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -3,9 +3,10 @@ import { getAuthToken } from "@/api/auth-token";
33
import { getProject } from "@/api/project/projects";
44
import { getTeamBySlug } from "@/api/team/get-team";
55
import { getFees } from "@/api/universal-bridge/developer";
6+
import { getClientThirdwebClient } from "@/constants/thirdweb-client.client";
67
import { getProjectWallet } from "@/lib/server/project-wallet";
78
import { loginRedirect } from "@/utils/redirects";
8-
import { ProjectSettingsBreadcrumb } from "../_components/project-settings-breadcrumb";
9+
import { RouteDiscovery } from "../RouteDiscovery";
910
import { PayConfig } from "./PayConfig";
1011

1112
export default async function Page(props: {
@@ -21,7 +22,7 @@ export default async function Page(props: {
2122
]);
2223

2324
if (!authToken) {
24-
loginRedirect(`/team/${team_slug}/${project_slug}/settings/payments`);
25+
loginRedirect(`/team/${team_slug}/${project_slug}/bridge/configuration`);
2526
}
2627

2728
if (!team) {
@@ -56,14 +57,13 @@ export default async function Page(props: {
5657
};
5758
}
5859

59-
return (
60-
<div className="flex flex-col gap-5">
61-
<ProjectSettingsBreadcrumb
62-
teamSlug={team_slug}
63-
projectSlug={project_slug}
64-
page="Payments"
65-
/>
60+
const client = getClientThirdwebClient({
61+
jwt: authToken,
62+
teamId: project.teamId,
63+
});
6664

65+
return (
66+
<div className="flex flex-col gap-6">
6767
<PayConfig
6868
fees={fees}
6969
project={project}
@@ -72,6 +72,8 @@ export default async function Page(props: {
7272
teamSlug={team_slug}
7373
authToken={authToken}
7474
/>
75+
76+
<RouteDiscovery client={client} project={project} />
7577
</div>
7678
);
7779
}

‎apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/bridge/layout.tsx‎

Lines changed: 83 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,83 @@
1+
import { WebhookIcon } from "lucide-react";
2+
import { redirect } from "next/navigation";
3+
import { getAuthToken } from "@/api/auth-token";
4+
import { getProject } from "@/api/project/projects";
5+
import { ProjectPage } from "@/components/blocks/project-page/project-page";
6+
import { getClientThirdwebClient } from "@/constants/thirdweb-client.client";
7+
import { BridgeIcon } from "@/icons/BridgeIcon";
8+
import { loginRedirect } from "@/utils/redirects";
9+
10+
export default async function Layout(props: {
11+
params: Promise<{
12+
team_slug: string;
13+
project_slug: string;
14+
}>;
15+
children: React.ReactNode;
16+
}) {
17+
const [params, authToken] = await Promise.all([props.params, getAuthToken()]);
18+
19+
const project = await getProject(params.team_slug, params.project_slug);
20+
21+
if (!authToken) {
22+
loginRedirect(`/team/${params.team_slug}/${params.project_slug}/bridge`);
23+
}
24+
25+
if (!project) {
26+
redirect(`/team/${params.team_slug}`);
27+
}
28+
29+
const client = getClientThirdwebClient({
30+
jwt: authToken,
31+
teamId: project.teamId,
32+
});
33+
34+
return (
35+
<ProjectPage
36+
header={{
37+
client,
38+
title: "Bridge",
39+
icon: BridgeIcon,
40+
description: (
41+
<>
42+
Bridge lets developers swap and transfer any token across any chain
43+
instantly
44+
</>
45+
),
46+
actions: {
47+
secondary: {
48+
href: `/team/${params.team_slug}/${params.project_slug}/webhooks/payments`,
49+
label: "Webhooks",
50+
icon: <WebhookIcon className="size-3.5 text-muted-foreground" />,
51+
},
52+
},
53+
links: [
54+
{
55+
type: "docs",
56+
href: "https://portal.thirdweb.com/bridge",
57+
},
58+
{
59+
type: "playground",
60+
href: "https://playground.thirdweb.com/bridge/swap-widget",
61+
},
62+
{
63+
type: "api",
64+
href: "https://api.thirdweb.com/reference#tag/bridge",
65+
},
66+
],
67+
}}
68+
tabs={[
69+
{
70+
name: "Overview",
71+
path: `/team/${params.team_slug}/${params.project_slug}/bridge`,
72+
exactMatch: true,
73+
},
74+
{
75+
name: "Configuration",
76+
path: `/team/${params.team_slug}/${params.project_slug}/bridge/configuration`,
77+
},
78+
]}
79+
>
80+
{props.children}
81+
</ProjectPage>
82+
);
83+
}

‎apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/bridge/page.tsx‎

Lines changed: 20 additions & 67 deletions
Original file line numberDiff line numberDiff line change
@@ -1,17 +1,12 @@
1-
import { WebhookIcon } from "lucide-react";
21
import { redirect } from "next/navigation";
32
import { ResponsiveSearchParamsProvider } from "responsive-rsc";
43
import { getAuthToken } from "@/api/auth-token";
54
import { getProject } from "@/api/project/projects";
6-
import { ProjectPage } from "@/components/blocks/project-page/project-page";
75
import { getClientThirdwebClient } from "@/constants/thirdweb-client.client";
8-
import { BridgeIcon } from "@/icons/BridgeIcon";
96
import { loginRedirect } from "@/utils/redirects";
107
import { PayAnalytics } from "../payments/components/PayAnalytics";
118
import { getUniversalBridgeFiltersFromSearchParams } from "../payments/components/time";
129
import { QuickStartSection } from "./QuickstartSection.client";
13-
import { RouteDiscovery } from "./RouteDiscovery";
14-
import { ViewTxStatus } from "./view-tx-status";
1510

1611
export default async function Page(props: {
1712
params: Promise<{
@@ -51,69 +46,27 @@ export default async function Page(props: {
5146
});
5247

5348
return (
54-
<ProjectPage
55-
header={{
56-
client,
57-
title: "Bridge",
58-
icon: BridgeIcon,
59-
description: (
60-
<>
61-
Bridge lets developers swap and transfer any token across any chain
62-
instantly
63-
</>
64-
),
65-
actions: {
66-
secondary: {
67-
href: `/team/${params.team_slug}/${params.project_slug}/webhooks/payments`,
68-
label: "Webhooks",
69-
icon: <WebhookIcon className="size-3.5 text-muted-foreground" />,
70-
},
71-
},
72-
settings: {
73-
href: `/team/${params.team_slug}/${params.project_slug}/settings/payments`,
74-
},
75-
links: [
76-
{
77-
type: "docs",
78-
href: "https://portal.thirdweb.com/bridge",
79-
},
80-
{
81-
type: "playground",
82-
href: "https://playground.thirdweb.com/bridge/swap-widget",
83-
},
84-
{
85-
type: "api",
86-
href: "https://api.thirdweb.com/reference#tag/bridge",
87-
},
88-
],
89-
}}
90-
>
91-
<div className="flex flex-col gap-6">
92-
<ResponsiveSearchParamsProvider value={searchParams}>
93-
<PayAnalytics
94-
client={client}
95-
interval={interval}
96-
projectClientId={project.publishableKey}
97-
projectId={project.id}
98-
range={range}
99-
teamId={project.teamId}
100-
authToken={authToken}
101-
/>
102-
</ResponsiveSearchParamsProvider>
49+
<div className="flex flex-col gap-6">
50+
<ResponsiveSearchParamsProvider value={searchParams}>
51+
<PayAnalytics
52+
client={client}
53+
interval={interval}
54+
projectClientId={project.publishableKey}
55+
projectId={project.id}
56+
range={range}
57+
teamId={project.teamId}
58+
authToken={authToken}
59+
/>
60+
</ResponsiveSearchParamsProvider>
10361

104-
<RouteDiscovery client={client} project={project} />
105-
106-
<ViewTxStatus client={client} />
107-
108-
<div className="pt-4">
109-
<QuickStartSection
110-
projectSlug={params.project_slug}
111-
teamSlug={params.team_slug}
112-
clientId={project.publishableKey}
113-
teamId={project.teamId}
114-
/>
115-
</div>
62+
<div className="pt-4">
63+
<QuickStartSection
64+
projectSlug={params.project_slug}
65+
teamSlug={params.team_slug}
66+
clientId={project.publishableKey}
67+
teamId={project.teamId}
68+
/>
11669
</div>
117-
</ProjectPage>
70+
</div>
11871
);
11972
}

‎apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/bridge/view-tx-status.tsx‎

Lines changed: 0 additions & 72 deletions
This file was deleted.

0 commit comments

Comments
 (0)