@logto/react 2.2.0 → 2.2.3

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.
@@ -1,5 +1,6 @@
1
1
  'use strict';
2
2
 
3
+ var essentials = require('@silverhand/essentials');
3
4
  var react = require('react');
4
5
  var context = require('../context.cjs');
5
6
 
@@ -38,36 +39,34 @@ const useHandleSignInCallback = (callback) => {
38
39
  // eslint-disable-next-line @silverhand/fp/no-mutation
39
40
  callbackRef.current = callback; // Update ref to the latest callback.
40
41
  }, [callback]);
41
- const handleSignInCallback = react.useCallback(async (callbackUri) => {
42
- if (!logtoClient) {
43
- return context.throwContextError();
44
- }
45
- try {
46
- setLoadingState(true);
47
- await logtoClient.handleSignInCallback(callbackUri);
48
- setIsAuthenticated(true);
49
- callbackRef.current?.();
50
- }
51
- catch (error) {
52
- handleError(error, 'Unexpected error occurred while handling sign in callback.');
53
- }
54
- finally {
55
- setLoadingState(false);
56
- }
57
- }, [logtoClient, setLoadingState, setIsAuthenticated, handleError]);
58
42
  react.useEffect(() => {
59
- if (!logtoClient) {
43
+ if (!logtoClient || isLoading || error) {
60
44
  return;
61
45
  }
62
46
  (async () => {
63
47
  const currentPageUrl = window.location.href;
64
- const isAuthenticated = await logtoClient.isAuthenticated();
65
48
  const isRedirected = await logtoClient.isSignInRedirected(currentPageUrl);
66
49
  if (!isAuthenticated && isRedirected) {
67
- void handleSignInCallback(currentPageUrl);
50
+ setLoadingState(true);
51
+ await essentials.trySafe(async () => {
52
+ await logtoClient.handleSignInCallback(currentPageUrl);
53
+ setIsAuthenticated(true);
54
+ callbackRef.current?.();
55
+ }, (error) => {
56
+ handleError(error, 'Unexpected error occurred while handling sign in callback.');
57
+ });
58
+ setLoadingState(false);
68
59
  }
69
60
  })();
70
- }, [handleSignInCallback, isAuthenticated, logtoClient]);
61
+ }, [
62
+ error,
63
+ handleError,
64
+ isAuthenticated,
65
+ isLoading,
66
+ logtoClient,
67
+ setIsAuthenticated,
68
+ setLoadingState,
69
+ ]);
71
70
  return {
72
71
  isLoading,
73
72
  isAuthenticated,
@@ -96,10 +95,7 @@ const useLogto = () => {
96
95
  }
97
96
  };
98
97
  }, [setLoadingState, handleError]);
