From e12030bb01656ebceb37bd196ad289b0bfb7ae70 Mon Sep 17 00:00:00 2001 From: devjiwonchoi Date: Thu, 23 Jan 2025 19:48:36 +0900 Subject: [PATCH] no devTools yet Co-authored-by: Jiachi Liu --- .../_experimental/app/error-boundary.tsx | 16 ++++++++-------- .../_experimental/app/react-dev-overlay.tsx | 10 +++++----- .../_experimental/pages/error-boundary.tsx | 10 +++++----- .../_experimental/pages/react-dev-overlay.tsx | 6 +++--- .../app-dir/owner-stack/owner-stack.test.ts | 6 +++--- 5 files changed, 24 insertions(+), 24 deletions(-) diff --git a/packages/next/src/client/components/react-dev-overlay/_experimental/app/error-boundary.tsx b/packages/next/src/client/components/react-dev-overlay/_experimental/app/error-boundary.tsx index d8b7589b22385f..799d73a03892a1 100644 --- a/packages/next/src/client/components/react-dev-overlay/_experimental/app/error-boundary.tsx +++ b/packages/next/src/client/components/react-dev-overlay/_experimental/app/error-boundary.tsx @@ -3,14 +3,14 @@ import type { GlobalErrorComponent } from '../../../error-boundary' import { PureComponent } from 'react' import { RuntimeErrorHandler } from '../../../errors/runtime-error-handler' -type DevToolsErrorBoundaryProps = { +type DevOverlayErrorBoundaryProps = { children: React.ReactNode - devTools: React.ReactNode + devOverlay: React.ReactNode globalError: [GlobalErrorComponent, React.ReactNode] onError: (value: boolean) => void } -type DevToolsErrorBoundaryState = { +type DevOverlayErrorBoundaryState = { isReactError: boolean reactError: unknown } @@ -38,9 +38,9 @@ function ErroredHtml({ ) } -export class DevToolsErrorBoundary extends PureComponent< - DevToolsErrorBoundaryProps, - DevToolsErrorBoundaryState +export class DevOverlayErrorBoundary extends PureComponent< + DevOverlayErrorBoundaryProps, + DevOverlayErrorBoundaryState > { state = { isReactError: false, reactError: null } @@ -62,7 +62,7 @@ export class DevToolsErrorBoundary extends PureComponent< } render() { - const { children, globalError, devTools } = this.props + const { children, globalError, devOverlay } = this.props const { isReactError, reactError } = this.state const fallback = ( @@ -72,7 +72,7 @@ export class DevToolsErrorBoundary extends PureComponent< return ( <> {isReactError ? fallback : children} - {devTools} + {devOverlay} ) } diff --git a/packages/next/src/client/components/react-dev-overlay/_experimental/app/react-dev-overlay.tsx b/packages/next/src/client/components/react-dev-overlay/_experimental/app/react-dev-overlay.tsx index 5be12a8849bc17..fbcac3085401d3 100644 --- a/packages/next/src/client/components/react-dev-overlay/_experimental/app/react-dev-overlay.tsx +++ b/packages/next/src/client/components/react-dev-overlay/_experimental/app/react-dev-overlay.tsx @@ -2,7 +2,7 @@ import type { OverlayState } from '../../shared' import type { GlobalErrorComponent } from '../../../error-boundary' import { useState } from 'react' -import { DevToolsErrorBoundary } from './error-boundary' +import { DevOverlayErrorBoundary } from './error-boundary' import { ShadowPortal } from '../internal/components/shadow-portal' import { Base } from '../internal/styles/base' import { ComponentStyles } from '../internal/styles/component-styles' @@ -24,7 +24,7 @@ export default function ReactDevOverlay({ const [isErrorOverlayOpen, setIsErrorOverlayOpen] = useState(false) const { readyErrors } = useErrorHook({ errors: state.errors, isAppDir: true }) - const devTools = ( + const devOverlay = ( @@ -47,12 +47,12 @@ export default function ReactDevOverlay({ ) return ( - {children} - + ) } diff --git a/packages/next/src/client/components/react-dev-overlay/_experimental/pages/error-boundary.tsx b/packages/next/src/client/components/react-dev-overlay/_experimental/pages/error-boundary.tsx index 8eda7feccdfaec..92ef7b7db7013c 100644 --- a/packages/next/src/client/components/react-dev-overlay/_experimental/pages/error-boundary.tsx +++ b/packages/next/src/client/components/react-dev-overlay/_experimental/pages/error-boundary.tsx @@ -1,15 +1,15 @@ import * as React from 'react' -type DevToolsErrorBoundaryProps = { +type DevOverlayErrorBoundaryProps = { children?: React.ReactNode onError: (error: Error, componentStack: string | null) => void isMounted?: boolean } -type DevToolsErrorBoundaryState = { error: Error | null } +type DevOverlayErrorBoundaryState = { error: Error | null } -export class DevToolsErrorBoundary extends React.PureComponent< - DevToolsErrorBoundaryProps, - DevToolsErrorBoundaryState +export class DevOverlayErrorBoundary extends React.PureComponent< + DevOverlayErrorBoundaryProps, + DevOverlayErrorBoundaryState > { state = { error: null } diff --git a/packages/next/src/client/components/react-dev-overlay/_experimental/pages/react-dev-overlay.tsx b/packages/next/src/client/components/react-dev-overlay/_experimental/pages/react-dev-overlay.tsx index ebc72c3c14fa60..72246638322a20 100644 --- a/packages/next/src/client/components/react-dev-overlay/_experimental/pages/react-dev-overlay.tsx +++ b/packages/next/src/client/components/react-dev-overlay/_experimental/pages/react-dev-overlay.tsx @@ -6,7 +6,7 @@ import { Base } from '../internal/styles/base' import { ComponentStyles } from '../internal/styles/component-styles' import { CssReset } from '../internal/styles/css-reset' -import { DevToolsErrorBoundary } from './error-boundary' +import { DevOverlayErrorBoundary } from './error-boundary' import { usePagesReactDevOverlay } from '../../pages/hooks' import { Colors } from '../internal/styles/colors' import { ErrorOverlay } from '../internal/components/errors/error-overlay/error-overlay' @@ -37,9 +37,9 @@ export default function ReactDevOverlay({ children }: ReactDevOverlayProps) { return ( <> - + {children ?? null} - + {isMounted && ( diff --git a/test/development/app-dir/owner-stack/owner-stack.test.ts b/test/development/app-dir/owner-stack/owner-stack.test.ts index 6cb631353bf4be..400a22c9052d4c 100644 --- a/test/development/app-dir/owner-stack/owner-stack.test.ts +++ b/test/development/app-dir/owner-stack/owner-stack.test.ts @@ -88,7 +88,7 @@ describe('app-dir - owner-stack', () => { at renderRootSync at performWorkOnRoot at performWorkOnRootViaSchedulerTask - at MessagePort.performWorkUntilDeadline The above error occurred in the component. It was handled by the error boundary." + at MessagePort.performWorkUntilDeadline The above error occurred in the component. It was handled by the error boundary." `) } else { expect(normalizeStackTrace(errorLog)).toMatchInlineSnapshot(` @@ -107,7 +107,7 @@ describe('app-dir - owner-stack', () => { at renderRootSync at performWorkOnRoot at performWorkOnRootViaSchedulerTask - at MessagePort.performWorkUntilDeadline The above error occurred in the component. It was handled by the error boundary." + at MessagePort.performWorkUntilDeadline The above error occurred in the component. It was handled by the error boundary." `) } } else { @@ -238,7 +238,7 @@ describe('app-dir - owner-stack', () => { at renderRootSync at performWorkOnRoot at performWorkOnRootViaSchedulerTask - at MessagePort.performWorkUntilDeadline The above error occurred in the component. It was handled by the error boundary." + at MessagePort.performWorkUntilDeadline The above error occurred in the component. It was handled by the error boundary." `) } else { expect(normalizeStackTrace(errorLog)).toMatchInlineSnapshot(`