types

Author: AbhiPrasad

packages/react/package.json

@@ -58,7 +58,7 @@
     "@types/history-5": "npm:@types/history@4.7.8",
     "@types/hoist-non-react-statics": "^3.3.5",
     "@types/node-fetch": "^2.6.0",
-    "@types/react": "^18.0.0",
+    "@types/react": "17.0.3",
     "@types/react-router-3": "npm:@types/react-router@3.0.24",
     "@types/react-router-4": "npm:@types/react-router@5.1.14",
     "@types/react-router-5": "npm:@types/react-router@5.1.14",

packages/react/src/errorboundary.tsx

@@ -201,9 +201,7 @@ function withErrorBoundary<P extends Record<string, any>>(
 
   // Copy over static methods from Wrapped component to Profiler HOC
   // See: https://reactjs.org/docs/higher-order-components.html#static-methods-must-be-copied-over
-  // Need to set type to any because of hoist-non-react-statics typing
-  // eslint-disable-next-line @typescript-eslint/no-explicit-any
-  hoistNonReactStatics(Wrapped, WrappedComponent as any);
+  hoistNonReactStatics(Wrapped, WrappedComponent);
   return Wrapped;
 }
 

packages/react/src/profiler.tsx

@@ -169,9 +169,7 @@ function withProfiler<P extends Record<string, any>>(
 
   // Copy over static methods from Wrapped component to Profiler HOC
   // See: https://reactjs.org/docs/higher-order-components.html#static-methods-must-be-copied-over
-  // Need to set type to any because of hoist-non-react-statics typing
-  // eslint-disable-next-line @typescript-eslint/no-explicit-any
-  hoistNonReactStatics(Wrapped, WrappedComponent as any);
+  hoistNonReactStatics(Wrapped, WrappedComponent);
   return Wrapped;
 }
 

packages/react/src/reactrouter.tsx

@@ -32,7 +32,7 @@ export type RouteConfig = {
   [propName: string]: unknown;
   path?: string | string[];
   exact?: boolean;
-  component?: React.JSX.Element;
+  component?: JSX.Element;
   routes?: RouteConfig[];
 };
 
@@ -244,8 +244,7 @@ export function withSentryRouting<P extends Record<string, any>, R extends React
   };
 
   WrappedRoute.displayName = `sentryRoute(${componentDisplayName})`;
-  // Need to set type to any because of hoist-non-react-statics typing
-  hoistNonReactStatics(WrappedRoute, Route as any);
+  hoistNonReactStatics(WrappedRoute, Route);
   // @ts-expect-error Setting more specific React Component typing for `R` generic above
   // will break advanced type inference done by react router params:
   // https://github.com/DefinitelyTyped/DefinitelyTyped/blob/13dc4235c069e25fe7ee16e11f529d909f9f3ff8/types/react-router/index.d.ts#L154-L164

packages/react/src/types.ts

@@ -1,6 +1,5 @@
 // Disabling `no-explicit-any` for the whole file as `any` has became common requirement.
 /* eslint-disable @typescript-eslint/no-explicit-any */
-import type { JSX } from 'react';
 
 export type Action = 'PUSH' | 'REPLACE' | 'POP';
 

packages/react/test/errorboundary.test.tsx

@@ -26,16 +26,16 @@ jest.mock('@sentry/browser', () => {
   };
 });
 
