@b3dotfun/sdk 0.0.35-alpha.5 → 0.0.35-alpha.6
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/global-account/react/components/SignInWithB3/SignInWithB3.js +2 -2
- package/dist/cjs/global-account/react/components/SignInWithB3/SignInWithB3Flow.js +1 -13
- package/dist/cjs/global-account/react/components/SignInWithB3/SignInWithB3Privy.js +1 -3
- package/dist/cjs/global-account/react/components/SignInWithB3/steps/LoginStep.js +0 -3
- package/dist/cjs/global-account/react/components/SignInWithB3/steps/LoginStepCustom.js +0 -3
- package/dist/cjs/global-account/react/hooks/useAuthentication.d.ts +1 -2
- package/dist/cjs/global-account/react/hooks/useAuthentication.js +9 -15
- package/dist/cjs/global-account/react/stores/useAuthStore.d.ts +2 -4
- package/dist/cjs/global-account/react/stores/useAuthStore.js +2 -4
- package/dist/esm/global-account/react/components/SignInWithB3/SignInWithB3.js +2 -2
- package/dist/esm/global-account/react/components/SignInWithB3/SignInWithB3Flow.js +1 -13
- package/dist/esm/global-account/react/components/SignInWithB3/SignInWithB3Privy.js +1 -3
- package/dist/esm/global-account/react/components/SignInWithB3/steps/LoginStep.js +0 -3
- package/dist/esm/global-account/react/components/SignInWithB3/steps/LoginStepCustom.js +0 -3
- package/dist/esm/global-account/react/hooks/useAuthentication.d.ts +1 -2
- package/dist/esm/global-account/react/hooks/useAuthentication.js +9 -15
- package/dist/esm/global-account/react/stores/useAuthStore.d.ts +2 -4
- package/dist/esm/global-account/react/stores/useAuthStore.js +2 -4
- package/dist/types/global-account/react/hooks/useAuthentication.d.ts +1 -2
- package/dist/types/global-account/react/stores/useAuthStore.d.ts +2 -4
- package/package.json +1 -1
- package/src/global-account/react/components/SignInWithB3/SignInWithB3.tsx +2 -2
- package/src/global-account/react/components/SignInWithB3/SignInWithB3Flow.tsx +1 -13
- package/src/global-account/react/components/SignInWithB3/SignInWithB3Privy.tsx +1 -3
- package/src/global-account/react/components/SignInWithB3/steps/LoginStep.tsx +0 -3
- package/src/global-account/react/components/SignInWithB3/steps/LoginStepCustom.tsx +0 -3
- package/src/global-account/react/hooks/useAuthentication.ts +9 -15
- package/src/global-account/react/stores/useAuthStore.ts +4 -8
|
@@ -9,7 +9,7 @@ const Loading_1 = require("../ui/Loading");
|
|
|
9
9
|
function SignInWithB3(props) {
|
|
10
10
|
const { setB3ModalOpen, setB3ModalContentType, setEcoSystemAccountAddress } = (0, react_1.useModalStore)();
|
|
11
11
|
const { account } = (0, react_1.useB3)();
|
|
12
|
-
const {
|
|
12
|
+
const { isAuthenticating, isAuthenticated } = (0, react_1.useAuthentication)(props.partnerId, props.loginWithSiwe);
|
|
13
13
|
const isMobile = (0, react_1.useIsMobile)();
|
|
14
14
|
(0, react_2.useEffect)(() => {
|
|
15
15
|
if (account) {
|
|
@@ -27,7 +27,7 @@ function SignInWithB3(props) {
|
|
|
27
27
|
if (isAuthenticated) {
|
|
28
28
|
return (0, jsx_runtime_1.jsx)(ManageAccountButton_1.ManageAccountButton, { ...props });
|
|
29
29
|
}
|
|
30
|
-
if (
|
|
30
|
+
if (isAuthenticating) {
|
|
31
31
|
return ((0, jsx_runtime_1.jsx)(react_1.StyleRoot, { children: (0, jsx_runtime_1.jsxs)(react_1.Button, { disabled: true, style: { backgroundColor: "#3368ef" }, className: "flex items-center gap-2 text-white", children: [props.withLogo !== false && ((0, jsx_runtime_1.jsx)("img", { src: "https://cdn.b3.fun/b3_logo_white.svg", alt: "B3 Logo", className: "h-5 w-5" })), props.loadingButtonText || (isMobile ? (0, jsx_runtime_1.jsx)(Loading_1.Loading, { size: "sm" }) : "Signing in…")] }) }));
|
|
32
32
|
}
|
|
33
33
|
return ((0, jsx_runtime_1.jsx)(react_1.StyleRoot, { children: (0, jsx_runtime_1.jsx)(react_1.Button, { onClick: handleClick, style: { backgroundColor: "#3368ef" }, className: "b3-sign-in-button flex items-center gap-2 font-medium text-white", children: props.buttonText ? (props.buttonText) : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("span", { children: "Sign in with" }), props.withLogo !== false && ((0, jsx_runtime_1.jsx)("img", { src: "https://cdn.b3.fun/b3_logo_white.svg", alt: "B3 Logo", className: "h-5 w-6" }))] })) }) }));
|
|
@@ -22,7 +22,6 @@ function SignInWithB3Flow({ strategies, onLoginSuccess, onSessionKeySuccess, onE
|
|
|
22
22
|
const { setB3ModalContentType, setB3ModalOpen, isOpen } = (0, react_1.useModalStore)();
|
|
23
23
|
const account = (0, react_3.useActiveAccount)();
|
|
24
24
|
const setIsAuthenticating = (0, react_1.useAuthStore)(state => state.setIsAuthenticating);
|
|
25
|
-
const setIsAuthenticatingV2 = (0, react_1.useAuthStore)(state => state.setIsAuthenticatingV2);
|
|
26
25
|
const isAuthenticating = (0, react_1.useAuthStore)(state => state.isAuthenticating);
|
|
27
26
|
const isConnected = (0, react_1.useAuthStore)(state => state.isConnected);
|
|
28
27
|
const setIsConnected = (0, react_1.useAuthStore)(state => state.setIsConnected);
|
|
@@ -167,7 +166,6 @@ function SignInWithB3Flow({ strategies, onLoginSuccess, onSessionKeySuccess, onE
|
|
|
167
166
|
if (loginWithSiwe) {
|
|
168
167
|
debug("setIsAuthenticating:true:1");
|
|
169
168
|
setIsAuthenticating(true);
|
|
170
|
-
setIsAuthenticatingV2(true);
|
|
171
169
|
const userAuth = await authenticate(account, partnerId);
|
|
172
170
|
setUser(userAuth.user);
|
|
173
171
|
}
|
|
@@ -175,17 +173,7 @@ function SignInWithB3Flow({ strategies, onLoginSuccess, onSessionKeySuccess, onE
|
|
|
175
173
|
onLoginSuccess?.(account);
|
|
176
174
|
debug("setIsAuthenticating:false:1");
|
|
177
175
|
setIsAuthenticating(false);
|
|
178
|
-
|
|
179
|
-
}, [
|
|
180
|
-
loginWithSiwe,
|
|
181
|
-
onLoginSuccess,
|
|
182
|
-
setIsAuthenticating,
|
|
183
|
-
authenticate,
|
|
184
|
-
partnerId,
|
|
185
|
-
setUser,
|
|
186
|
-
setIsConnected,
|
|
187
|
-
setIsAuthenticatingV2,
|
|
188
|
-
]);
|
|
176
|
+
}, [loginWithSiwe, onLoginSuccess, authenticate, partnerId, setUser, setIsConnected, setIsAuthenticating]);
|
|
189
177
|
(0, react_2.useEffect)(() => {
|
|
190
178
|
if (step === "permissions") {
|
|
191
179
|
setB3ModalContentType({
|
|
@@ -9,7 +9,6 @@ const debug = (0, debug_1.debugB3React)("SignInWithB3Privy");
|
|
|
9
9
|
function SignInWithB3Privy({ onSuccess, onError, partnerId, chain }) {
|
|
10
10
|
const { isLoading, connectTw, fullToken } = (0, react_1.useHandleConnectWithPrivy)(partnerId, chain, onSuccess);
|
|
11
11
|
const setIsAuthenticating = (0, react_1.useAuthStore)(state => state.setIsAuthenticating);
|
|
12
|
-
const setIsAuthenticatingV2 = (0, react_1.useAuthStore)(state => state.setIsAuthenticatingV2);
|
|
13
12
|
const setIsAuthenticated = (0, react_1.useAuthStore)(state => state.setIsAuthenticated);
|
|
14
13
|
const { logout } = (0, react_1.useAuthentication)(partnerId);
|
|
15
14
|
debug("@@SignInWithB3Privy", {
|
|
@@ -37,11 +36,10 @@ function SignInWithB3Privy({ onSuccess, onError, partnerId, chain }) {
|
|
|
37
36
|
finally {
|
|
38
37
|
debug("setIsAuthenticating:false:7");
|
|
39
38
|
setIsAuthenticating(false);
|
|
40
|
-
setIsAuthenticatingV2(false);
|
|
41
39
|
}
|
|
42
40
|
}
|
|
43
41
|
autoConnect();
|
|
44
|
-
}, [connectTw, onSuccess, onError,
|
|
42
|
+
}, [connectTw, onSuccess, onError, setIsAuthenticated, logout, setIsAuthenticating]);
|
|
45
43
|
// Currently we auto login, so we can show loading immediately and the onSuccess will proceed to the next modal
|
|
46
44
|
return ((0, jsx_runtime_1.jsx)("div", { className: "flex aspect-square items-center justify-center p-6", children: (0, jsx_runtime_1.jsx)(react_1.Loading, { variant: "white", size: "lg" }) }));
|
|
47
45
|
}
|
|
@@ -25,7 +25,6 @@ function LoginStep({ onSuccess, onError, partnerId, chain }) {
|
|
|
25
25
|
});
|
|
26
26
|
const { theme } = (0, react_1.useB3)();
|
|
27
27
|
const setIsAuthenticating = (0, react_1.useAuthStore)(state => state.setIsAuthenticating);
|
|
28
|
-
const setIsAuthenticatingV2 = (0, react_1.useAuthStore)(state => state.setIsAuthenticatingV2);
|
|
29
28
|
const setIsAuthenticated = (0, react_1.useAuthStore)(state => state.setIsAuthenticated);
|
|
30
29
|
const { logout } = (0, react_1.useAuthentication)(partnerId);
|
|
31
30
|
return ((0, jsx_runtime_1.jsx)(LoginStepContainer, { partnerId: partnerId, children: (0, jsx_runtime_1.jsx)(react_2.ConnectEmbed, { showThirdwebBranding: false, client: thirdweb_1.client, chain: chain, wallets: [wallet], theme: theme === "light"
|
|
@@ -66,7 +65,6 @@ function LoginStep({ onSuccess, onError, partnerId, chain }) {
|
|
|
66
65
|
}, className: "b3-login-step", onConnect: async (wallet) => {
|
|
67
66
|
try {
|
|
68
67
|
setIsAuthenticating(true);
|
|
69
|
-
setIsAuthenticatingV2(true);
|
|
70
68
|
(0, debug_1.debug)("setIsAuthenticating:true:6");
|
|
71
69
|
const account = wallet.getAccount();
|
|
72
70
|
if (!account)
|
|
@@ -83,7 +81,6 @@ function LoginStep({ onSuccess, onError, partnerId, chain }) {
|
|
|
83
81
|
finally {
|
|
84
82
|
(0, debug_1.debug)("setIsAuthenticating:false:6");
|
|
85
83
|
setIsAuthenticating(false);
|
|
86
|
-
setIsAuthenticatingV2(false);
|
|
87
84
|
}
|
|
88
85
|
} }) }));
|
|
89
86
|
}
|
|
@@ -13,7 +13,6 @@ function LoginStepCustom({ onSuccess, onError, partnerId, chain, strategies, max
|
|
|
13
13
|
const [showAllWallets, setShowAllWallets] = (0, react_2.useState)(false);
|
|
14
14
|
const { connect } = (0, react_1.useConnect)(partnerId, chain);
|
|
15
15
|
const setIsAuthenticating = (0, react_1.useAuthStore)(state => state.setIsAuthenticating);
|
|
16
|
-
const setIsAuthenticatingV2 = (0, react_1.useAuthStore)(state => state.setIsAuthenticatingV2);
|
|
17
16
|
const setIsAuthenticated = (0, react_1.useAuthStore)(state => state.setIsAuthenticated);
|
|
18
17
|
const { logout } = (0, react_1.useAuthentication)(partnerId);
|
|
19
18
|
const { connect: connectTW } = (0, react_3.useConnect)();
|
|
@@ -27,7 +26,6 @@ function LoginStepCustom({ onSuccess, onError, partnerId, chain, strategies, max
|
|
|
27
26
|
setIsLoading(true);
|
|
28
27
|
(0, debug_1.debug)("setIsAuthenticating:true:3");
|
|
29
28
|
setIsAuthenticating(true);
|
|
30
|
-
setIsAuthenticatingV2(true);
|
|
31
29
|
const options = (0, react_1.getConnectOptionsFromStrategy)(strategy);
|
|
32
30
|
let connectResult;
|
|
33
31
|
if (automaticallySetFirstEoa) {
|
|
@@ -62,7 +60,6 @@ function LoginStepCustom({ onSuccess, onError, partnerId, chain, strategies, max
|
|
|
62
60
|
setIsLoading(false);
|
|
63
61
|
(0, debug_1.debug)("setIsAuthenticating:false:3");
|
|
64
62
|
setIsAuthenticating(false);
|
|
65
|
-
setIsAuthenticatingV2(false);
|
|
66
63
|
}
|
|
67
64
|
};
|
|
68
65
|
return ((0, jsx_runtime_1.jsxs)(react_1.LoginStepContainer, { partnerId: partnerId, children: [authStrategies.length > 0 && ((0, jsx_runtime_1.jsx)("div", { className: "mb-6 grid w-full grid-cols-4 gap-4", children: authStrategies.map(strategy => {
|
|
@@ -1,7 +1,6 @@
|
|
|
1
1
|
import { preAuthenticate } from "thirdweb/wallets/in-app";
|
|
2
2
|
export declare function useAuthentication(partnerId: string, loginWithSiwe?: boolean): {
|
|
3
3
|
logout: (callback?: () => void) => Promise<void>;
|
|
4
|
-
isAuthenticating: boolean;
|
|
5
4
|
isAuthenticated: boolean;
|
|
6
5
|
isReady: boolean;
|
|
7
6
|
isConnecting: boolean;
|
|
@@ -9,5 +8,5 @@ export declare function useAuthentication(partnerId: string, loginWithSiwe?: boo
|
|
|
9
8
|
wallet: import("thirdweb/dist/types/wallets/in-app/core/wallet/types").EcosystemWallet;
|
|
10
9
|
preAuthenticate: typeof preAuthenticate;
|
|
11
10
|
connect: (strategyOptions?: import("thirdweb/wallets").SingleStepAuthArgsType) => Promise<import("thirdweb/wallets").Wallet | null>;
|
|
12
|
-
|
|
11
|
+
isAuthenticating: boolean;
|
|
13
12
|
};
|
|
@@ -24,17 +24,15 @@ function useAuthentication(partnerId, loginWithSiwe) {
|
|
|
24
24
|
const activeWallet = (0, react_3.useActiveWallet)();
|
|
25
25
|
const { authenticate } = (0, useSiwe_1.useSiwe)();
|
|
26
26
|
const { setUser } = (0, react_1.useB3)();
|
|
27
|
-
const isAuthenticating = (0, react_1.useAuthStore)(state => state.isAuthenticating);
|
|
28
27
|
const isAuthenticated = (0, react_1.useAuthStore)(state => state.isAuthenticated);
|
|
29
28
|
const setIsAuthenticated = (0, react_1.useAuthStore)(state => state.setIsAuthenticated);
|
|
30
|
-
const setIsAuthenticating = (0, react_1.useAuthStore)(state => state.setIsAuthenticating);
|
|
31
29
|
const setIsConnecting = (0, react_1.useAuthStore)(state => state.setIsConnecting);
|
|
32
30
|
const setIsConnected = (0, react_1.useAuthStore)(state => state.setIsConnected);
|
|
33
31
|
const isConnecting = (0, react_1.useAuthStore)(state => state.isConnecting);
|
|
34
32
|
const isConnected = (0, react_1.useAuthStore)(state => state.isConnected);
|
|
35
33
|
const useAutoConnectLoadingPrevious = (0, react_2.useRef)(false);
|
|
36
|
-
const
|
|
37
|
-
const
|
|
34
|
+
const setIsAuthenticating = (0, react_1.useAuthStore)(state => state.setIsAuthenticating);
|
|
35
|
+
const isAuthenticating = (0, react_1.useAuthStore)(state => state.isAuthenticating);
|
|
38
36
|
const hasStartedConnecting = (0, react_1.useAuthStore)(state => state.hasStartedConnecting);
|
|
39
37
|
const setHasStartedConnecting = (0, react_1.useAuthStore)(state => state.setHasStartedConnecting);
|
|
40
38
|
const { connect } = (0, useConnect_1.useConnect)(partnerId, supported_1.b3MainnetThirdWeb);
|
|
@@ -51,11 +49,10 @@ function useAuthentication(partnerId, loginWithSiwe) {
|
|
|
51
49
|
if (!loginWithSiwe) {
|
|
52
50
|
debug("Skipping SIWE login", { loginWithSiwe });
|
|
53
51
|
setIsAuthenticated(true);
|
|
54
|
-
|
|
52
|
+
setIsAuthenticating(false);
|
|
55
53
|
return;
|
|
56
54
|
}
|
|
57
55
|
debug("setIsAuthenticating:true:4");
|
|
58
|
-
setIsAuthenticating(true);
|
|
59
56
|
const account = await wallet.getAccount();
|
|
60
57
|
if (!account) {
|
|
61
58
|
throw new Error("No account found during auto-connect");
|
|
@@ -65,7 +62,7 @@ function useAuthentication(partnerId, loginWithSiwe) {
|
|
|
65
62
|
const userAuth = await app_1.default.reAuthenticate();
|
|
66
63
|
setUser(userAuth.user);
|
|
67
64
|
setIsAuthenticated(true);
|
|
68
|
-
|
|
65
|
+
setIsAuthenticating(false);
|
|
69
66
|
debug("Re-authenticated successfully", { userAuth });
|
|
70
67
|
// Authenticate on BSMNT with B3 JWT
|
|
71
68
|
const b3Jwt = await (0, bsmnt_1.authenticateWithB3JWT)(userAuth.accessToken);
|
|
@@ -77,7 +74,7 @@ function useAuthentication(partnerId, loginWithSiwe) {
|
|
|
77
74
|
const userAuth = await authenticate(account, partnerId);
|
|
78
75
|
setUser(userAuth.user);
|
|
79
76
|
setIsAuthenticated(true);
|
|
80
|
-
|
|
77
|
+
setIsAuthenticating(false);
|
|
81
78
|
debug("Fresh authentication successful", { userAuth });
|
|
82
79
|
// Authenticate on BSMNT with B3 JWT
|
|
83
80
|
const b3Jwt = await (0, bsmnt_1.authenticateWithB3JWT)(userAuth.accessToken);
|
|
@@ -90,7 +87,7 @@ function useAuthentication(partnerId, loginWithSiwe) {
|
|
|
90
87
|
debug("setIsAuthenticating:false:4");
|
|
91
88
|
setUser();
|
|
92
89
|
}
|
|
93
|
-
|
|
90
|
+
setIsAuthenticating(false);
|
|
94
91
|
},
|
|
95
92
|
});
|
|
96
93
|
/**
|
|
@@ -98,7 +95,7 @@ function useAuthentication(partnerId, loginWithSiwe) {
|
|
|
98
95
|
*/
|
|
99
96
|
(0, react_2.useEffect)(() => {
|
|
100
97
|
if (!useAutoConnectLoading && useAutoConnectLoadingPrevious.current && !hasStartedConnecting) {
|
|
101
|
-
|
|
98
|
+
setIsAuthenticating(false);
|
|
102
99
|
}
|
|
103
100
|
useAutoConnectLoadingPrevious.current = useAutoConnectLoading;
|
|
104
101
|
}, [useAutoConnectLoading]);
|
|
@@ -112,17 +109,15 @@ function useAuthentication(partnerId, loginWithSiwe) {
|
|
|
112
109
|
// This prevents the flicker state where both isAuthenticating and isAuthenticated are false
|
|
113
110
|
const timeout = setTimeout(() => {
|
|
114
111
|
debug("setIsAuthenticating:false:5a");
|
|
115
|
-
setIsAuthenticating(false);
|
|
116
112
|
setIsConnecting(false);
|
|
117
113
|
}, 100); // Add a small delay to prevent quick flickers
|
|
118
114
|
return () => clearTimeout(timeout);
|
|
119
115
|
}
|
|
120
116
|
else {
|
|
121
117
|
debug("setIsAuthenticating:false:5b");
|
|
122
|
-
setIsAuthenticating(false);
|
|
123
118
|
setIsConnecting(false);
|
|
124
119
|
}
|
|
125
|
-
}, [useAutoConnectLoading, isAuthenticated,
|
|
120
|
+
}, [useAutoConnectLoading, isAuthenticated, setIsConnecting, setIsConnected]);
|
|
126
121
|
const logout = async (callback) => {
|
|
127
122
|
if (activeWallet) {
|
|
128
123
|
debug("@@logout:activeWallet", activeWallet);
|
|
@@ -152,7 +147,6 @@ function useAuthentication(partnerId, loginWithSiwe) {
|
|
|
152
147
|
const isReady = isAuthenticated && !useAutoConnectLoading && !isAuthenticating;
|
|
153
148
|
return {
|
|
154
149
|
logout,
|
|
155
|
-
isAuthenticating: useAutoConnectLoading || isAuthenticating,
|
|
156
150
|
isAuthenticated,
|
|
157
151
|
isReady,
|
|
158
152
|
isConnecting,
|
|
@@ -160,6 +154,6 @@ function useAuthentication(partnerId, loginWithSiwe) {
|
|
|
160
154
|
wallet,
|
|
161
155
|
preAuthenticate: in_app_1.preAuthenticate,
|
|
162
156
|
connect,
|
|
163
|
-
|
|
157
|
+
isAuthenticating,
|
|
164
158
|
};
|
|
165
159
|
}
|
|
@@ -5,7 +5,6 @@ interface AuthState {
|
|
|
5
5
|
provider?: string;
|
|
6
6
|
accessToken?: string;
|
|
7
7
|
chain?: Chain;
|
|
8
|
-
isAuthenticating: boolean;
|
|
9
8
|
isAuthenticated: boolean;
|
|
10
9
|
isConnecting: boolean;
|
|
11
10
|
isConnected: boolean;
|
|
@@ -15,7 +14,6 @@ interface AuthState {
|
|
|
15
14
|
setStep: (step: "login" | "permissions") => void;
|
|
16
15
|
setIsConnecting: (isConnecting: boolean) => void;
|
|
17
16
|
setIsConnected: (isConnected: boolean) => void;
|
|
18
|
-
setIsAuthenticating: (isAuthenticating: boolean) => void;
|
|
19
17
|
setIsAuthenticated: (isAuthenticated: boolean) => void;
|
|
20
18
|
startAuth: (params: {
|
|
21
19
|
provider: string;
|
|
@@ -25,8 +23,8 @@ interface AuthState {
|
|
|
25
23
|
onError?: (error: Error) => void;
|
|
26
24
|
}) => void;
|
|
27
25
|
reset: () => void;
|
|
28
|
-
|
|
29
|
-
|
|
26
|
+
isAuthenticating: boolean;
|
|
27
|
+
setIsAuthenticating: (isAuthenticating: boolean) => void;
|
|
30
28
|
hasStartedConnecting: boolean;
|
|
31
29
|
setHasStartedConnecting: (hasStartedConnecting: boolean) => void;
|
|
32
30
|
}
|
|
@@ -8,7 +8,6 @@ exports.useAuthStore = (0, zustand_1.create)(set => ({
|
|
|
8
8
|
provider: undefined,
|
|
9
9
|
accessToken: undefined,
|
|
10
10
|
chain: undefined,
|
|
11
|
-
isAuthenticating: false,
|
|
12
11
|
isAuthenticated: false,
|
|
13
12
|
isConnecting: false,
|
|
14
13
|
isConnected: false,
|
|
@@ -18,7 +17,6 @@ exports.useAuthStore = (0, zustand_1.create)(set => ({
|
|
|
18
17
|
setStep: step => set({ step }),
|
|
19
18
|
setIsConnecting: isConnecting => set({ isConnecting }),
|
|
20
19
|
setIsConnected: isConnected => set({ isConnected }),
|
|
21
|
-
setIsAuthenticating: isAuthenticating => set({ isAuthenticating }),
|
|
22
20
|
setIsAuthenticated: isAuthenticated => set({ isAuthenticated }),
|
|
23
21
|
startAuth: params => set({
|
|
24
22
|
isOpen: true,
|
|
@@ -40,8 +38,8 @@ exports.useAuthStore = (0, zustand_1.create)(set => ({
|
|
|
40
38
|
onSuccess: undefined,
|
|
41
39
|
onError: undefined,
|
|
42
40
|
}),
|
|
43
|
-
|
|
44
|
-
|
|
41
|
+
isAuthenticating: true,
|
|
42
|
+
setIsAuthenticating: isAuthenticating => set({ isAuthenticating: isAuthenticating }),
|
|
45
43
|
hasStartedConnecting: false,
|
|
46
44
|
setHasStartedConnecting: hasStartedConnecting => set({ hasStartedConnecting }),
|
|
47
45
|
}));
|
|
@@ -6,7 +6,7 @@ import { Loading } from "../ui/Loading.js";
|
|
|
6
6
|
export function SignInWithB3(props) {
|
|
7
7
|
const { setB3ModalOpen, setB3ModalContentType, setEcoSystemAccountAddress } = useModalStore();
|
|
8
8
|
const { account } = useB3();
|
|
9
|
-
const {
|
|
9
|
+
const { isAuthenticating, isAuthenticated } = useAuthentication(props.partnerId, props.loginWithSiwe);
|
|
10
10
|
const isMobile = useIsMobile();
|
|
11
11
|
useEffect(() => {
|
|
12
12
|
if (account) {
|
|
@@ -24,7 +24,7 @@ export function SignInWithB3(props) {
|
|
|
24
24
|
if (isAuthenticated) {
|
|
25
25
|
return _jsx(ManageAccountButton, { ...props });
|
|
26
26
|
}
|
|
27
|
-
if (
|
|
27
|
+
if (isAuthenticating) {
|
|
28
28
|
return (_jsx(StyleRoot, { children: _jsxs(Button, { disabled: true, style: { backgroundColor: "#3368ef" }, className: "flex items-center gap-2 text-white", children: [props.withLogo !== false && (_jsx("img", { src: "https://cdn.b3.fun/b3_logo_white.svg", alt: "B3 Logo", className: "h-5 w-5" })), props.loadingButtonText || (isMobile ? _jsx(Loading, { size: "sm" }) : "Signing in…")] }) }));
|
|
29
29
|
}
|
|
30
30
|
return (_jsx(StyleRoot, { children: _jsx(Button, { onClick: handleClick, style: { backgroundColor: "#3368ef" }, className: "b3-sign-in-button flex items-center gap-2 font-medium text-white", children: props.buttonText ? (props.buttonText) : (_jsxs(_Fragment, { children: [_jsx("span", { children: "Sign in with" }), props.withLogo !== false && (_jsx("img", { src: "https://cdn.b3.fun/b3_logo_white.svg", alt: "B3 Logo", className: "h-5 w-6" }))] })) }) }));
|
|
@@ -19,7 +19,6 @@ export function SignInWithB3Flow({ strategies, onLoginSuccess, onSessionKeySucce
|
|
|
19
19
|
const { setB3ModalContentType, setB3ModalOpen, isOpen } = useModalStore();
|
|
20
20
|
const account = useActiveAccount();
|
|
21
21
|
const setIsAuthenticating = useAuthStore(state => state.setIsAuthenticating);
|
|
22
|
-
const setIsAuthenticatingV2 = useAuthStore(state => state.setIsAuthenticatingV2);
|
|
23
22
|
const isAuthenticating = useAuthStore(state => state.isAuthenticating);
|
|
24
23
|
const isConnected = useAuthStore(state => state.isConnected);
|
|
25
24
|
const setIsConnected = useAuthStore(state => state.setIsConnected);
|
|
@@ -164,7 +163,6 @@ export function SignInWithB3Flow({ strategies, onLoginSuccess, onSessionKeySucce
|
|
|
164
163
|
if (loginWithSiwe) {
|
|
165
164
|
debug("setIsAuthenticating:true:1");
|
|
166
165
|
setIsAuthenticating(true);
|
|
167
|
-
setIsAuthenticatingV2(true);
|
|
168
166
|
const userAuth = await authenticate(account, partnerId);
|
|
169
167
|
setUser(userAuth.user);
|
|
170
168
|
}
|
|
@@ -172,17 +170,7 @@ export function SignInWithB3Flow({ strategies, onLoginSuccess, onSessionKeySucce
|
|
|
172
170
|
onLoginSuccess?.(account);
|
|
173
171
|
debug("setIsAuthenticating:false:1");
|
|
174
172
|
setIsAuthenticating(false);
|
|
175
|
-
|
|
176
|
-
}, [
|
|
177
|
-
loginWithSiwe,
|
|
178
|
-
onLoginSuccess,
|
|
179
|
-
setIsAuthenticating,
|
|
180
|
-
authenticate,
|
|
181
|
-
partnerId,
|
|
182
|
-
setUser,
|
|
183
|
-
setIsConnected,
|
|
184
|
-
setIsAuthenticatingV2,
|
|
185
|
-
]);
|
|
173
|
+
}, [loginWithSiwe, onLoginSuccess, authenticate, partnerId, setUser, setIsConnected, setIsAuthenticating]);
|
|
186
174
|
useEffect(() => {
|
|
187
175
|
if (step === "permissions") {
|
|
188
176
|
setB3ModalContentType({
|
|
@@ -6,7 +6,6 @@ const debug = debugB3React("SignInWithB3Privy");
|
|
|
6
6
|
export function SignInWithB3Privy({ onSuccess, onError, partnerId, chain }) {
|
|
7
7
|
const { isLoading, connectTw, fullToken } = useHandleConnectWithPrivy(partnerId, chain, onSuccess);
|
|
8
8
|
const setIsAuthenticating = useAuthStore(state => state.setIsAuthenticating);
|
|
9
|
-
const setIsAuthenticatingV2 = useAuthStore(state => state.setIsAuthenticatingV2);
|
|
10
9
|
const setIsAuthenticated = useAuthStore(state => state.setIsAuthenticated);
|
|
11
10
|
const { logout } = useAuthentication(partnerId);
|
|
12
11
|
debug("@@SignInWithB3Privy", {
|
|
@@ -34,11 +33,10 @@ export function SignInWithB3Privy({ onSuccess, onError, partnerId, chain }) {
|
|
|
34
33
|
finally {
|
|
35
34
|
debug("setIsAuthenticating:false:7");
|
|
36
35
|
setIsAuthenticating(false);
|
|
37
|
-
setIsAuthenticatingV2(false);
|
|
38
36
|
}
|
|
39
37
|
}
|
|
40
38
|
autoConnect();
|
|
41
|
-
}, [connectTw, onSuccess, onError,
|
|
39
|
+
}, [connectTw, onSuccess, onError, setIsAuthenticated, logout, setIsAuthenticating]);
|
|
42
40
|
// Currently we auto login, so we can show loading immediately and the onSuccess will proceed to the next modal
|
|
43
41
|
return (_jsx("div", { className: "flex aspect-square items-center justify-center p-6", children: _jsx(Loading, { variant: "white", size: "lg" }) }));
|
|
44
42
|
}
|
|
@@ -21,7 +21,6 @@ export function LoginStep({ onSuccess, onError, partnerId, chain }) {
|
|
|
21
21
|
});
|
|
22
22
|
const { theme } = useB3();
|
|
23
23
|
const setIsAuthenticating = useAuthStore(state => state.setIsAuthenticating);
|
|
24
|
-
const setIsAuthenticatingV2 = useAuthStore(state => state.setIsAuthenticatingV2);
|
|
25
24
|
const setIsAuthenticated = useAuthStore(state => state.setIsAuthenticated);
|
|
26
25
|
const { logout } = useAuthentication(partnerId);
|
|
27
26
|
return (_jsx(LoginStepContainer, { partnerId: partnerId, children: _jsx(ConnectEmbed, { showThirdwebBranding: false, client: client, chain: chain, wallets: [wallet], theme: theme === "light"
|
|
@@ -62,7 +61,6 @@ export function LoginStep({ onSuccess, onError, partnerId, chain }) {
|
|
|
62
61
|
}, className: "b3-login-step", onConnect: async (wallet) => {
|
|
63
62
|
try {
|
|
64
63
|
setIsAuthenticating(true);
|
|
65
|
-
setIsAuthenticatingV2(true);
|
|
66
64
|
debug("setIsAuthenticating:true:6");
|
|
67
65
|
const account = wallet.getAccount();
|
|
68
66
|
if (!account)
|
|
@@ -79,7 +77,6 @@ export function LoginStep({ onSuccess, onError, partnerId, chain }) {
|
|
|
79
77
|
finally {
|
|
80
78
|
debug("setIsAuthenticating:false:6");
|
|
81
79
|
setIsAuthenticating(false);
|
|
82
|
-
setIsAuthenticatingV2(false);
|
|
83
80
|
}
|
|
84
81
|
} }) }));
|
|
85
82
|
}
|
|
@@ -10,7 +10,6 @@ export function LoginStepCustom({ onSuccess, onError, partnerId, chain, strategi
|
|
|
10
10
|
const [showAllWallets, setShowAllWallets] = useState(false);
|
|
11
11
|
const { connect } = useConnect(partnerId, chain);
|
|
12
12
|
const setIsAuthenticating = useAuthStore(state => state.setIsAuthenticating);
|
|
13
|
-
const setIsAuthenticatingV2 = useAuthStore(state => state.setIsAuthenticatingV2);
|
|
14
13
|
const setIsAuthenticated = useAuthStore(state => state.setIsAuthenticated);
|
|
15
14
|
const { logout } = useAuthentication(partnerId);
|
|
16
15
|
const { connect: connectTW } = useConnectTW();
|
|
@@ -24,7 +23,6 @@ export function LoginStepCustom({ onSuccess, onError, partnerId, chain, strategi
|
|
|
24
23
|
setIsLoading(true);
|
|
25
24
|
debug("setIsAuthenticating:true:3");
|
|
26
25
|
setIsAuthenticating(true);
|
|
27
|
-
setIsAuthenticatingV2(true);
|
|
28
26
|
const options = getConnectOptionsFromStrategy(strategy);
|
|
29
27
|
let connectResult;
|
|
30
28
|
if (automaticallySetFirstEoa) {
|
|
@@ -59,7 +57,6 @@ export function LoginStepCustom({ onSuccess, onError, partnerId, chain, strategi
|
|
|
59
57
|
setIsLoading(false);
|
|
60
58
|
debug("setIsAuthenticating:false:3");
|
|
61
59
|
setIsAuthenticating(false);
|
|
62
|
-
setIsAuthenticatingV2(false);
|
|
63
60
|
}
|
|
64
61
|
};
|
|
65
62
|
return (_jsxs(LoginStepContainer, { partnerId: partnerId, children: [authStrategies.length > 0 && (_jsx("div", { className: "mb-6 grid w-full grid-cols-4 gap-4", children: authStrategies.map(strategy => {
|
|
@@ -1,7 +1,6 @@
|
|
|
1
1
|
import { preAuthenticate } from "thirdweb/wallets/in-app";
|
|
2
2
|
export declare function useAuthentication(partnerId: string, loginWithSiwe?: boolean): {
|
|
3
3
|
logout: (callback?: () => void) => Promise<void>;
|
|
4
|
-
isAuthenticating: boolean;
|
|
5
4
|
isAuthenticated: boolean;
|
|
6
5
|
isReady: boolean;
|
|
7
6
|
isConnecting: boolean;
|
|
@@ -9,5 +8,5 @@ export declare function useAuthentication(partnerId: string, loginWithSiwe?: boo
|
|
|
9
8
|
wallet: import("thirdweb/dist/types/wallets/in-app/core/wallet/types").EcosystemWallet;
|
|
10
9
|
preAuthenticate: typeof preAuthenticate;
|
|
11
10
|
connect: (strategyOptions?: import("thirdweb/wallets").SingleStepAuthArgsType) => Promise<import("thirdweb/wallets").Wallet | null>;
|
|
12
|
-
|
|
11
|
+
isAuthenticating: boolean;
|
|
13
12
|
};
|
|
@@ -18,17 +18,15 @@ export function useAuthentication(partnerId, loginWithSiwe) {
|
|
|
18
18
|
const activeWallet = useActiveWallet();
|
|
19
19
|
const { authenticate } = useSiwe();
|
|
20
20
|
const { setUser } = useB3();
|
|
21
|
-
const isAuthenticating = useAuthStore(state => state.isAuthenticating);
|
|
22
21
|
const isAuthenticated = useAuthStore(state => state.isAuthenticated);
|
|
23
22
|
const setIsAuthenticated = useAuthStore(state => state.setIsAuthenticated);
|
|
24
|
-
const setIsAuthenticating = useAuthStore(state => state.setIsAuthenticating);
|
|
25
23
|
const setIsConnecting = useAuthStore(state => state.setIsConnecting);
|
|
26
24
|
const setIsConnected = useAuthStore(state => state.setIsConnected);
|
|
27
25
|
const isConnecting = useAuthStore(state => state.isConnecting);
|
|
28
26
|
const isConnected = useAuthStore(state => state.isConnected);
|
|
29
27
|
const useAutoConnectLoadingPrevious = useRef(false);
|
|
30
|
-
const
|
|
31
|
-
const
|
|
28
|
+
const setIsAuthenticating = useAuthStore(state => state.setIsAuthenticating);
|
|
29
|
+
const isAuthenticating = useAuthStore(state => state.isAuthenticating);
|
|
32
30
|
const hasStartedConnecting = useAuthStore(state => state.hasStartedConnecting);
|
|
33
31
|
const setHasStartedConnecting = useAuthStore(state => state.setHasStartedConnecting);
|
|
34
32
|
const { connect } = useConnect(partnerId, b3MainnetThirdWeb);
|
|
@@ -45,11 +43,10 @@ export function useAuthentication(partnerId, loginWithSiwe) {
|
|
|
45
43
|
if (!loginWithSiwe) {
|
|
46
44
|
debug("Skipping SIWE login", { loginWithSiwe });
|
|
47
45
|
setIsAuthenticated(true);
|
|
48
|
-
|
|
46
|
+
setIsAuthenticating(false);
|
|
49
47
|
return;
|
|
50
48
|
}
|
|
51
49
|
debug("setIsAuthenticating:true:4");
|
|
52
|
-
setIsAuthenticating(true);
|
|
53
50
|
const account = await wallet.getAccount();
|
|
54
51
|
if (!account) {
|
|
55
52
|
throw new Error("No account found during auto-connect");
|
|
@@ -59,7 +56,7 @@ export function useAuthentication(partnerId, loginWithSiwe) {
|
|
|
59
56
|
const userAuth = await app.reAuthenticate();
|
|
60
57
|
setUser(userAuth.user);
|
|
61
58
|
setIsAuthenticated(true);
|
|
62
|
-
|
|
59
|
+
setIsAuthenticating(false);
|
|
63
60
|
debug("Re-authenticated successfully", { userAuth });
|
|
64
61
|
// Authenticate on BSMNT with B3 JWT
|
|
65
62
|
const b3Jwt = await authenticateWithB3JWT(userAuth.accessToken);
|
|
@@ -71,7 +68,7 @@ export function useAuthentication(partnerId, loginWithSiwe) {
|
|
|
71
68
|
const userAuth = await authenticate(account, partnerId);
|
|
72
69
|
setUser(userAuth.user);
|
|
73
70
|
setIsAuthenticated(true);
|
|
74
|
-
|
|
71
|
+
setIsAuthenticating(false);
|
|
75
72
|
debug("Fresh authentication successful", { userAuth });
|
|
76
73
|
// Authenticate on BSMNT with B3 JWT
|
|
77
74
|
const b3Jwt = await authenticateWithB3JWT(userAuth.accessToken);
|
|
@@ -84,7 +81,7 @@ export function useAuthentication(partnerId, loginWithSiwe) {
|
|
|
84
81
|
debug("setIsAuthenticating:false:4");
|
|
85
82
|
setUser();
|
|
86
83
|
}
|
|
87
|
-
|
|
84
|
+
setIsAuthenticating(false);
|
|
88
85
|
},
|
|
89
86
|
});
|
|
90
87
|
/**
|
|
@@ -92,7 +89,7 @@ export function useAuthentication(partnerId, loginWithSiwe) {
|
|
|
92
89
|
*/
|
|
93
90
|
useEffect(() => {
|
|
94
91
|
if (!useAutoConnectLoading && useAutoConnectLoadingPrevious.current && !hasStartedConnecting) {
|
|
95
|
-
|
|
92
|
+
setIsAuthenticating(false);
|
|
96
93
|
}
|
|
97
94
|
useAutoConnectLoadingPrevious.current = useAutoConnectLoading;
|
|
98
95
|
}, [useAutoConnectLoading]);
|
|
@@ -106,17 +103,15 @@ export function useAuthentication(partnerId, loginWithSiwe) {
|
|
|
106
103
|
// This prevents the flicker state where both isAuthenticating and isAuthenticated are false
|
|
107
104
|
const timeout = setTimeout(() => {
|
|
108
105
|
debug("setIsAuthenticating:false:5a");
|
|
109
|
-
setIsAuthenticating(false);
|
|
110
106
|
setIsConnecting(false);
|
|
111
107
|
}, 100); // Add a small delay to prevent quick flickers
|
|
112
108
|
return () => clearTimeout(timeout);
|
|
113
109
|
}
|
|
114
110
|
else {
|
|
115
111
|
debug("setIsAuthenticating:false:5b");
|
|
116
|
-
setIsAuthenticating(false);
|
|
117
112
|
setIsConnecting(false);
|
|
118
113
|
}
|
|
119
|
-
}, [useAutoConnectLoading, isAuthenticated,
|
|
114
|
+
}, [useAutoConnectLoading, isAuthenticated, setIsConnecting, setIsConnected]);
|
|
120
115
|
const logout = async (callback) => {
|
|
121
116
|
if (activeWallet) {
|
|
122
117
|
debug("@@logout:activeWallet", activeWallet);
|
|
@@ -146,7 +141,6 @@ export function useAuthentication(partnerId, loginWithSiwe) {
|
|
|
146
141
|
const isReady = isAuthenticated && !useAutoConnectLoading && !isAuthenticating;
|
|
147
142
|
return {
|
|
148
143
|
logout,
|
|
149
|
-
isAuthenticating: useAutoConnectLoading || isAuthenticating,
|
|
150
144
|
isAuthenticated,
|
|
151
145
|
isReady,
|
|
152
146
|
isConnecting,
|
|
@@ -154,6 +148,6 @@ export function useAuthentication(partnerId, loginWithSiwe) {
|
|
|
154
148
|
wallet,
|
|
155
149
|
preAuthenticate,
|
|
156
150
|
connect,
|
|
157
|
-
|
|
151
|
+
isAuthenticating,
|
|
158
152
|
};
|
|
159
153
|
}
|
|
@@ -5,7 +5,6 @@ interface AuthState {
|
|
|
5
5
|
provider?: string;
|
|
6
6
|
accessToken?: string;
|
|
7
7
|
chain?: Chain;
|
|
8
|
-
isAuthenticating: boolean;
|
|
9
8
|
isAuthenticated: boolean;
|
|
10
9
|
isConnecting: boolean;
|
|
11
10
|
isConnected: boolean;
|
|
@@ -15,7 +14,6 @@ interface AuthState {
|
|
|
15
14
|
setStep: (step: "login" | "permissions") => void;
|
|
16
15
|
setIsConnecting: (isConnecting: boolean) => void;
|
|
17
16
|
setIsConnected: (isConnected: boolean) => void;
|
|
18
|
-
setIsAuthenticating: (isAuthenticating: boolean) => void;
|
|
19
17
|
setIsAuthenticated: (isAuthenticated: boolean) => void;
|
|
20
18
|
startAuth: (params: {
|
|
21
19
|
provider: string;
|
|
@@ -25,8 +23,8 @@ interface AuthState {
|
|
|
25
23
|
onError?: (error: Error) => void;
|
|
26
24
|
}) => void;
|
|
27
25
|
reset: () => void;
|
|
28
|
-
|
|
29
|
-
|
|
26
|
+
isAuthenticating: boolean;
|
|
27
|
+
setIsAuthenticating: (isAuthenticating: boolean) => void;
|
|
30
28
|
hasStartedConnecting: boolean;
|
|
31
29
|
setHasStartedConnecting: (hasStartedConnecting: boolean) => void;
|
|
32
30
|
}
|
|
@@ -5,7 +5,6 @@ export const useAuthStore = create(set => ({
|
|
|
5
5
|
provider: undefined,
|
|
6
6
|
accessToken: undefined,
|
|
7
7
|
chain: undefined,
|
|
8
|
-
isAuthenticating: false,
|
|
9
8
|
isAuthenticated: false,
|
|
10
9
|
isConnecting: false,
|
|
11
10
|
isConnected: false,
|
|
@@ -15,7 +14,6 @@ export const useAuthStore = create(set => ({
|
|
|
15
14
|
setStep: step => set({ step }),
|
|
16
15
|
setIsConnecting: isConnecting => set({ isConnecting }),
|
|
17
16
|
setIsConnected: isConnected => set({ isConnected }),
|
|
18
|
-
setIsAuthenticating: isAuthenticating => set({ isAuthenticating }),
|
|
19
17
|
setIsAuthenticated: isAuthenticated => set({ isAuthenticated }),
|
|
20
18
|
startAuth: params => set({
|
|
21
19
|
isOpen: true,
|
|
@@ -37,8 +35,8 @@ export const useAuthStore = create(set => ({
|
|
|
37
35
|
onSuccess: undefined,
|
|
38
36
|
onError: undefined,
|
|
39
37
|
}),
|
|
40
|
-
|
|
41
|
-
|
|
38
|
+
isAuthenticating: true,
|
|
39
|
+
setIsAuthenticating: isAuthenticating => set({ isAuthenticating: isAuthenticating }),
|
|
42
40
|
hasStartedConnecting: false,
|
|
43
41
|
setHasStartedConnecting: hasStartedConnecting => set({ hasStartedConnecting }),
|
|
44
42
|
}));
|
|
@@ -1,7 +1,6 @@
|
|
|
1
1
|
import { preAuthenticate } from "thirdweb/wallets/in-app";
|
|
2
2
|
export declare function useAuthentication(partnerId: string, loginWithSiwe?: boolean): {
|
|
3
3
|
logout: (callback?: () => void) => Promise<void>;
|
|
4
|
-
isAuthenticating: boolean;
|
|
5
4
|
isAuthenticated: boolean;
|
|
6
5
|
isReady: boolean;
|
|
7
6
|
isConnecting: boolean;
|
|
@@ -9,5 +8,5 @@ export declare function useAuthentication(partnerId: string, loginWithSiwe?: boo
|
|
|
9
8
|
wallet: import("thirdweb/dist/types/wallets/in-app/core/wallet/types").EcosystemWallet;
|
|
10
9
|
preAuthenticate: typeof preAuthenticate;
|
|
11
10
|
connect: (strategyOptions?: import("thirdweb/wallets").SingleStepAuthArgsType) => Promise<import("thirdweb/wallets").Wallet | null>;
|
|
12
|
-
|
|
11
|
+
isAuthenticating: boolean;
|
|
13
12
|
};
|
|
@@ -5,7 +5,6 @@ interface AuthState {
|
|
|
5
5
|
provider?: string;
|
|
6
6
|
accessToken?: string;
|
|
7
7
|
chain?: Chain;
|
|
8
|
-
isAuthenticating: boolean;
|
|
9
8
|
isAuthenticated: boolean;
|
|
10
9
|
isConnecting: boolean;
|
|
11
10
|
isConnected: boolean;
|
|
@@ -15,7 +14,6 @@ interface AuthState {
|
|
|
15
14
|
setStep: (step: "login" | "permissions") => void;
|
|
16
15
|
setIsConnecting: (isConnecting: boolean) => void;
|
|
17
16
|
setIsConnected: (isConnected: boolean) => void;
|
|
18
|
-
setIsAuthenticating: (isAuthenticating: boolean) => void;
|
|
19
17
|
setIsAuthenticated: (isAuthenticated: boolean) => void;
|
|
20
18
|
startAuth: (params: {
|
|
21
19
|
provider: string;
|
|
@@ -25,8 +23,8 @@ interface AuthState {
|
|
|
25
23
|
onError?: (error: Error) => void;
|
|
26
24
|
}) => void;
|
|
27
25
|
reset: () => void;
|
|
28
|
-
|
|
29
|
-
|
|
26
|
+
isAuthenticating: boolean;
|
|
27
|
+
setIsAuthenticating: (isAuthenticating: boolean) => void;
|
|
30
28
|
hasStartedConnecting: boolean;
|
|
31
29
|
setHasStartedConnecting: (hasStartedConnecting: boolean) => void;
|
|
32
30
|
}
|
package/package.json
CHANGED
|
@@ -21,7 +21,7 @@ export type SignInWithB3Props = Omit<SignInWithB3ModalProps, "type" | "showBackB
|
|
|
21
21
|
export function SignInWithB3(props: SignInWithB3Props) {
|
|
22
22
|
const { setB3ModalOpen, setB3ModalContentType, setEcoSystemAccountAddress } = useModalStore();
|
|
23
23
|
const { account } = useB3();
|
|
24
|
-
const {
|
|
24
|
+
const { isAuthenticating, isAuthenticated } = useAuthentication(props.partnerId, props.loginWithSiwe);
|
|
25
25
|
const isMobile = useIsMobile();
|
|
26
26
|
|
|
27
27
|
useEffect(() => {
|
|
@@ -43,7 +43,7 @@ export function SignInWithB3(props: SignInWithB3Props) {
|
|
|
43
43
|
return <ManageAccountButton {...props} />;
|
|
44
44
|
}
|
|
45
45
|
|
|
46
|
-
if (
|
|
46
|
+
if (isAuthenticating) {
|
|
47
47
|
return (
|
|
48
48
|
<StyleRoot>
|
|
49
49
|
<Button disabled style={{ backgroundColor: "#3368ef" }} className="flex items-center gap-2 text-white">
|
|
@@ -41,7 +41,6 @@ export function SignInWithB3Flow({
|
|
|
41
41
|
const { setB3ModalContentType, setB3ModalOpen, isOpen } = useModalStore();
|
|
42
42
|
const account = useActiveAccount();
|
|
43
43
|
const setIsAuthenticating = useAuthStore(state => state.setIsAuthenticating);
|
|
44
|
-
const setIsAuthenticatingV2 = useAuthStore(state => state.setIsAuthenticatingV2);
|
|
45
44
|
const isAuthenticating = useAuthStore(state => state.isAuthenticating);
|
|
46
45
|
const isConnected = useAuthStore(state => state.isConnected);
|
|
47
46
|
const setIsConnected = useAuthStore(state => state.setIsConnected);
|
|
@@ -199,7 +198,6 @@ export function SignInWithB3Flow({
|
|
|
199
198
|
if (loginWithSiwe) {
|
|
200
199
|
debug("setIsAuthenticating:true:1");
|
|
201
200
|
setIsAuthenticating(true);
|
|
202
|
-
setIsAuthenticatingV2(true);
|
|
203
201
|
const userAuth = await authenticate(account, partnerId);
|
|
204
202
|
setUser(userAuth.user);
|
|
205
203
|
}
|
|
@@ -207,18 +205,8 @@ export function SignInWithB3Flow({
|
|
|
207
205
|
onLoginSuccess?.(account);
|
|
208
206
|
debug("setIsAuthenticating:false:1");
|
|
209
207
|
setIsAuthenticating(false);
|
|
210
|
-
setIsAuthenticatingV2(false);
|
|
211
208
|
},
|
|
212
|
-
[
|
|
213
|
-
loginWithSiwe,
|
|
214
|
-
onLoginSuccess,
|
|
215
|
-
setIsAuthenticating,
|
|
216
|
-
authenticate,
|
|
217
|
-
partnerId,
|
|
218
|
-
setUser,
|
|
219
|
-
setIsConnected,
|
|
220
|
-
setIsAuthenticatingV2,
|
|
221
|
-
],
|
|
209
|
+
[loginWithSiwe, onLoginSuccess, authenticate, partnerId, setUser, setIsConnected, setIsAuthenticating],
|
|
222
210
|
);
|
|
223
211
|
|
|
224
212
|
useEffect(() => {
|
|
@@ -21,7 +21,6 @@ interface SignInWithB3PrivyProps {
|
|
|
21
21
|
export function SignInWithB3Privy({ onSuccess, onError, partnerId, chain }: SignInWithB3PrivyProps) {
|
|
22
22
|
const { isLoading, connectTw, fullToken } = useHandleConnectWithPrivy(partnerId, chain, onSuccess);
|
|
23
23
|
const setIsAuthenticating = useAuthStore(state => state.setIsAuthenticating);
|
|
24
|
-
const setIsAuthenticatingV2 = useAuthStore(state => state.setIsAuthenticatingV2);
|
|
25
24
|
const setIsAuthenticated = useAuthStore(state => state.setIsAuthenticated);
|
|
26
25
|
const { logout } = useAuthentication(partnerId);
|
|
27
26
|
|
|
@@ -49,11 +48,10 @@ export function SignInWithB3Privy({ onSuccess, onError, partnerId, chain }: Sign
|
|
|
49
48
|
} finally {
|
|
50
49
|
debug("setIsAuthenticating:false:7");
|
|
51
50
|
setIsAuthenticating(false);
|
|
52
|
-
setIsAuthenticatingV2(false);
|
|
53
51
|
}
|
|
54
52
|
}
|
|
55
53
|
autoConnect();
|
|
56
|
-
}, [connectTw, onSuccess, onError,
|
|
54
|
+
}, [connectTw, onSuccess, onError, setIsAuthenticated, logout, setIsAuthenticating]);
|
|
57
55
|
|
|
58
56
|
// Currently we auto login, so we can show loading immediately and the onSuccess will proceed to the next modal
|
|
59
57
|
return (
|
|
@@ -63,7 +63,6 @@ export function LoginStep({ onSuccess, onError, partnerId, chain }: LoginStepPro
|
|
|
63
63
|
|
|
64
64
|
const { theme } = useB3();
|
|
65
65
|
const setIsAuthenticating = useAuthStore(state => state.setIsAuthenticating);
|
|
66
|
-
const setIsAuthenticatingV2 = useAuthStore(state => state.setIsAuthenticatingV2);
|
|
67
66
|
const setIsAuthenticated = useAuthStore(state => state.setIsAuthenticated);
|
|
68
67
|
const { logout } = useAuthentication(partnerId);
|
|
69
68
|
|
|
@@ -118,7 +117,6 @@ export function LoginStep({ onSuccess, onError, partnerId, chain }: LoginStepPro
|
|
|
118
117
|
onConnect={async wallet => {
|
|
119
118
|
try {
|
|
120
119
|
setIsAuthenticating(true);
|
|
121
|
-
setIsAuthenticatingV2(true);
|
|
122
120
|
debug("setIsAuthenticating:true:6");
|
|
123
121
|
|
|
124
122
|
const account = wallet.getAccount();
|
|
@@ -135,7 +133,6 @@ export function LoginStep({ onSuccess, onError, partnerId, chain }: LoginStepPro
|
|
|
135
133
|
} finally {
|
|
136
134
|
debug("setIsAuthenticating:false:6");
|
|
137
135
|
setIsAuthenticating(false);
|
|
138
|
-
setIsAuthenticatingV2(false);
|
|
139
136
|
}
|
|
140
137
|
}}
|
|
141
138
|
/>
|
|
@@ -40,7 +40,6 @@ export function LoginStepCustom({
|
|
|
40
40
|
const [showAllWallets, setShowAllWallets] = useState(false);
|
|
41
41
|
const { connect } = useConnect(partnerId, chain);
|
|
42
42
|
const setIsAuthenticating = useAuthStore(state => state.setIsAuthenticating);
|
|
43
|
-
const setIsAuthenticatingV2 = useAuthStore(state => state.setIsAuthenticatingV2);
|
|
44
43
|
const setIsAuthenticated = useAuthStore(state => state.setIsAuthenticated);
|
|
45
44
|
const { logout } = useAuthentication(partnerId);
|
|
46
45
|
const { connect: connectTW } = useConnectTW();
|
|
@@ -56,7 +55,6 @@ export function LoginStepCustom({
|
|
|
56
55
|
setIsLoading(true);
|
|
57
56
|
debug("setIsAuthenticating:true:3");
|
|
58
57
|
setIsAuthenticating(true);
|
|
59
|
-
setIsAuthenticatingV2(true);
|
|
60
58
|
const options = getConnectOptionsFromStrategy(strategy);
|
|
61
59
|
let connectResult: Wallet | null;
|
|
62
60
|
|
|
@@ -90,7 +88,6 @@ export function LoginStepCustom({
|
|
|
90
88
|
setIsLoading(false);
|
|
91
89
|
debug("setIsAuthenticating:false:3");
|
|
92
90
|
setIsAuthenticating(false);
|
|
93
|
-
setIsAuthenticatingV2(false);
|
|
94
91
|
}
|
|
95
92
|
};
|
|
96
93
|
|
|
@@ -20,17 +20,15 @@ export function useAuthentication(partnerId: string, loginWithSiwe?: boolean) {
|
|
|
20
20
|
const activeWallet = useActiveWallet();
|
|
21
21
|
const { authenticate } = useSiwe();
|
|
22
22
|
const { setUser } = useB3();
|
|
23
|
-
const isAuthenticating = useAuthStore(state => state.isAuthenticating);
|
|
24
23
|
const isAuthenticated = useAuthStore(state => state.isAuthenticated);
|
|
25
24
|
const setIsAuthenticated = useAuthStore(state => state.setIsAuthenticated);
|
|
26
|
-
const setIsAuthenticating = useAuthStore(state => state.setIsAuthenticating);
|
|
27
25
|
const setIsConnecting = useAuthStore(state => state.setIsConnecting);
|
|
28
26
|
const setIsConnected = useAuthStore(state => state.setIsConnected);
|
|
29
27
|
const isConnecting = useAuthStore(state => state.isConnecting);
|
|
30
28
|
const isConnected = useAuthStore(state => state.isConnected);
|
|
31
29
|
const useAutoConnectLoadingPrevious = useRef(false);
|
|
32
|
-
const
|
|
33
|
-
const
|
|
30
|
+
const setIsAuthenticating = useAuthStore(state => state.setIsAuthenticating);
|
|
31
|
+
const isAuthenticating = useAuthStore(state => state.isAuthenticating);
|
|
34
32
|
const hasStartedConnecting = useAuthStore(state => state.hasStartedConnecting);
|
|
35
33
|
const setHasStartedConnecting = useAuthStore(state => state.setHasStartedConnecting);
|
|
36
34
|
const { connect } = useConnect(partnerId, b3MainnetThirdWeb);
|
|
@@ -51,11 +49,10 @@ export function useAuthentication(partnerId: string, loginWithSiwe?: boolean) {
|
|
|
51
49
|
debug("Skipping SIWE login", { loginWithSiwe });
|
|
52
50
|
setIsAuthenticated(true);
|
|
53
51
|
|
|
54
|
-
|
|
52
|
+
setIsAuthenticating(false);
|
|
55
53
|
return;
|
|
56
54
|
}
|
|
57
55
|
debug("setIsAuthenticating:true:4");
|
|
58
|
-
setIsAuthenticating(true);
|
|
59
56
|
const account = await wallet.getAccount();
|
|
60
57
|
if (!account) {
|
|
61
58
|
throw new Error("No account found during auto-connect");
|
|
@@ -66,7 +63,7 @@ export function useAuthentication(partnerId: string, loginWithSiwe?: boolean) {
|
|
|
66
63
|
const userAuth = await app.reAuthenticate();
|
|
67
64
|
setUser(userAuth.user);
|
|
68
65
|
setIsAuthenticated(true);
|
|
69
|
-
|
|
66
|
+
setIsAuthenticating(false);
|
|
70
67
|
debug("Re-authenticated successfully", { userAuth });
|
|
71
68
|
|
|
72
69
|
// Authenticate on BSMNT with B3 JWT
|
|
@@ -78,7 +75,7 @@ export function useAuthentication(partnerId: string, loginWithSiwe?: boolean) {
|
|
|
78
75
|
const userAuth = await authenticate(account, partnerId);
|
|
79
76
|
setUser(userAuth.user);
|
|
80
77
|
setIsAuthenticated(true);
|
|
81
|
-
|
|
78
|
+
setIsAuthenticating(false);
|
|
82
79
|
debug("Fresh authentication successful", { userAuth });
|
|
83
80
|
|
|
84
81
|
// Authenticate on BSMNT with B3 JWT
|
|
@@ -91,7 +88,7 @@ export function useAuthentication(partnerId: string, loginWithSiwe?: boolean) {
|
|
|
91
88
|
debug("setIsAuthenticating:false:4");
|
|
92
89
|
setUser();
|
|
93
90
|
}
|
|
94
|
-
|
|
91
|
+
setIsAuthenticating(false);
|
|
95
92
|
},
|
|
96
93
|
});
|
|
97
94
|
|
|
@@ -100,7 +97,7 @@ export function useAuthentication(partnerId: string, loginWithSiwe?: boolean) {
|
|
|
100
97
|
*/
|
|
101
98
|
useEffect(() => {
|
|
102
99
|
if (!useAutoConnectLoading && useAutoConnectLoadingPrevious.current && !hasStartedConnecting) {
|
|
103
|
-
|
|
100
|
+
setIsAuthenticating(false);
|
|
104
101
|
}
|
|
105
102
|
useAutoConnectLoadingPrevious.current = useAutoConnectLoading;
|
|
106
103
|
}, [useAutoConnectLoading]);
|
|
@@ -114,16 +111,14 @@ export function useAuthentication(partnerId: string, loginWithSiwe?: boolean) {
|
|
|
114
111
|
// This prevents the flicker state where both isAuthenticating and isAuthenticated are false
|
|
115
112
|
const timeout = setTimeout(() => {
|
|
116
113
|
debug("setIsAuthenticating:false:5a");
|
|
117
|
-
setIsAuthenticating(false);
|
|
118
114
|
setIsConnecting(false);
|
|
119
115
|
}, 100); // Add a small delay to prevent quick flickers
|
|
120
116
|
return () => clearTimeout(timeout);
|
|
121
117
|
} else {
|
|
122
118
|
debug("setIsAuthenticating:false:5b");
|
|
123
|
-
setIsAuthenticating(false);
|
|
124
119
|
setIsConnecting(false);
|
|
125
120
|
}
|
|
126
|
-
}, [useAutoConnectLoading, isAuthenticated,
|
|
121
|
+
}, [useAutoConnectLoading, isAuthenticated, setIsConnecting, setIsConnected]);
|
|
127
122
|
|
|
128
123
|
const logout = async (callback?: () => void) => {
|
|
129
124
|
if (activeWallet) {
|
|
@@ -160,7 +155,6 @@ export function useAuthentication(partnerId: string, loginWithSiwe?: boolean) {
|
|
|
160
155
|
|
|
161
156
|
return {
|
|
162
157
|
logout,
|
|
163
|
-
isAuthenticating: useAutoConnectLoading || isAuthenticating,
|
|
164
158
|
isAuthenticated,
|
|
165
159
|
isReady,
|
|
166
160
|
isConnecting,
|
|
@@ -168,6 +162,6 @@ export function useAuthentication(partnerId: string, loginWithSiwe?: boolean) {
|
|
|
168
162
|
wallet,
|
|
169
163
|
preAuthenticate,
|
|
170
164
|
connect,
|
|
171
|
-
|
|
165
|
+
isAuthenticating,
|
|
172
166
|
};
|
|
173
167
|
}
|
|
@@ -7,7 +7,6 @@ interface AuthState {
|
|
|
7
7
|
provider?: string;
|
|
8
8
|
accessToken?: string;
|
|
9
9
|
chain?: Chain;
|
|
10
|
-
isAuthenticating: boolean;
|
|
11
10
|
isAuthenticated: boolean;
|
|
12
11
|
isConnecting: boolean;
|
|
13
12
|
isConnected: boolean;
|
|
@@ -17,7 +16,6 @@ interface AuthState {
|
|
|
17
16
|
setStep: (step: "login" | "permissions") => void;
|
|
18
17
|
setIsConnecting: (isConnecting: boolean) => void;
|
|
19
18
|
setIsConnected: (isConnected: boolean) => void;
|
|
20
|
-
setIsAuthenticating: (isAuthenticating: boolean) => void;
|
|
21
19
|
setIsAuthenticated: (isAuthenticated: boolean) => void;
|
|
22
20
|
startAuth: (params: {
|
|
23
21
|
provider: string;
|
|
@@ -27,8 +25,8 @@ interface AuthState {
|
|
|
27
25
|
onError?: (error: Error) => void;
|
|
28
26
|
}) => void;
|
|
29
27
|
reset: () => void;
|
|
30
|
-
|
|
31
|
-
|
|
28
|
+
isAuthenticating: boolean;
|
|
29
|
+
setIsAuthenticating: (isAuthenticating: boolean) => void;
|
|
32
30
|
hasStartedConnecting: boolean;
|
|
33
31
|
setHasStartedConnecting: (hasStartedConnecting: boolean) => void;
|
|
34
32
|
}
|
|
@@ -39,7 +37,6 @@ export const useAuthStore = create<AuthState>(set => ({
|
|
|
39
37
|
provider: undefined,
|
|
40
38
|
accessToken: undefined,
|
|
41
39
|
chain: undefined,
|
|
42
|
-
isAuthenticating: false,
|
|
43
40
|
isAuthenticated: false,
|
|
44
41
|
isConnecting: false,
|
|
45
42
|
isConnected: false,
|
|
@@ -49,7 +46,6 @@ export const useAuthStore = create<AuthState>(set => ({
|
|
|
49
46
|
setStep: step => set({ step }),
|
|
50
47
|
setIsConnecting: isConnecting => set({ isConnecting }),
|
|
51
48
|
setIsConnected: isConnected => set({ isConnected }),
|
|
52
|
-
setIsAuthenticating: isAuthenticating => set({ isAuthenticating }),
|
|
53
49
|
setIsAuthenticated: isAuthenticated => set({ isAuthenticated }),
|
|
54
50
|
startAuth: params =>
|
|
55
51
|
set({
|
|
@@ -73,8 +69,8 @@ export const useAuthStore = create<AuthState>(set => ({
|
|
|
73
69
|
onSuccess: undefined,
|
|
74
70
|
onError: undefined,
|
|
75
71
|
}),
|
|
76
|
-
|
|
77
|
-
|
|
72
|
+
isAuthenticating: true,
|
|
73
|
+
setIsAuthenticating: isAuthenticating => set({ isAuthenticating: isAuthenticating }),
|
|
78
74
|
hasStartedConnecting: false,
|
|
79
75
|
setHasStartedConnecting: hasStartedConnecting => set({ hasStartedConnecting }),
|
|
80
76
|
}));
|