8000 Enhance type safety in Auth0Provider and reducer by introducing generic user type by gyaneshgouraw-okta · Pull Request #842 · auth0/auth0-react · GitHub
[go: up one dir, main page]
More Web Proxy on the site http://driver.im/
Skip to content

Enhance type safety in Auth0Provider and reducer by introducing generic user type #842

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 2 commits into
base: main
Choose a base branch
from
Open

Enhance type safety in Auth0Provider and reducer by introducing generic user type #842

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
2d6c4f4
Enhance type safety in Auth0Provider and reducer by introducing gener…
gyaneshgouraw-okta Jun 17, 2025
bf3b0fc
fix: remove runtime type cast from context value
gyaneshgouraw-okta Jun 18, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
16 changes: 8 additions & 8 deletions src/auth0-provider.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -28,7 +28,7 @@
deprecateRedirectUri,
} from './utils';
import { reducer } from './reducer';
import { initialAuthState } from './auth-state';
import { initialAuthState, type AuthState } from './auth-state';

/**
* The state of the application before the user was redirected to the login page.
Expand All @@ -41,7 +41,7 @@
/**
* The main configuration to instantiate the `Auth0Provider`.
*/
export interface Auth0ProviderOptions extends Auth0ClientOptions {
export interface Auth0ProviderOptions<TUser extends User = User> extends Auth0ClientOptions {
/**
* The child nodes your Provider has wrapped
*/
Expand All @@ -51,7 +51,7 @@
* It uses `window.history` but you might want to overwrite this if you are using a custom router, like `react-router-dom`
* See the EXAMPLES.md for more info.
*/
onRedirectCallback?: (appState?: AppState, user?: User) => void;
onRedirectCallback?: (appState?: AppState, user?: TUser) => void;
/**
* By default, if the page url has code/state params, the SDK will treat them as Auth0's and attempt to exchange the
* code for a token. In some cases the code might be for something else (another OAuth SDK perhaps). In these
Expand Down Expand Up @@ -83,7 +83,7 @@
*
* For a sample on using multiple Auth0Providers review the [React Account Linking Sample](https://github.com/auth0-samples/auth0-link-accounts-sample/tree/react-variant)
*/
context?: React.Context<Auth0ContextInterface>;
context?: React.Context<Auth0ContextInterface<TUser>>;
}

/**
Expand Down Expand Up @@ -132,7 +132,7 @@
*
* Provides the Auth0Context to its child components.
*/
const Auth0Provider = (opts: Auth0ProviderOptions) => {
const Auth0Provider = <TUser extends User = User>(opts: Auth0ProviderOptions<TUser>) => {
const {
children,
skipRedirectCallback,
Expand All @@ -143,7 +143,7 @@
const [client] = useState(
() => new Auth0Client(toAuth0ClientOptions(clientOpts))
);
const [state, dispatch] = useReducer(reducer, initialAuthState);
const [state, dispatch] = useReducer(reducer<TUser>, initialAuthState as AuthState<TUser>);
const didInitialise = useRef(false);

const handleError = useCallback((error: Error) => {
Expand All @@ -158,7 +158,7 @@
didInitialise.current = true;
(async (): Promise<void> => {
try {
let user: User | undefined;
let user: TUser | undefined;
if (hasAuthParams() && !skipRedirectCallback) {
const { appState } = await client.handleRedirectCallback();
user = await client.getUser();
Expand Down Expand Up @@ -198,7 +198,7 @@
const user = await client.getUser();
dispatch({ type: 'LOGIN_POPUP_COMPLETE', user });
},
[client]

Check warning on line 201 in src/auth0-provider.tsx

View workflow job for this annotation

GitHub Actions / BrowserStack Tests 

React Hook useCallback has a missing dependency: 'handleError'. Either include it or remove the dependency array
);

const logout = useCallback(
Expand Down Expand Up @@ -272,7 +272,7 @@
[client]
);

const contextValue = useMemo<Auth0ContextInterface<User>>(() => {
const contextValue = useMemo<Auth0ContextInterface<TUser>>(() => {
return {
...state,
getAccessTokenSilently,
Expand Down
6 changes: 3 additions & 3 deletions src/reducer.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -17,7 +17,7 @@ type Action =
/**
* Handles how that state changes in the `useAuth0` hook.
*/
export const reducer = (state: AuthState, action: Action): AuthState => {
export const reducer = <TUser extends User = User>(state: AuthState<TUser>, action: Action): AuthState<TUser> => {
switch (action.type) {
case 'LOGIN_POPUP_STARTED':
return {
Expand All @@ -29,7 +29,7 @@ export const reducer = (state: AuthState, action: Action): AuthState => {
return {
...state,
isAuthenticated: !!action.user,
user: action.user,
user: action.user as TUser | undefined,
isLoading: false,
error: undefined,
};
Expand All @@ -41,7 +41,7 @@ export const reducer = (state: AuthState, action: Action): AuthState => {
return {
...state,
isAuthenticated: !!action.user,
user: action.user,
user: action.user as TUser | undefined,
};
case 'LOGOUT':
return {
Expand Down
Loading
0