-function Boo({ title }: { title: string }): React.JSX.Element {
+function Boo({ title }: { title: string }): JSX.Element {
   throw new Error(title);
 }
 
-function Bam(): React.JSX.Element {
+function Bam(): JSX.Element {
   const [title] = useState('boom');
   return <Boo title={title} />;
 }
 
-function EffectSpyFallback({ error }: { error: unknown }): React.JSX.Element {
+function EffectSpyFallback({ error }: { error: unknown }): JSX.Element {
   const [counter, setCounter] = useState(0);
 
   React.useEffect(() => {
@@ -50,10 +50,10 @@ function EffectSpyFallback({ error }: { error: unknown }): React.JSX.Element {
 }
 
 interface TestAppProps extends ErrorBoundaryProps {
-  errorComp?: React.JSX.Element;
+  errorComp?: JSX.Element;
 }
 
-const TestApp: React.FC<TestAppProps> = ({ children, errorComp, ...props }) => {
+const TestApp: React.FC<TestAppProps> = ({ children, errorComp, ...props }): any => {
   const customErrorComp = errorComp || <Bam />;
   const [isError, setError] = React.useState(false);
   return (
@@ -282,7 +282,7 @@ describe('ErrorBoundary', () => {
     it('does not set cause if non Error objected is thrown', () => {
       const TestAppThrowingString: React.FC<ErrorBoundaryProps> = ({ children, ...props }) => {
         const [isError, setError] = React.useState(false);
-        function StringBam(): React.JSX.Element {
+        function StringBam(): JSX.Element {
           throw 'bam';
         }
         return (
@@ -333,7 +333,7 @@ describe('ErrorBoundary', () => {
     it('handles when `error.cause` is nested', () => {
       const mockOnError = jest.fn();
 
-      function CustomBam(): React.JSX.Element {
+      function CustomBam(): JSX.Element {
         const firstError = new Error('bam');
         const secondError = new Error('bam2');
         const thirdError = new Error('bam3');
@@ -378,7 +378,7 @@ describe('ErrorBoundary', () => {
     it('handles when `error.cause` is recursive', () => {
       const mockOnError = jest.fn();
 
-      function CustomBam(): React.JSX.Element {
+      function CustomBam(): JSX.Element {
         const firstError = new Error('bam');
         const secondError = new Error('bam2');
         // @ts-expect-error Need to set cause on error

packages/react/test/reactrouterv3.test.tsx

@@ -62,7 +62,7 @@ jest.mock('@sentry/core', () => {
 
 describe('browserTracingReactRouterV3', () => {
   const routes = (
-    <Route path="/" component={({ children }: { children: React.JSX.Element }) => <div>{children}</div>}>
+    <Route path="/" component={({ children }: { children: JSX.Element }) => <div>{children}</div>}>
       <IndexRoute component={() => <div>Home</div>} />
       <Route path="about" component={() => <div>About</div>} />
       <Route path="features" component={() => <div>Features</div>} />

yarn.lock

@@ -8833,7 +8833,7 @@
   dependencies:
     "@types/react" "*"
 
-"@types/react@*", "@types/react@>=16.9.0":
+"@types/react@*", "@types/react@17.0.3", "@types/react@>=16.9.0":
   version "17.0.3"
   resolved "https://registry.yarnpkg.com/@types/react/-/react-17.0.3.tgz#ba6e215368501ac3826951eef2904574c262cc79"
   integrity sha512-wYOUxIgs2HZZ0ACNiIayItyluADNbONl7kt8lkLjVK8IitMH5QMyAh75Fwhmo37r1m7L2JaFj03sIfxBVDvRAg==
@@ -8842,14 +8842,6 @@
     "@types/scheduler" "*"
     csstype "^3.0.2"
 
-"@types/react@^18.0.0":
-  version "18.3.3"
-  resolved "https://registry.yarnpkg.com/@types/react/-/react-18.3.3.tgz#9679020895318b0915d7a3ab004d92d33375c45f"
-  integrity sha512-hti/R0pS0q1/xx+TsI73XIqk26eBsISZ2R0wUijXIngRK9R/e7Xw/cXVxQK7R5JjW+SV4zGcn5hXjudkN/pLIw==
-  dependencies:
-    "@types/prop-types" "*"
-    csstype "^3.0.2"
-
 "@types/resolve@1.17.1":
   version "1.17.1"
   resolved "https://registry.yarnpkg.com/@types/resolve/-/resolve-1.17.1.tgz#3afd6ad8967c77e4376c598a82ddd58f46ec45d6"