Skip to content

Commit 35a909a

Browse files
WIP brige embed (#7222)
Co-authored-by: gregfromstl <[email protected]>
1 parent 9f6c1a4 commit 35a909a

File tree

112 files changed

+13645
-256
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

112 files changed

+13645
-256
lines changed

.changeset/icy-eyes-show.md

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
---
2+
"thirdweb": minor
3+
---
4+
5+
Updates PayEmbed with refreshed UI and multi-step support

AGENTS.md

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -20,6 +20,7 @@ Welcome, AI copilots! This guide captures the coding standards, architectural de
2020
- Biome governs formatting and linting; its rules live in biome.json.
2121
- Run pnpm biome check --apply before committing.
2222
- Avoid editor‑specific configs; rely on the shared settings.
23+
- make sure everything builds after each file change by running `pnpm build`
2324

2425
2526

@@ -39,7 +40,8 @@ Welcome, AI copilots! This guide captures the coding standards, architectural de
3940
- Co‑locate tests: foo.ts ↔ foo.test.ts.
4041
- Use real function invocations with stub data; avoid brittle mocks.
4142
- For network interactions, use Mock Service Worker (MSW) to intercept fetch/HTTP calls, mocking only scenarios that are hard to reproduce.
42-
- Keep tests deterministic and side‑effect free; Jest is pre‑configured.
43+
- Keep tests deterministic and side‑effect free; Vitest is pre‑configured.
44+
- to run the tests: `cd packages thirdweb & pnpm test:dev <filename>`
4345

4446
4547

apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/(chainPage)/components/client/PayModal.tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -44,8 +44,8 @@ export function PayModalButton(props: {
4444
payOptions={{
4545
onPurchaseSuccess(info) {
4646
if (
47-
info.type === "crypto" &&
48-
info.status.status !== "NOT_FOUND"
47+
info?.type === "crypto" &&
48+
info?.status.status !== "NOT_FOUND"
4949
) {
5050
trackEvent({
5151
category: "pay",
@@ -58,7 +58,7 @@ export function PayModalButton(props: {
5858
});
5959
}
6060

61-
if (info.type === "fiat" && info.status.status !== "NOT_FOUND") {
61+
if (info?.type === "fiat" && info.status.status !== "NOT_FOUND") {
6262
trackEvent({
6363
category: "pay",
6464
action: "buy",

apps/dashboard/src/app/pay/components/client/PayPageEmbed.client.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -63,7 +63,7 @@ export function PayPageEmbed({
6363
onPurchaseSuccess: (result) => {
6464
if (!redirectUri) return;
6565
const url = new URL(redirectUri);
66-
switch (result.type) {
66+
switch (result?.type) {
6767
case "crypto": {
6868
url.searchParams.set("status", result.status.status);
6969
if (

apps/dashboard/src/components/buttons/MismatchButton.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -293,7 +293,7 @@ export const MismatchButton = forwardRef<
293293
payOptions={{
294294
onPurchaseSuccess(info) {
295295
if (
296-
info.type === "crypto" &&
296+
info?.type === "crypto" &&
297297
info.status.status !== "NOT_FOUND"
298298
) {
299299
trackEvent({
@@ -308,7 +308,7 @@ export const MismatchButton = forwardRef<
308308
}
309309

310310
if (
311-
info.type === "fiat" &&
311+
info?.type === "fiat" &&
312312
info.status.status !== "NOT_FOUND"
313313
) {
314314
trackEvent({

apps/playground-web/src/app/connect/pay/commerce/page.tsx

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -63,7 +63,8 @@ function BuyMerch() {
6363
sellerAddress: "0xEb0effdFB4dC5b3d5d3aC6ce29F3ED213E95d675",
6464
},
6565
metadata: {
66-
name: "Black Hoodie (Size L)",
66+
name: "Black Hoodie",
67+
description: "Size L. Ships worldwide.",
6768
image: "/drip-hoodie.png",
6869
},
6970
}}

apps/playground-web/src/app/connect/pay/components/types.ts

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -12,6 +12,7 @@ export type PayEmbedPlaygroundOptions = {
1212
mode?: "fund_wallet" | "direct_payment" | "transaction";
1313
title: string | undefined;
1414
image: string | undefined;
15+
description: string | undefined;
1516

1617
// fund_wallet mode options
1718
buyTokenAddress: string | undefined;

apps/playground-web/src/app/connect/pay/embed/LeftSection.tsx

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -496,6 +496,26 @@ export function LeftSection(props: {
496496
/>
497497
</div>
498498
</div>
499+
500+
{/* Modal description */}
501+
<div className="flex flex-col gap-2">
502+
<Label htmlFor="modal-description">Image</Label>
503+
<Input
504+
id="modal-description"
505+
placeholder="Your own description here"
506+
className="bg-card"
507+
value={options.payOptions.description}
508+
onChange={(e) =>
509+
setOptions((v) => ({
510+
...v,
511+
payOptions: {
512+
...payOptions,
513+
description: e.target.value,
514+
},
515+
}))
516+
}
517+
/>
518+
</div>
499519
</div>
500520
</CollapsibleSection>
501521

apps/playground-web/src/app/connect/pay/embed/RightSection.tsx

Lines changed: 10 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -70,15 +70,19 @@ export function RightSection(props: {
7070
(props.options.payOptions.mode === "transaction"
7171
? "Transaction"
7272
: props.options.payOptions.mode === "direct_payment"
73-
? "Purchase"
73+
? "Product Name"
7474
: "Buy Crypto"),
75+
description:
76+
props.options.payOptions.description || "Your own description here",
7577
image:
7678
props.options.payOptions.image ||
77-
`https://placehold.co/600x400/${
78-
props.options.theme.type === "dark"
79-
? "1d1d23/7c7a85"
80-
: "f2eff3/6f6d78"
81-
}?text=Your%20Product%20Here&font=roboto`,
79+
props.options.payOptions.mode === "direct_payment"
80+
? `https://placehold.co/600x400/${
81+
props.options.theme.type === "dark"
82+
? "1d1d23/7c7a85"
83+
: "f2eff3/6f6d78"
84+
}?text=Your%20Product%20Here&font=roboto`
85+
: undefined,
8286
},
8387

8488
// Mode-specific options

apps/playground-web/src/app/connect/pay/embed/page.tsx

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -17,6 +17,7 @@ const defaultConnectOptions: PayEmbedPlaygroundOptions = {
1717
mode: "fund_wallet",
1818
title: "",
1919
image: "",
20+
description: "",
2021
buyTokenAddress: NATIVE_TOKEN_ADDRESS,
2122
buyTokenAmount: "0.01",
2223
buyTokenChain: base,

0 commit comments

Comments
 (0)