@b3dotfun/sdk 0.0.40-alpha.0 → 0.0.40-alpha.10
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/anyspend/react/components/AnySpend.js +1 -1
- package/dist/cjs/anyspend/react/components/AnyspendDepositHype.js +1 -1
- package/dist/cjs/anyspend/react/components/common/CryptoReceiveSection.js +38 -36
- package/dist/cjs/anyspend/react/components/common/OrderDetails.js +1 -4
- package/dist/cjs/anyspend/react/components/common/PanelOnramp.d.ts +3 -1
- package/dist/cjs/anyspend/react/components/common/PanelOnramp.js +7 -6
- package/dist/cjs/anyspend/react/contexts/FeatureFlagsContext.d.ts +11 -0
- package/dist/cjs/anyspend/react/contexts/FeatureFlagsContext.js +21 -0
- package/dist/cjs/anyspend/react/hooks/useAnyspendFlow.d.ts +2 -0
- package/dist/cjs/anyspend/react/hooks/useAnyspendFlow.js +12 -5
- package/dist/cjs/anyspend/react/providers/AnyspendProvider.d.ts +5 -2
- package/dist/cjs/anyspend/react/providers/AnyspendProvider.js +5 -3
- package/dist/cjs/anyspend/react/providers/index.d.ts +1 -0
- package/dist/cjs/anyspend/react/providers/index.js +3 -0
- package/dist/cjs/anyspend/types/api.d.ts +10 -0
- package/dist/cjs/anyspend/utils/chain.js +1 -1
- package/dist/cjs/bondkit/bondkitToken.d.ts +37 -2
- package/dist/cjs/bondkit/bondkitToken.js +268 -2
- package/dist/cjs/bondkit/bondkitTokenFactory.d.ts +1 -1
- package/dist/cjs/bondkit/bondkitTokenFactory.js +2 -2
- package/dist/cjs/bondkit/config.d.ts +1 -1
- package/dist/cjs/bondkit/config.js +5 -2
- package/dist/cjs/bondkit/constants.d.ts +4 -0
- package/dist/cjs/bondkit/constants.js +6 -1
- package/dist/cjs/bondkit/index.d.ts +1 -0
- package/dist/cjs/bondkit/index.js +4 -1
- package/dist/cjs/bondkit/swapService.d.ts +43 -0
- package/dist/cjs/bondkit/swapService.js +373 -0
- package/dist/cjs/bondkit/types.d.ts +10 -4
- package/dist/cjs/bondkit/types.js +4 -5
- package/dist/cjs/global-account/react/components/B3Provider/B3Provider.d.ts +4 -3
- package/dist/cjs/global-account/react/components/B3Provider/B3Provider.js +35 -9
- package/dist/cjs/global-account/react/components/LinkAccount/LinkAccount.js +63 -3
- package/dist/cjs/global-account/react/components/ManageAccount/ManageAccount.js +35 -2
- package/dist/cjs/global-account/react/components/SignInWithB3/steps/LoginStepCustom.js +4 -3
- package/dist/cjs/global-account/react/hooks/useAuthentication.js +1 -2
- package/dist/cjs/global-account/react/hooks/useUnifiedChainSwitchAndExecute.js +5 -2
- package/dist/esm/anyspend/react/components/AnySpend.js +1 -1
- package/dist/esm/anyspend/react/components/AnyspendDepositHype.js +1 -1
- package/dist/esm/anyspend/react/components/common/CryptoReceiveSection.js +38 -36
- package/dist/esm/anyspend/react/components/common/OrderDetails.js +1 -4
- package/dist/esm/anyspend/react/components/common/PanelOnramp.d.ts +3 -1
- package/dist/esm/anyspend/react/components/common/PanelOnramp.js +7 -6
- package/dist/esm/anyspend/react/contexts/FeatureFlagsContext.d.ts +11 -0
- package/dist/esm/anyspend/react/contexts/FeatureFlagsContext.js +17 -0
- package/dist/esm/anyspend/react/hooks/useAnyspendFlow.d.ts +2 -0
- package/dist/esm/anyspend/react/hooks/useAnyspendFlow.js +12 -5
- package/dist/esm/anyspend/react/providers/AnyspendProvider.d.ts +5 -2
- package/dist/esm/anyspend/react/providers/AnyspendProvider.js +5 -3
- package/dist/esm/anyspend/react/providers/index.d.ts +1 -0
- package/dist/esm/anyspend/react/providers/index.js +1 -0
- package/dist/esm/anyspend/types/api.d.ts +10 -0
- package/dist/esm/anyspend/utils/chain.js +1 -1
- package/dist/esm/bondkit/bondkitToken.d.ts +37 -2
- package/dist/esm/bondkit/bondkitToken.js +268 -2
- package/dist/esm/bondkit/bondkitTokenFactory.d.ts +1 -1
- package/dist/esm/bondkit/bondkitTokenFactory.js +2 -2
- package/dist/esm/bondkit/config.d.ts +1 -1
- package/dist/esm/bondkit/config.js +5 -2
- package/dist/esm/bondkit/constants.d.ts +4 -0
- package/dist/esm/bondkit/constants.js +5 -0
- package/dist/esm/bondkit/index.d.ts +1 -0
- package/dist/esm/bondkit/index.js +2 -0
- package/dist/esm/bondkit/swapService.d.ts +43 -0
- package/dist/esm/bondkit/swapService.js +369 -0
- package/dist/esm/bondkit/types.d.ts +10 -4
- package/dist/esm/bondkit/types.js +4 -5
- package/dist/esm/global-account/react/components/B3Provider/B3Provider.d.ts +4 -3
- package/dist/esm/global-account/react/components/B3Provider/B3Provider.js +36 -9
- package/dist/esm/global-account/react/components/LinkAccount/LinkAccount.js +65 -5
- package/dist/esm/global-account/react/components/ManageAccount/ManageAccount.js +35 -2
- package/dist/esm/global-account/react/components/SignInWithB3/steps/LoginStepCustom.js +3 -2
- package/dist/esm/global-account/react/hooks/useAuthentication.js +1 -2
- package/dist/esm/global-account/react/hooks/useUnifiedChainSwitchAndExecute.js +5 -2
- package/dist/styles/index.css +1 -1
- package/dist/types/anyspend/react/components/common/PanelOnramp.d.ts +3 -1
- package/dist/types/anyspend/react/contexts/FeatureFlagsContext.d.ts +11 -0
- package/dist/types/anyspend/react/hooks/useAnyspendFlow.d.ts +2 -0
- package/dist/types/anyspend/react/providers/AnyspendProvider.d.ts +5 -2
- package/dist/types/anyspend/react/providers/index.d.ts +1 -0
- package/dist/types/anyspend/types/api.d.ts +10 -0
- package/dist/types/bondkit/bondkitToken.d.ts +37 -2
- package/dist/types/bondkit/bondkitTokenFactory.d.ts +1 -1
- package/dist/types/bondkit/config.d.ts +1 -1
- package/dist/types/bondkit/constants.d.ts +4 -0
- package/dist/types/bondkit/index.d.ts +1 -0
- package/dist/types/bondkit/swapService.d.ts +43 -0
- package/dist/types/bondkit/types.d.ts +10 -4
- package/dist/types/global-account/react/components/B3Provider/B3Provider.d.ts +4 -3
- package/package.json +6 -5
- package/src/anyspend/react/components/AnySpend.tsx +1 -0
- package/src/anyspend/react/components/AnyspendDepositHype.tsx +1 -0
- package/src/anyspend/react/components/common/CryptoReceiveSection.tsx +55 -45
- package/src/anyspend/react/components/common/OrderDetails.tsx +2 -5
- package/src/anyspend/react/components/common/PanelOnramp.tsx +21 -15
- package/src/anyspend/react/contexts/FeatureFlagsContext.tsx +34 -0
- package/src/anyspend/react/hooks/useAnyspendFlow.ts +12 -5
- package/src/anyspend/react/providers/AnyspendProvider.tsx +11 -6
- package/src/anyspend/react/providers/index.ts +1 -0
- package/src/anyspend/types/api.ts +10 -0
- package/src/anyspend/types/api_req_res.ts +6 -10
- package/src/anyspend/utils/chain.ts +1 -1
- package/src/bondkit/bondkitToken.ts +323 -3
- package/src/bondkit/bondkitTokenFactory.ts +2 -2
- package/src/bondkit/config.ts +5 -2
- package/src/bondkit/constants.ts +7 -0
- package/src/bondkit/index.ts +3 -0
- package/src/bondkit/swapService.ts +461 -0
- package/src/bondkit/types.ts +12 -5
- package/src/global-account/react/components/B3Provider/B3Provider.tsx +51 -15
- package/src/global-account/react/components/LinkAccount/LinkAccount.tsx +106 -32
- package/src/global-account/react/components/ManageAccount/ManageAccount.tsx +60 -5
- package/src/global-account/react/components/SignInWithB3/steps/LoginStepCustom.tsx +4 -2
- package/src/global-account/react/hooks/useAuthentication.ts +1 -2
- package/src/global-account/react/hooks/useUnifiedChainSwitchAndExecute.ts +5 -2
|
@@ -1,6 +1,8 @@
|
|
|
1
1
|
import { ReactNode } from "react";
|
|
2
|
+
import { FeatureFlags } from "../contexts/FeatureFlagsContext";
|
|
2
3
|
interface AnyspendProviderProps {
|
|
3
4
|
children: ReactNode;
|
|
5
|
+
featureFlags?: FeatureFlags;
|
|
4
6
|
}
|
|
5
7
|
/**
|
|
6
8
|
* AnyspendProvider is a top-level provider that wraps your application to provide
|
|
@@ -12,17 +14,18 @@ interface AnyspendProviderProps {
|
|
|
12
14
|
* - Safe to use at the application root
|
|
13
15
|
* - Configures sensible defaults for query caching
|
|
14
16
|
* - Handles Stripe payment redirects and modal state
|
|
17
|
+
* - Provides feature flags configuration
|
|
15
18
|
*
|
|
16
19
|
* @example
|
|
17
20
|
* ```tsx
|
|
18
21
|
* function App() {
|
|
19
22
|
* return (
|
|
20
|
-
* <AnyspendProvider>
|
|
23
|
+
* <AnyspendProvider featureFlags={{ showPoints: true }}>
|
|
21
24
|
* <YourApp />
|
|
22
25
|
* </AnyspendProvider>
|
|
23
26
|
* );
|
|
24
27
|
* }
|
|
25
28
|
* ```
|
|
26
29
|
*/
|
|
27
|
-
export declare const AnyspendProvider: ({ children }: AnyspendProviderProps) => import("react/jsx-runtime").JSX.Element;
|
|
30
|
+
export declare const AnyspendProvider: ({ children, featureFlags }: AnyspendProviderProps) => import("react/jsx-runtime").JSX.Element;
|
|
28
31
|
export {};
|
|
@@ -798,6 +798,16 @@ export interface paths {
|
|
|
798
798
|
* @example 0
|
|
799
799
|
*/
|
|
800
800
|
userBalance?: string;
|
|
801
|
+
/**
|
|
802
|
+
* @description Anyspend points that will be awarded for the order
|
|
803
|
+
* @example 100
|
|
804
|
+
*/
|
|
805
|
+
pointsAmount?: number;
|
|
806
|
+
/**
|
|
807
|
+
* @description Multiplier applied to points that will be awarded for the order
|
|
808
|
+
* @example 1.5
|
|
809
|
+
*/
|
|
810
|
+
pointsMultiplier?: number;
|
|
801
811
|
};
|
|
802
812
|
/** @example 200 */
|
|
803
813
|
statusCode: number;
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import type { Address, EIP1193Provider, GetContractReturnType, Hex, PublicClient, WalletClient } from "viem";
|
|
2
2
|
import { BondkitTokenABI } from "./abis";
|
|
3
|
-
import type { BondkitTokenInitializationConfig, GetTransactionHistoryOptions,
|
|
3
|
+
import type { BondkitTokenInitializationConfig, GetTransactionHistoryOptions, SwapQuote, TokenDetails, TransactionResponse } from "./types";
|
|
4
|
+
import { TokenStatus } from "./types";
|
|
4
5
|
type ExecuteWriteOptions = {
|
|
5
6
|
value?: bigint;
|
|
6
7
|
gas?: bigint;
|
|
@@ -18,7 +19,8 @@ export declare class BondkitToken {
|
|
|
18
19
|
private walletClientInstance;
|
|
19
20
|
private connectedProvider?;
|
|
20
21
|
private tradingToken?;
|
|
21
|
-
|
|
22
|
+
private swapService?;
|
|
23
|
+
constructor(contractAddress: string, walletKey?: string, rpcUrl?: string);
|
|
22
24
|
connect(provider?: EIP1193Provider): boolean;
|
|
23
25
|
/**
|
|
24
26
|
* Connects using an EIP-1193 provider and requests accounts, selecting the first one.
|
|
@@ -69,5 +71,38 @@ export declare class BondkitToken {
|
|
|
69
71
|
migrateToDex(options?: ExecuteWriteOptions): Promise<Hex | undefined>;
|
|
70
72
|
transferTokenOwnership(newOwner: Address, options?: ExecuteWriteOptions): Promise<Hex | undefined>;
|
|
71
73
|
renounceTokenOwnership(options?: ExecuteWriteOptions): Promise<Hex | undefined>;
|
|
74
|
+
/**
|
|
75
|
+
* Get the swap service instance (lazy initialization)
|
|
76
|
+
*/
|
|
77
|
+
private getSwapService;
|
|
78
|
+
/**
|
|
79
|
+
* Check if DEX swapping is available (token must be in Dex phase)
|
|
80
|
+
*/
|
|
81
|
+
isSwapAvailable(): Promise<boolean | undefined>;
|
|
82
|
+
/**
|
|
83
|
+
* Get swap quote for trading token → bondkit token
|
|
84
|
+
*/
|
|
85
|
+
getSwapQuoteForBondkitToken(amountTradingTokenIn: string, slippageTolerance?: number): Promise<SwapQuote | undefined>;
|
|
86
|
+
/**
|
|
87
|
+
* Get swap quote for bondkit token → trading token
|
|
88
|
+
*/
|
|
89
|
+
getSwapQuoteForTradingToken(amountBondkitTokenIn: string, slippageTolerance?: number): Promise<SwapQuote | undefined>;
|
|
90
|
+
/**
|
|
91
|
+
* Swap trading token for bondkit token
|
|
92
|
+
*/
|
|
93
|
+
swapTradingTokenForBondkitToken(amountTradingTokenIn: string, slippageTolerance?: number, options?: ExecuteWriteOptions): Promise<Hex | undefined>;
|
|
94
|
+
/**
|
|
95
|
+
* Swap bondkit token for trading token
|
|
96
|
+
*/
|
|
97
|
+
swapBondkitTokenForTradingToken(amountBondkitTokenIn: string, slippageTolerance?: number, options?: ExecuteWriteOptions): Promise<Hex | undefined>;
|
|
98
|
+
/**
|
|
99
|
+
* Helper method to get trading token decimals
|
|
100
|
+
*/
|
|
101
|
+
private getTradingTokenDecimals;
|
|
102
|
+
/**
|
|
103
|
+
* Get trading token symbol
|
|
104
|
+
* @param tradingTokenAddress Optional trading token address to avoid fetching it again
|
|
105
|
+
*/
|
|
106
|
+
getTradingTokenSymbol(tradingTokenAddress?: Address): Promise<string | undefined>;
|
|
72
107
|
}
|
|
73
108
|
export {};
|
|
@@ -10,7 +10,7 @@ export declare class BondkitTokenFactory {
|
|
|
10
10
|
private rpcUrl;
|
|
11
11
|
private walletClientInstance;
|
|
12
12
|
private connectedProvider?;
|
|
13
|
-
constructor(chainId: SupportedChainId, walletKey?: string);
|
|
13
|
+
constructor(chainId: SupportedChainId, walletKey?: string, rpcUrl?: string);
|
|
14
14
|
connect(provider?: EIP1193Provider): boolean;
|
|
15
15
|
/**
|
|
16
16
|
* Connects using an EIP-1193 provider and requests accounts, selecting the first one.
|
|
@@ -1,3 +1,7 @@
|
|
|
1
1
|
import type { Address } from "viem";
|
|
2
2
|
export declare const BaseBondkitTokenFactoryContractAddress: Address;
|
|
3
3
|
export declare const BaseMainnetRpcUrl = "https://base-rpc.publicnode.com";
|
|
4
|
+
export declare const UniversalRouterAddress: Address;
|
|
5
|
+
export declare const QuoterAddress: Address;
|
|
6
|
+
export declare const Permit2Address: Address;
|
|
7
|
+
export declare const B3TokenAddress: Address;
|
|
@@ -0,0 +1,43 @@
|
|
|
1
|
+
import type { Address, WalletClient } from "viem";
|
|
2
|
+
import type { SwapQuote } from "./types";
|
|
3
|
+
interface SwapParams {
|
|
4
|
+
tokenIn: Address;
|
|
5
|
+
tokenOut: Address;
|
|
6
|
+
amountIn: string;
|
|
7
|
+
tokenInDecimals: number;
|
|
8
|
+
tokenOutDecimals: number;
|
|
9
|
+
slippageTolerance: number;
|
|
10
|
+
recipient: Address;
|
|
11
|
+
deadline?: number;
|
|
12
|
+
}
|
|
13
|
+
/**
|
|
14
|
+
* Internal swap service for handling Uniswap V4 swaps between trading token and bondkit token
|
|
15
|
+
*/
|
|
16
|
+
export declare class BondkitSwapService {
|
|
17
|
+
private v4Config;
|
|
18
|
+
private configInitialized;
|
|
19
|
+
private readonly bondkitTokenAddress;
|
|
20
|
+
private readonly publicClient;
|
|
21
|
+
constructor(bondkitTokenAddress: Address);
|
|
22
|
+
/**
|
|
23
|
+
* Initialize V4 pool configuration from bondkit token contract
|
|
24
|
+
*/
|
|
25
|
+
private initializeV4Config;
|
|
26
|
+
/**
|
|
27
|
+
* Get V4 pool configuration
|
|
28
|
+
*/
|
|
29
|
+
private getV4Config;
|
|
30
|
+
/**
|
|
31
|
+
* Handle token approvals for swap
|
|
32
|
+
*/
|
|
33
|
+
private handleTokenApprovals;
|
|
34
|
+
/**
|
|
35
|
+
* Get swap quote
|
|
36
|
+
*/
|
|
37
|
+
getSwapQuote(params: SwapParams): Promise<SwapQuote | null>;
|
|
38
|
+
/**
|
|
39
|
+
* Execute swap transaction
|
|
40
|
+
*/
|
|
41
|
+
executeSwap(params: SwapParams, walletClient: WalletClient): Promise<string | null>;
|
|
42
|
+
}
|
|
43
|
+
export {};
|
|
@@ -49,10 +49,9 @@ export type DexMigrationEventArgs = {
|
|
|
49
49
|
ethForFeeRecipient: bigint;
|
|
50
50
|
};
|
|
51
51
|
export declare enum TokenStatus {
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
Migrated = 3
|
|
52
|
+
Uninitialized = 0,
|
|
53
|
+
Bonding = 1,
|
|
54
|
+
Dex = 2
|
|
56
55
|
}
|
|
57
56
|
export interface GetTransactionHistoryOptions {
|
|
58
57
|
userAddress?: Address;
|
|
@@ -80,3 +79,10 @@ export interface TransactionResponse {
|
|
|
80
79
|
skip: number;
|
|
81
80
|
data: Transaction[];
|
|
82
81
|
}
|
|
82
|
+
export interface SwapQuote {
|
|
83
|
+
amountOut: string;
|
|
84
|
+
amountOutMin: string;
|
|
85
|
+
priceImpact: string;
|
|
86
|
+
executionPrice: string;
|
|
87
|
+
fee: string;
|
|
88
|
+
}
|
|
@@ -1,13 +1,12 @@
|
|
|
1
1
|
import { PermissionsConfig } from "@b3dotfun/sdk/global-account/types/permissions";
|
|
2
|
+
import "@reservoir0x/relay-kit-ui/styles.css";
|
|
2
3
|
import { Account } from "thirdweb/wallets";
|
|
3
4
|
import { ClientType } from "../../../client-manager";
|
|
4
5
|
import { B3ContextType } from "./types";
|
|
5
|
-
import "@reservoir0x/relay-kit-ui/styles.css";
|
|
6
|
-
export declare const wagmiConfig: import("wagmi").Config<readonly [import("viem").Chain, ...import("viem").Chain[]], any, readonly import("wagmi").CreateConnectorFn[]>;
|
|
7
6
|
/**
|
|
8
7
|
* Main B3Provider component
|
|
9
8
|
*/
|
|
10
|
-
export declare function B3Provider({ theme, children, accountOverride, environment, automaticallySetFirstEoa, simDuneApiKey, toaster, clientType, }: {
|
|
9
|
+
export declare function B3Provider({ theme, children, accountOverride, environment, automaticallySetFirstEoa, simDuneApiKey, toaster, clientType, rpcUrls, partnerId, }: {
|
|
11
10
|
theme: "light" | "dark";
|
|
12
11
|
children: React.ReactNode;
|
|
13
12
|
accountOverride?: Account;
|
|
@@ -19,6 +18,8 @@ export declare function B3Provider({ theme, children, accountOverride, environme
|
|
|
19
18
|
style?: React.CSSProperties;
|
|
20
19
|
};
|
|
21
20
|
clientType?: ClientType;
|
|
21
|
+
rpcUrls?: Record<number, string>;
|
|
22
|
+
partnerId?: string;
|
|
22
23
|
}): import("react/jsx-runtime").JSX.Element;
|
|
23
24
|
/**
|
|
24
25
|
* Inner provider component that provides the actual B3Context
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@b3dotfun/sdk",
|
|
3
|
-
"version": "0.0.40-alpha.
|
|
3
|
+
"version": "0.0.40-alpha.10",
|
|
4
4
|
"source": "src/index.ts",
|
|
5
5
|
"main": "./dist/cjs/index.js",
|
|
6
6
|
"react-native": "./dist/cjs/index.native.js",
|
|
@@ -241,8 +241,8 @@
|
|
|
241
241
|
"@b3dotfun/basement-api": "0.0.11",
|
|
242
242
|
"@feathersjs/authentication-client": "5.0.33",
|
|
243
243
|
"@feathersjs/feathers": "5.0.33",
|
|
244
|
-
"@feathersjs/socketio-client": "5.0.33",
|
|
245
244
|
"@feathersjs/rest-client": "5.0.33",
|
|
245
|
+
"@feathersjs/socketio-client": "5.0.33",
|
|
246
246
|
"@feathersjs/typebox": "5.0.33",
|
|
247
247
|
"@fingerprintjs/fingerprintjs-pro-react": "^2.7.0",
|
|
248
248
|
"@hey-api/client-fetch": "0.8.3",
|
|
@@ -261,6 +261,7 @@
|
|
|
261
261
|
"@solana/web3.js": "^1.98.2",
|
|
262
262
|
"@stripe/react-stripe-js": "^3.7.0",
|
|
263
263
|
"@stripe/stripe-js": "^7.3.1",
|
|
264
|
+
"@thirdweb-dev/wagmi-adapter": "^0.2.141",
|
|
264
265
|
"@web3icons/react": "3.16.0",
|
|
265
266
|
"big.js": "^7.0.1",
|
|
266
267
|
"class-variance-authority": "0.7.0",
|
|
@@ -329,10 +330,10 @@
|
|
|
329
330
|
"react": "^18.0.0 || ^19.0.0",
|
|
330
331
|
"react-dom": "^18.0.0 || ^19.0.0",
|
|
331
332
|
"react-native-mmkv": "^3.2.0",
|
|
332
|
-
"thirdweb": "
|
|
333
|
+
"thirdweb": "5.106.0",
|
|
333
334
|
"three": "^0.175.0",
|
|
334
|
-
"
|
|
335
|
-
"
|
|
335
|
+
"viem": "^2.28.1",
|
|
336
|
+
"wagmi": "^2.14.15"
|
|
336
337
|
},
|
|
337
338
|
"peerDependenciesMeta": {
|
|
338
339
|
"@react-three/postprocessing": {
|
|
@@ -223,6 +223,7 @@ function AnySpendDepositHypeInner({
|
|
|
223
223
|
onDestinationChainChange={() => {}}
|
|
224
224
|
fiatPaymentMethodIndex={PanelView.FIAT_PAYMENT_METHOD}
|
|
225
225
|
recipientSelectionPanelIndex={PanelView.RECIPIENT_SELECTION}
|
|
226
|
+
anyspendQuote={anyspendQuote}
|
|
226
227
|
/>
|
|
227
228
|
</motion.div>
|
|
228
229
|
)}
|
|
@@ -5,6 +5,7 @@ import { formatDisplayNumber } from "@b3dotfun/sdk/shared/utils/number";
|
|
|
5
5
|
import { ChevronRight } from "lucide-react";
|
|
6
6
|
import { motion } from "motion/react";
|
|
7
7
|
import { components } from "../../../types/api";
|
|
8
|
+
import { useFeatureFlags } from "../../contexts/FeatureFlagsContext";
|
|
8
9
|
import { OrderTokenAmount } from "./OrderTokenAmount";
|
|
9
10
|
|
|
10
11
|
interface CryptoReceiveSectionProps {
|
|
@@ -45,6 +46,8 @@ export function CryptoReceiveSection({
|
|
|
45
46
|
dstTokenSymbol,
|
|
46
47
|
dstTokenLogoURI,
|
|
47
48
|
}: CryptoReceiveSectionProps) {
|
|
49
|
+
const featureFlags = useFeatureFlags();
|
|
50
|
+
|
|
48
51
|
return (
|
|
49
52
|
<motion.div
|
|
50
53
|
initial={{ opacity: 0, y: 20, filter: "blur(10px)" }}
|
|
@@ -100,61 +103,68 @@ export function CryptoReceiveSection({
|
|
|
100
103
|
setToken={setSelectedDstToken || (() => {})}
|
|
101
104
|
/>
|
|
102
105
|
)}
|
|
103
|
-
<div className="text-as-primary/50 flex h-5 items-center text-sm">
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
anyspendQuote?.data?.
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
106
|
+
<div className="text-as-primary/50 flex h-5 items-center justify-between text-sm">
|
|
107
|
+
<div className="flex items-center gap-2">
|
|
108
|
+
{formatDisplayNumber(anyspendQuote?.data?.currencyOut?.amountUsd, {
|
|
109
|
+
style: "currency",
|
|
110
|
+
fallback: "",
|
|
111
|
+
})}
|
|
112
|
+
{anyspendQuote?.data?.currencyIn?.amountUsd &&
|
|
113
|
+
anyspendQuote?.data?.currencyOut?.amountUsd &&
|
|
114
|
+
(() => {
|
|
115
|
+
const calculatePriceImpact = (inputUsd?: string | number, outputUsd?: string | number) => {
|
|
116
|
+
if (!inputUsd || !outputUsd) {
|
|
117
|
+
return { percentage: "0.00", isNegative: false };
|
|
118
|
+
}
|
|
115
119
|
|
|
116
|
-
|
|
117
|
-
|
|
120
|
+
const input = Number(inputUsd);
|
|
121
|
+
const output = Number(outputUsd);
|
|
118
122
|
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
+
// Handle edge cases
|
|
124
|
+
if (input === 0 || isNaN(input) || isNaN(output) || input <= output) {
|
|
125
|
+
return { percentage: "0.00", isNegative: false };
|
|
126
|
+
}
|
|
123
127
|
|
|
124
|
-
|
|
128
|
+
const percentageValue = ((output - input) / input) * 100;
|
|
125
129
|
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
+
// Handle the -0.00% case
|
|
131
|
+
if (percentageValue > -0.005 && percentageValue < 0) {
|
|
132
|
+
return { percentage: "0.00", isNegative: false };
|
|
133
|
+
}
|
|
130
134
|
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
135
|
+
return {
|
|
136
|
+
percentage: Math.abs(percentageValue).toFixed(2),
|
|
137
|
+
isNegative: percentageValue < 0,
|
|
138
|
+
};
|
|
134
139
|
};
|
|
135
|
-
};
|
|
136
140
|
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
+
const { percentage, isNegative } = calculatePriceImpact(
|
|
142
|
+
anyspendQuote.data.currencyIn.amountUsd,
|
|
143
|
+
anyspendQuote.data.currencyOut.amountUsd,
|
|
144
|
+
);
|
|
141
145
|
|
|
142
|
-
|
|
143
|
-
|
|
146
|
+
// Parse the percentage as a number for comparison
|
|
147
|
+
const percentageNum = parseFloat(percentage);
|
|
144
148
|
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
149
|
+
// Don't show if less than 1%
|
|
150
|
+
if (percentageNum < 1) {
|
|
151
|
+
return null;
|
|
152
|
+
}
|
|
149
153
|
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
|
|
154
|
+
// Using inline style to ensure color displays
|
|
155
|
+
return (
|
|
156
|
+
<span className="ml-2" style={{ color: percentageNum >= 10 ? "red" : "#FFD700" }}>
|
|
157
|
+
({isNegative ? "-" : ""}
|
|
158
|
+
{percentage}%)
|
|
159
|
+
</span>
|
|
160
|
+
);
|
|
161
|
+
})()}
|
|
162
|
+
</div>
|
|
163
|
+
{featureFlags.showPoints && anyspendQuote?.data?.pointsAmount && anyspendQuote.data.pointsAmount > 0 && (
|
|
164
|
+
<div key={`points-${anyspendQuote.data.pointsAmount}`} className="flex items-center gap-1">
|
|
165
|
+
<span className="text-as-brand font-medium">+{anyspendQuote.data.pointsAmount.toLocaleString()} pts</span>
|
|
166
|
+
</div>
|
|
167
|
+
)}
|
|
158
168
|
</div>
|
|
159
169
|
</motion.div>
|
|
160
170
|
);
|
|
@@ -110,9 +110,6 @@ function getOrderSuccessText({
|
|
|
110
110
|
case "custom":
|
|
111
111
|
actionText = order.metadata.action || `executed contract`;
|
|
112
112
|
return `Successfully ${actionText}`;
|
|
113
|
-
case "hype_duel":
|
|
114
|
-
actionText = `deposited ${formattedActualDstAmount || "--"} HYPE`;
|
|
115
|
-
return `Successfully ${actionText} to ${recipient}`;
|
|
116
113
|
default:
|
|
117
114
|
throw new Error("Invalid order type");
|
|
118
115
|
}
|
|
@@ -667,8 +664,8 @@ export const OrderDetails = memo(function OrderDetails({
|
|
|
667
664
|
/>
|
|
668
665
|
<Accordion type="single" collapsible className="order-details-accordion w-full">
|
|
669
666
|
<AccordionItem value="execute-details" className="order-details-execute-item">
|
|
670
|
-
<AccordionTrigger className="
|
|
671
|
-
<AccordionContent className="
|
|
667
|
+
<AccordionTrigger className="accordion-trigger">Transaction Details</AccordionTrigger>
|
|
668
|
+
<AccordionContent className="accordion-content pl-2">
|
|
672
669
|
<div className="relative flex w-full flex-col gap-4">
|
|
673
670
|
<div className="bg-as-surface-secondary absolute bottom-2 left-4 top-2 z-[5] w-2">
|
|
674
671
|
<motion.div
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import { useCoinbaseOnrampOptions, useGeoOnrampOptions } from "@b3dotfun/sdk/anyspend/react";
|
|
2
2
|
import { components } from "@b3dotfun/sdk/anyspend/types/api";
|
|
3
|
+
import { GetQuoteResponse } from "@b3dotfun/sdk/anyspend/types/api_req_res";
|
|
3
4
|
import { ALL_CHAINS } from "@b3dotfun/sdk/anyspend/utils/chain";
|
|
4
5
|
import { Input, useGetGeo, useProfile } from "@b3dotfun/sdk/global-account/react";
|
|
5
6
|
import { cn, formatUsername } from "@b3dotfun/sdk/shared/utils";
|
|
@@ -7,6 +8,7 @@ import { formatAddress } from "@b3dotfun/sdk/shared/utils/formatAddress";
|
|
|
7
8
|
import { ChevronRight, Wallet } from "lucide-react";
|
|
8
9
|
import { useRef } from "react";
|
|
9
10
|
import { toast } from "sonner";
|
|
11
|
+
import { useFeatureFlags } from "../../contexts/FeatureFlagsContext";
|
|
10
12
|
import { FiatPaymentMethod } from "./FiatPaymentMethod";
|
|
11
13
|
import { OrderTokenAmountFiat } from "./OrderTokenAmountFiat";
|
|
12
14
|
|
|
@@ -25,6 +27,7 @@ export function PanelOnramp({
|
|
|
25
27
|
recipientSelectionPanelIndex,
|
|
26
28
|
dstTokenSymbol,
|
|
27
29
|
hideDstToken = false,
|
|
30
|
+
anyspendQuote,
|
|
28
31
|
}: {
|
|
29
32
|
srcAmountOnRamp: string;
|
|
30
33
|
setSrcAmountOnRamp: (amount: string) => void;
|
|
@@ -40,7 +43,9 @@ export function PanelOnramp({
|
|
|
40
43
|
recipientSelectionPanelIndex: number;
|
|
41
44
|
dstTokenSymbol?: string;
|
|
42
45
|
hideDstToken?: boolean;
|
|
46
|
+
anyspendQuote?: GetQuoteResponse;
|
|
43
47
|
}) {
|
|
48
|
+
const featureFlags = useFeatureFlags();
|
|
44
49
|
// Get geo-based onramp options to access fee information
|
|
45
50
|
const { stripeWeb2Support } = useGeoOnrampOptions(srcAmountOnRamp);
|
|
46
51
|
|
|
@@ -245,21 +250,22 @@ export function PanelOnramp({
|
|
|
245
250
|
|
|
246
251
|
<div className="">
|
|
247
252
|
<div className="flex items-center justify-between">
|
|
248
|
-
|
|
249
|
-
|
|
250
|
-
|
|
251
|
-
|
|
252
|
-
|
|
253
|
-
|
|
254
|
-
|
|
255
|
-
|
|
256
|
-
|
|
257
|
-
|
|
258
|
-
|
|
259
|
-
|
|
260
|
-
|
|
261
|
-
|
|
262
|
-
|
|
253
|
+
<div className="flex items-center gap-2">
|
|
254
|
+
<span className="text-as-tertiarry text-sm">
|
|
255
|
+
{(() => {
|
|
256
|
+
const fee = getFeeFromApi(selectedPaymentMethod || FiatPaymentMethod.NONE);
|
|
257
|
+
return fee !== null ? `Total (included $${fee.toFixed(2)} fee)` : "Total";
|
|
258
|
+
})()}
|
|
259
|
+
</span>
|
|
260
|
+
{featureFlags.showPoints && anyspendQuote?.data?.pointsAmount && anyspendQuote.data.pointsAmount > 0 && (
|
|
261
|
+
<span key={`points-${anyspendQuote.data.pointsAmount}`} className="text-as-brand text-sm font-medium">
|
|
262
|
+
+{anyspendQuote.data.pointsAmount.toLocaleString()} pts
|
|
263
|
+
</span>
|
|
264
|
+
)}
|
|
265
|
+
</div>
|
|
266
|
+
<span className="text-as-primary font-semibold">
|
|
267
|
+
${getTotalAmount(selectedPaymentMethod || FiatPaymentMethod.NONE).toFixed(2)}
|
|
268
|
+
</span>
|
|
263
269
|
</div>
|
|
264
270
|
</div>
|
|
265
271
|
</div>
|
|
@@ -0,0 +1,34 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
|
|
3
|
+
import { createContext, useContext, ReactNode } from "react";
|
|
4
|
+
|
|
5
|
+
export interface FeatureFlags {
|
|
6
|
+
showPoints?: boolean;
|
|
7
|
+
}
|
|
8
|
+
|
|
9
|
+
interface FeatureFlagsContextType {
|
|
10
|
+
featureFlags: FeatureFlags;
|
|
11
|
+
}
|
|
12
|
+
|
|
13
|
+
const FeatureFlagsContext = createContext<FeatureFlagsContextType | undefined>(undefined);
|
|
14
|
+
|
|
15
|
+
interface FeatureFlagsProviderProps {
|
|
16
|
+
children: ReactNode;
|
|
17
|
+
featureFlags?: FeatureFlags;
|
|
18
|
+
}
|
|
19
|
+
|
|
20
|
+
const defaultFeatureFlags: FeatureFlags = {
|
|
21
|
+
showPoints: false,
|
|
22
|
+
};
|
|
23
|
+
|
|
24
|
+
export function FeatureFlagsProvider({ children, featureFlags = defaultFeatureFlags }: FeatureFlagsProviderProps) {
|
|
25
|
+
return <FeatureFlagsContext.Provider value={{ featureFlags }}>{children}</FeatureFlagsContext.Provider>;
|
|
26
|
+
}
|
|
27
|
+
|
|
28
|
+
export function useFeatureFlags(): FeatureFlags {
|
|
29
|
+
const context = useContext(FeatureFlagsContext);
|
|
30
|
+
if (!context) {
|
|
31
|
+
return defaultFeatureFlags;
|
|
32
|
+
}
|
|
33
|
+
return context.featureFlags;
|
|
34
|
+
}
|
|
@@ -244,12 +244,19 @@ export function useAnyspendFlow({
|
|
|
244
244
|
// Handle order completion
|
|
245
245
|
useEffect(() => {
|
|
246
246
|
if (oat?.data?.order.status === "executed") {
|
|
247
|
-
|
|
248
|
-
|
|
249
|
-
const
|
|
250
|
-
|
|
247
|
+
// get the actualDstAmount if available from custompayload
|
|
248
|
+
const amount = (oat.data.order.payload as { actualDstAmount?: string })?.actualDstAmount;
|
|
249
|
+
const formattedActualDstAmount = amount
|
|
250
|
+
? formatTokenAmount(BigInt(amount), oat.data.order.metadata.dstToken.decimals)
|
|
251
|
+
: undefined;
|
|
252
|
+
onTransactionSuccess?.(formattedActualDstAmount);
|
|
251
253
|
}
|
|
252
|
-
}, [
|
|
254
|
+
}, [
|
|
255
|
+
oat?.data?.order.status,
|
|
256
|
+
oat?.data?.order.payload,
|
|
257
|
+
onTransactionSuccess,
|
|
258
|
+
oat?.data?.order.metadata.dstToken.decimals,
|
|
259
|
+
]);
|
|
253
260
|
|
|
254
261
|
return {
|
|
255
262
|
// State
|
|
@@ -3,10 +3,12 @@
|
|
|
3
3
|
import { TooltipProvider } from "@b3dotfun/sdk/global-account/react";
|
|
4
4
|
import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
|
|
5
5
|
import { ReactNode, useState } from "react";
|
|
6
|
+
import { FeatureFlags, FeatureFlagsProvider } from "../contexts/FeatureFlagsContext";
|
|
6
7
|
import { StripeRedirectHandler } from "./StripeRedirectHandler";
|
|
7
8
|
|
|
8
9
|
interface AnyspendProviderProps {
|
|
9
10
|
children: ReactNode;
|
|
11
|
+
featureFlags?: FeatureFlags;
|
|
10
12
|
}
|
|
11
13
|
|
|
12
14
|
const defaultQueryClientConfig = {
|
|
@@ -29,27 +31,30 @@ const defaultQueryClientConfig = {
|
|
|
29
31
|
* - Safe to use at the application root
|
|
30
32
|
* - Configures sensible defaults for query caching
|
|
31
33
|
* - Handles Stripe payment redirects and modal state
|
|
34
|
+
* - Provides feature flags configuration
|
|
32
35
|
*
|
|
33
36
|
* @example
|
|
34
37
|
* ```tsx
|
|
35
38
|
* function App() {
|
|
36
39
|
* return (
|
|
37
|
-
* <AnyspendProvider>
|
|
40
|
+
* <AnyspendProvider featureFlags={{ showPoints: true }}>
|
|
38
41
|
* <YourApp />
|
|
39
42
|
* </AnyspendProvider>
|
|
40
43
|
* );
|
|
41
44
|
* }
|
|
42
45
|
* ```
|
|
43
46
|
*/
|
|
44
|
-
export const AnyspendProvider = function AnyspendProvider({ children }: AnyspendProviderProps) {
|
|
47
|
+
export const AnyspendProvider = function AnyspendProvider({ children, featureFlags }: AnyspendProviderProps) {
|
|
45
48
|
const [queryClient] = useState(() => new QueryClient(defaultQueryClientConfig));
|
|
46
49
|
|
|
47
50
|
return (
|
|
48
51
|
<QueryClientProvider client={queryClient}>
|
|
49
|
-
<
|
|
50
|
-
<
|
|
51
|
-
|
|
52
|
-
|
|
52
|
+
<FeatureFlagsProvider featureFlags={featureFlags}>
|
|
53
|
+
<TooltipProvider>
|
|
54
|
+
<StripeRedirectHandler />
|
|
55
|
+
{children}
|
|
56
|
+
</TooltipProvider>
|
|
57
|
+
</FeatureFlagsProvider>
|
|
53
58
|
</QueryClientProvider>
|
|
54
59
|
);
|
|
55
60
|
};
|