@b3dotfun/sdk 0.1.69-alpha.0 → 0.1.69-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/AnySpendStakeB3.js +1 -1
- package/dist/cjs/anyspend/react/components/AnySpendStakeB3ExactIn.js +1 -1
- package/dist/cjs/anyspend/react/components/checkout/CheckoutPaymentPanel.js +2 -4
- package/dist/cjs/anyspend/react/components/checkout/CheckoutSuccess.d.ts +2 -1
- package/dist/cjs/anyspend/react/components/checkout/CheckoutSuccess.js +5 -3
- package/dist/cjs/anyspend/react/components/checkout/FiatCheckoutPanel.js +1 -2
- package/dist/cjs/anyspend/react/components/checkout/KycGate.js +1 -2
- package/dist/cjs/anyspend/react/components/common/OrderDetails.js +5 -0
- package/dist/cjs/anyspend/react/components/common/OrderStatus.js +37 -6
- package/dist/cjs/anyspend/react/components/common/StepProgress.d.ts +2 -0
- package/dist/cjs/anyspend/react/components/common/StepProgress.js +7 -2
- package/dist/cjs/anyspend/react/hooks/useAnyspendCreateOnrampOrder.js +4 -6
- package/dist/cjs/anyspend/react/hooks/useKycStatus.d.ts +3 -1
- package/dist/cjs/anyspend/react/hooks/useKycStatus.js +11 -7
- package/dist/cjs/app.shared.js +9 -7
- package/dist/cjs/global-account/react/components/B3DynamicModal.js +5 -2
- package/dist/cjs/global-account/react/components/B3Provider/AuthenticationProvider.d.ts +3 -1
- package/dist/cjs/global-account/react/components/B3Provider/AuthenticationProvider.js +2 -1
- package/dist/cjs/global-account/react/components/B3Provider/B3Provider.d.ts +5 -2
- package/dist/cjs/global-account/react/components/B3Provider/B3Provider.js +3 -3
- package/dist/cjs/global-account/react/components/B3Provider/B3Provider.native.js +2 -1
- package/dist/cjs/global-account/react/components/B3Provider/LocalSDKProvider.d.ts +3 -1
- package/dist/cjs/global-account/react/components/B3Provider/LocalSDKProvider.js +3 -1
- package/dist/cjs/global-account/react/components/ManageAccount/SessionDurationContent.d.ts +5 -0
- package/dist/cjs/global-account/react/components/ManageAccount/SessionDurationContent.js +57 -0
- package/dist/cjs/global-account/react/components/ManageAccount/SettingsContent.js +12 -29
- package/dist/cjs/global-account/react/components/SignInWithB3/components/AuthButton.js +10 -1
- package/dist/cjs/global-account/react/components/SignInWithB3/steps/LoginStepCustom.js +96 -15
- package/dist/cjs/global-account/react/components/SignInWithB3/utils/signInUtils.d.ts +5 -3
- package/dist/cjs/global-account/react/components/SignInWithB3/utils/signInUtils.js +15 -2
- package/dist/cjs/global-account/react/components/Toast/ToastContext.d.ts +3 -0
- package/dist/cjs/global-account/react/components/Toast/ToastContext.js +30 -7
- package/dist/cjs/global-account/react/hooks/useAuth.js +26 -15
- package/dist/cjs/global-account/react/hooks/useAuthentication.js +23 -12
- package/dist/cjs/global-account/react/hooks/useAutoSelectWallet.d.ts +6 -3
- package/dist/cjs/global-account/react/hooks/useAutoSelectWallet.js +31 -3
- package/dist/cjs/global-account/react/hooks/useConnect.d.ts +2 -2
- package/dist/cjs/global-account/react/hooks/useFirstEOA.d.ts +8 -8
- package/dist/cjs/global-account/react/hooks/useTWAuth.js +0 -1
- package/dist/cjs/global-account/react/stores/useModalStore.d.ts +10 -1
- package/dist/cjs/global-account/react/utils/createWagmiConfig.d.ts +0 -18
- package/dist/cjs/global-account/react/utils/createWagmiConfig.js +0 -17
- package/dist/cjs/shared/utils/session-duration.d.ts +15 -0
- package/dist/cjs/shared/utils/session-duration.js +69 -0
- package/dist/esm/anyspend/react/components/AnySpendStakeB3.js +2 -2
- package/dist/esm/anyspend/react/components/AnySpendStakeB3ExactIn.js +2 -2
- package/dist/esm/anyspend/react/components/checkout/CheckoutPaymentPanel.js +2 -4
- package/dist/esm/anyspend/react/components/checkout/CheckoutSuccess.d.ts +2 -1
- package/dist/esm/anyspend/react/components/checkout/CheckoutSuccess.js +5 -3
- package/dist/esm/anyspend/react/components/checkout/FiatCheckoutPanel.js +2 -3
- package/dist/esm/anyspend/react/components/checkout/KycGate.js +2 -3
- package/dist/esm/anyspend/react/components/common/OrderDetails.js +6 -1
- package/dist/esm/anyspend/react/components/common/OrderStatus.js +34 -3
- package/dist/esm/anyspend/react/components/common/StepProgress.d.ts +2 -0
- package/dist/esm/anyspend/react/components/common/StepProgress.js +4 -2
- package/dist/esm/anyspend/react/hooks/useAnyspendCreateOnrampOrder.js +5 -7
- package/dist/esm/anyspend/react/hooks/useKycStatus.d.ts +3 -1
- package/dist/esm/anyspend/react/hooks/useKycStatus.js +9 -5
- package/dist/esm/app.shared.js +9 -7
- package/dist/esm/global-account/react/components/B3DynamicModal.js +5 -2
- package/dist/esm/global-account/react/components/B3Provider/AuthenticationProvider.d.ts +3 -1
- package/dist/esm/global-account/react/components/B3Provider/AuthenticationProvider.js +2 -1
- package/dist/esm/global-account/react/components/B3Provider/B3Provider.d.ts +5 -2
- package/dist/esm/global-account/react/components/B3Provider/B3Provider.js +3 -3
- package/dist/esm/global-account/react/components/B3Provider/B3Provider.native.js +2 -1
- package/dist/esm/global-account/react/components/B3Provider/LocalSDKProvider.d.ts +3 -1
- package/dist/esm/global-account/react/components/B3Provider/LocalSDKProvider.js +3 -1
- package/dist/esm/global-account/react/components/ManageAccount/SessionDurationContent.d.ts +5 -0
- package/dist/esm/global-account/react/components/ManageAccount/SessionDurationContent.js +52 -0
- package/dist/esm/global-account/react/components/ManageAccount/SettingsContent.js +12 -29
- package/dist/esm/global-account/react/components/SignInWithB3/components/AuthButton.js +11 -2
- package/dist/esm/global-account/react/components/SignInWithB3/steps/LoginStepCustom.js +100 -19
- package/dist/esm/global-account/react/components/SignInWithB3/utils/signInUtils.d.ts +5 -3
- package/dist/esm/global-account/react/components/SignInWithB3/utils/signInUtils.js +14 -1
- package/dist/esm/global-account/react/components/Toast/ToastContext.d.ts +3 -0
- package/dist/esm/global-account/react/components/Toast/ToastContext.js +30 -7
- package/dist/esm/global-account/react/hooks/useAuth.js +28 -17
- package/dist/esm/global-account/react/hooks/useAuthentication.js +24 -13
- package/dist/esm/global-account/react/hooks/useAutoSelectWallet.d.ts +6 -3
- package/dist/esm/global-account/react/hooks/useAutoSelectWallet.js +33 -5
- package/dist/esm/global-account/react/hooks/useConnect.d.ts +2 -2
- package/dist/esm/global-account/react/hooks/useFirstEOA.d.ts +8 -8
- package/dist/esm/global-account/react/hooks/useTWAuth.js +0 -1
- package/dist/esm/global-account/react/stores/useModalStore.d.ts +10 -1
- package/dist/esm/global-account/react/utils/createWagmiConfig.d.ts +0 -18
- package/dist/esm/global-account/react/utils/createWagmiConfig.js +0 -16
- package/dist/esm/shared/utils/session-duration.d.ts +15 -0
- package/dist/esm/shared/utils/session-duration.js +64 -0
- package/dist/styles/index.css +1 -1
- package/dist/types/anyspend/react/components/checkout/CheckoutSuccess.d.ts +2 -1
- package/dist/types/anyspend/react/components/common/StepProgress.d.ts +2 -0
- package/dist/types/anyspend/react/hooks/useKycStatus.d.ts +3 -1
- package/dist/types/global-account/react/components/B3Provider/AuthenticationProvider.d.ts +3 -1
- package/dist/types/global-account/react/components/B3Provider/B3Provider.d.ts +5 -2
- package/dist/types/global-account/react/components/B3Provider/LocalSDKProvider.d.ts +3 -1
- package/dist/types/global-account/react/components/ManageAccount/SessionDurationContent.d.ts +5 -0
- package/dist/types/global-account/react/components/SignInWithB3/utils/signInUtils.d.ts +5 -3
- package/dist/types/global-account/react/components/Toast/ToastContext.d.ts +3 -0
- package/dist/types/global-account/react/hooks/useAutoSelectWallet.d.ts +6 -3
- package/dist/types/global-account/react/hooks/useConnect.d.ts +2 -2
- package/dist/types/global-account/react/hooks/useFirstEOA.d.ts +8 -8
- package/dist/types/global-account/react/stores/useModalStore.d.ts +10 -1
- package/dist/types/global-account/react/utils/createWagmiConfig.d.ts +0 -18
- package/dist/types/shared/utils/session-duration.d.ts +15 -0
- package/package.json +2 -1
- package/src/anyspend/react/components/AnySpendStakeB3.tsx +2 -2
- package/src/anyspend/react/components/AnySpendStakeB3ExactIn.tsx +2 -2
- package/src/anyspend/react/components/checkout/CheckoutPaymentPanel.tsx +2 -4
- package/src/anyspend/react/components/checkout/CheckoutSuccess.tsx +13 -3
- package/src/anyspend/react/components/checkout/FiatCheckoutPanel.tsx +9 -3
- package/src/anyspend/react/components/checkout/KycGate.tsx +8 -3
- package/src/anyspend/react/components/common/OrderDetails.tsx +8 -0
- package/src/anyspend/react/components/common/OrderStatus.tsx +38 -3
- package/src/anyspend/react/components/common/StepProgress.tsx +15 -5
- package/src/anyspend/react/hooks/useAnyspendCreateOnrampOrder.ts +5 -7
- package/src/anyspend/react/hooks/useKycStatus.ts +8 -5
- package/src/app.shared.ts +9 -8
- package/src/global-account/react/components/B3DynamicModal.tsx +5 -2
- package/src/global-account/react/components/B3Provider/AuthenticationProvider.tsx +4 -0
- package/src/global-account/react/components/B3Provider/B3Provider.native.tsx +2 -1
- package/src/global-account/react/components/B3Provider/B3Provider.tsx +16 -3
- package/src/global-account/react/components/B3Provider/LocalSDKProvider.tsx +5 -0
- package/src/global-account/react/components/ManageAccount/SessionDurationContent.tsx +107 -0
- package/src/global-account/react/components/ManageAccount/SettingsContent.tsx +28 -30
- package/src/global-account/react/components/SignInWithB3/components/AuthButton.tsx +21 -2
- package/src/global-account/react/components/SignInWithB3/steps/LoginStepCustom.tsx +207 -54
- package/src/global-account/react/components/SignInWithB3/utils/signInUtils.ts +19 -3
- package/src/global-account/react/components/Toast/ToastContext.tsx +39 -7
- package/src/global-account/react/hooks/useAuth.ts +28 -17
- package/src/global-account/react/hooks/useAuthentication.ts +24 -13
- package/src/global-account/react/hooks/useAutoSelectWallet.ts +40 -6
- package/src/global-account/react/hooks/useConnect.tsx +2 -2
- package/src/global-account/react/hooks/useTWAuth.tsx +0 -1
- package/src/global-account/react/stores/useModalStore.ts +11 -0
- package/src/global-account/react/utils/createWagmiConfig.tsx +0 -18
- package/src/shared/utils/session-duration.ts +64 -0
- package/src/types/torph.d.ts +4 -0
|
@@ -1,14 +1,16 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
|
|
3
|
+
import React from "react";
|
|
3
4
|
import { motion } from "framer-motion";
|
|
5
|
+
import { TextMorph } from "torph/react";
|
|
4
6
|
import { AnimatedCheckmark } from "../icons/AnimatedCheckmark.js";
|
|
5
7
|
export function StepProgress({ steps, currentStepIndex, className = "", animateCompletedSteps = true, }) {
|
|
6
8
|
const currentStep = steps[currentStepIndex];
|
|
7
|
-
return (_jsxs("div", { className: `flex w-full flex-col items-center gap-4 ${className}`, children: [_jsx("div", { className: "flex items-center gap-2", children: steps.map((_, index) => (_jsxs(
|
|
9
|
+
return (_jsxs("div", { className: `flex w-full flex-col items-center gap-4 ${className}`, children: [_jsx("div", { className: "flex items-center gap-2", children: steps.map((_, index) => (_jsxs(React.Fragment, { children: [_jsx("div", { className: "flex items-center", children: index < currentStepIndex ? (
|
|
8
10
|
// Completed step - checkmark replaces the whole circle
|
|
9
11
|
_jsx(motion.div, { initial: { scale: 0.8, opacity: 0 }, animate: { scale: 1, opacity: 1 }, transition: { delay: index * 0.2 }, children: _jsx(AnimatedCheckmark, { className: "h-10 w-10", strokeWidth: 2.5, static: !animateCompletedSteps }) })) : (_jsx(motion.div, { initial: { scale: 0.8, opacity: 0 }, animate: { scale: 1, opacity: 1 }, transition: { delay: index * 0.2 }, className: `border-as-border-secondary relative flex h-10 w-10 items-center justify-center rounded-full border-[3px]`, children: index === currentStepIndex ? (
|
|
10
12
|
// Current step - show spinning border and step number
|
|
11
13
|
_jsxs(_Fragment, { children: [_jsx("div", { className: "border-t-as-primary absolute -inset-0.5 animate-spin rounded-full border-[3px] border-transparent" }), _jsx("span", { className: "text-as-primary font-semibold", children: index + 1 })] })) : (
|
|
12
14
|
// Future step - show step number with disabled styling
|
|
13
|
-
_jsx("span", { className: "text-as-content-disabled font-semibold", children: index + 1 })) })) }
|
|
15
|
+
_jsx("span", { className: "text-as-content-disabled font-semibold", children: index + 1 })) })) }), index < steps.length - 1 && (_jsx("div", { className: "flex w-8 items-center justify-center gap-1", children: Array.from({ length: 6 }).map((_, dotIndex) => (_jsx("div", { className: "bg-as-primary/30 h-[2px] w-[2px] rounded-full" }, dotIndex))) }))] }, index))) }), currentStep && (_jsxs(motion.div, { initial: { opacity: 0, y: 10 }, animate: { opacity: 1, y: 0 }, transition: { delay: 0.3 }, className: "text-center", children: [_jsx("h2", { className: "text-as-primary text-xl font-semibold", children: _jsx(TextMorph, { children: currentStep.title }) }), currentStep.description && (_jsxs("p", { className: "text-as-tertiary mt-1 flex items-center justify-center gap-1.5 text-sm", children: [currentStep.icon, _jsx(TextMorph, { children: currentStep.description })] }))] }))] }));
|
|
14
16
|
}
|
|
@@ -7,8 +7,7 @@ import { useMutation } from "@tanstack/react-query";
|
|
|
7
7
|
import { useMemo } from "react";
|
|
8
8
|
import { parseUnits } from "viem";
|
|
9
9
|
import { base } from "viem/chains";
|
|
10
|
-
import {
|
|
11
|
-
import { getCachedWalletHeaders } from "./useKycStatus.js";
|
|
10
|
+
import { getCachedWalletHeaders, useWalletAuthHeaders } from "./useKycStatus.js";
|
|
12
11
|
import { useValidatedClientReferenceId } from "./useValidatedClientReferenceId.js";
|
|
13
12
|
/**
|
|
14
13
|
* Hook for creating onramp orders in the Anyspend protocol
|
|
@@ -17,7 +16,7 @@ import { useValidatedClientReferenceId } from "./useValidatedClientReferenceId.j
|
|
|
17
16
|
export function useAnyspendCreateOnrampOrder({ onSuccess, onError } = {}) {
|
|
18
17
|
// Get B3 context values
|
|
19
18
|
const { partnerId } = useB3Config();
|
|
20
|
-
const { address } =
|
|
19
|
+
const { address, getHeaders: getWalletAuthHeaders } = useWalletAuthHeaders();
|
|
21
20
|
// Get validated client reference ID from B3 context
|
|
22
21
|
const createValidatedClientReferenceId = useValidatedClientReferenceId();
|
|
23
22
|
// Get fingerprint data
|
|
@@ -41,12 +40,11 @@ export function useAnyspendCreateOnrampOrder({ onSuccess, onError } = {}) {
|
|
|
41
40
|
const srcAmountOnRampInWei = parseUnits(srcFiatAmount, USDC_BASE.decimals);
|
|
42
41
|
// For card payments, include wallet auth headers so the backend can verify
|
|
43
42
|
// KYC by the signing wallet address (may differ from the B3 JWT address).
|
|
44
|
-
//
|
|
45
|
-
//
|
|
46
|
-
// KycGate pre-caches the headers in the "Continue to Verify" user-gesture.
|
|
43
|
+
// First try cached headers (from KycGate), then sign on-the-fly.
|
|
44
|
+
// The user is already clicking "Continue"/"Pay" so signing here is acceptable.
|
|
47
45
|
let kycWalletHeaders;
|
|
48
46
|
if (onramp.vendor === "stripe-web2" && address) {
|
|
49
|
-
kycWalletHeaders = getCachedWalletHeaders(address);
|
|
47
|
+
kycWalletHeaders = getCachedWalletHeaders(address) || (await getWalletAuthHeaders());
|
|
50
48
|
}
|
|
51
49
|
return await anyspendService.createOrder({
|
|
52
50
|
recipientAddress: normalizeAddress(recipientAddress),
|
|
@@ -24,10 +24,12 @@ interface KycVerifyResponse {
|
|
|
24
24
|
export declare function getCachedWalletHeaders(address: string): Record<string, string> | undefined;
|
|
25
25
|
/**
|
|
26
26
|
* Returns a function that builds the wallet-signature auth headers.
|
|
27
|
+
* Uses useAccountWallet (thirdweb) instead of wagmi so signing works
|
|
28
|
+
* for all wallet types (social login, EOA, smart wallet, etc.).
|
|
27
29
|
* Caches signatures for 4 minutes (server allows 5-minute window).
|
|
28
30
|
*/
|
|
29
31
|
export declare function useWalletAuthHeaders(): {
|
|
30
|
-
address:
|
|
32
|
+
address: string | undefined;
|
|
31
33
|
getHeaders: () => Promise<Record<string, string>>;
|
|
32
34
|
};
|
|
33
35
|
export declare function useKycStatus(enabled?: boolean): {
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
import { ANYSPEND_MAINNET_BASE_URL } from "../../../anyspend/constants/index.js";
|
|
3
|
+
import { useAccountWallet } from "../../../global-account/react/index.js";
|
|
3
4
|
import { useMutation, useQuery } from "@tanstack/react-query";
|
|
4
5
|
import { useCallback } from "react";
|
|
5
|
-
import { useAccount, useSignMessage } from "wagmi";
|
|
6
6
|
function buildWalletAuthMessage(walletAddress, timestamp) {
|
|
7
7
|
return `AnySpend wants to verify your identity for card payments.\n\nThis signature does not trigger a blockchain transaction or cost any gas.\n\nWallet: ${walletAddress.toLowerCase()}\nNonce: ${timestamp}`;
|
|
8
8
|
}
|
|
@@ -20,21 +20,25 @@ export function getCachedWalletHeaders(address) {
|
|
|
20
20
|
}
|
|
21
21
|
/**
|
|
22
22
|
* Returns a function that builds the wallet-signature auth headers.
|
|
23
|
+
* Uses useAccountWallet (thirdweb) instead of wagmi so signing works
|
|
24
|
+
* for all wallet types (social login, EOA, smart wallet, etc.).
|
|
23
25
|
* Caches signatures for 4 minutes (server allows 5-minute window).
|
|
24
26
|
*/
|
|
25
27
|
export function useWalletAuthHeaders() {
|
|
26
|
-
const { address } =
|
|
27
|
-
const
|
|
28
|
+
const { address, wallet } = useAccountWallet();
|
|
29
|
+
const signMessage = wallet.signMessage;
|
|
28
30
|
const getHeaders = useCallback(async () => {
|
|
29
31
|
if (!address)
|
|
30
32
|
throw new Error("No wallet connected");
|
|
33
|
+
if (!signMessage)
|
|
34
|
+
throw new Error("Wallet does not support message signing");
|
|
31
35
|
const walletAddress = address.toLowerCase();
|
|
32
36
|
const cached = headerCache.get(walletAddress);
|
|
33
37
|
if (cached && Date.now() < cached.expiresAt)
|
|
34
38
|
return cached.headers;
|
|
35
39
|
const timestamp = Math.floor(Date.now() / 1000);
|
|
36
40
|
const message = buildWalletAuthMessage(walletAddress, timestamp);
|
|
37
|
-
const signature = await
|
|
41
|
+
const signature = await signMessage({ message });
|
|
38
42
|
const headers = {
|
|
39
43
|
"X-Wallet-Address": walletAddress,
|
|
40
44
|
"X-Wallet-Signature": signature,
|
|
@@ -43,7 +47,7 @@ export function useWalletAuthHeaders() {
|
|
|
43
47
|
// Cache for 4 minutes so repeated fetches don't re-prompt the user
|
|
44
48
|
headerCache.set(walletAddress, { headers, expiresAt: Date.now() + 4 * 60 * 1000 });
|
|
45
49
|
return headers;
|
|
46
|
-
}, [address,
|
|
50
|
+
}, [address, signMessage]);
|
|
47
51
|
return { address, getHeaders };
|
|
48
52
|
}
|
|
49
53
|
export function useKycStatus(enabled = true) {
|
package/dist/esm/app.shared.js
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { AuthenticationClient } from "@feathersjs/authentication-client";
|
|
2
2
|
import Cookies from "js-cookie";
|
|
3
3
|
import { B3_AUTH_COOKIE_NAME } from "./shared/constants/index.js";
|
|
4
|
+
import { getSessionDurationDays } from "./shared/utils/session-duration.js";
|
|
4
5
|
export const B3_API_URL = process.env.EXPO_PUBLIC_B3_API || process.env.NEXT_PUBLIC_B3_API || process.env.PUBLIC_B3_API || "https://api.b3.fun";
|
|
5
|
-
const DEV_USER_GROUP = 4;
|
|
6
6
|
export const authenticate = async (app, accessToken, identityToken, params) => {
|
|
7
7
|
const fullToken = `${accessToken}+${identityToken}`;
|
|
8
8
|
// Do not authenticate if there is no token
|
|
@@ -17,12 +17,14 @@ export const authenticate = async (app, accessToken, identityToken, params) => {
|
|
|
17
17
|
}, {
|
|
18
18
|
query: params || {},
|
|
19
19
|
});
|
|
20
|
-
|
|
21
|
-
if (
|
|
22
|
-
const
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
20
|
+
const token = Cookies.get(B3_AUTH_COOKIE_NAME);
|
|
21
|
+
if (token) {
|
|
22
|
+
const days = getSessionDurationDays(response?.user?.preferences, params?.partnerId);
|
|
23
|
+
Cookies.set(B3_AUTH_COOKIE_NAME, token, {
|
|
24
|
+
...(days > 0 ? { expires: days } : {}),
|
|
25
|
+
secure: true,
|
|
26
|
+
sameSite: "Lax",
|
|
27
|
+
});
|
|
26
28
|
}
|
|
27
29
|
return response;
|
|
28
30
|
}
|
|
@@ -17,6 +17,7 @@ import { LinkAccount } from "./LinkAccount/LinkAccount.js";
|
|
|
17
17
|
import { LinkNewAccount } from "./LinkAccount/LinkNewAccount.js";
|
|
18
18
|
import { ManageAccount } from "./ManageAccount/ManageAccount.js";
|
|
19
19
|
import NotificationsContent from "./ManageAccount/NotificationsContent.js";
|
|
20
|
+
import SessionDurationContent from "./ManageAccount/SessionDurationContent.js";
|
|
20
21
|
import { RequestPermissions } from "./RequestPermissions/RequestPermissions.js";
|
|
21
22
|
import { Send } from "./Send/Send.js";
|
|
22
23
|
import { SignInWithB3Flow } from "./SignInWithB3/SignInWithB3Flow.js";
|
|
@@ -31,7 +32,7 @@ export function B3DynamicModal() {
|
|
|
31
32
|
const navigateBack = useModalStore(state => state.navigateBack);
|
|
32
33
|
const { theme } = useB3Config();
|
|
33
34
|
const isMobile = useIsMobile();
|
|
34
|
-
const { toasts, removeToast } = useToastContext();
|
|
35
|
+
const { toasts, removeToast, headerMode } = useToastContext();
|
|
35
36
|
// Define arrays for different modal type groups
|
|
36
37
|
const fullWidthTypes = [
|
|
37
38
|
"anySpend",
|
|
@@ -140,6 +141,8 @@ export function B3DynamicModal() {
|
|
|
140
141
|
return _jsx(Send, { ...contentType });
|
|
141
142
|
case "notifications":
|
|
142
143
|
return _jsx(NotificationsContent, { ...contentType });
|
|
144
|
+
case "sessionDuration":
|
|
145
|
+
return _jsx(SessionDurationContent, { partnerId: contentType.partnerId });
|
|
143
146
|
// Add other modal types here
|
|
144
147
|
default:
|
|
145
148
|
return null;
|
|
@@ -162,7 +165,7 @@ export function B3DynamicModal() {
|
|
|
162
165
|
contentType?.type === "send" ||
|
|
163
166
|
contentType?.type === "avatarEditor" ||
|
|
164
167
|
contentType?.type === "notifications") &&
|
|
165
|
-
"p-0", "mx-auto w-full max-w-md sm:max-w-lg"), hideCloseButton: hideCloseButton, hideGABranding: isAnySpendType, onEscapeKeyDown: !isClosable ? e => e.preventDefault() : undefined, children: [_jsx(ModalTitle, { className: "sr-only hidden", children: contentType?.type || "Modal" }), _jsx(ModalDescription, { className: "sr-only hidden", children: contentType?.type || "Modal Body" }), _jsxs("div", { className: cn("b3-modal-content no-scrollbar dark:bg-b3-background flex max-h-[90dvh] flex-col overflow-auto sm:max-h-[80dvh]"), children: [!hideCloseButton && (_jsxs("button", { onClick: navigateBack, className: "flex items-center gap-2 px-6 py-4 text-gray-600 transition-colors hover:text-gray-900 dark:text-gray-400 dark:hover:text-white", children: [_jsxs("svg", { width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [_jsx("path", { d: "M15.8337 10H4.16699", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }), _jsx("path", { d: "M10.0003 15.8334L4.16699 10L10.0003 4.16669", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" })] }), _jsx("span", { className: "font-inter text-sm font-semibold", children: "Back" })] })), _jsx("div", { className: "flex-1", children: renderContent() }), _jsx(AnimatePresence, { children: toasts.length > 0 && (_jsx(motion.div, { initial: { height: 0 }, animate: { height: "auto" }, exit: { height: 0 }, transition: { duration: 0.3, ease: "easeInOut" }, className: "toast-section relative z-10 overflow-hidden bg-white dark:border-neutral-800 dark:bg-neutral-900", children: _jsx(motion.div, { initial: { opacity: 0, y: -10 }, animate: { opacity: 1, y: 0 }, exit: { opacity: 0, y: -10 }, transition: { duration: 0.2, delay: 0.1 }, className: "p-4 pt-0", children: _jsx(ToastContainer, { toasts: toasts, onDismiss: removeToast, theme: theme }) }) })) })] })] }), isOpen && !isAnySpendType && (_jsx("style", { children: `
|
|
168
|
+
"p-0", "mx-auto w-full max-w-md sm:max-w-lg"), hideCloseButton: hideCloseButton, hideGABranding: isAnySpendType, onEscapeKeyDown: !isClosable ? e => e.preventDefault() : undefined, children: [_jsx(ModalTitle, { className: "sr-only hidden", children: contentType?.type || "Modal" }), _jsx(ModalDescription, { className: "sr-only hidden", children: contentType?.type || "Modal Body" }), _jsxs("div", { className: cn("b3-modal-content no-scrollbar dark:bg-b3-background flex max-h-[90dvh] flex-col overflow-auto sm:max-h-[80dvh]"), children: [!hideCloseButton && (_jsxs("button", { onClick: navigateBack, className: "flex items-center gap-2 px-6 py-4 text-gray-600 transition-colors hover:text-gray-900 dark:text-gray-400 dark:hover:text-white", children: [_jsxs("svg", { width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [_jsx("path", { d: "M15.8337 10H4.16699", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }), _jsx("path", { d: "M10.0003 15.8334L4.16699 10L10.0003 4.16669", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" })] }), _jsx("span", { className: "font-inter text-sm font-semibold", children: "Back" })] })), _jsx("div", { className: "flex-1", children: renderContent() }), _jsx(AnimatePresence, { children: !headerMode && toasts.length > 0 && (_jsx(motion.div, { initial: { height: 0 }, animate: { height: "auto" }, exit: { height: 0 }, transition: { duration: 0.3, ease: "easeInOut" }, className: "toast-section relative z-10 overflow-hidden bg-white dark:border-neutral-800 dark:bg-neutral-900", children: _jsx(motion.div, { initial: { opacity: 0, y: -10 }, animate: { opacity: 1, y: 0 }, exit: { opacity: 0, y: -10 }, transition: { duration: 0.2, delay: 0.1 }, className: "p-4 pt-0", children: _jsx(ToastContainer, { toasts: toasts, onDismiss: removeToast, theme: theme }) }) })) })] })] }), isOpen && !isAnySpendType && (_jsx("style", { children: `
|
|
166
169
|
.modal-inner-content {
|
|
167
170
|
transition: margin-bottom 0.3s ease-in-out;
|
|
168
171
|
margin-bottom: ${toasts.length > 0 ? "0px" : "23px"} !important;
|
|
@@ -1,5 +1,7 @@
|
|
|
1
|
-
|
|
1
|
+
import { EIP1193 } from "thirdweb/wallets";
|
|
2
|
+
declare const AuthenticationProvider: ({ partnerId, automaticallySetFirstEoa, defaultEoaProvider, }: {
|
|
2
3
|
partnerId: string;
|
|
3
4
|
automaticallySetFirstEoa: boolean;
|
|
5
|
+
defaultEoaProvider?: EIP1193.EIP1193Provider;
|
|
4
6
|
}) => null;
|
|
5
7
|
export default AuthenticationProvider;
|
|
@@ -1,9 +1,10 @@
|
|
|
1
1
|
import { useAuthentication } from "../../hooks/index.js";
|
|
2
2
|
import { useAutoSelectWallet } from "../../hooks/useAutoSelectWallet.js";
|
|
3
|
-
const AuthenticationProvider = ({ partnerId, automaticallySetFirstEoa, }) => {
|
|
3
|
+
const AuthenticationProvider = ({ partnerId, automaticallySetFirstEoa, defaultEoaProvider, }) => {
|
|
4
4
|
useAuthentication(partnerId);
|
|
5
5
|
useAutoSelectWallet({
|
|
6
6
|
enabled: automaticallySetFirstEoa,
|
|
7
|
+
defaultEoaProvider,
|
|
7
8
|
});
|
|
8
9
|
return null;
|
|
9
10
|
};
|
|
@@ -2,18 +2,20 @@ import { CreateOnrampOrderParams } from "../../../../anyspend/react/hooks/useAny
|
|
|
2
2
|
import { CreateOrderParams } from "../../../../anyspend/react/hooks/useAnyspendCreateOrder";
|
|
3
3
|
import { PermissionsConfig } from "../../../../global-account/types/permissions";
|
|
4
4
|
import "@relayprotocol/relay-kit-ui/styles.css";
|
|
5
|
-
import { Account, Wallet } from "thirdweb/wallets";
|
|
5
|
+
import { Account, EIP1193, Wallet } from "thirdweb/wallets";
|
|
6
6
|
import { CreateConnectorFn } from "wagmi";
|
|
7
7
|
import { ClientType } from "../../../client-manager";
|
|
8
8
|
/**
|
|
9
9
|
* Main B3Provider component
|
|
10
10
|
*/
|
|
11
|
-
export declare function B3Provider({ theme, children, accountOverride, environment, automaticallySetFirstEoa, simDuneApiKey, toaster: _toaster, clientType, rpcUrls, partnerId, stripePublishableKey, onConnect, onLogout, connectors, overrideDefaultConnectors, createClientReferenceId, defaultPermissions, }: {
|
|
11
|
+
export declare function B3Provider({ theme, children, accountOverride, environment, automaticallySetFirstEoa, defaultEoaProvider, simDuneApiKey, toaster: _toaster, clientType, rpcUrls, partnerId, stripePublishableKey, onConnect, onLogout, connectors, overrideDefaultConnectors, createClientReferenceId, defaultPermissions, disableBSMNTAuthentication, }: {
|
|
12
12
|
theme: "light" | "dark";
|
|
13
13
|
children: React.ReactNode;
|
|
14
14
|
accountOverride?: Account;
|
|
15
15
|
environment?: "development" | "production";
|
|
16
16
|
automaticallySetFirstEoa?: boolean;
|
|
17
|
+
/** EIP-1193 provider to auto-connect as the default EOA wallet (e.g., Farcaster frame wallet) */
|
|
18
|
+
defaultEoaProvider?: EIP1193.EIP1193Provider;
|
|
17
19
|
simDuneApiKey?: string;
|
|
18
20
|
toaster?: {
|
|
19
21
|
position?: "top-center" | "top-right" | "bottom-center" | "bottom-right";
|
|
@@ -30,4 +32,5 @@ export declare function B3Provider({ theme, children, accountOverride, environme
|
|
|
30
32
|
overrideDefaultConnectors?: boolean;
|
|
31
33
|
createClientReferenceId?: (params: CreateOrderParams | CreateOnrampOrderParams) => Promise<string>;
|
|
32
34
|
defaultPermissions?: PermissionsConfig;
|
|
35
|
+
disableBSMNTAuthentication?: boolean;
|
|
33
36
|
}): import("react/jsx-runtime").JSX.Element;
|
|
@@ -18,9 +18,9 @@ const queryClient = new QueryClient();
|
|
|
18
18
|
/**
|
|
19
19
|
* Main B3Provider component
|
|
20
20
|
*/
|
|
21
|
-
export function B3Provider({ theme = "light", children, accountOverride, environment, automaticallySetFirstEoa, simDuneApiKey,
|
|
21
|
+
export function B3Provider({ theme = "light", children, accountOverride, environment, automaticallySetFirstEoa, defaultEoaProvider, simDuneApiKey,
|
|
22
22
|
// deprecated since v0.0.87
|
|
23
|
-
toaster: _toaster, clientType = "rest", rpcUrls, partnerId, stripePublishableKey, onConnect, onLogout, connectors, overrideDefaultConnectors = false, createClientReferenceId, defaultPermissions, }) {
|
|
23
|
+
toaster: _toaster, clientType = "rest", rpcUrls, partnerId, stripePublishableKey, onConnect, onLogout, connectors, overrideDefaultConnectors = false, createClientReferenceId, defaultPermissions, disableBSMNTAuthentication = false, }) {
|
|
24
24
|
// Initialize Google Analytics on mount
|
|
25
25
|
useEffect(() => {
|
|
26
26
|
loadGA4Script();
|
|
@@ -30,7 +30,7 @@ toaster: _toaster, clientType = "rest", rpcUrls, partnerId, stripePublishableKey
|
|
|
30
30
|
setClientType(clientType);
|
|
31
31
|
}, [clientType]);
|
|
32
32
|
const wagmiConfig = useMemo(() => createWagmiConfig({ partnerId, rpcUrls, connectors, overrideDefaultConnectors }), [partnerId, rpcUrls, connectors, overrideDefaultConnectors]);
|
|
33
|
-
return (_jsx(ThirdwebProvider, { children: _jsx(WagmiProvider, { config: wagmiConfig, reconnectOnMount: false, children: _jsx(QueryClientProvider, { client: queryClient, children: _jsx(TooltipProvider, { children: _jsx(ToastProvider, { children: _jsx(LocalSDKProvider, { onConnectCallback: onConnect, onLogoutCallback: onLogout, children: _jsxs(B3ConfigProvider, { accountOverride: accountOverride, environment: environment, automaticallySetFirstEoa: !!automaticallySetFirstEoa, theme: theme, clientType: clientType, partnerId: partnerId, stripePublishableKey: stripePublishableKey, createClientReferenceId: createClientReferenceId, defaultPermissions: defaultPermissions, children: [_jsx(ToastContextConnector, {}), _jsxs(RelayKitProviderWrapper, { simDuneApiKey: simDuneApiKey, children: [children, _jsx(StyleRoot, { id: "b3-root" })] }), _jsx(AuthenticationProvider, { partnerId: partnerId, automaticallySetFirstEoa: !!automaticallySetFirstEoa })] }) }) }) }) }) }) }));
|
|
33
|
+
return (_jsx(ThirdwebProvider, { children: _jsx(WagmiProvider, { config: wagmiConfig, reconnectOnMount: false, children: _jsx(QueryClientProvider, { client: queryClient, children: _jsx(TooltipProvider, { children: _jsx(ToastProvider, { children: _jsx(LocalSDKProvider, { onConnectCallback: onConnect, onLogoutCallback: onLogout, disableBSMNTAuthentication: disableBSMNTAuthentication, children: _jsxs(B3ConfigProvider, { accountOverride: accountOverride, environment: environment, automaticallySetFirstEoa: !!automaticallySetFirstEoa, theme: theme, clientType: clientType, partnerId: partnerId, stripePublishableKey: stripePublishableKey, createClientReferenceId: createClientReferenceId, defaultPermissions: defaultPermissions, children: [_jsx(ToastContextConnector, {}), _jsxs(RelayKitProviderWrapper, { simDuneApiKey: simDuneApiKey, children: [children, _jsx(StyleRoot, { id: "b3-root" })] }), _jsx(AuthenticationProvider, { partnerId: partnerId, automaticallySetFirstEoa: !!automaticallySetFirstEoa, defaultEoaProvider: defaultEoaProvider })] }) }) }) }) }) }) }));
|
|
34
34
|
}
|
|
35
35
|
/**
|
|
36
36
|
* Component to connect the toast context to the global toast API
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
2
|
import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
|
|
3
3
|
import { ThirdwebProvider } from "thirdweb/react";
|
|
4
|
+
import { useMemo } from "react";
|
|
4
5
|
import { WagmiProvider } from "wagmi";
|
|
5
6
|
import { createWagmiConfig } from "../../utils/createWagmiConfig.js";
|
|
6
7
|
import AuthenticationProvider from "./AuthenticationProvider.js";
|
|
@@ -18,6 +19,6 @@ export function B3Provider({ theme = "light", children, accountOverride, environ
|
|
|
18
19
|
* Inner provider component for native
|
|
19
20
|
*/
|
|
20
21
|
export function InnerProvider({ children, accountOverride, environment, defaultPermissions, theme = "light", clientType = "socket", partnerId, rpcUrls, }) {
|
|
21
|
-
const wagmiConfig = createWagmiConfig({ partnerId, rpcUrls });
|
|
22
|
+
const wagmiConfig = useMemo(() => createWagmiConfig({ partnerId, rpcUrls }), [partnerId, rpcUrls]);
|
|
22
23
|
return (_jsx(WagmiProvider, { config: wagmiConfig, children: _jsx(QueryClientProvider, { client: queryClient, children: _jsx(B3ConfigProvider, { accountOverride: accountOverride, environment: environment, automaticallySetFirstEoa: false, theme: theme, clientType: clientType, partnerId: partnerId, defaultPermissions: defaultPermissions, children: children }) }) }));
|
|
23
24
|
}
|
|
@@ -6,13 +6,15 @@ import { Wallet } from "thirdweb/wallets";
|
|
|
6
6
|
export interface LocalSDKContextType {
|
|
7
7
|
onConnectCallback?: (wallet: Wallet, b3Jwt: string) => void | Promise<void>;
|
|
8
8
|
onLogoutCallback?: () => void | Promise<void>;
|
|
9
|
+
disableBSMNTAuthentication?: boolean;
|
|
9
10
|
}
|
|
10
11
|
export declare const LocalSDKContext: import("react").Context<LocalSDKContextType>;
|
|
11
12
|
/**
|
|
12
13
|
* Local SDK Provider that wraps the app and provides internal SDK state
|
|
13
14
|
*/
|
|
14
|
-
export declare function LocalSDKProvider({ children, onConnectCallback, onLogoutCallback, }: {
|
|
15
|
+
export declare function LocalSDKProvider({ children, onConnectCallback, onLogoutCallback, disableBSMNTAuthentication, }: {
|
|
15
16
|
children: React.ReactNode;
|
|
16
17
|
onConnectCallback?: (wallet: Wallet, b3Jwt: string) => void | Promise<void>;
|
|
17
18
|
onLogoutCallback?: () => void | Promise<void>;
|
|
19
|
+
disableBSMNTAuthentication?: boolean;
|
|
18
20
|
}): import("react/jsx-runtime").JSX.Element;
|
|
@@ -3,13 +3,15 @@ import { createContext } from "react";
|
|
|
3
3
|
export const LocalSDKContext = createContext({
|
|
4
4
|
onConnectCallback: undefined,
|
|
5
5
|
onLogoutCallback: undefined,
|
|
6
|
+
disableBSMNTAuthentication: false,
|
|
6
7
|
});
|
|
7
8
|
/**
|
|
8
9
|
* Local SDK Provider that wraps the app and provides internal SDK state
|
|
9
10
|
*/
|
|
10
|
-
export function LocalSDKProvider({ children, onConnectCallback, onLogoutCallback, }) {
|
|
11
|
+
export function LocalSDKProvider({ children, onConnectCallback, onLogoutCallback, disableBSMNTAuthentication, }) {
|
|
11
12
|
return (_jsx(LocalSDKContext.Provider, { value: {
|
|
12
13
|
onConnectCallback,
|
|
13
14
|
onLogoutCallback,
|
|
15
|
+
disableBSMNTAuthentication,
|
|
14
16
|
}, children: children }));
|
|
15
17
|
}
|
|
@@ -0,0 +1,52 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import app from "../../../../global-account/app.js";
|
|
3
|
+
import { useAuthentication, useModalStore } from "../../../../global-account/react/index.js";
|
|
4
|
+
import { getSessionDurationDays, SESSION_DURATION_LABELS, SESSION_DURATION_OPTIONS, setSessionDurationDays, } from "../../../../shared/utils/session-duration.js";
|
|
5
|
+
import { useState } from "react";
|
|
6
|
+
import ModalHeader from "../ModalHeader/ModalHeader.js";
|
|
7
|
+
const DESCRIPTIONS = {
|
|
8
|
+
0: "Sign out when browser closes",
|
|
9
|
+
1: "Stay signed in for 1 day",
|
|
10
|
+
7: "Stay signed in for 7 days",
|
|
11
|
+
14: "Stay signed in for 2 weeks",
|
|
12
|
+
30: "Stay signed in for 30 days",
|
|
13
|
+
};
|
|
14
|
+
const SessionDurationContent = ({ partnerId }) => {
|
|
15
|
+
const { user, setUser } = useAuthentication(partnerId);
|
|
16
|
+
const navigateBack = useModalStore(state => state.navigateBack);
|
|
17
|
+
const [sessionDays, setSessionDays] = useState(() => getSessionDurationDays(user?.preferences, partnerId));
|
|
18
|
+
const [saving, setSaving] = useState(false);
|
|
19
|
+
const handleSelect = async (days) => {
|
|
20
|
+
const previous = sessionDays;
|
|
21
|
+
setSessionDurationDays(days, partnerId);
|
|
22
|
+
setSessionDays(days);
|
|
23
|
+
if (user?.userId) {
|
|
24
|
+
setSaving(true);
|
|
25
|
+
try {
|
|
26
|
+
const updated = await app.service("users").patch(user.userId, {
|
|
27
|
+
preferences: {
|
|
28
|
+
...user.preferences,
|
|
29
|
+
[partnerId]: {
|
|
30
|
+
...((user.preferences ?? {})[partnerId] ?? {}),
|
|
31
|
+
sessionDuration: days,
|
|
32
|
+
},
|
|
33
|
+
},
|
|
34
|
+
});
|
|
35
|
+
setUser(updated);
|
|
36
|
+
}
|
|
37
|
+
catch (error) {
|
|
38
|
+
console.error("Failed to save session duration preference:", error);
|
|
39
|
+
// Revert optimistic update so UI stays consistent with server state
|
|
40
|
+
setSessionDays(previous);
|
|
41
|
+
setSessionDurationDays(previous, partnerId);
|
|
42
|
+
}
|
|
43
|
+
finally {
|
|
44
|
+
setSaving(false);
|
|
45
|
+
}
|
|
46
|
+
}
|
|
47
|
+
};
|
|
48
|
+
return (_jsxs("div", { className: "flex h-[470px] flex-col", children: [_jsx(ModalHeader, { showBackButton: true, showCloseButton: false, title: "Stay signed in", handleBack: navigateBack }), _jsx("div", { className: "flex flex-col gap-2 p-5", children: SESSION_DURATION_OPTIONS.map(days => (_jsxs("button", { type: "button", onClick: () => handleSelect(days), disabled: saving, className: `flex items-center justify-between rounded-xl border px-4 py-3 transition-colors ${sessionDays === days
|
|
49
|
+
? "border-[#3f3f46] bg-[#f4f4f5] dark:border-white dark:bg-white/10"
|
|
50
|
+
: "border-[#e4e4e7] bg-transparent hover:bg-[#f4f4f5] dark:border-white/10 dark:hover:bg-white/5"}`, children: [_jsxs("div", { className: "flex flex-col items-start gap-0.5", children: [_jsx("span", { className: "font-neue-montreal-semibold text-[14px] leading-none tracking-[-0.28px] text-[#3f3f46] dark:text-white", children: SESSION_DURATION_LABELS[days] }), _jsx("span", { className: "font-neue-montreal-medium text-[13px] leading-none tracking-[-0.26px] text-[#70707b] dark:text-white/50", children: DESCRIPTIONS[days] })] }), sessionDays === days && (_jsx("div", { className: "flex size-5 items-center justify-center rounded-full bg-[#3f3f46] dark:bg-white", children: _jsx("svg", { width: "10", height: "8", viewBox: "0 0 10 8", fill: "none", children: _jsx("path", { d: "M1 4L3.5 6.5L9 1", stroke: "white", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round", className: "dark:stroke-[#3f3f46]" }) }) }))] }, days))) })] }));
|
|
51
|
+
};
|
|
52
|
+
export default SessionDurationContent;
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
2
|
import { useAuthentication, useModalStore } from "../../../../global-account/react/index.js";
|
|
3
3
|
import { client } from "../../../../shared/utils/thirdweb.js";
|
|
4
|
+
import { getSessionDurationDays, SESSION_DURATION_LABELS } from "../../../../shared/utils/session-duration.js";
|
|
4
5
|
import { Loader2 } from "lucide-react";
|
|
5
6
|
import { useState } from "react";
|
|
6
7
|
import { useProfiles } from "thirdweb/react";
|
|
@@ -11,47 +12,29 @@ import SettingsProfileCard from "./SettingsProfileCard.js";
|
|
|
11
12
|
const SettingsContent = ({ partnerId, onLogout, chain, }) => {
|
|
12
13
|
const setB3ModalContentType = useModalStore(state => state.setB3ModalContentType);
|
|
13
14
|
const setB3ModalOpen = useModalStore(state => state.setB3ModalOpen);
|
|
14
|
-
const { logout } = useAuthentication(partnerId);
|
|
15
|
+
const { logout, user } = useAuthentication(partnerId);
|
|
15
16
|
const [logoutLoading, setLogoutLoading] = useState(false);
|
|
17
|
+
const sessionDays = getSessionDurationDays(user?.preferences, partnerId);
|
|
16
18
|
const { data: profilesRaw = [] } = useProfiles({ client });
|
|
17
19
|
const profiles = profilesRaw.filter((profile) => !["custom_auth_endpoint"].includes(profile.type));
|
|
18
20
|
const handleNavigate = (type) => {
|
|
19
21
|
if (type === "home") {
|
|
20
|
-
setB3ModalContentType({
|
|
21
|
-
type: "manageAccount",
|
|
22
|
-
chain,
|
|
23
|
-
partnerId,
|
|
24
|
-
onLogout,
|
|
25
|
-
activeTab: "home",
|
|
26
|
-
});
|
|
22
|
+
setB3ModalContentType({ type: "manageAccount", chain, partnerId, onLogout, activeTab: "home" });
|
|
27
23
|
}
|
|
28
24
|
else if (type === "swap") {
|
|
29
|
-
setB3ModalContentType({
|
|
30
|
-
type: "manageAccount",
|
|
31
|
-
chain,
|
|
32
|
-
partnerId,
|
|
33
|
-
onLogout,
|
|
34
|
-
activeTab: "tokens",
|
|
35
|
-
});
|
|
25
|
+
setB3ModalContentType({ type: "manageAccount", chain, partnerId, onLogout, activeTab: "tokens" });
|
|
36
26
|
}
|
|
37
27
|
else if (type === "linkAccount") {
|
|
38
|
-
setB3ModalContentType({
|
|
39
|
-
type: "linkAccount",
|
|
40
|
-
chain,
|
|
41
|
-
partnerId,
|
|
42
|
-
});
|
|
28
|
+
setB3ModalContentType({ type: "linkAccount", chain, partnerId });
|
|
43
29
|
}
|
|
44
30
|
else if (type === "notifications") {
|
|
45
|
-
setB3ModalContentType({
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
});
|
|
31
|
+
setB3ModalContentType({ type: "notifications", chain, partnerId });
|
|
32
|
+
}
|
|
33
|
+
else if (type === "sessionDuration") {
|
|
34
|
+
setB3ModalContentType({ type: "sessionDuration", chain, partnerId });
|
|
50
35
|
}
|
|
51
36
|
else {
|
|
52
|
-
setB3ModalContentType({
|
|
53
|
-
type: "avatarEditor",
|
|
54
|
-
});
|
|
37
|
+
setB3ModalContentType({ type: "avatarEditor" });
|
|
55
38
|
}
|
|
56
39
|
setB3ModalOpen(true);
|
|
57
40
|
};
|
|
@@ -62,7 +45,7 @@ const SettingsContent = ({ partnerId, onLogout, chain, }) => {
|
|
|
62
45
|
setB3ModalOpen(false);
|
|
63
46
|
setLogoutLoading(false);
|
|
64
47
|
};
|
|
65
|
-
return (_jsxs("div", { className: "flex h-[470px] flex-col", children: [_jsx(ModalHeader, { showBackButton: false, showCloseButton: false, title: "Settings" }), _jsx("div", { className: "p-5", children: _jsx("div", { className: "b3-modal-settings-profile-card dark:border-b3-line dark:bg-b3-background flex items-center rounded-xl border border-[#e4e4e7] bg-[#f4f4f5] p-4", children: _jsx(SettingsProfileCard, {}) }) }), _jsxs("div", { className: "space-y-3 px-5", children: [_jsx(SettingsMenuItem, { icon: _jsx("svg", { width: "40", height: "40", viewBox: "0 0 40 40", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: _jsx("path", { d: "M0 12C0 5.37258 5.37258 0 12 0H28C34.6274 0 40 5.37258 40 12V28C40 34.6274 34.6274 40 28 40H12C5.37258 40 0 34.6274 0 28V12Z", fill: "#F4F4F5" }) }), title: "Linked Accounts", subtitle: `${profiles.length} connected account${profiles.length > 1 ? "s" : ""}`, onClick: () => handleNavigate("linkAccount") }), _jsx(SettingsMenuItem, { icon: _jsx("svg", { width: "40", height: "40", viewBox: "0 0 40 40", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: _jsx("path", { d: "M0 12C0 5.37258 5.37258 0 12 0H28C34.6274 0 40 5.37258 40 12V28C40 34.6274 34.6274 40 28 40H12C5.37258 40 0 34.6274 0 28V12Z", fill: "#F4F4F5" }) }), title: "Notifications", subtitle: "Manage your notifications", onClick: () => handleNavigate("notifications") })] }), _jsx("div", { className: "mt-auto px-5 pb-5", children: _jsxs("button", { className: "b3-modal-sign-out-button border-b3-line hover:bg-b3-line bg-b3-background dark:bg-b3-background dark:border-b3-line dark:hover:bg-b3-line/80 flex w-full items-center justify-center gap-1.5 rounded-xl border border-solid p-3 transition-colors", onClick: onLogoutEnhanced, disabled: logoutLoading, style: {
|
|
48
|
+
return (_jsxs("div", { className: "flex h-[470px] flex-col", children: [_jsx(ModalHeader, { showBackButton: false, showCloseButton: false, title: "Settings" }), _jsx("div", { className: "p-5", children: _jsx("div", { className: "b3-modal-settings-profile-card dark:border-b3-line dark:bg-b3-background flex items-center rounded-xl border border-[#e4e4e7] bg-[#f4f4f5] p-4", children: _jsx(SettingsProfileCard, {}) }) }), _jsxs("div", { className: "space-y-3 px-5", children: [_jsx(SettingsMenuItem, { icon: _jsx("svg", { width: "40", height: "40", viewBox: "0 0 40 40", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: _jsx("path", { d: "M0 12C0 5.37258 5.37258 0 12 0H28C34.6274 0 40 5.37258 40 12V28C40 34.6274 34.6274 40 28 40H12C5.37258 40 0 34.6274 0 28V12Z", fill: "#F4F4F5" }) }), title: "Linked Accounts", subtitle: `${profiles.length} connected account${profiles.length > 1 ? "s" : ""}`, onClick: () => handleNavigate("linkAccount") }), _jsx(SettingsMenuItem, { icon: _jsx("svg", { width: "40", height: "40", viewBox: "0 0 40 40", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: _jsx("path", { d: "M0 12C0 5.37258 5.37258 0 12 0H28C34.6274 0 40 5.37258 40 12V28C40 34.6274 34.6274 40 28 40H12C5.37258 40 0 34.6274 0 28V12Z", fill: "#F4F4F5" }) }), title: "Notifications", subtitle: "Manage your notifications", onClick: () => handleNavigate("notifications") }), _jsx(SettingsMenuItem, { icon: _jsx("svg", { width: "40", height: "40", viewBox: "0 0 40 40", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: _jsx("path", { d: "M0 12C0 5.37258 5.37258 0 12 0H28C34.6274 0 40 5.37258 40 12V28C40 34.6274 34.6274 40 28 40H12C5.37258 40 0 34.6274 0 28V12Z", fill: "#F4F4F5" }) }), title: "Stay signed in", subtitle: SESSION_DURATION_LABELS[sessionDays] ?? `${sessionDays} days`, onClick: () => handleNavigate("sessionDuration") })] }), _jsx("div", { className: "mt-auto px-5 pb-5", children: _jsxs("button", { type: "button", className: "b3-modal-sign-out-button border-b3-line hover:bg-b3-line bg-b3-background dark:bg-b3-background dark:border-b3-line dark:hover:bg-b3-line/80 flex w-full items-center justify-center gap-1.5 rounded-xl border border-solid p-3 transition-colors", onClick: onLogoutEnhanced, disabled: logoutLoading, style: {
|
|
66
49
|
boxShadow: "inset 0px 0px 0px 1px rgba(10,13,18,0.18), inset 0px -2px 0px 0px rgba(10,13,18,0.05)",
|
|
67
50
|
}, children: [logoutLoading ? (_jsx(Loader2, { className: "text-b3-grey animate-spin", size: 20 })) : (_jsx(SignOutIcon, { size: 20, className: "text-b3-grey", color: "currentColor" })), _jsx("p", { className: "text-b3-grey dark:text-b3-foreground-muted font-neue-montreal-semibold text-base", children: "Sign out" })] }) })] }));
|
|
68
51
|
};
|
|
@@ -1,6 +1,15 @@
|
|
|
1
1
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
2
|
import { Button } from "../../custom/Button.js";
|
|
3
|
-
import {
|
|
3
|
+
import { Github, Mail } from "lucide-react";
|
|
4
|
+
import { strategyIcons, strategyLabels } from "../utils/signInUtils.js";
|
|
5
|
+
const fallbackIcons = {
|
|
6
|
+
github: Github,
|
|
7
|
+
email: Mail,
|
|
8
|
+
};
|
|
4
9
|
export function AuthButton({ strategy, onClick, isLoading, }) {
|
|
5
|
-
|
|
10
|
+
const strategyIcon = strategyIcons[strategy];
|
|
11
|
+
const strategyLabel = strategyLabels[strategy] || strategy;
|
|
12
|
+
const FallbackIcon = fallbackIcons[strategy];
|
|
13
|
+
const buttonLabel = `Sign in with ${strategyLabel}`;
|
|
14
|
+
return (_jsx(Button, { onClick: onClick, disabled: isLoading, "aria-label": buttonLabel, title: buttonLabel, className: "flex w-full items-center justify-center bg-gray-100 px-2 py-3 hover:bg-gray-200 dark:bg-gray-800 dark:hover:bg-gray-700", children: strategyIcon ? (_jsx("img", { src: strategyIcon, alt: `${strategyLabel} icon`, className: "h-9 w-9" })) : FallbackIcon ? (_jsx(FallbackIcon, { className: "h-9 w-9 text-gray-900 dark:text-gray-100" })) : (_jsx("span", { className: "text-sm font-semibold text-gray-900 dark:text-gray-100", children: strategyLabel.charAt(0) })) }, strategy));
|
|
6
15
|
}
|