Merge pull request #1427 from authts/deprecated-1

use React.JSX instead of the global JSX namespace

Author: pamapa

docs/react-oidc-context.api.md

@@ -58,7 +58,7 @@ export interface AuthContextProps extends AuthState {
 }
 
 // @public
-export const AuthProvider: (props: AuthProviderProps) => JSX.Element;
+export const AuthProvider: (props: AuthProviderProps) => React_2.JSX.Element;
 
 // @public (undocumented)
 export interface AuthProviderBaseProps {
@@ -107,7 +107,7 @@ export const withAuthenticationRequired: <P extends object>(Component: React_2.C
 // @public (undocumented)
 export interface WithAuthenticationRequiredProps {
     onBeforeSignin?: () => Promise<void> | void;
-    OnRedirecting?: () => JSX.Element;
+    OnRedirecting?: () => React_2.JSX.Element;
     signinRedirectArgs?: SigninRedirectArgs;
 }
 

src/AuthProvider.tsx

@@ -152,7 +152,7 @@ const UserManagerImpl =
  *
  * @public
  */
-export const AuthProvider = (props: AuthProviderProps): JSX.Element => {
+export const AuthProvider = (props: AuthProviderProps): React.JSX.Element => {
     const {
         children,
 

src/withAuthenticationRequired.tsx

@@ -11,7 +11,7 @@ export interface WithAuthenticationRequiredProps {
     /**
      * Show a message when redirected to the signin page.
      */
-    OnRedirecting?: () => JSX.Element;
+    OnRedirecting?: () => React.JSX.Element;
 
     /**
      * Allows executing logic before the user is redirected to the signin page.
@@ -35,7 +35,7 @@ export const withAuthenticationRequired = <P extends object>(
     Component: React.ComponentType<P>,
     options: WithAuthenticationRequiredProps = {},
 ): React.FC<P> => {
-    const { OnRedirecting = (): JSX.Element => <></>, onBeforeSignin, signinRedirectArgs } = options;
+    const { OnRedirecting = (): React.JSX.Element => <></>, onBeforeSignin, signinRedirectArgs } = options;
     const displayName = `withAuthenticationRequired(${Component.displayName || Component.name})`;
     const C: React.FC<P> = (props) => {
         const auth = useAuth();

test/helpers.tsx

@@ -3,7 +3,7 @@ import React from "react";
 import { AuthProvider, type AuthProviderProps } from "../src/AuthProvider";
 
 export const createWrapper = (opts: AuthProviderProps, strictMode = true) => {
-    const AllProviders = ({ children }: React.PropsWithChildren): JSX.Element => {
+    const AllProviders = ({ children }: React.PropsWithChildren): React.JSX.Element => {
         const provider = <AuthProvider {...opts}>{children}</AuthProvider>;
         if (!strictMode) {
             return provider;

test/withAuth.test.tsx

@@ -10,7 +10,7 @@ describe("withAuth", () => {
     it("should wrap a class component, adding AuthContextProps to the component's `auth` prop", async () => {
         // arrange
         class MyComponent extends Component {
-            render(): JSX.Element {
+            render(): React.JSX.Element {
                 for (const [k, v] of Object.entries(this.props)) {
                     if (k === "auth") {
                         return <>{k}: {Object.keys(v as Map<string, unknown>)}</>;
@@ -34,7 +34,7 @@ describe("withAuth", () => {
     it("should pass through wrapped component props", async () => {
         // arrange
         class MyPropsComponent extends Component<{ originalProp: string }> {
-            render(): JSX.Element {
+            render(): React.JSX.Element {
                 return <>originalPropValue: {this.props.originalProp}</>;
             }
         }

test/withAuthenticationRequired.test.tsx

@@ -15,7 +15,7 @@ describe("withAuthenticationRequired", () => {
         authContext.signinRedirect = signinRedirectMock;
         useAuthMock.mockReturnValue(authContext);
 
-        const MyComponent = (): JSX.Element => <>Private</>;
+        const MyComponent = (): React.JSX.Element => <>Private</>;
         const WrappedComponent = withAuthenticationRequired(MyComponent);
 
         // act
@@ -40,7 +40,7 @@ describe("withAuthenticationRequired", () => {
         authContext.signinRedirect = signinRedirectMock;
         useAuthMock.mockReturnValue(authContext);
 
-        const MyComponent = (): JSX.Element => <>Private</>;
+        const MyComponent = (): React.JSX.Element => <>Private</>;
         const WrappedComponent = withAuthenticationRequired(MyComponent);
 
         // act
@@ -67,8 +67,8 @@ describe("withAuthenticationRequired", () => {
         authContext.signinRedirect = signinRedirectMock;
         useAuthMock.mockReturnValue(authContext);
 
-        const MyComponent = (): JSX.Element => <>Private</>;
-        const OnRedirecting = (): JSX.Element => <>Redirecting</>;
+        const MyComponent = (): React.JSX.Element => <>Private</>;
+        const OnRedirecting = (): React.JSX.Element => <>Redirecting</>;
         const WrappedComponent = withAuthenticationRequired(MyComponent, {
             OnRedirecting,
         });
@@ -94,7 +94,7 @@ describe("withAuthenticationRequired", () => {
         authContext.signinRedirect = signinRedirectMock;
         useAuthMock.mockReturnValue(authContext);
 
-        const MyComponent = (): JSX.Element => <>Private</>;
+        const MyComponent = (): React.JSX.Element => <>Private</>;
         const onBeforeSigninMock = jest.fn();
         const WrappedComponent = withAuthenticationRequired(MyComponent, {
             onBeforeSignin: onBeforeSigninMock,
@@ -124,7 +124,7 @@ describe("withAuthenticationRequired", () => {
         authContext.signinRedirect = signinRedirectMock;
         useAuthMock.mockReturnValue(authContext);
 
-        const MyComponent = (): JSX.Element => <>Private</>;
+        const MyComponent = (): React.JSX.Element => <>Private</>;
         const WrappedComponent = withAuthenticationRequired(MyComponent, {
             signinRedirectArgs: {
                 redirect_uri: "foo",
@@ -156,9 +156,9 @@ describe("withAuthenticationRequired", () => {
         authContext.signinRedirect = signinRedirectMock;
         useAuthMock.mockReturnValue(authContext);
 
-        const MyComponent = (): JSX.Element => <>Private</>;
+        const MyComponent = (): React.JSX.Element => <>Private</>;
         const WrappedComponent = withAuthenticationRequired(MyComponent);
-        const App = ({ foo }: { foo: number }): JSX.Element => (
+        const App = ({ foo }: { foo: number }): React.JSX.Element => (
             <div>
                 {foo}
                 <AuthProvider {...settingsStub}>