99
- return {
100
- isAuthenticated,
101
- isLoading,
102
- error,
98
+ const methods = react.useMemo(() => ({
103
99
  getRefreshToken: proxy(client.getRefreshToken.bind(client)),
104
100
  getAccessToken: proxy(client.getAccessToken.bind(client)),
105
101
  getAccessTokenClaims: proxy(client.getAccessTokenClaims.bind(client)),
@@ -114,6 +110,12 @@ const useLogto = () => {
114
110
  // Moreover, since the location will be redirected, the isAuthenticated state will not matter any more.
115
111
  signOut: proxy(client.signOut.bind(client)),
116
112
  fetchUserInfo: proxy(client.fetchUserInfo.bind(client)),
113
+ }), [client, proxy]);
114
+ return {
115
+ isAuthenticated,
116
+ isLoading,
117
+ error,
118
+ ...methods,
117
119
  };
118
120
  };
119
121
 
@@ -1,5 +1,5 @@
1
1
  import type LogtoClient from '@logto/browser';
2
- import type { Optional } from '@silverhand/essentials';
2
+ import { type Optional } from '@silverhand/essentials';
3
3
  type OptionalPromiseReturn<T> = {
4
4
  [K in keyof T]: T[K] extends (...args: infer A) => Promise<infer R> ? (...args: A) => Promise<Optional<R>> : T[K];
5
5
  };
@@ -1,4 +1,5 @@
1
- import { useContext, useRef, useEffect, useCallback } from 'react';
1
+ import { trySafe } from '@silverhand/essentials';
2
+ import { useContext, useRef, useEffect, useCallback, useMemo } from 'react';
2
3
  import { LogtoContext, throwContextError } from '../context.js';
3
4
 
4
5
  const useLoadingState = () => {
@@ -36,36 +37,34 @@ const useHandleSignInCallback = (callback) => {
36
37
  // eslint-disable-next-line @silverhand/fp/no-mutation
37
38
  callbackRef.current = callback; // Update ref to the latest callback.
38
39
  }, [callback]);
39
- const handleSignInCallback = useCallback(async (callbackUri) => {
40
- if (!logtoClient) {
41
- return throwContextError();
42
- }
43
- try {
44
- setLoadingState(true);
45
- await logtoClient.handleSignInCallback(callbackUri);
46
- setIsAuthenticated(true);
47
- callbackRef.current?.();
48
- }
49
- catch (error) {
50
- handleError(error, 'Unexpected error occurred while handling sign in callback.');
51
- }
52
- finally {
53
- setLoadingState(false);
54
- }
55
- }, [logtoClient, setLoadingState, setIsAuthenticated, handleError]);
56
40
  useEffect(() => {
57
- if (!logtoClient) {
41
+ if (!logtoClient || isLoading || error) {
58
42
  return;
59
43
  }
60
44
  (async () => {
61
45
  const currentPageUrl = window.location.href;
62
- const isAuthenticated = await logtoClient.isAuthenticated();
63
46
  const isRedirected = await logtoClient.isSignInRedirected(currentPageUrl);
64
47
  if (!isAuthenticated && isRedirected) {
65
- void handleSignInCallback(currentPageUrl);
48
+ setLoadingState(true);
49
+ await trySafe(async () => {
50
+ await logtoClient.handleSignInCallback(currentPageUrl);
51
+ setIsAuthenticated(true);
52
+ callbackRef.current?.();
53
+ }, (error) => {
54
+ handleError(error, 'Unexpected error occurred while handling sign in callback.');
55
+ });
56
+ setLoadingState(false);
66
57
  }
67
58
  })();
68
- }, [handleSignInCallback, isAuthenticated, logtoClient]);
59
+ }, [
60
+ error,
61
+ handleError,
62
+ isAuthenticated,
63
+ isLoading,
64
+ logtoClient,
65
+ setIsAuthenticated,
66
+ setLoadingState,
67
+ ]);
69
68
  return {
70
69
  isLoading,
71
70
  isAuthenticated,
@@ -94,10 +93,7 @@ const useLogto = () => {
94
93
  }
95
94
  };
96
95
  }, [setLoadingState, handleError]);
97
- return {
98
- isAuthenticated,
99
- isLoading,
100
- error,
96
+ const methods = useMemo(() => ({
101
97
  getRefreshToken: proxy(client.getRefreshToken.bind(client)),
102
98
  getAccessToken: proxy(client.getAccessToken.bind(client)),
103
99
  getAccessTokenClaims: proxy(client.getAccessTokenClaims.bind(client)),
@@ -112,6 +108,12 @@ const useLogto = () => {
112
108
  // Moreover, since the location will be redirected, the isAuthenticated state will not matter any more.
113
109
  signOut: proxy(client.signOut.bind(client)),
114
110
  fetchUserInfo: proxy(client.fetchUserInfo.bind(client)),
111
+ }), [client, proxy]);
112
+ return {
113
+ isAuthenticated,
114
+ isLoading,
115
+ error,
116
+ ...methods,
115
117
  };
116
118
  };
117
119
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@logto/react",
3
- "version": "2.2.0",
3
+ "version": "2.2.3",
4
4
  "type": "module",
5
5
  "main": "./lib/index.cjs",
6
6
  "module": "./lib/index.js",
@@ -21,7 +21,7 @@
21
21
  "directory": "packages/react"
22
22
  },
23
23
  "dependencies": {
24
- "@logto/browser": "^2.2.0",
24
+ "@logto/browser": "^2.2.1",
25
25
  "@silverhand/essentials": "^2.6.2"
26
26
  },
27
27
  "devDependencies": {