diff --git a/.eslintrc.json b/.eslintrc.json index 8f9646ddbfe..a0ee52fcc9d 100644 --- a/.eslintrc.json +++ b/.eslintrc.json @@ -297,6 +297,17 @@ "no-octal": "error", "no-octal-escape": "error", "no-regex-spaces": "error", + "no-restricted-imports": [ + "error", + { + "patterns": [ + { + "group": ["*/next-devtools/dev-overlay*"], + "message": "Use `next/dist/compiled/next-devtools` (`src/next-devtools/dev-overlay/entrypoint.ts`) instead. Prefer `src/next-devtools/shared/` for shared utils." + } + ] + } + ], "no-restricted-syntax": [ "error", "WithStatement", diff --git a/packages/next/.storybook/main.ts b/packages/next/.storybook/main.ts index 18bb145dc58..9dadabe0165 100644 --- a/packages/next/.storybook/main.ts +++ b/packages/next/.storybook/main.ts @@ -10,7 +10,7 @@ function getAbsolutePath(value: string): any { return dirname(require.resolve(join(value, 'package.json'))) } const config: StorybookConfig = { - stories: ['../src/client/components/react-dev-overlay/ui/**/*.stories.tsx'], + stories: ['../src/next-devtools/dev-overlay/**/*.stories.tsx'], addons: [ getAbsolutePath('@storybook/addon-webpack5-compiler-swc'), getAbsolutePath('@storybook/addon-essentials'), diff --git a/packages/next/next-devtools.webpack-config.js b/packages/next/next-devtools.webpack-config.js index c4b14ad8796..6f956e50412 100644 --- a/packages/next/next-devtools.webpack-config.js +++ b/packages/next/next-devtools.webpack-config.js @@ -25,10 +25,7 @@ module.exports = ({ dev, ...rest }) => { const target = `browserslist:${MODERN_BROWSERSLIST_TARGET.join(', ')}` return { - entry: path.join( - __dirname, - 'src/client/components/react-dev-overlay/entrypoint.js' - ), + entry: path.join(__dirname, 'src/next-devtools/entrypoint.ts'), target, mode: dev ? 'development' : 'production', output: { diff --git a/packages/next/next-runtime.webpack-config.js b/packages/next/next-runtime.webpack-config.js index 39b3bc1a7ec..7ef1a9920f3 100644 --- a/packages/next/next-runtime.webpack-config.js +++ b/packages/next/next-runtime.webpack-config.js @@ -93,7 +93,7 @@ const sharedExternals = [ const externalsMap = { './web/sandbox': 'next/dist/server/web/sandbox', 'next/dist/compiled/next-devtools': - 'commonjs next/dist/client/components/react-dev-overlay/dev-overlay.shim.js', + 'commonjs next/dist/next-devtools/dev-overlay.shim.js', } const externalsRegexMap = { diff --git a/packages/next/src/build/output/index.ts b/packages/next/src/build/output/index.ts index ae5f59ba297..39eb103e43b 100644 --- a/packages/next/src/build/output/index.ts +++ b/packages/next/src/build/output/index.ts @@ -2,7 +2,7 @@ import { bold, red, yellow } from '../../lib/picocolors' import stripAnsi from 'next/dist/compiled/strip-ansi' import textTable from 'next/dist/compiled/text-table' import createStore from 'next/dist/compiled/unistore' -import formatWebpackMessages from '../../client/components/react-dev-overlay/utils/format-webpack-messages' +import formatWebpackMessages from '../../shared/lib/format-webpack-messages' import { store as consoleStore } from './store' import type { OutputState } from './store' import type { webpack } from 'next/dist/compiled/webpack/webpack' diff --git a/packages/next/src/build/webpack-build/impl.ts b/packages/next/src/build/webpack-build/impl.ts index 6856cb9166a..50864661dc1 100644 --- a/packages/next/src/build/webpack-build/impl.ts +++ b/packages/next/src/build/webpack-build/impl.ts @@ -1,7 +1,7 @@ import type { webpack } from 'next/dist/compiled/webpack/webpack' import { stringBufferUtils } from 'next/dist/compiled/webpack-sources3' import { red } from '../../lib/picocolors' -import formatWebpackMessages from '../../client/components/react-dev-overlay/utils/format-webpack-messages' +import formatWebpackMessages from '../../shared/lib/format-webpack-messages' import { nonNullable } from '../../lib/non-nullable' import type { COMPILER_INDEXES } from '../../shared/lib/constants' import { diff --git a/packages/next/src/build/webpack/plugins/wellknown-errors-plugin/parseNotFoundError.ts b/packages/next/src/build/webpack/plugins/wellknown-errors-plugin/parseNotFoundError.ts index 89ad209ce3e..ffaf4734d06 100644 --- a/packages/next/src/build/webpack/plugins/wellknown-errors-plugin/parseNotFoundError.ts +++ b/packages/next/src/build/webpack/plugins/wellknown-errors-plugin/parseNotFoundError.ts @@ -3,7 +3,7 @@ import { SimpleWebpackError } from './simpleWebpackError' import { createOriginalStackFrame, getIgnoredSources, -} from '../../../../client/components/react-dev-overlay/server/middleware-webpack' +} from '../../../../server/dev/middleware-webpack' import type { webpack } from 'next/dist/compiled/webpack/webpack' // Based on https://github.com/webpack/webpack/blob/fcdd04a833943394bbb0a9eeb54a962a24cc7e41/lib/stats/DefaultStatsFactoryPlugin.js#L422-L431 diff --git a/packages/next/src/cli/next-info.ts b/packages/next/src/cli/next-info.ts index a4f7d749ceb..b04a51370cf 100755 --- a/packages/next/src/cli/next-info.ts +++ b/packages/next/src/cli/next-info.ts @@ -8,7 +8,7 @@ import { PHASE_INFO } from '../shared/lib/constants' import loadConfig from '../server/config' import { getRegistry } from '../lib/helpers/get-registry' import { parseVersionInfo } from '../server/dev/parse-version-info' -import { getStaleness } from '../client/components/react-dev-overlay/ui/components/version-staleness-info/version-staleness-info' +import { getStaleness } from '../next-devtools/shared/version-staleness' import { warn } from '../build/output/log' export type NextInfoOptions = { diff --git a/packages/next/src/client/app-index.tsx b/packages/next/src/client/app-index.tsx index a0dd2ff58a0..feed9204031 100644 --- a/packages/next/src/client/app-index.tsx +++ b/packages/next/src/client/app-index.tsx @@ -1,7 +1,7 @@ // imports polyfill from `@next/polyfill-module` after build. import '../build/polyfills/polyfill-module' -import './components/react-dev-overlay/app/app-dev-overlay-setup' +import '../next-devtools/userspace/app/app-dev-overlay-setup' import ReactDOMClient from 'react-dom/client' import React, { use } from 'react' @@ -272,7 +272,7 @@ export function hydrate( // Server rendering failed, fall back to client-side rendering if (process.env.NODE_ENV !== 'production') { const { createRootLevelDevOverlayElement } = - require('./components/react-dev-overlay/app/client-entry') as typeof import('./components/react-dev-overlay/app/client-entry') + require('../next-devtools/userspace/app/client-entry') as typeof import('../next-devtools/userspace/app/client-entry') // Note this won't cause hydration mismatch because we are doing CSR w/o hydration element = createRootLevelDevOverlayElement(element) diff --git a/packages/next/src/client/app-next-dev.ts b/packages/next/src/client/app-next-dev.ts index 3c860184d6c..d8744d934b6 100644 --- a/packages/next/src/client/app-next-dev.ts +++ b/packages/next/src/client/app-next-dev.ts @@ -7,7 +7,7 @@ import { appBootstrap } from './app-bootstrap' import { getComponentStack, getOwnerStack, -} from './components/react-dev-overlay/app/errors/stitched-error' +} from '../next-devtools/userspace/app/errors/stitched-error' import { isRecoverableError } from './react-client-callbacks/on-recoverable-error' // eslint-disable-next-line @next/internal/typechecked-require diff --git a/packages/next/src/client/app-next-turbopack.ts b/packages/next/src/client/app-next-turbopack.ts index ca0956d52a5..167b9f96476 100644 --- a/packages/next/src/client/app-next-turbopack.ts +++ b/packages/next/src/client/app-next-turbopack.ts @@ -2,7 +2,7 @@ import { appBootstrap } from './app-bootstrap' import { getComponentStack, getOwnerStack, -} from './components/react-dev-overlay/app/errors/stitched-error' +} from '../next-devtools/userspace/app/errors/stitched-error' import { isRecoverableError } from './react-client-callbacks/on-recoverable-error' window.next.version += '-turbo' diff --git a/packages/next/src/client/components/react-dev-overlay/entrypoint.js b/packages/next/src/client/components/react-dev-overlay/entrypoint.js deleted file mode 100644 index 58c7bc2caff..00000000000 --- a/packages/next/src/client/components/react-dev-overlay/entrypoint.js +++ /dev/null @@ -1 +0,0 @@ -export * from './dev-overlay.browser' diff --git a/packages/next/src/client/components/react-dev-overlay/utils/get-source-map-url.ts b/packages/next/src/client/components/react-dev-overlay/utils/get-source-map-url.ts deleted file mode 100644 index 9a6049cf1cd..00000000000 --- a/packages/next/src/client/components/react-dev-overlay/utils/get-source-map-url.ts +++ /dev/null @@ -1,15 +0,0 @@ -export function getSourceMapUrl(fileContents: string): string | null { - const regex = /\/\/[#@] ?sourceMappingURL=([^\s'"]+)\s*$/gm - let match = null - for (;;) { - let next = regex.exec(fileContents) - if (next == null) { - break - } - match = next - } - if (!(match && match[1])) { - return null - } - return match[1].toString() -} diff --git a/packages/next/src/client/components/use-action-queue.ts b/packages/next/src/client/components/use-action-queue.ts index fbb2d2469ba..04c8ebc2926 100644 --- a/packages/next/src/client/components/use-action-queue.ts +++ b/packages/next/src/client/components/use-action-queue.ts @@ -36,7 +36,7 @@ export function useActionQueue( // weird implementation details. if (process.env.NODE_ENV !== 'production') { const { useAppDevRenderingIndicator } = - require('./react-dev-overlay/utils/dev-indicator/use-app-dev-rendering-indicator') as typeof import('./react-dev-overlay/utils/dev-indicator/use-app-dev-rendering-indicator') + require('../../next-devtools/userspace/use-app-dev-rendering-indicator') as typeof import('../../next-devtools/userspace/use-app-dev-rendering-indicator') // eslint-disable-next-line react-hooks/rules-of-hooks const appDevRenderingIndicator = useAppDevRenderingIndicator() diff --git a/packages/next/src/client/dev/hot-reloader/app/hot-reloader-app.tsx b/packages/next/src/client/dev/hot-reloader/app/hot-reloader-app.tsx index 0b59f10408d..44b901d9886 100644 --- a/packages/next/src/client/dev/hot-reloader/app/hot-reloader-app.tsx +++ b/packages/next/src/client/dev/hot-reloader/app/hot-reloader-app.tsx @@ -3,7 +3,7 @@ import type { ReactNode } from 'react' import { useEffect, startTransition, useRef } from 'react' import stripAnsi from 'next/dist/compiled/strip-ansi' -import formatWebpackMessages from '../../../components/react-dev-overlay/utils/format-webpack-messages' +import formatWebpackMessages from '../../../../shared/lib/format-webpack-messages' import { useRouter } from '../../../components/navigation' import { REACT_REFRESH_FULL_RELOAD, @@ -11,10 +11,10 @@ import { reportInvalidHmrMessage, } from '../shared' import { dispatcher } from 'next/dist/compiled/next-devtools' -import { ReplaySsrOnlyErrors } from '../../../components/react-dev-overlay/app/errors/replay-ssr-only-errors' -import { AppDevOverlayErrorBoundary } from '../../../components/react-dev-overlay/app/app-dev-overlay-error-boundary' -import { useErrorHandler } from '../../../components/react-dev-overlay/app/errors/use-error-handler' -import { RuntimeErrorHandler } from '../../../components/react-dev-overlay/runtime-error-handler' +import { ReplaySsrOnlyErrors } from '../../../../next-devtools/userspace/app/errors/replay-ssr-only-errors' +import { AppDevOverlayErrorBoundary } from '../../../../next-devtools/userspace/app/app-dev-overlay-error-boundary' +import { useErrorHandler } from '../../../../next-devtools/userspace/app/errors/use-error-handler' +import { RuntimeErrorHandler } from '../../runtime-error-handler' import { useSendMessage, useTurbopack, @@ -28,8 +28,8 @@ import type { } from '../../../../server/dev/hot-reloader-types' import { useUntrackedPathname } from '../../../components/navigation-untracked' import type { GlobalErrorComponent } from '../../../components/global-error' -import reportHmrLatency from '../../../components/react-dev-overlay/utils/report-hmr-latency' -import { TurbopackHmr } from '../../../components/react-dev-overlay/utils/turbopack-hot-reloader-common' +import reportHmrLatency from '../../report-hmr-latency' +import { TurbopackHmr } from '../turbopack-hot-reloader-common' import { NEXT_HMR_REFRESH_HASH_COOKIE } from '../../../components/app-router-headers' let mostRecentCompilationHash: any = null diff --git a/packages/next/src/client/dev/hot-reloader/pages/hot-reloader-pages.ts b/packages/next/src/client/dev/hot-reloader/pages/hot-reloader-pages.ts index b2b014ccaf7..06a7e9513b5 100644 --- a/packages/next/src/client/dev/hot-reloader/pages/hot-reloader-pages.ts +++ b/packages/next/src/client/dev/hot-reloader/pages/hot-reloader-pages.ts @@ -33,10 +33,10 @@ /// import { dispatcher } from 'next/dist/compiled/next-devtools' -import { register } from '../../../components/react-dev-overlay/pages/pages-dev-overlay-setup' +import { register } from '../../../../next-devtools/userspace/pages/pages-dev-overlay-setup' import stripAnsi from 'next/dist/compiled/strip-ansi' import { addMessageListener, sendMessage } from './websocket' -import formatWebpackMessages from '../../../components/react-dev-overlay/utils/format-webpack-messages' +import formatWebpackMessages from '../../../../shared/lib/format-webpack-messages' import { HMR_ACTIONS_SENT_TO_BROWSER } from '../../../../server/dev/hot-reloader-types' import type { HMR_ACTION_TYPES, @@ -47,9 +47,9 @@ import { REACT_REFRESH_FULL_RELOAD_FROM_ERROR, reportInvalidHmrMessage, } from '../shared' -import { RuntimeErrorHandler } from '../../../components/react-dev-overlay/runtime-error-handler' -import reportHmrLatency from '../../../components/react-dev-overlay/utils/report-hmr-latency' -import { TurbopackHmr } from '../../../components/react-dev-overlay/utils/turbopack-hot-reloader-common' +import { RuntimeErrorHandler } from '../../runtime-error-handler' +import reportHmrLatency from '../../report-hmr-latency' +import { TurbopackHmr } from '../turbopack-hot-reloader-common' // This alternative WebpackDevServer combines the functionality of: // https://github.com/webpack/webpack-dev-server/blob/webpack-1/client/index.js diff --git a/packages/next/src/client/components/react-dev-overlay/utils/turbopack-hot-reloader-common.ts b/packages/next/src/client/dev/hot-reloader/turbopack-hot-reloader-common.ts similarity index 96% rename from packages/next/src/client/components/react-dev-overlay/utils/turbopack-hot-reloader-common.ts rename to packages/next/src/client/dev/hot-reloader/turbopack-hot-reloader-common.ts index f1e6c2e5ae7..d2b76c0f6de 100644 --- a/packages/next/src/client/components/react-dev-overlay/utils/turbopack-hot-reloader-common.ts +++ b/packages/next/src/client/dev/hot-reloader/turbopack-hot-reloader-common.ts @@ -1,5 +1,5 @@ -import type { TurbopackMessageAction } from '../../../../server/dev/hot-reloader-types' -import type { Update as TurbopackUpdate } from '../../../../build/swc/types' +import type { TurbopackMessageAction } from '../../../server/dev/hot-reloader-types' +import type { Update as TurbopackUpdate } from '../../../build/swc/types' declare global { interface Window { diff --git a/packages/next/src/client/components/react-dev-overlay/utils/report-hmr-latency.ts b/packages/next/src/client/dev/report-hmr-latency.ts similarity index 100% rename from packages/next/src/client/components/react-dev-overlay/utils/report-hmr-latency.ts rename to packages/next/src/client/dev/report-hmr-latency.ts diff --git a/packages/next/src/client/components/react-dev-overlay/runtime-error-handler.ts b/packages/next/src/client/dev/runtime-error-handler.ts similarity index 100% rename from packages/next/src/client/components/react-dev-overlay/runtime-error-handler.ts rename to packages/next/src/client/dev/runtime-error-handler.ts diff --git a/packages/next/src/client/index.tsx b/packages/next/src/client/index.tsx index fabfbb05e59..86166716254 100644 --- a/packages/next/src/client/index.tsx +++ b/packages/next/src/client/index.tsx @@ -180,7 +180,7 @@ class Container extends React.Component<{ return this.props.children } else { const { PagesDevOverlayBridge } = - require('./components/react-dev-overlay/pages/pages-dev-overlay-setup') as typeof import('./components/react-dev-overlay/pages/pages-dev-overlay-setup') + require('../next-devtools/userspace/pages/pages-dev-overlay-setup') as typeof import('../next-devtools/userspace/pages/pages-dev-overlay-setup') return ( {this.props.children} ) @@ -918,7 +918,7 @@ export async function hydrate(opts?: { beforeRender?: () => Promise }) { if (process.env.NODE_ENV === 'development') { const getServerError = ( - require('./components/react-dev-overlay/utils/node-stack-frames') as typeof import('./components/react-dev-overlay/utils/node-stack-frames') + require('../server/dev/node-stack-frames') as typeof import('../server/dev/node-stack-frames') ).getServerError // Server-side runtime errors need to be re-thrown on the client-side so // that the overlay is rendered. diff --git a/packages/next/src/client/page-bootstrap.ts b/packages/next/src/client/page-bootstrap.ts index bdf7a054f9e..787bec27a15 100644 --- a/packages/next/src/client/page-bootstrap.ts +++ b/packages/next/src/client/page-bootstrap.ts @@ -11,7 +11,7 @@ import { urlQueryToSearchParams, } from '../shared/lib/router/utils/querystring' import { HMR_ACTIONS_SENT_TO_BROWSER } from '../server/dev/hot-reloader-types' -import { RuntimeErrorHandler } from './components/react-dev-overlay/runtime-error-handler' +import { RuntimeErrorHandler } from './dev/runtime-error-handler' import { REACT_REFRESH_FULL_RELOAD_FROM_ERROR } from './dev/hot-reloader/shared' import { performFullReload } from './dev/hot-reloader/pages/hot-reloader-pages' import { dispatcher } from 'next/dist/compiled/next-devtools' diff --git a/packages/next/src/client/react-client-callbacks/error-boundary-callbacks.ts b/packages/next/src/client/react-client-callbacks/error-boundary-callbacks.ts index f19445d5a4d..7d6a8dbbc67 100644 --- a/packages/next/src/client/react-client-callbacks/error-boundary-callbacks.ts +++ b/packages/next/src/client/react-client-callbacks/error-boundary-callbacks.ts @@ -5,12 +5,12 @@ import { setOwnerStackIfAvailable, setComponentStack, coerceError, -} from '../components/react-dev-overlay/app/errors/stitched-error' -import { handleClientError } from '../components/react-dev-overlay/app/errors/use-error-handler' +} from '../../next-devtools/userspace/app/errors/stitched-error' +import { handleClientError } from '../../next-devtools/userspace/app/errors/use-error-handler' import { isNextRouterError } from '../components/is-next-router-error' import { isBailoutToCSRError } from '../../shared/lib/lazy-dynamic/bailout-to-csr' import { reportGlobalError } from './report-global-error' -import { originConsoleError } from '../components/react-dev-overlay/app/errors/intercept-console-error' +import { originConsoleError } from '../../next-devtools/userspace/app/errors/intercept-console-error' import { ErrorBoundaryHandler } from '../components/error-boundary' import DefaultErrorBoundary from '../components/global-error' @@ -24,7 +24,7 @@ export function onCaughtError( if (process.env.NODE_ENV !== 'production') { const { AppDevOverlayErrorBoundary } = - require('../components/react-dev-overlay/app/app-dev-overlay-error-boundary') as typeof import('../components/react-dev-overlay/app/app-dev-overlay-error-boundary') + require('../../next-devtools/userspace/app/app-dev-overlay-error-boundary') as typeof import('../../next-devtools/userspace/app/app-dev-overlay-error-boundary') isImplicitErrorBoundary = errorBoundaryComponent === AppDevOverlayErrorBoundary diff --git a/packages/next/src/client/react-client-callbacks/on-recoverable-error.ts b/packages/next/src/client/react-client-callbacks/on-recoverable-error.ts index e358ad16d63..8a3abf45248 100644 --- a/packages/next/src/client/react-client-callbacks/on-recoverable-error.ts +++ b/packages/next/src/client/react-client-callbacks/on-recoverable-error.ts @@ -6,7 +6,7 @@ import { setOwnerStackIfAvailable, setComponentStack, coerceError, -} from '../components/react-dev-overlay/app/errors/stitched-error' +} from '../../next-devtools/userspace/app/errors/stitched-error' import isError from '../../lib/is-error' import { reportGlobalError } from './report-global-error' diff --git a/packages/next/src/client/components/react-dev-overlay/README.md b/packages/next/src/next-devtools/README.md similarity index 76% rename from packages/next/src/client/components/react-dev-overlay/README.md rename to packages/next/src/next-devtools/README.md index dec1c21eac6..b04c77f521c 100644 --- a/packages/next/src/client/components/react-dev-overlay/README.md +++ b/packages/next/src/next-devtools/README.md @@ -2,12 +2,16 @@ ## Project Structure -- `app/` - Main entrypoint and related files for App Router dev overlay. -- `font/` - Includes Geist fonts that will be served to the client via the internal `/__nextjs_font/...` route. -- `pages/` - Main entrypoint and related files for Pages Router dev overlay. -- `server/` - Source files related to the dev overlay that are to run on the server and not sent to the client. -- `ui/` - Main source files that build the UI of the dev overlay. It is recommended to keep this directory isolated from the rest of the codebase to make it easier to be excluded from compiliation and be bundled in the future. -- `utils/` - Utils that can also be used outside of this project unlike the ones inside the `ui/` directory. +- `next-devtools/dev-overlay/` - The UI that Next.js developers can interact with in development. +- `next-devtools/server/` - Code that runs in the Next.js development server. +- `next-devtools/shared/` - Anything that doesn't fit in +- `next-devtools/userspace/` - Code that runs in the user's application. + +Modules in `dev-overlay/` are isolated from the rest of the source. Any stateful module will not share state with e.g. `userspace/`. Stateful modules in `shared/` cannot be used to pass data from `dev-overlay/` to `userspace/` or vice versa. + +`userspace/` code can send messages to `dev-overlay/` via the `dispatcher` imported from `next/dist/compiled/next-devtools`. + +Keep processing in `userspace/` to a minimum and prefer deriving data in `dev-overlay/`. ## Development diff --git a/packages/next/src/client/components/react-dev-overlay/dev-overlay.browser.tsx b/packages/next/src/next-devtools/dev-overlay.browser.tsx similarity index 96% rename from packages/next/src/client/components/react-dev-overlay/dev-overlay.browser.tsx rename to packages/next/src/next-devtools/dev-overlay.browser.tsx index 9d0cb744512..216eb2caf1e 100644 --- a/packages/next/src/client/components/react-dev-overlay/dev-overlay.browser.tsx +++ b/packages/next/src/next-devtools/dev-overlay.browser.tsx @@ -17,16 +17,16 @@ import { ACTION_BUILDING_INDICATOR_SHOW, ACTION_RENDERING_INDICATOR_HIDE, ACTION_RENDERING_INDICATOR_SHOW, -} from './shared' +} from './dev-overlay/shared' import { startTransition, useInsertionEffect } from 'react' import { createRoot } from 'react-dom/client' -import { FontStyles } from './font/font-styles' -import type { HydrationErrorState } from './pages/hydration-error-state' -import type { DebugInfo } from './types' -import { DevOverlay } from './ui/dev-overlay' -import type { DevIndicatorServerState } from '../../../server/dev/dev-indicator-server-state' -import type { VersionInfo } from '../../../server/dev/parse-version-info' +import { FontStyles } from './dev-overlay/font/font-styles' +import type { HydrationErrorState } from './shared/hydration-error' +import type { DebugInfo } from './shared/types' +import { DevOverlay } from './dev-overlay/dev-overlay' +import type { DevIndicatorServerState } from '../server/dev/dev-indicator-server-state' +import type { VersionInfo } from '../server/dev/parse-version-info' export interface Dispatcher { onBuildOk(): void diff --git a/packages/next/src/client/components/react-dev-overlay/dev-overlay.shim.ts b/packages/next/src/next-devtools/dev-overlay.shim.ts similarity index 100% rename from packages/next/src/client/components/react-dev-overlay/dev-overlay.shim.ts rename to packages/next/src/next-devtools/dev-overlay.shim.ts diff --git a/packages/next/src/client/components/react-dev-overlay/ui/app.png b/packages/next/src/next-devtools/dev-overlay/app.png similarity index 100% rename from packages/next/src/client/components/react-dev-overlay/ui/app.png rename to packages/next/src/next-devtools/dev-overlay/app.png diff --git a/packages/next/src/client/components/react-dev-overlay/ui/components/call-stack-frame/call-stack-frame.stories.tsx b/packages/next/src/next-devtools/dev-overlay/components/call-stack-frame/call-stack-frame.stories.tsx similarity index 100% rename from packages/next/src/client/components/react-dev-overlay/ui/components/call-stack-frame/call-stack-frame.stories.tsx rename to packages/next/src/next-devtools/dev-overlay/components/call-stack-frame/call-stack-frame.stories.tsx diff --git a/packages/next/src/client/components/react-dev-overlay/ui/components/call-stack-frame/call-stack-frame.tsx b/packages/next/src/next-devtools/dev-overlay/components/call-stack-frame/call-stack-frame.tsx similarity index 96% rename from packages/next/src/client/components/react-dev-overlay/ui/components/call-stack-frame/call-stack-frame.tsx rename to packages/next/src/next-devtools/dev-overlay/components/call-stack-frame/call-stack-frame.tsx index d8ee0b8d17e..db2ea0df015 100644 --- a/packages/next/src/client/components/react-dev-overlay/ui/components/call-stack-frame/call-stack-frame.tsx +++ b/packages/next/src/next-devtools/dev-overlay/components/call-stack-frame/call-stack-frame.tsx @@ -1,9 +1,9 @@ import type { StackFrame } from 'next/dist/compiled/stacktrace-parser' -import type { OriginalStackFrame } from '../../../utils/stack-frame' +import type { OriginalStackFrame } from '../../../shared/stack-frame' import { HotlinkedText } from '../hot-linked-text' import { ExternalIcon, SourceMappingErrorIcon } from '../../icons/external' -import { getFrameSource } from '../../../utils/stack-frame' +import { getFrameSource } from '../../../shared/stack-frame' import { useOpenInEditor } from '../../utils/use-open-in-editor' export const CallStackFrame: React.FC<{ diff --git a/packages/next/src/client/components/react-dev-overlay/ui/components/code-frame/code-frame.stories.tsx b/packages/next/src/next-devtools/dev-overlay/components/code-frame/code-frame.stories.tsx similarity index 100% rename from packages/next/src/client/components/react-dev-overlay/ui/components/code-frame/code-frame.stories.tsx rename to packages/next/src/next-devtools/dev-overlay/components/code-frame/code-frame.stories.tsx diff --git a/packages/next/src/client/components/react-dev-overlay/ui/components/code-frame/code-frame.tsx b/packages/next/src/next-devtools/dev-overlay/components/code-frame/code-frame.tsx similarity index 99% rename from packages/next/src/client/components/react-dev-overlay/ui/components/code-frame/code-frame.tsx rename to packages/next/src/next-devtools/dev-overlay/components/code-frame/code-frame.tsx index 51c7b075b94..8a7a6f9c6a4 100644 --- a/packages/next/src/client/components/react-dev-overlay/ui/components/code-frame/code-frame.tsx +++ b/packages/next/src/next-devtools/dev-overlay/components/code-frame/code-frame.tsx @@ -1,7 +1,7 @@ import type { StackFrame } from 'next/dist/compiled/stacktrace-parser' import { useMemo } from 'react' import { HotlinkedText } from '../hot-linked-text' -import { getFrameSource } from '../../../utils/stack-frame' +import { getFrameSource } from '../../../shared/stack-frame' import { useOpenInEditor } from '../../utils/use-open-in-editor' import { ExternalIcon } from '../../icons/external' import { FileIcon } from '../../icons/file' diff --git a/packages/next/src/client/components/react-dev-overlay/ui/components/code-frame/parse-code-frame.test.ts b/packages/next/src/next-devtools/dev-overlay/components/code-frame/parse-code-frame.test.ts similarity index 100% rename from packages/next/src/client/components/react-dev-overlay/ui/components/code-frame/parse-code-frame.test.ts rename to packages/next/src/next-devtools/dev-overlay/components/code-frame/parse-code-frame.test.ts diff --git a/packages/next/src/client/components/react-dev-overlay/ui/components/code-frame/parse-code-frame.ts b/packages/next/src/next-devtools/dev-overlay/components/code-frame/parse-code-frame.ts similarity index 100% rename from packages/next/src/client/components/react-dev-overlay/ui/components/code-frame/parse-code-frame.ts rename to packages/next/src/next-devtools/dev-overlay/components/code-frame/parse-code-frame.ts diff --git a/packages/next/src/client/components/react-dev-overlay/ui/components/copy-button/index.tsx b/packages/next/src/next-devtools/dev-overlay/components/copy-button/index.tsx similarity index 100% rename from packages/next/src/client/components/react-dev-overlay/ui/components/copy-button/index.tsx rename to packages/next/src/next-devtools/dev-overlay/components/copy-button/index.tsx diff --git a/packages/next/src/client/components/react-dev-overlay/ui/components/dialog/dialog-body.tsx b/packages/next/src/next-devtools/dev-overlay/components/dialog/dialog-body.tsx similarity index 100% rename from packages/next/src/client/components/react-dev-overlay/ui/components/dialog/dialog-body.tsx rename to packages/next/src/next-devtools/dev-overlay/components/dialog/dialog-body.tsx diff --git a/packages/next/src/client/components/react-dev-overlay/ui/components/dialog/dialog-content.tsx b/packages/next/src/next-devtools/dev-overlay/components/dialog/dialog-content.tsx similarity index 100% rename from packages/next/src/client/components/react-dev-overlay/ui/components/dialog/dialog-content.tsx rename to packages/next/src/next-devtools/dev-overlay/components/dialog/dialog-content.tsx diff --git a/packages/next/src/client/components/react-dev-overlay/ui/components/dialog/dialog-header.tsx b/packages/next/src/next-devtools/dev-overlay/components/dialog/dialog-header.tsx similarity index 100% rename from packages/next/src/client/components/react-dev-overlay/ui/components/dialog/dialog-header.tsx rename to packages/next/src/next-devtools/dev-overlay/components/dialog/dialog-header.tsx diff --git a/packages/next/src/client/components/react-dev-overlay/ui/components/dialog/dialog.tsx b/packages/next/src/next-devtools/dev-overlay/components/dialog/dialog.tsx similarity index 100% rename from packages/next/src/client/components/react-dev-overlay/ui/components/dialog/dialog.tsx rename to packages/next/src/next-devtools/dev-overlay/components/dialog/dialog.tsx diff --git a/packages/next/src/client/components/react-dev-overlay/ui/components/dialog/index.ts b/packages/next/src/next-devtools/dev-overlay/components/dialog/index.ts similarity index 100% rename from packages/next/src/client/components/react-dev-overlay/ui/components/dialog/index.ts rename to packages/next/src/next-devtools/dev-overlay/components/dialog/index.ts diff --git a/packages/next/src/client/components/react-dev-overlay/ui/components/dialog/styles.ts b/packages/next/src/next-devtools/dev-overlay/components/dialog/styles.ts similarity index 100% rename from packages/next/src/client/components/react-dev-overlay/ui/components/dialog/styles.ts rename to packages/next/src/next-devtools/dev-overlay/components/dialog/styles.ts diff --git a/packages/next/src/client/components/react-dev-overlay/ui/components/errors/call-stack/call-stack.stories.tsx b/packages/next/src/next-devtools/dev-overlay/components/errors/call-stack/call-stack.stories.tsx similarity index 100% rename from packages/next/src/client/components/react-dev-overlay/ui/components/errors/call-stack/call-stack.stories.tsx rename to packages/next/src/next-devtools/dev-overlay/components/errors/call-stack/call-stack.stories.tsx diff --git a/packages/next/src/client/components/react-dev-overlay/ui/components/errors/call-stack/call-stack.tsx b/packages/next/src/next-devtools/dev-overlay/components/errors/call-stack/call-stack.tsx similarity index 98% rename from packages/next/src/client/components/react-dev-overlay/ui/components/errors/call-stack/call-stack.tsx rename to packages/next/src/next-devtools/dev-overlay/components/errors/call-stack/call-stack.tsx index 1c7a56f387e..6888395517f 100644 --- a/packages/next/src/client/components/react-dev-overlay/ui/components/errors/call-stack/call-stack.tsx +++ b/packages/next/src/next-devtools/dev-overlay/components/errors/call-stack/call-stack.tsx @@ -1,4 +1,4 @@ -import type { OriginalStackFrame } from '../../../../utils/stack-frame' +import type { OriginalStackFrame } from '../../../../shared/stack-frame' import { useMemo, useState, useRef } from 'react' import { CallStackFrame } from '../../call-stack-frame/call-stack-frame' diff --git a/packages/next/src/client/components/react-dev-overlay/ui/components/errors/dev-tools-indicator/dev-tools-indicator.stories.tsx b/packages/next/src/next-devtools/dev-overlay/components/errors/dev-tools-indicator/dev-tools-indicator.stories.tsx similarity index 93% rename from packages/next/src/client/components/react-dev-overlay/ui/components/errors/dev-tools-indicator/dev-tools-indicator.stories.tsx rename to packages/next/src/next-devtools/dev-overlay/components/errors/dev-tools-indicator/dev-tools-indicator.stories.tsx index 50ed035aba3..262b230748e 100644 --- a/packages/next/src/client/components/react-dev-overlay/ui/components/errors/dev-tools-indicator/dev-tools-indicator.stories.tsx +++ b/packages/next/src/next-devtools/dev-overlay/components/errors/dev-tools-indicator/dev-tools-indicator.stories.tsx @@ -1,8 +1,8 @@ import type { Meta, StoryObj } from '@storybook/react' import { DevToolsIndicator } from './dev-tools-indicator' import { withShadowPortal } from '../../../storybook/with-shadow-portal' -import type { VersionInfo } from '../../../../../../../server/dev/parse-version-info' -import type { OverlayState } from '../../../../shared' +import type { VersionInfo } from '../../../../../server/dev/parse-version-info' +import type { OverlayState } from '../../../shared' const meta: Meta = { component: DevToolsIndicator, diff --git a/packages/next/src/client/components/react-dev-overlay/ui/components/errors/dev-tools-indicator/dev-tools-indicator.tsx b/packages/next/src/next-devtools/dev-overlay/components/errors/dev-tools-indicator/dev-tools-indicator.tsx similarity index 99% rename from packages/next/src/client/components/react-dev-overlay/ui/components/errors/dev-tools-indicator/dev-tools-indicator.tsx rename to packages/next/src/next-devtools/dev-overlay/components/errors/dev-tools-indicator/dev-tools-indicator.tsx index 01b2ee4a91e..e8f0ca43307 100644 --- a/packages/next/src/client/components/react-dev-overlay/ui/components/errors/dev-tools-indicator/dev-tools-indicator.tsx +++ b/packages/next/src/next-devtools/dev-overlay/components/errors/dev-tools-indicator/dev-tools-indicator.tsx @@ -5,7 +5,7 @@ import { STORAGE_KEY_POSITION, type OverlayDispatch, type OverlayState, -} from '../../../../shared' +} from '../../../shared' import { useState, useEffect, useRef, createContext, useContext } from 'react' import { Toast } from '../../toast' diff --git a/packages/next/src/client/components/react-dev-overlay/ui/components/errors/dev-tools-indicator/dev-tools-info/dev-tools-info.tsx b/packages/next/src/next-devtools/dev-overlay/components/errors/dev-tools-indicator/dev-tools-info/dev-tools-info.tsx similarity index 100% rename from packages/next/src/client/components/react-dev-overlay/ui/components/errors/dev-tools-indicator/dev-tools-info/dev-tools-info.tsx rename to packages/next/src/next-devtools/dev-overlay/components/errors/dev-tools-indicator/dev-tools-info/dev-tools-info.tsx diff --git a/packages/next/src/client/components/react-dev-overlay/ui/components/errors/dev-tools-indicator/dev-tools-info/preferences.ts b/packages/next/src/next-devtools/dev-overlay/components/errors/dev-tools-indicator/dev-tools-info/preferences.ts similarity index 98% rename from packages/next/src/client/components/react-dev-overlay/ui/components/errors/dev-tools-indicator/dev-tools-info/preferences.ts rename to packages/next/src/next-devtools/dev-overlay/components/errors/dev-tools-indicator/dev-tools-info/preferences.ts index 008800154fa..c21c30207ea 100644 --- a/packages/next/src/client/components/react-dev-overlay/ui/components/errors/dev-tools-indicator/dev-tools-info/preferences.ts +++ b/packages/next/src/next-devtools/dev-overlay/components/errors/dev-tools-indicator/dev-tools-info/preferences.ts @@ -3,7 +3,7 @@ import { STORAGE_KEY_POSITION, STORAGE_KEY_SCALE, STORAGE_KEY_THEME, -} from '../../../../../shared' +} from '../../../../shared' const INDICATOR_POSITION = (process.env diff --git a/packages/next/src/client/components/react-dev-overlay/ui/components/errors/dev-tools-indicator/dev-tools-info/route-info.tsx b/packages/next/src/next-devtools/dev-overlay/components/errors/dev-tools-indicator/dev-tools-info/route-info.tsx similarity index 100% rename from packages/next/src/client/components/react-dev-overlay/ui/components/errors/dev-tools-indicator/dev-tools-info/route-info.tsx rename to packages/next/src/next-devtools/dev-overlay/components/errors/dev-tools-indicator/dev-tools-info/route-info.tsx diff --git a/packages/next/src/client/components/react-dev-overlay/ui/components/errors/dev-tools-indicator/dev-tools-info/turbopack-info.tsx b/packages/next/src/next-devtools/dev-overlay/components/errors/dev-tools-indicator/dev-tools-info/turbopack-info.tsx similarity index 100% rename from packages/next/src/client/components/react-dev-overlay/ui/components/errors/dev-tools-indicator/dev-tools-info/turbopack-info.tsx rename to packages/next/src/next-devtools/dev-overlay/components/errors/dev-tools-indicator/dev-tools-info/turbopack-info.tsx diff --git a/packages/next/src/client/components/react-dev-overlay/ui/components/errors/dev-tools-indicator/dev-tools-info/user-preferences.tsx b/packages/next/src/next-devtools/dev-overlay/components/errors/dev-tools-indicator/dev-tools-info/user-preferences.tsx similarity index 99% rename from packages/next/src/client/components/react-dev-overlay/ui/components/errors/dev-tools-indicator/dev-tools-info/user-preferences.tsx rename to packages/next/src/next-devtools/dev-overlay/components/errors/dev-tools-indicator/dev-tools-info/user-preferences.tsx index bd8a0ce35fa..7cfbe4f2b38 100644 --- a/packages/next/src/client/components/react-dev-overlay/ui/components/errors/dev-tools-indicator/dev-tools-info/user-preferences.tsx +++ b/packages/next/src/next-devtools/dev-overlay/components/errors/dev-tools-indicator/dev-tools-info/user-preferences.tsx @@ -1,7 +1,7 @@ import { useState, type HTMLProps } from 'react' -import { css } from '../../../../../utils/css' +import { css } from '../../../../utils/css' import EyeIcon from '../../../../icons/eye-icon' -import { STORAGE_KEY_POSITION, STORAGE_KEY_THEME } from '../../../../../shared' +import { STORAGE_KEY_POSITION, STORAGE_KEY_THEME } from '../../../../shared' import LightIcon from '../../../../icons/light-icon' import DarkIcon from '../../../../icons/dark-icon' import SystemIcon from '../../../../icons/system-icon' diff --git a/packages/next/src/client/components/react-dev-overlay/ui/components/errors/dev-tools-indicator/draggable.tsx b/packages/next/src/next-devtools/dev-overlay/components/errors/dev-tools-indicator/draggable.tsx similarity index 100% rename from packages/next/src/client/components/react-dev-overlay/ui/components/errors/dev-tools-indicator/draggable.tsx rename to packages/next/src/next-devtools/dev-overlay/components/errors/dev-tools-indicator/draggable.tsx diff --git a/packages/next/src/client/components/react-dev-overlay/ui/components/errors/dev-tools-indicator/next-logo.stories.tsx b/packages/next/src/next-devtools/dev-overlay/components/errors/dev-tools-indicator/next-logo.stories.tsx similarity index 100% rename from packages/next/src/client/components/react-dev-overlay/ui/components/errors/dev-tools-indicator/next-logo.stories.tsx rename to packages/next/src/next-devtools/dev-overlay/components/errors/dev-tools-indicator/next-logo.stories.tsx diff --git a/packages/next/src/client/components/react-dev-overlay/ui/components/errors/dev-tools-indicator/next-logo.tsx b/packages/next/src/next-devtools/dev-overlay/components/errors/dev-tools-indicator/next-logo.tsx similarity index 99% rename from packages/next/src/client/components/react-dev-overlay/ui/components/errors/dev-tools-indicator/next-logo.tsx rename to packages/next/src/next-devtools/dev-overlay/components/errors/dev-tools-indicator/next-logo.tsx index 86d16faa6f4..10ff35365ae 100644 --- a/packages/next/src/client/components/react-dev-overlay/ui/components/errors/dev-tools-indicator/next-logo.tsx +++ b/packages/next/src/next-devtools/dev-overlay/components/errors/dev-tools-indicator/next-logo.tsx @@ -1,5 +1,5 @@ import { forwardRef, useEffect, useRef, useState } from 'react' -import { css } from '../../../../utils/css' +import { css } from '../../../utils/css' import mergeRefs from '../../../utils/merge-refs' import { useMinimumLoadingTimeMultiple } from './use-minimum-loading-time-multiple' import type { DevToolsScale } from './dev-tools-info/preferences' diff --git a/packages/next/src/client/components/react-dev-overlay/ui/components/errors/dev-tools-indicator/use-minimum-loading-time-multiple.tsx b/packages/next/src/next-devtools/dev-overlay/components/errors/dev-tools-indicator/use-minimum-loading-time-multiple.tsx similarity index 100% rename from packages/next/src/client/components/react-dev-overlay/ui/components/errors/dev-tools-indicator/use-minimum-loading-time-multiple.tsx rename to packages/next/src/next-devtools/dev-overlay/components/errors/dev-tools-indicator/use-minimum-loading-time-multiple.tsx diff --git a/packages/next/src/client/components/react-dev-overlay/ui/components/errors/dev-tools-indicator/utils.ts b/packages/next/src/next-devtools/dev-overlay/components/errors/dev-tools-indicator/utils.ts similarity index 100% rename from packages/next/src/client/components/react-dev-overlay/ui/components/errors/dev-tools-indicator/utils.ts rename to packages/next/src/next-devtools/dev-overlay/components/errors/dev-tools-indicator/utils.ts diff --git a/packages/next/src/client/components/react-dev-overlay/ui/components/errors/dialog/body.tsx b/packages/next/src/next-devtools/dev-overlay/components/errors/dialog/body.tsx similarity index 100% rename from packages/next/src/client/components/react-dev-overlay/ui/components/errors/dialog/body.tsx rename to packages/next/src/next-devtools/dev-overlay/components/errors/dialog/body.tsx diff --git a/packages/next/src/client/components/react-dev-overlay/ui/components/errors/dialog/dialog.tsx b/packages/next/src/next-devtools/dev-overlay/components/errors/dialog/dialog.tsx similarity index 100% rename from packages/next/src/client/components/react-dev-overlay/ui/components/errors/dialog/dialog.tsx rename to packages/next/src/next-devtools/dev-overlay/components/errors/dialog/dialog.tsx diff --git a/packages/next/src/client/components/react-dev-overlay/ui/components/errors/dialog/header.tsx b/packages/next/src/next-devtools/dev-overlay/components/errors/dialog/header.tsx similarity index 100% rename from packages/next/src/client/components/react-dev-overlay/ui/components/errors/dialog/header.tsx rename to packages/next/src/next-devtools/dev-overlay/components/errors/dialog/header.tsx diff --git a/packages/next/src/client/components/react-dev-overlay/ui/components/errors/environment-name-label/environment-name-label.stories.tsx b/packages/next/src/next-devtools/dev-overlay/components/errors/environment-name-label/environment-name-label.stories.tsx similarity index 100% rename from packages/next/src/client/components/react-dev-overlay/ui/components/errors/environment-name-label/environment-name-label.stories.tsx rename to packages/next/src/next-devtools/dev-overlay/components/errors/environment-name-label/environment-name-label.stories.tsx diff --git a/packages/next/src/client/components/react-dev-overlay/ui/components/errors/environment-name-label/environment-name-label.tsx b/packages/next/src/next-devtools/dev-overlay/components/errors/environment-name-label/environment-name-label.tsx similarity index 100% rename from packages/next/src/client/components/react-dev-overlay/ui/components/errors/environment-name-label/environment-name-label.tsx rename to packages/next/src/next-devtools/dev-overlay/components/errors/environment-name-label/environment-name-label.tsx diff --git a/packages/next/src/client/components/react-dev-overlay/ui/components/errors/error-message/error-message.stories.tsx b/packages/next/src/next-devtools/dev-overlay/components/errors/error-message/error-message.stories.tsx similarity index 100% rename from packages/next/src/client/components/react-dev-overlay/ui/components/errors/error-message/error-message.stories.tsx rename to packages/next/src/next-devtools/dev-overlay/components/errors/error-message/error-message.stories.tsx diff --git a/packages/next/src/client/components/react-dev-overlay/ui/components/errors/error-message/error-message.tsx b/packages/next/src/next-devtools/dev-overlay/components/errors/error-message/error-message.tsx similarity index 100% rename from packages/next/src/client/components/react-dev-overlay/ui/components/errors/error-message/error-message.tsx rename to packages/next/src/next-devtools/dev-overlay/components/errors/error-message/error-message.tsx diff --git a/packages/next/src/client/components/react-dev-overlay/ui/components/errors/error-overlay-bottom-stack/index.tsx b/packages/next/src/next-devtools/dev-overlay/components/errors/error-overlay-bottom-stack/index.tsx similarity index 100% rename from packages/next/src/client/components/react-dev-overlay/ui/components/errors/error-overlay-bottom-stack/index.tsx rename to packages/next/src/next-devtools/dev-overlay/components/errors/error-overlay-bottom-stack/index.tsx diff --git a/packages/next/src/client/components/react-dev-overlay/ui/components/errors/error-overlay-footer/error-feedback/error-feedback.tsx b/packages/next/src/next-devtools/dev-overlay/components/errors/error-overlay-footer/error-feedback/error-feedback.tsx similarity index 100% rename from packages/next/src/client/components/react-dev-overlay/ui/components/errors/error-overlay-footer/error-feedback/error-feedback.tsx rename to packages/next/src/next-devtools/dev-overlay/components/errors/error-overlay-footer/error-feedback/error-feedback.tsx diff --git a/packages/next/src/client/components/react-dev-overlay/ui/components/errors/error-overlay-footer/error-overlay-footer.tsx b/packages/next/src/next-devtools/dev-overlay/components/errors/error-overlay-footer/error-overlay-footer.tsx similarity index 100% rename from packages/next/src/client/components/react-dev-overlay/ui/components/errors/error-overlay-footer/error-overlay-footer.tsx rename to packages/next/src/next-devtools/dev-overlay/components/errors/error-overlay-footer/error-overlay-footer.tsx diff --git a/packages/next/src/client/components/react-dev-overlay/ui/components/errors/error-overlay-layout/error-overlay-layout.stories.tsx b/packages/next/src/next-devtools/dev-overlay/components/errors/error-overlay-layout/error-overlay-layout.stories.tsx similarity index 100% rename from packages/next/src/client/components/react-dev-overlay/ui/components/errors/error-overlay-layout/error-overlay-layout.stories.tsx rename to packages/next/src/next-devtools/dev-overlay/components/errors/error-overlay-layout/error-overlay-layout.stories.tsx diff --git a/packages/next/src/client/components/react-dev-overlay/ui/components/errors/error-overlay-layout/error-overlay-layout.test.tsx b/packages/next/src/next-devtools/dev-overlay/components/errors/error-overlay-layout/error-overlay-layout.test.tsx similarity index 100% rename from packages/next/src/client/components/react-dev-overlay/ui/components/errors/error-overlay-layout/error-overlay-layout.test.tsx rename to packages/next/src/next-devtools/dev-overlay/components/errors/error-overlay-layout/error-overlay-layout.test.tsx diff --git a/packages/next/src/client/components/react-dev-overlay/ui/components/errors/error-overlay-layout/error-overlay-layout.tsx b/packages/next/src/next-devtools/dev-overlay/components/errors/error-overlay-layout/error-overlay-layout.tsx similarity index 97% rename from packages/next/src/client/components/react-dev-overlay/ui/components/errors/error-overlay-layout/error-overlay-layout.tsx rename to packages/next/src/next-devtools/dev-overlay/components/errors/error-overlay-layout/error-overlay-layout.tsx index acbe4125e09..89e8db2248c 100644 --- a/packages/next/src/client/components/react-dev-overlay/ui/components/errors/error-overlay-layout/error-overlay-layout.tsx +++ b/packages/next/src/next-devtools/dev-overlay/components/errors/error-overlay-layout/error-overlay-layout.tsx @@ -1,5 +1,5 @@ import * as React from 'react' -import type { DebugInfo } from '../../../../types' +import type { DebugInfo } from '../../../../shared/types' import type { ErrorMessageType } from '../error-message/error-message' import type { ErrorType } from '../error-type-label/error-type-label' @@ -32,7 +32,7 @@ import { CALL_STACK_STYLES } from '../call-stack/call-stack' import { OVERLAY_STYLES, ErrorOverlayOverlay } from '../overlay/overlay' import { ErrorOverlayBottomStack } from '../error-overlay-bottom-stack' import type { ErrorBaseProps } from '../error-overlay/error-overlay' -import type { ReadyRuntimeError } from '../../../../utils/get-error-by-type' +import type { ReadyRuntimeError } from '../../../utils/get-error-by-type' import { EnvironmentNameLabel } from '../environment-name-label/environment-name-label' import { useFocusTrap } from '../dev-tools-indicator/utils' import { Fader } from '../../fader' diff --git a/packages/next/src/client/components/react-dev-overlay/ui/components/errors/error-overlay-nav/error-overlay-nav.stories.tsx b/packages/next/src/next-devtools/dev-overlay/components/errors/error-overlay-nav/error-overlay-nav.stories.tsx similarity index 100% rename from packages/next/src/client/components/react-dev-overlay/ui/components/errors/error-overlay-nav/error-overlay-nav.stories.tsx rename to packages/next/src/next-devtools/dev-overlay/components/errors/error-overlay-nav/error-overlay-nav.stories.tsx diff --git a/packages/next/src/client/components/react-dev-overlay/ui/components/errors/error-overlay-nav/error-overlay-nav.tsx b/packages/next/src/next-devtools/dev-overlay/components/errors/error-overlay-nav/error-overlay-nav.tsx similarity index 97% rename from packages/next/src/client/components/react-dev-overlay/ui/components/errors/error-overlay-nav/error-overlay-nav.tsx rename to packages/next/src/next-devtools/dev-overlay/components/errors/error-overlay-nav/error-overlay-nav.tsx index 05d5b160656..f384b368e9f 100644 --- a/packages/next/src/client/components/react-dev-overlay/ui/components/errors/error-overlay-nav/error-overlay-nav.tsx +++ b/packages/next/src/next-devtools/dev-overlay/components/errors/error-overlay-nav/error-overlay-nav.tsx @@ -1,8 +1,8 @@ -import type { VersionInfo } from '../../../../../../../server/dev/parse-version-info' +import type { VersionInfo } from '../../../../../server/dev/parse-version-info' import { ErrorOverlayPagination } from '../error-overlay-pagination/error-overlay-pagination' import { VersionStalenessInfo } from '../../version-staleness-info/version-staleness-info' -import type { ReadyRuntimeError } from '../../../../utils/get-error-by-type' +import type { ReadyRuntimeError } from '../../../utils/get-error-by-type' type ErrorOverlayNavProps = { runtimeErrors?: ReadyRuntimeError[] diff --git a/packages/next/src/client/components/react-dev-overlay/ui/components/errors/error-overlay-pagination/error-overlay-pagination.stories.tsx b/packages/next/src/next-devtools/dev-overlay/components/errors/error-overlay-pagination/error-overlay-pagination.stories.tsx similarity index 96% rename from packages/next/src/client/components/react-dev-overlay/ui/components/errors/error-overlay-pagination/error-overlay-pagination.stories.tsx rename to packages/next/src/next-devtools/dev-overlay/components/errors/error-overlay-pagination/error-overlay-pagination.stories.tsx index 423e0ee2e62..160aab4dc8d 100644 --- a/packages/next/src/client/components/react-dev-overlay/ui/components/errors/error-overlay-pagination/error-overlay-pagination.stories.tsx +++ b/packages/next/src/next-devtools/dev-overlay/components/errors/error-overlay-pagination/error-overlay-pagination.stories.tsx @@ -2,7 +2,7 @@ import type { Meta, StoryObj } from '@storybook/react' import { ErrorOverlayPagination } from './error-overlay-pagination' import { withShadowPortal } from '../../../storybook/with-shadow-portal' import { useState } from 'react' -import type { ReadyRuntimeError } from '../../../../utils/get-error-by-type' +import type { ReadyRuntimeError } from '../../../utils/get-error-by-type' const meta: Meta = { component: ErrorOverlayPagination, diff --git a/packages/next/src/client/components/react-dev-overlay/ui/components/errors/error-overlay-pagination/error-overlay-pagination.tsx b/packages/next/src/next-devtools/dev-overlay/components/errors/error-overlay-pagination/error-overlay-pagination.tsx similarity index 98% rename from packages/next/src/client/components/react-dev-overlay/ui/components/errors/error-overlay-pagination/error-overlay-pagination.tsx rename to packages/next/src/next-devtools/dev-overlay/components/errors/error-overlay-pagination/error-overlay-pagination.tsx index 4490a4a32d2..9341ecfe9e3 100644 --- a/packages/next/src/client/components/react-dev-overlay/ui/components/errors/error-overlay-pagination/error-overlay-pagination.tsx +++ b/packages/next/src/next-devtools/dev-overlay/components/errors/error-overlay-pagination/error-overlay-pagination.tsx @@ -7,7 +7,7 @@ import { } from 'react' import { LeftArrow } from '../../../icons/left-arrow' import { RightArrow } from '../../../icons/right-arrow' -import type { ReadyRuntimeError } from '../../../../utils/get-error-by-type' +import type { ReadyRuntimeError } from '../../../utils/get-error-by-type' type ErrorPaginationProps = { runtimeErrors: ReadyRuntimeError[] diff --git a/packages/next/src/client/components/react-dev-overlay/ui/components/errors/error-overlay-toolbar/copy-stack-trace-button.stories.tsx b/packages/next/src/next-devtools/dev-overlay/components/errors/error-overlay-toolbar/copy-stack-trace-button.stories.tsx similarity index 100% rename from packages/next/src/client/components/react-dev-overlay/ui/components/errors/error-overlay-toolbar/copy-stack-trace-button.stories.tsx rename to packages/next/src/next-devtools/dev-overlay/components/errors/error-overlay-toolbar/copy-stack-trace-button.stories.tsx diff --git a/packages/next/src/client/components/react-dev-overlay/ui/components/errors/error-overlay-toolbar/copy-stack-trace-button.tsx b/packages/next/src/next-devtools/dev-overlay/components/errors/error-overlay-toolbar/copy-stack-trace-button.tsx similarity index 100% rename from packages/next/src/client/components/react-dev-overlay/ui/components/errors/error-overlay-toolbar/copy-stack-trace-button.tsx rename to packages/next/src/next-devtools/dev-overlay/components/errors/error-overlay-toolbar/copy-stack-trace-button.tsx diff --git a/packages/next/src/client/components/react-dev-overlay/ui/components/errors/error-overlay-toolbar/docs-link-button.stories.tsx b/packages/next/src/next-devtools/dev-overlay/components/errors/error-overlay-toolbar/docs-link-button.stories.tsx similarity index 100% rename from packages/next/src/client/components/react-dev-overlay/ui/components/errors/error-overlay-toolbar/docs-link-button.stories.tsx rename to packages/next/src/next-devtools/dev-overlay/components/errors/error-overlay-toolbar/docs-link-button.stories.tsx diff --git a/packages/next/src/client/components/react-dev-overlay/ui/components/errors/error-overlay-toolbar/docs-link-button.tsx b/packages/next/src/next-devtools/dev-overlay/components/errors/error-overlay-toolbar/docs-link-button.tsx similarity index 97% rename from packages/next/src/client/components/react-dev-overlay/ui/components/errors/error-overlay-toolbar/docs-link-button.tsx rename to packages/next/src/next-devtools/dev-overlay/components/errors/error-overlay-toolbar/docs-link-button.tsx index f1a4b182059..be998c3ffd4 100644 --- a/packages/next/src/client/components/react-dev-overlay/ui/components/errors/error-overlay-toolbar/docs-link-button.tsx +++ b/packages/next/src/next-devtools/dev-overlay/components/errors/error-overlay-toolbar/docs-link-button.tsx @@ -1,7 +1,7 @@ import { NEXTJS_HYDRATION_ERROR_LINK, REACT_HYDRATION_ERROR_LINK, -} from '../../../../../react-19-hydration-error' +} from '../../../../shared/react-19-hydration-error' import { parseUrlFromText } from '../../../utils/parse-url-from-text' const docsURLAllowlist = ['https://nextjs.org', 'https://react.dev'] diff --git a/packages/next/src/client/components/react-dev-overlay/ui/components/errors/error-overlay-toolbar/error-overlay-toolbar.stories.tsx b/packages/next/src/next-devtools/dev-overlay/components/errors/error-overlay-toolbar/error-overlay-toolbar.stories.tsx similarity index 100% rename from packages/next/src/client/components/react-dev-overlay/ui/components/errors/error-overlay-toolbar/error-overlay-toolbar.stories.tsx rename to packages/next/src/next-devtools/dev-overlay/components/errors/error-overlay-toolbar/error-overlay-toolbar.stories.tsx diff --git a/packages/next/src/client/components/react-dev-overlay/ui/components/errors/error-overlay-toolbar/error-overlay-toolbar.tsx b/packages/next/src/next-devtools/dev-overlay/components/errors/error-overlay-toolbar/error-overlay-toolbar.tsx similarity index 96% rename from packages/next/src/client/components/react-dev-overlay/ui/components/errors/error-overlay-toolbar/error-overlay-toolbar.tsx rename to packages/next/src/next-devtools/dev-overlay/components/errors/error-overlay-toolbar/error-overlay-toolbar.tsx index a6df3bb4ac1..39fa6874dc6 100644 --- a/packages/next/src/client/components/react-dev-overlay/ui/components/errors/error-overlay-toolbar/error-overlay-toolbar.tsx +++ b/packages/next/src/next-devtools/dev-overlay/components/errors/error-overlay-toolbar/error-overlay-toolbar.tsx @@ -1,4 +1,4 @@ -import type { DebugInfo } from '../../../../types' +import type { DebugInfo } from '../../../../shared/types' import { NodejsInspectorButton } from './nodejs-inspector-button' import { CopyStackTraceButton } from './copy-stack-trace-button' import { DocsLinkButton } from './docs-link-button' diff --git a/packages/next/src/client/components/react-dev-overlay/ui/components/errors/error-overlay-toolbar/nodejs-inspector-button.stories.tsx b/packages/next/src/next-devtools/dev-overlay/components/errors/error-overlay-toolbar/nodejs-inspector-button.stories.tsx similarity index 100% rename from packages/next/src/client/components/react-dev-overlay/ui/components/errors/error-overlay-toolbar/nodejs-inspector-button.stories.tsx rename to packages/next/src/next-devtools/dev-overlay/components/errors/error-overlay-toolbar/nodejs-inspector-button.stories.tsx diff --git a/packages/next/src/client/components/react-dev-overlay/ui/components/errors/error-overlay-toolbar/nodejs-inspector-button.tsx b/packages/next/src/next-devtools/dev-overlay/components/errors/error-overlay-toolbar/nodejs-inspector-button.tsx similarity index 100% rename from packages/next/src/client/components/react-dev-overlay/ui/components/errors/error-overlay-toolbar/nodejs-inspector-button.tsx rename to packages/next/src/next-devtools/dev-overlay/components/errors/error-overlay-toolbar/nodejs-inspector-button.tsx diff --git a/packages/next/src/client/components/react-dev-overlay/ui/components/errors/error-overlay-toolbar/restart-server-button.tsx b/packages/next/src/next-devtools/dev-overlay/components/errors/error-overlay-toolbar/restart-server-button.tsx similarity index 100% rename from packages/next/src/client/components/react-dev-overlay/ui/components/errors/error-overlay-toolbar/restart-server-button.tsx rename to packages/next/src/next-devtools/dev-overlay/components/errors/error-overlay-toolbar/restart-server-button.tsx diff --git a/packages/next/src/client/components/react-dev-overlay/ui/components/errors/error-overlay/error-overlay.tsx b/packages/next/src/next-devtools/dev-overlay/components/errors/error-overlay/error-overlay.tsx similarity index 91% rename from packages/next/src/client/components/react-dev-overlay/ui/components/errors/error-overlay/error-overlay.tsx rename to packages/next/src/next-devtools/dev-overlay/components/errors/error-overlay/error-overlay.tsx index a6593902c3c..d329f6d8f91 100644 --- a/packages/next/src/client/components/react-dev-overlay/ui/components/errors/error-overlay/error-overlay.tsx +++ b/packages/next/src/next-devtools/dev-overlay/components/errors/error-overlay/error-overlay.tsx @@ -2,14 +2,14 @@ import { ACTION_ERROR_OVERLAY_CLOSE, type OverlayDispatch, type OverlayState, -} from '../../../../shared' +} from '../../../shared' import { Suspense } from 'react' import { BuildError } from '../../../container/build-error' import { Errors } from '../../../container/errors' import { useDelayedRender } from '../../../hooks/use-delayed-render' -import type { ReadyRuntimeError } from '../../../../utils/get-error-by-type' -import type { HydrationErrorState } from '../../../../pages/hydration-error-state' +import type { ReadyRuntimeError } from '../../../utils/get-error-by-type' +import type { HydrationErrorState } from '../../../../shared/hydration-error' const transitionDurationMs = 200 diff --git a/packages/next/src/client/components/react-dev-overlay/ui/components/errors/error-type-label/error-type-label.stories.tsx b/packages/next/src/next-devtools/dev-overlay/components/errors/error-type-label/error-type-label.stories.tsx similarity index 100% rename from packages/next/src/client/components/react-dev-overlay/ui/components/errors/error-type-label/error-type-label.stories.tsx rename to packages/next/src/next-devtools/dev-overlay/components/errors/error-type-label/error-type-label.stories.tsx diff --git a/packages/next/src/client/components/react-dev-overlay/ui/components/errors/error-type-label/error-type-label.tsx b/packages/next/src/next-devtools/dev-overlay/components/errors/error-type-label/error-type-label.tsx similarity index 100% rename from packages/next/src/client/components/react-dev-overlay/ui/components/errors/error-type-label/error-type-label.tsx rename to packages/next/src/next-devtools/dev-overlay/components/errors/error-type-label/error-type-label.tsx diff --git a/packages/next/src/client/components/react-dev-overlay/ui/components/errors/overlay/overlay.tsx b/packages/next/src/next-devtools/dev-overlay/components/errors/overlay/overlay.tsx similarity index 100% rename from packages/next/src/client/components/react-dev-overlay/ui/components/errors/overlay/overlay.tsx rename to packages/next/src/next-devtools/dev-overlay/components/errors/overlay/overlay.tsx diff --git a/packages/next/src/client/components/react-dev-overlay/ui/components/fader/index.tsx b/packages/next/src/next-devtools/dev-overlay/components/fader/index.tsx similarity index 100% rename from packages/next/src/client/components/react-dev-overlay/ui/components/fader/index.tsx rename to packages/next/src/next-devtools/dev-overlay/components/fader/index.tsx diff --git a/packages/next/src/client/components/react-dev-overlay/ui/components/hot-linked-text/index.tsx b/packages/next/src/next-devtools/dev-overlay/components/hot-linked-text/index.tsx similarity index 96% rename from packages/next/src/client/components/react-dev-overlay/ui/components/hot-linked-text/index.tsx rename to packages/next/src/next-devtools/dev-overlay/components/hot-linked-text/index.tsx index 1b92c31ff67..73f58c24f7d 100644 --- a/packages/next/src/client/components/react-dev-overlay/ui/components/hot-linked-text/index.tsx +++ b/packages/next/src/next-devtools/dev-overlay/components/hot-linked-text/index.tsx @@ -2,7 +2,7 @@ import React from 'react' import { decodeMagicIdentifier, MAGIC_IDENTIFIER_REGEX, -} from '../../../../../../shared/lib/magic-identifier' +} from '../../../../shared/lib/magic-identifier' const linkRegex = /https?:\/\/[^\s/$.?#].[^\s)'"]*/i diff --git a/packages/next/src/client/components/react-dev-overlay/ui/components/hydration-diff/diff-view.tsx b/packages/next/src/next-devtools/dev-overlay/components/hydration-diff/diff-view.tsx similarity index 100% rename from packages/next/src/client/components/react-dev-overlay/ui/components/hydration-diff/diff-view.tsx rename to packages/next/src/next-devtools/dev-overlay/components/hydration-diff/diff-view.tsx diff --git a/packages/next/src/client/components/react-dev-overlay/ui/components/overlay/body-locker.ts b/packages/next/src/next-devtools/dev-overlay/components/overlay/body-locker.ts similarity index 100% rename from packages/next/src/client/components/react-dev-overlay/ui/components/overlay/body-locker.ts rename to packages/next/src/next-devtools/dev-overlay/components/overlay/body-locker.ts diff --git a/packages/next/src/client/components/react-dev-overlay/ui/components/overlay/index.tsx b/packages/next/src/next-devtools/dev-overlay/components/overlay/index.tsx similarity index 100% rename from packages/next/src/client/components/react-dev-overlay/ui/components/overlay/index.tsx rename to packages/next/src/next-devtools/dev-overlay/components/overlay/index.tsx diff --git a/packages/next/src/client/components/react-dev-overlay/ui/components/overlay/overlay.tsx b/packages/next/src/next-devtools/dev-overlay/components/overlay/overlay.tsx similarity index 100% rename from packages/next/src/client/components/react-dev-overlay/ui/components/overlay/overlay.tsx rename to packages/next/src/next-devtools/dev-overlay/components/overlay/overlay.tsx diff --git a/packages/next/src/client/components/react-dev-overlay/ui/components/overlay/styles.tsx b/packages/next/src/next-devtools/dev-overlay/components/overlay/styles.tsx similarity index 100% rename from packages/next/src/client/components/react-dev-overlay/ui/components/overlay/styles.tsx rename to packages/next/src/next-devtools/dev-overlay/components/overlay/styles.tsx diff --git a/packages/next/src/client/components/react-dev-overlay/ui/components/overview/segment-explorer.tsx b/packages/next/src/next-devtools/dev-overlay/components/overview/segment-explorer.tsx similarity index 97% rename from packages/next/src/client/components/react-dev-overlay/ui/components/overview/segment-explorer.tsx rename to packages/next/src/next-devtools/dev-overlay/components/overview/segment-explorer.tsx index 03f03a63e15..4e974b7871f 100644 --- a/packages/next/src/client/components/react-dev-overlay/ui/components/overview/segment-explorer.tsx +++ b/packages/next/src/next-devtools/dev-overlay/components/overview/segment-explorer.tsx @@ -1,13 +1,13 @@ import type { HTMLProps } from 'react' -import { css } from '../../../utils/css' +import { css } from '../../utils/css' import type { DevToolsInfoPropsCore } from '../errors/dev-tools-indicator/dev-tools-info/dev-tools-info' import { DevToolsInfo } from '../errors/dev-tools-indicator/dev-tools-info/dev-tools-info' import { cx } from '../../utils/cx' import { - useSegmentTreeClientState, type SegmentNode, -} from '../../../../../../shared/lib/devtool/app-segment-tree' -import type { Trie, TrieNode } from '../../../../../../shared/lib/devtool/trie' + useSegmentTreeClientState, +} from '../../../../shared/lib/devtool/app-segment-tree' +import type { Trie, TrieNode } from '../../../../shared/lib/devtool/trie' const IconLayout = (props: React.SVGProps) => { return ( diff --git a/packages/next/src/client/components/react-dev-overlay/ui/components/resizer/index.tsx b/packages/next/src/next-devtools/dev-overlay/components/resizer/index.tsx similarity index 100% rename from packages/next/src/client/components/react-dev-overlay/ui/components/resizer/index.tsx rename to packages/next/src/next-devtools/dev-overlay/components/resizer/index.tsx diff --git a/packages/next/src/client/components/react-dev-overlay/ui/components/shadow-portal.tsx b/packages/next/src/next-devtools/dev-overlay/components/shadow-portal.tsx similarity index 97% rename from packages/next/src/client/components/react-dev-overlay/ui/components/shadow-portal.tsx rename to packages/next/src/next-devtools/dev-overlay/components/shadow-portal.tsx index f8c2432b793..3cd5ace6e34 100644 --- a/packages/next/src/client/components/react-dev-overlay/ui/components/shadow-portal.tsx +++ b/packages/next/src/next-devtools/dev-overlay/components/shadow-portal.tsx @@ -1,6 +1,6 @@ import * as React from 'react' import { createPortal } from 'react-dom' -import { STORAGE_KEY_THEME } from '../../shared' +import { STORAGE_KEY_THEME } from '../shared' export function ShadowPortal({ children }: { children: React.ReactNode }) { let portalNode = React.useRef(null) diff --git a/packages/next/src/client/components/react-dev-overlay/ui/components/terminal/editor-link.tsx b/packages/next/src/next-devtools/dev-overlay/components/terminal/editor-link.tsx similarity index 100% rename from packages/next/src/client/components/react-dev-overlay/ui/components/terminal/editor-link.tsx rename to packages/next/src/next-devtools/dev-overlay/components/terminal/editor-link.tsx diff --git a/packages/next/src/client/components/react-dev-overlay/ui/components/terminal/index.tsx b/packages/next/src/next-devtools/dev-overlay/components/terminal/index.tsx similarity index 100% rename from packages/next/src/client/components/react-dev-overlay/ui/components/terminal/index.tsx rename to packages/next/src/next-devtools/dev-overlay/components/terminal/index.tsx diff --git a/packages/next/src/client/components/react-dev-overlay/ui/components/terminal/terminal.stories.tsx b/packages/next/src/next-devtools/dev-overlay/components/terminal/terminal.stories.tsx similarity index 100% rename from packages/next/src/client/components/react-dev-overlay/ui/components/terminal/terminal.stories.tsx rename to packages/next/src/next-devtools/dev-overlay/components/terminal/terminal.stories.tsx diff --git a/packages/next/src/client/components/react-dev-overlay/ui/components/terminal/terminal.tsx b/packages/next/src/next-devtools/dev-overlay/components/terminal/terminal.tsx similarity index 98% rename from packages/next/src/client/components/react-dev-overlay/ui/components/terminal/terminal.tsx rename to packages/next/src/next-devtools/dev-overlay/components/terminal/terminal.tsx index 8c30f049fe4..df0412c643b 100644 --- a/packages/next/src/client/components/react-dev-overlay/ui/components/terminal/terminal.tsx +++ b/packages/next/src/next-devtools/dev-overlay/components/terminal/terminal.tsx @@ -3,7 +3,7 @@ import * as React from 'react' import { HotlinkedText } from '../hot-linked-text' import { EditorLink } from './editor-link' import { ExternalIcon } from '../../icons/external' -import { getFrameSource } from '../../../utils/stack-frame' +import { getFrameSource } from '../../../shared/stack-frame' import { useOpenInEditor } from '../../utils/use-open-in-editor' import { FileIcon } from '../../icons/file' diff --git a/packages/next/src/client/components/react-dev-overlay/ui/components/toast/index.tsx b/packages/next/src/next-devtools/dev-overlay/components/toast/index.tsx similarity index 100% rename from packages/next/src/client/components/react-dev-overlay/ui/components/toast/index.tsx rename to packages/next/src/next-devtools/dev-overlay/components/toast/index.tsx diff --git a/packages/next/src/client/components/react-dev-overlay/ui/components/toast/styles.ts b/packages/next/src/next-devtools/dev-overlay/components/toast/styles.ts similarity index 100% rename from packages/next/src/client/components/react-dev-overlay/ui/components/toast/styles.ts rename to packages/next/src/next-devtools/dev-overlay/components/toast/styles.ts diff --git a/packages/next/src/client/components/react-dev-overlay/ui/components/toast/toast.tsx b/packages/next/src/next-devtools/dev-overlay/components/toast/toast.tsx similarity index 100% rename from packages/next/src/client/components/react-dev-overlay/ui/components/toast/toast.tsx rename to packages/next/src/next-devtools/dev-overlay/components/toast/toast.tsx diff --git a/packages/next/src/client/components/react-dev-overlay/ui/components/version-staleness-info/version-staleness-info.stories.tsx b/packages/next/src/next-devtools/dev-overlay/components/version-staleness-info/version-staleness-info.stories.tsx similarity index 100% rename from packages/next/src/client/components/react-dev-overlay/ui/components/version-staleness-info/version-staleness-info.stories.tsx rename to packages/next/src/next-devtools/dev-overlay/components/version-staleness-info/version-staleness-info.stories.tsx diff --git a/packages/next/src/client/components/react-dev-overlay/ui/components/version-staleness-info/version-staleness-info.tsx b/packages/next/src/next-devtools/dev-overlay/components/version-staleness-info/version-staleness-info.tsx similarity index 71% rename from packages/next/src/client/components/react-dev-overlay/ui/components/version-staleness-info/version-staleness-info.tsx rename to packages/next/src/next-devtools/dev-overlay/components/version-staleness-info/version-staleness-info.tsx index 0636e322a48..6b8869dd08d 100644 --- a/packages/next/src/client/components/react-dev-overlay/ui/components/version-staleness-info/version-staleness-info.tsx +++ b/packages/next/src/next-devtools/dev-overlay/components/version-staleness-info/version-staleness-info.tsx @@ -1,4 +1,5 @@ -import type { VersionInfo } from '../../../../../../server/dev/parse-version-info' +import type { VersionInfo } from '../../../../server/dev/parse-version-info' +import { getStaleness } from '../../../shared/version-staleness' import { cx } from '../../utils/cx' export function VersionStalenessInfo({ @@ -46,47 +47,6 @@ export function VersionStalenessInfo({ ) } -export function getStaleness({ installed, staleness, expected }: VersionInfo) { - let text = '' - let title = '' - let indicatorClass = '' - const versionLabel = `Next.js ${installed}` - switch (staleness) { - case 'newer-than-npm': - case 'fresh': - text = versionLabel - title = `Latest available version is detected (${installed}).` - indicatorClass = 'fresh' - break - case 'stale-patch': - case 'stale-minor': - text = `${versionLabel} (stale)` - title = `There is a newer version (${expected}) available, upgrade recommended! ` - indicatorClass = 'stale' - break - case 'stale-major': { - text = `${versionLabel} (outdated)` - title = `An outdated version detected (latest is ${expected}), upgrade is highly recommended!` - indicatorClass = 'outdated' - break - } - case 'stale-prerelease': { - text = `${versionLabel} (stale)` - title = `There is a newer canary version (${expected}) available, please upgrade! ` - indicatorClass = 'stale' - break - } - case 'unknown': - text = `${versionLabel} (unknown)` - title = 'No Next.js version data was found.' - indicatorClass = 'unknown' - break - default: - break - } - return { text, indicatorClass, title } -} - export const styles = ` .nextjs-container-build-error-version-status { -webkit-font-smoothing: antialiased; diff --git a/packages/next/src/client/components/react-dev-overlay/ui/container/build-error.stories.tsx b/packages/next/src/next-devtools/dev-overlay/container/build-error.stories.tsx similarity index 100% rename from packages/next/src/client/components/react-dev-overlay/ui/container/build-error.stories.tsx rename to packages/next/src/next-devtools/dev-overlay/container/build-error.stories.tsx diff --git a/packages/next/src/client/components/react-dev-overlay/ui/container/build-error.tsx b/packages/next/src/next-devtools/dev-overlay/container/build-error.tsx similarity index 100% rename from packages/next/src/client/components/react-dev-overlay/ui/container/build-error.tsx rename to packages/next/src/next-devtools/dev-overlay/container/build-error.tsx diff --git a/packages/next/src/client/components/react-dev-overlay/ui/container/errors.stories.tsx b/packages/next/src/next-devtools/dev-overlay/container/errors.stories.tsx similarity index 98% rename from packages/next/src/client/components/react-dev-overlay/ui/container/errors.stories.tsx rename to packages/next/src/next-devtools/dev-overlay/container/errors.stories.tsx index c9c876bcc6d..2ab9c068cf7 100644 --- a/packages/next/src/client/components/react-dev-overlay/ui/container/errors.stories.tsx +++ b/packages/next/src/next-devtools/dev-overlay/container/errors.stories.tsx @@ -2,7 +2,7 @@ import type { Meta, StoryObj } from '@storybook/react' import { Errors } from './errors' import { withShadowPortal } from '../storybook/with-shadow-portal' -import type { ReadyRuntimeError } from '../../utils/get-error-by-type' +import type { ReadyRuntimeError } from '../utils/get-error-by-type' import { lorem } from '../utils/lorem' const meta: Meta = { diff --git a/packages/next/src/client/components/react-dev-overlay/ui/container/errors.tsx b/packages/next/src/next-devtools/dev-overlay/container/errors.tsx similarity index 94% rename from packages/next/src/client/components/react-dev-overlay/ui/container/errors.tsx rename to packages/next/src/next-devtools/dev-overlay/container/errors.tsx index 219ffa95883..d2447cc00ee 100644 --- a/packages/next/src/client/components/react-dev-overlay/ui/container/errors.tsx +++ b/packages/next/src/next-devtools/dev-overlay/container/errors.tsx @@ -1,11 +1,11 @@ import { useState, useMemo, useRef, Suspense } from 'react' -import type { DebugInfo } from '../../types' +import type { DebugInfo } from '../../shared/types' import { Overlay } from '../components/overlay' import { RuntimeError } from './runtime-error' -import { getErrorSource } from '../../../../../shared/lib/error-source' +import { getErrorSource } from '../../../shared/lib/error-source' import { HotlinkedText } from '../components/hot-linked-text' import { PseudoHtmlDiff } from './runtime-error/component-stack-pseudo-html' -import { extractNextErrorCode } from '../../../../../lib/error-telemetry-utils' +import { extractNextErrorCode } from '../../../lib/error-telemetry-utils' import { ErrorOverlayLayout, type ErrorOverlayLayoutProps, @@ -14,10 +14,10 @@ import { getHydrationErrorStackInfo, isHydrationError, NEXTJS_HYDRATION_ERROR_LINK, -} from '../../../react-19-hydration-error' -import type { ReadyRuntimeError } from '../../utils/get-error-by-type' +} from '../../shared/react-19-hydration-error' +import type { ReadyRuntimeError } from '../utils/get-error-by-type' import type { ErrorBaseProps } from '../components/errors/error-overlay/error-overlay' -import type { HydrationErrorState } from '../../pages/hydration-error-state' +import type { HydrationErrorState } from '../../shared/hydration-error' export interface ErrorsProps extends ErrorBaseProps { getSquashedHydrationErrorDetails: (error: Error) => HydrationErrorState | null diff --git a/packages/next/src/client/components/react-dev-overlay/ui/container/runtime-error/component-stack-pseudo-html.stories.tsx b/packages/next/src/next-devtools/dev-overlay/container/runtime-error/component-stack-pseudo-html.stories.tsx similarity index 100% rename from packages/next/src/client/components/react-dev-overlay/ui/container/runtime-error/component-stack-pseudo-html.stories.tsx rename to packages/next/src/next-devtools/dev-overlay/container/runtime-error/component-stack-pseudo-html.stories.tsx diff --git a/packages/next/src/client/components/react-dev-overlay/ui/container/runtime-error/component-stack-pseudo-html.tsx b/packages/next/src/next-devtools/dev-overlay/container/runtime-error/component-stack-pseudo-html.tsx similarity index 100% rename from packages/next/src/client/components/react-dev-overlay/ui/container/runtime-error/component-stack-pseudo-html.tsx rename to packages/next/src/next-devtools/dev-overlay/container/runtime-error/component-stack-pseudo-html.tsx diff --git a/packages/next/src/client/components/react-dev-overlay/ui/container/runtime-error/index.tsx b/packages/next/src/next-devtools/dev-overlay/container/runtime-error/index.tsx similarity index 96% rename from packages/next/src/client/components/react-dev-overlay/ui/container/runtime-error/index.tsx rename to packages/next/src/next-devtools/dev-overlay/container/runtime-error/index.tsx index c5248728871..bfea61f549c 100644 --- a/packages/next/src/client/components/react-dev-overlay/ui/container/runtime-error/index.tsx +++ b/packages/next/src/next-devtools/dev-overlay/container/runtime-error/index.tsx @@ -5,7 +5,7 @@ import { PSEUDO_HTML_DIFF_STYLES } from './component-stack-pseudo-html' import { useFrames, type ReadyRuntimeError, -} from '../../../utils/get-error-by-type' +} from '../../utils/get-error-by-type' export type RuntimeErrorProps = { error: ReadyRuntimeError diff --git a/packages/next/src/client/components/react-dev-overlay/ui/container/runtime-error/render-error.tsx b/packages/next/src/next-devtools/dev-overlay/container/runtime-error/render-error.tsx similarity index 93% rename from packages/next/src/client/components/react-dev-overlay/ui/container/runtime-error/render-error.tsx rename to packages/next/src/next-devtools/dev-overlay/container/runtime-error/render-error.tsx index 0531b66e4c4..77fa1dfcdf1 100644 --- a/packages/next/src/client/components/react-dev-overlay/ui/container/runtime-error/render-error.tsx +++ b/packages/next/src/next-devtools/dev-overlay/container/runtime-error/render-error.tsx @@ -1,12 +1,12 @@ -import type { OverlayState } from '../../../shared' +import type { OverlayState } from '../../shared' import { useMemo, useState, useEffect } from 'react' import { getErrorByType, type ReadyRuntimeError, -} from '../../../utils/get-error-by-type' +} from '../../utils/get-error-by-type' import type { StackFrame } from 'next/dist/compiled/stacktrace-parser' -import type { ComponentStackFrame } from '../../../utils/parse-component-stack' +import type { ComponentStackFrame } from '../../utils/parse-component-stack' export type SupportedErrorEvent = { id: number diff --git a/packages/next/src/client/components/react-dev-overlay/ui/dev-overlay.stories.tsx b/packages/next/src/next-devtools/dev-overlay/dev-overlay.stories.tsx similarity index 97% rename from packages/next/src/client/components/react-dev-overlay/ui/dev-overlay.stories.tsx rename to packages/next/src/next-devtools/dev-overlay/dev-overlay.stories.tsx index 379b8282d08..7da50428f68 100644 --- a/packages/next/src/client/components/react-dev-overlay/ui/dev-overlay.stories.tsx +++ b/packages/next/src/next-devtools/dev-overlay/dev-overlay.stories.tsx @@ -1,5 +1,5 @@ import type { Meta, StoryObj } from '@storybook/react' -import type { DispatcherEvent, OverlayState } from '../shared' +import type { DispatcherEvent, OverlayState } from './shared' // @ts-expect-error import imgApp from './app.png' @@ -10,7 +10,7 @@ import { ACTION_ERROR_OVERLAY_CLOSE, ACTION_ERROR_OVERLAY_OPEN, ACTION_ERROR_OVERLAY_TOGGLE, -} from '../shared' +} from './shared' const meta: Meta = { component: DevOverlay, diff --git a/packages/next/src/client/components/react-dev-overlay/ui/dev-overlay.tsx b/packages/next/src/next-devtools/dev-overlay/dev-overlay.tsx similarity index 93% rename from packages/next/src/client/components/react-dev-overlay/ui/dev-overlay.tsx rename to packages/next/src/next-devtools/dev-overlay/dev-overlay.tsx index d5304ccad2e..b5c1668532c 100644 --- a/packages/next/src/client/components/react-dev-overlay/ui/dev-overlay.tsx +++ b/packages/next/src/next-devtools/dev-overlay/dev-overlay.tsx @@ -1,4 +1,4 @@ -import type { OverlayDispatch, OverlayState } from '../shared' +import type { OverlayDispatch, OverlayState } from './shared' import { ShadowPortal } from './components/shadow-portal' import { Base } from './styles/base' @@ -10,7 +10,7 @@ import { DevToolsIndicator } from './components/errors/dev-tools-indicator/dev-t import { RenderError } from './container/runtime-error/render-error' import { DarkTheme } from './styles/dark-theme' import { useDevToolsScale } from './components/errors/dev-tools-indicator/dev-tools-info/preferences' -import type { HydrationErrorState } from '../pages/hydration-error-state' +import type { HydrationErrorState } from '../shared/hydration-error' export function DevOverlay({ state, diff --git a/packages/next/src/client/components/react-dev-overlay/font/font-styles.tsx b/packages/next/src/next-devtools/dev-overlay/font/font-styles.tsx similarity index 100% rename from packages/next/src/client/components/react-dev-overlay/font/font-styles.tsx rename to packages/next/src/next-devtools/dev-overlay/font/font-styles.tsx diff --git a/packages/next/src/client/components/react-dev-overlay/ui/hooks/use-delayed-render.ts b/packages/next/src/next-devtools/dev-overlay/hooks/use-delayed-render.ts similarity index 100% rename from packages/next/src/client/components/react-dev-overlay/ui/hooks/use-delayed-render.ts rename to packages/next/src/next-devtools/dev-overlay/hooks/use-delayed-render.ts diff --git a/packages/next/src/client/components/react-dev-overlay/ui/hooks/use-on-click-outside.ts b/packages/next/src/next-devtools/dev-overlay/hooks/use-on-click-outside.ts similarity index 100% rename from packages/next/src/client/components/react-dev-overlay/ui/hooks/use-on-click-outside.ts rename to packages/next/src/next-devtools/dev-overlay/hooks/use-on-click-outside.ts diff --git a/packages/next/src/client/components/react-dev-overlay/ui/icons/collapse-icon.tsx b/packages/next/src/next-devtools/dev-overlay/icons/collapse-icon.tsx similarity index 100% rename from packages/next/src/client/components/react-dev-overlay/ui/icons/collapse-icon.tsx rename to packages/next/src/next-devtools/dev-overlay/icons/collapse-icon.tsx diff --git a/packages/next/src/client/components/react-dev-overlay/ui/icons/dark-icon.tsx b/packages/next/src/next-devtools/dev-overlay/icons/dark-icon.tsx similarity index 100% rename from packages/next/src/client/components/react-dev-overlay/ui/icons/dark-icon.tsx rename to packages/next/src/next-devtools/dev-overlay/icons/dark-icon.tsx diff --git a/packages/next/src/client/components/react-dev-overlay/ui/icons/external.tsx b/packages/next/src/next-devtools/dev-overlay/icons/external.tsx similarity index 100% rename from packages/next/src/client/components/react-dev-overlay/ui/icons/external.tsx rename to packages/next/src/next-devtools/dev-overlay/icons/external.tsx diff --git a/packages/next/src/client/components/react-dev-overlay/ui/icons/eye-icon.tsx b/packages/next/src/next-devtools/dev-overlay/icons/eye-icon.tsx similarity index 100% rename from packages/next/src/client/components/react-dev-overlay/ui/icons/eye-icon.tsx rename to packages/next/src/next-devtools/dev-overlay/icons/eye-icon.tsx diff --git a/packages/next/src/client/components/react-dev-overlay/ui/icons/file.tsx b/packages/next/src/next-devtools/dev-overlay/icons/file.tsx similarity index 100% rename from packages/next/src/client/components/react-dev-overlay/ui/icons/file.tsx rename to packages/next/src/next-devtools/dev-overlay/icons/file.tsx diff --git a/packages/next/src/client/components/react-dev-overlay/ui/icons/gear-icon.tsx b/packages/next/src/next-devtools/dev-overlay/icons/gear-icon.tsx similarity index 100% rename from packages/next/src/client/components/react-dev-overlay/ui/icons/gear-icon.tsx rename to packages/next/src/next-devtools/dev-overlay/icons/gear-icon.tsx diff --git a/packages/next/src/client/components/react-dev-overlay/ui/icons/left-arrow.tsx b/packages/next/src/next-devtools/dev-overlay/icons/left-arrow.tsx similarity index 100% rename from packages/next/src/client/components/react-dev-overlay/ui/icons/left-arrow.tsx rename to packages/next/src/next-devtools/dev-overlay/icons/left-arrow.tsx diff --git a/packages/next/src/client/components/react-dev-overlay/ui/icons/light-icon.tsx b/packages/next/src/next-devtools/dev-overlay/icons/light-icon.tsx similarity index 100% rename from packages/next/src/client/components/react-dev-overlay/ui/icons/light-icon.tsx rename to packages/next/src/next-devtools/dev-overlay/icons/light-icon.tsx diff --git a/packages/next/src/client/components/react-dev-overlay/ui/icons/refresh-clock-wise.tsx b/packages/next/src/next-devtools/dev-overlay/icons/refresh-clock-wise.tsx similarity index 100% rename from packages/next/src/client/components/react-dev-overlay/ui/icons/refresh-clock-wise.tsx rename to packages/next/src/next-devtools/dev-overlay/icons/refresh-clock-wise.tsx diff --git a/packages/next/src/client/components/react-dev-overlay/ui/icons/right-arrow.tsx b/packages/next/src/next-devtools/dev-overlay/icons/right-arrow.tsx similarity index 100% rename from packages/next/src/client/components/react-dev-overlay/ui/icons/right-arrow.tsx rename to packages/next/src/next-devtools/dev-overlay/icons/right-arrow.tsx diff --git a/packages/next/src/client/components/react-dev-overlay/ui/icons/stop-icon.tsx b/packages/next/src/next-devtools/dev-overlay/icons/stop-icon.tsx similarity index 100% rename from packages/next/src/client/components/react-dev-overlay/ui/icons/stop-icon.tsx rename to packages/next/src/next-devtools/dev-overlay/icons/stop-icon.tsx diff --git a/packages/next/src/client/components/react-dev-overlay/ui/icons/system-icon.tsx b/packages/next/src/next-devtools/dev-overlay/icons/system-icon.tsx similarity index 100% rename from packages/next/src/client/components/react-dev-overlay/ui/icons/system-icon.tsx rename to packages/next/src/next-devtools/dev-overlay/icons/system-icon.tsx diff --git a/packages/next/src/client/components/react-dev-overlay/ui/icons/thumbs/thumbs-down.tsx b/packages/next/src/next-devtools/dev-overlay/icons/thumbs/thumbs-down.tsx similarity index 100% rename from packages/next/src/client/components/react-dev-overlay/ui/icons/thumbs/thumbs-down.tsx rename to packages/next/src/next-devtools/dev-overlay/icons/thumbs/thumbs-down.tsx diff --git a/packages/next/src/client/components/react-dev-overlay/ui/icons/thumbs/thumbs-up.tsx b/packages/next/src/next-devtools/dev-overlay/icons/thumbs/thumbs-up.tsx similarity index 100% rename from packages/next/src/client/components/react-dev-overlay/ui/icons/thumbs/thumbs-up.tsx rename to packages/next/src/next-devtools/dev-overlay/icons/thumbs/thumbs-up.tsx diff --git a/packages/next/src/client/components/react-dev-overlay/shared.ts b/packages/next/src/next-devtools/dev-overlay/shared.ts similarity index 96% rename from packages/next/src/client/components/react-dev-overlay/shared.ts rename to packages/next/src/next-devtools/dev-overlay/shared.ts index 90629a69fa6..008128b948f 100644 --- a/packages/next/src/client/components/react-dev-overlay/shared.ts +++ b/packages/next/src/next-devtools/dev-overlay/shared.ts @@ -1,12 +1,12 @@ import { useReducer } from 'react' -import type { VersionInfo } from '../../../server/dev/parse-version-info' -import type { SupportedErrorEvent } from './ui/container/runtime-error/render-error' +import type { VersionInfo } from '../../server/dev/parse-version-info' +import type { SupportedErrorEvent } from './container/runtime-error/render-error' import { parseComponentStack } from './utils/parse-component-stack' -import type { DebugInfo } from './types' -import type { DevIndicatorServerState } from '../../../server/dev/dev-indicator-server-state' -import { parseStack } from './utils/parse-stack' -import { isConsoleError } from './app/errors/console-error' +import type { DebugInfo } from '../shared/types' +import type { DevIndicatorServerState } from '../../server/dev/dev-indicator-server-state' +import { parseStack } from '../../server/lib/parse-stack' +import { isConsoleError } from '../shared/console-error' type FastRefreshState = /** No refresh in progress. */ diff --git a/packages/next/src/client/components/react-dev-overlay/ui/storybook/with-shadow-portal.tsx b/packages/next/src/next-devtools/dev-overlay/storybook/with-shadow-portal.tsx similarity index 100% rename from packages/next/src/client/components/react-dev-overlay/ui/storybook/with-shadow-portal.tsx rename to packages/next/src/next-devtools/dev-overlay/storybook/with-shadow-portal.tsx diff --git a/packages/next/src/client/components/react-dev-overlay/ui/styles/base.tsx b/packages/next/src/next-devtools/dev-overlay/styles/base.tsx similarity index 99% rename from packages/next/src/client/components/react-dev-overlay/ui/styles/base.tsx rename to packages/next/src/next-devtools/dev-overlay/styles/base.tsx index 2e0356e7319..23e2cafd1a1 100644 --- a/packages/next/src/client/components/react-dev-overlay/ui/styles/base.tsx +++ b/packages/next/src/next-devtools/dev-overlay/styles/base.tsx @@ -1,4 +1,4 @@ -import { css } from '../../utils/css' +import { css } from '../utils/css' import type { DevToolsScale } from '../components/errors/dev-tools-indicator/dev-tools-info/preferences' export function Base({ scale = 1 }: { scale?: DevToolsScale }) { diff --git a/packages/next/src/client/components/react-dev-overlay/ui/styles/colors.tsx b/packages/next/src/next-devtools/dev-overlay/styles/colors.tsx similarity index 99% rename from packages/next/src/client/components/react-dev-overlay/ui/styles/colors.tsx rename to packages/next/src/next-devtools/dev-overlay/styles/colors.tsx index 9f6e9c9ea3a..a9a1db64086 100644 --- a/packages/next/src/client/components/react-dev-overlay/ui/styles/colors.tsx +++ b/packages/next/src/next-devtools/dev-overlay/styles/colors.tsx @@ -1,4 +1,4 @@ -import { css } from '../../utils/css' +import { css } from '../utils/css' export function Colors() { return ( diff --git a/packages/next/src/client/components/react-dev-overlay/ui/styles/component-styles.tsx b/packages/next/src/next-devtools/dev-overlay/styles/component-styles.tsx similarity index 98% rename from packages/next/src/client/components/react-dev-overlay/ui/styles/component-styles.tsx rename to packages/next/src/next-devtools/dev-overlay/styles/component-styles.tsx index 38951b49565..b5dc8ef24e5 100644 --- a/packages/next/src/client/components/react-dev-overlay/ui/styles/component-styles.tsx +++ b/packages/next/src/next-devtools/dev-overlay/styles/component-styles.tsx @@ -14,7 +14,7 @@ import { styles as containerRuntimeErrorStyles } from '../container/runtime-erro import { COPY_BUTTON_STYLES } from '../components/copy-button' import { CALL_STACK_FRAME_STYLES } from '../components/call-stack-frame/call-stack-frame' import { DEV_TOOLS_INDICATOR_STYLES } from '../components/errors/dev-tools-indicator/dev-tools-indicator' -import { css } from '../../utils/css' +import { css } from '../utils/css' import { EDITOR_LINK_STYLES } from '../components/terminal/editor-link' import { ENVIRONMENT_NAME_LABEL_STYLES } from '../components/errors/environment-name-label/environment-name-label' import { DEV_TOOLS_INFO_STYLES } from '../components/errors/dev-tools-indicator/dev-tools-info/dev-tools-info' diff --git a/packages/next/src/client/components/react-dev-overlay/ui/styles/css-reset.tsx b/packages/next/src/next-devtools/dev-overlay/styles/css-reset.tsx similarity index 99% rename from packages/next/src/client/components/react-dev-overlay/ui/styles/css-reset.tsx rename to packages/next/src/next-devtools/dev-overlay/styles/css-reset.tsx index cbb3f19b613..57732bea647 100644 --- a/packages/next/src/client/components/react-dev-overlay/ui/styles/css-reset.tsx +++ b/packages/next/src/next-devtools/dev-overlay/styles/css-reset.tsx @@ -1,5 +1,5 @@ import * as React from 'react' -import { css } from '../../utils/css' +import { css } from '../utils/css' export function CssReset() { return ( diff --git a/packages/next/src/client/components/react-dev-overlay/ui/styles/dark-theme.tsx b/packages/next/src/next-devtools/dev-overlay/styles/dark-theme.tsx similarity index 98% rename from packages/next/src/client/components/react-dev-overlay/ui/styles/dark-theme.tsx rename to packages/next/src/next-devtools/dev-overlay/styles/dark-theme.tsx index d945b923baf..08a0ea39d5e 100644 --- a/packages/next/src/client/components/react-dev-overlay/ui/styles/dark-theme.tsx +++ b/packages/next/src/next-devtools/dev-overlay/styles/dark-theme.tsx @@ -1,4 +1,4 @@ -import { css } from '../../utils/css' +import { css } from '../utils/css' const colors = ` /* Background Dark */ diff --git a/packages/next/src/client/components/react-dev-overlay/utils/css.test.ts b/packages/next/src/next-devtools/dev-overlay/utils/css.test.ts similarity index 100% rename from packages/next/src/client/components/react-dev-overlay/utils/css.test.ts rename to packages/next/src/next-devtools/dev-overlay/utils/css.test.ts diff --git a/packages/next/src/client/components/react-dev-overlay/utils/css.ts b/packages/next/src/next-devtools/dev-overlay/utils/css.ts similarity index 100% rename from packages/next/src/client/components/react-dev-overlay/utils/css.ts rename to packages/next/src/next-devtools/dev-overlay/utils/css.ts diff --git a/packages/next/src/client/components/react-dev-overlay/ui/utils/cx.test.ts b/packages/next/src/next-devtools/dev-overlay/utils/cx.test.ts similarity index 100% rename from packages/next/src/client/components/react-dev-overlay/ui/utils/cx.test.ts rename to packages/next/src/next-devtools/dev-overlay/utils/cx.test.ts diff --git a/packages/next/src/client/components/react-dev-overlay/ui/utils/cx.ts b/packages/next/src/next-devtools/dev-overlay/utils/cx.ts similarity index 100% rename from packages/next/src/client/components/react-dev-overlay/ui/utils/cx.ts rename to packages/next/src/next-devtools/dev-overlay/utils/cx.ts diff --git a/packages/next/src/client/components/react-dev-overlay/utils/get-error-by-type.ts b/packages/next/src/next-devtools/dev-overlay/utils/get-error-by-type.ts similarity index 89% rename from packages/next/src/client/components/react-dev-overlay/utils/get-error-by-type.ts rename to packages/next/src/next-devtools/dev-overlay/utils/get-error-by-type.ts index 5ad9b345338..113301332ee 100644 --- a/packages/next/src/client/components/react-dev-overlay/utils/get-error-by-type.ts +++ b/packages/next/src/next-devtools/dev-overlay/utils/get-error-by-type.ts @@ -1,8 +1,8 @@ -import type { SupportedErrorEvent } from '../ui/container/runtime-error/render-error' -import { getOriginalStackFrames } from './stack-frame' -import type { OriginalStackFrame } from './stack-frame' +import type { SupportedErrorEvent } from '../container/runtime-error/render-error' +import { getOriginalStackFrames } from '../../shared/stack-frame' +import type { OriginalStackFrame } from '../../shared/stack-frame' import type { ComponentStackFrame } from './parse-component-stack' -import { getErrorSource } from '../../../../shared/lib/error-source' +import { getErrorSource } from '../../../shared/lib/error-source' import React from 'react' export type ReadyRuntimeError = { diff --git a/packages/next/src/client/components/react-dev-overlay/ui/utils/lorem.ts b/packages/next/src/next-devtools/dev-overlay/utils/lorem.ts similarity index 100% rename from packages/next/src/client/components/react-dev-overlay/ui/utils/lorem.ts rename to packages/next/src/next-devtools/dev-overlay/utils/lorem.ts diff --git a/packages/next/src/client/components/react-dev-overlay/ui/utils/merge-refs.ts b/packages/next/src/next-devtools/dev-overlay/utils/merge-refs.ts similarity index 100% rename from packages/next/src/client/components/react-dev-overlay/ui/utils/merge-refs.ts rename to packages/next/src/next-devtools/dev-overlay/utils/merge-refs.ts diff --git a/packages/next/src/client/components/react-dev-overlay/utils/parse-component-stack.ts b/packages/next/src/next-devtools/dev-overlay/utils/parse-component-stack.ts similarity index 100% rename from packages/next/src/client/components/react-dev-overlay/utils/parse-component-stack.ts rename to packages/next/src/next-devtools/dev-overlay/utils/parse-component-stack.ts diff --git a/packages/next/src/client/components/react-dev-overlay/ui/utils/parse-url-from-text.test.ts b/packages/next/src/next-devtools/dev-overlay/utils/parse-url-from-text.test.ts similarity index 100% rename from packages/next/src/client/components/react-dev-overlay/ui/utils/parse-url-from-text.test.ts rename to packages/next/src/next-devtools/dev-overlay/utils/parse-url-from-text.test.ts diff --git a/packages/next/src/client/components/react-dev-overlay/ui/utils/parse-url-from-text.ts b/packages/next/src/next-devtools/dev-overlay/utils/parse-url-from-text.ts similarity index 100% rename from packages/next/src/client/components/react-dev-overlay/ui/utils/parse-url-from-text.ts rename to packages/next/src/next-devtools/dev-overlay/utils/parse-url-from-text.ts diff --git a/packages/next/src/client/components/react-dev-overlay/ui/utils/use-open-in-editor.ts b/packages/next/src/next-devtools/dev-overlay/utils/use-open-in-editor.ts similarity index 100% rename from packages/next/src/client/components/react-dev-overlay/ui/utils/use-open-in-editor.ts rename to packages/next/src/next-devtools/dev-overlay/utils/use-open-in-editor.ts diff --git a/packages/next/src/client/components/react-dev-overlay/entrypoint.d.ts b/packages/next/src/next-devtools/entrypoint.ts similarity index 100% rename from packages/next/src/client/components/react-dev-overlay/entrypoint.d.ts rename to packages/next/src/next-devtools/entrypoint.ts diff --git a/packages/next/src/server/dev/dev-indicator-middleware.ts b/packages/next/src/next-devtools/server/dev-indicator-middleware.ts similarity index 86% rename from packages/next/src/server/dev/dev-indicator-middleware.ts rename to packages/next/src/next-devtools/server/dev-indicator-middleware.ts index 389a8a892c6..593cd700d4f 100644 --- a/packages/next/src/server/dev/dev-indicator-middleware.ts +++ b/packages/next/src/next-devtools/server/dev-indicator-middleware.ts @@ -1,7 +1,7 @@ import type { ServerResponse, IncomingMessage } from 'http' -import { middlewareResponse } from '../../client/components/react-dev-overlay/server/middleware-response' +import { middlewareResponse } from './middleware-response' import * as Log from '../../build/output/log' -import { devIndicatorServerState } from './dev-indicator-server-state' +import { devIndicatorServerState } from '../../server/dev/dev-indicator-server-state' const DISABLE_DEV_INDICATOR_PREFIX = '/__nextjs_disable_dev_indicator' diff --git a/packages/next/src/client/components/react-dev-overlay/font/geist-latin-ext.woff2 b/packages/next/src/next-devtools/server/font/geist-latin-ext.woff2 similarity index 100% rename from packages/next/src/client/components/react-dev-overlay/font/geist-latin-ext.woff2 rename to packages/next/src/next-devtools/server/font/geist-latin-ext.woff2 diff --git a/packages/next/src/client/components/react-dev-overlay/font/geist-latin.woff2 b/packages/next/src/next-devtools/server/font/geist-latin.woff2 similarity index 100% rename from packages/next/src/client/components/react-dev-overlay/font/geist-latin.woff2 rename to packages/next/src/next-devtools/server/font/geist-latin.woff2 diff --git a/packages/next/src/client/components/react-dev-overlay/font/geist-mono-latin-ext.woff2 b/packages/next/src/next-devtools/server/font/geist-mono-latin-ext.woff2 similarity index 100% rename from packages/next/src/client/components/react-dev-overlay/font/geist-mono-latin-ext.woff2 rename to packages/next/src/next-devtools/server/font/geist-mono-latin-ext.woff2 diff --git a/packages/next/src/client/components/react-dev-overlay/font/geist-mono-latin.woff2 b/packages/next/src/next-devtools/server/font/geist-mono-latin.woff2 similarity index 100% rename from packages/next/src/client/components/react-dev-overlay/font/geist-mono-latin.woff2 rename to packages/next/src/next-devtools/server/font/geist-mono-latin.woff2 diff --git a/packages/next/src/client/components/react-dev-overlay/font/get-dev-overlay-font-middleware.ts b/packages/next/src/next-devtools/server/font/get-dev-overlay-font-middleware.ts similarity index 93% rename from packages/next/src/client/components/react-dev-overlay/font/get-dev-overlay-font-middleware.ts rename to packages/next/src/next-devtools/server/font/get-dev-overlay-font-middleware.ts index 7efd2c56300..e02085c5058 100644 --- a/packages/next/src/client/components/react-dev-overlay/font/get-dev-overlay-font-middleware.ts +++ b/packages/next/src/next-devtools/server/font/get-dev-overlay-font-middleware.ts @@ -2,8 +2,8 @@ import type { ServerResponse, IncomingMessage } from 'http' import path from 'path' import * as fs from 'fs/promises' import { constants } from 'fs' -import * as Log from '../../../../build/output/log' -import { middlewareResponse } from '../server/middleware-response' +import * as Log from '../../../build/output/log' +import { middlewareResponse } from '../middleware-response' const FONT_PREFIX = '/__nextjs_font/' diff --git a/packages/next/src/client/components/react-dev-overlay/server/get-next-error-feedback-middleware.test.ts b/packages/next/src/next-devtools/server/get-next-error-feedback-middleware.test.ts similarity index 100% rename from packages/next/src/client/components/react-dev-overlay/server/get-next-error-feedback-middleware.test.ts rename to packages/next/src/next-devtools/server/get-next-error-feedback-middleware.test.ts diff --git a/packages/next/src/client/components/react-dev-overlay/server/get-next-error-feedback-middleware.ts b/packages/next/src/next-devtools/server/get-next-error-feedback-middleware.ts similarity index 88% rename from packages/next/src/client/components/react-dev-overlay/server/get-next-error-feedback-middleware.ts rename to packages/next/src/next-devtools/server/get-next-error-feedback-middleware.ts index 89db34a4b64..f00b951711f 100644 --- a/packages/next/src/client/components/react-dev-overlay/server/get-next-error-feedback-middleware.ts +++ b/packages/next/src/next-devtools/server/get-next-error-feedback-middleware.ts @@ -1,7 +1,7 @@ -import { eventErrorFeedback } from '../../../../telemetry/events/error-feedback' +import { eventErrorFeedback } from '../../telemetry/events/error-feedback' import { middlewareResponse } from './middleware-response' import type { ServerResponse, IncomingMessage } from 'http' -import type { Telemetry } from '../../../../telemetry/storage' +import type { Telemetry } from '../../telemetry/storage' // Handles HTTP requests to /__nextjs_error_feedback endpoint for collecting user feedback on error messages export function getNextErrorFeedbackMiddleware(telemetry: Telemetry) { diff --git a/packages/next/src/client/components/react-dev-overlay/utils/launch-editor.test.ts b/packages/next/src/next-devtools/server/launch-editor.test.ts similarity index 100% rename from packages/next/src/client/components/react-dev-overlay/utils/launch-editor.test.ts rename to packages/next/src/next-devtools/server/launch-editor.test.ts diff --git a/packages/next/src/client/components/react-dev-overlay/utils/launch-editor.ts b/packages/next/src/next-devtools/server/launch-editor.ts similarity index 99% rename from packages/next/src/client/components/react-dev-overlay/utils/launch-editor.ts rename to packages/next/src/next-devtools/server/launch-editor.ts index 31bacccaac0..f8dc35ab4b4 100644 --- a/packages/next/src/client/components/react-dev-overlay/utils/launch-editor.ts +++ b/packages/next/src/next-devtools/server/launch-editor.ts @@ -21,7 +21,7 @@ * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE * SOFTWARE. */ -import { cyan, green, red } from '../../../../lib/picocolors' +import { cyan, green, red } from '../../lib/picocolors' import child_process from 'child_process' import fs from 'fs' import os from 'os' diff --git a/packages/next/src/client/components/react-dev-overlay/server/middleware-response.ts b/packages/next/src/next-devtools/server/middleware-response.ts similarity index 100% rename from packages/next/src/client/components/react-dev-overlay/server/middleware-response.ts rename to packages/next/src/next-devtools/server/middleware-response.ts diff --git a/packages/next/src/client/components/react-dev-overlay/server/restart-dev-server-middleware.ts b/packages/next/src/next-devtools/server/restart-dev-server-middleware.ts similarity index 92% rename from packages/next/src/client/components/react-dev-overlay/server/restart-dev-server-middleware.ts rename to packages/next/src/next-devtools/server/restart-dev-server-middleware.ts index 4421eebbafe..9b5b1189432 100644 --- a/packages/next/src/client/components/react-dev-overlay/server/restart-dev-server-middleware.ts +++ b/packages/next/src/next-devtools/server/restart-dev-server-middleware.ts @@ -1,8 +1,8 @@ import type { ServerResponse, IncomingMessage } from 'http' -import type { Telemetry } from '../../../../telemetry/storage' -import { RESTART_EXIT_CODE } from '../../../../server/lib/utils' +import type { Telemetry } from '../../telemetry/storage' +import { RESTART_EXIT_CODE } from '../../server/lib/utils' import { middlewareResponse } from './middleware-response' -import type { Project } from '../../../../build/swc/types' +import type { Project } from '../../build/swc/types' const EVENT_DEV_OVERLAY_RESTART_SERVER = 'DEV_OVERLAY_RESTART_SERVER' diff --git a/packages/next/src/client/components/react-dev-overlay/server/shared.ts b/packages/next/src/next-devtools/server/shared.ts similarity index 95% rename from packages/next/src/client/components/react-dev-overlay/server/shared.ts rename to packages/next/src/next-devtools/server/shared.ts index 3bdf4e25fb8..c92b3338b94 100644 --- a/packages/next/src/client/components/react-dev-overlay/server/shared.ts +++ b/packages/next/src/next-devtools/server/shared.ts @@ -1,6 +1,6 @@ import type { StackFrame } from 'stacktrace-parser' import { codeFrameColumns } from 'next/dist/compiled/babel/code-frame' -import isInternal from '../../../../shared/lib/is-internal' +import isInternal from '../../shared/lib/is-internal' export interface OriginalStackFramesRequest { frames: StackFrame[] diff --git a/packages/next/src/client/components/react-dev-overlay/app/errors/console-error.ts b/packages/next/src/next-devtools/shared/console-error.ts similarity index 100% rename from packages/next/src/client/components/react-dev-overlay/app/errors/console-error.ts rename to packages/next/src/next-devtools/shared/console-error.ts diff --git a/packages/next/src/next-devtools/shared/hydration-error.ts b/packages/next/src/next-devtools/shared/hydration-error.ts new file mode 100644 index 00000000000..0623d896e25 --- /dev/null +++ b/packages/next/src/next-devtools/shared/hydration-error.ts @@ -0,0 +1,5 @@ +export type HydrationErrorState = { + // Hydration warning template format: + warning?: string + reactOutputComponentDiff?: string +} diff --git a/packages/next/src/client/components/react-dev-overlay/pages/react-18-hydration-error-info.ts b/packages/next/src/next-devtools/shared/react-18-hydration-error.ts similarity index 97% rename from packages/next/src/client/components/react-dev-overlay/pages/react-18-hydration-error-info.ts rename to packages/next/src/next-devtools/shared/react-18-hydration-error.ts index ad213107aad..14cda0f450e 100644 --- a/packages/next/src/client/components/react-dev-overlay/pages/react-18-hydration-error-info.ts +++ b/packages/next/src/next-devtools/shared/react-18-hydration-error.ts @@ -1,4 +1,4 @@ -import isError from '../../../../lib/is-error' +import isError from '../../lib/is-error' export function isHydrationError(error: unknown): boolean { return ( diff --git a/packages/next/src/client/components/react-19-hydration-error.ts b/packages/next/src/next-devtools/shared/react-19-hydration-error.ts similarity index 100% rename from packages/next/src/client/components/react-19-hydration-error.ts rename to packages/next/src/next-devtools/shared/react-19-hydration-error.ts diff --git a/packages/next/src/client/components/react-dev-overlay/utils/stack-frame.ts b/packages/next/src/next-devtools/shared/stack-frame.ts similarity index 100% rename from packages/next/src/client/components/react-dev-overlay/utils/stack-frame.ts rename to packages/next/src/next-devtools/shared/stack-frame.ts diff --git a/packages/next/src/client/components/react-dev-overlay/types.ts b/packages/next/src/next-devtools/shared/types.ts similarity index 100% rename from packages/next/src/client/components/react-dev-overlay/types.ts rename to packages/next/src/next-devtools/shared/types.ts diff --git a/packages/next/src/next-devtools/shared/version-staleness.ts b/packages/next/src/next-devtools/shared/version-staleness.ts new file mode 100644 index 00000000000..71d651ff067 --- /dev/null +++ b/packages/next/src/next-devtools/shared/version-staleness.ts @@ -0,0 +1,42 @@ +import type { VersionInfo } from '../../server/dev/parse-version-info' + +export function getStaleness({ installed, staleness, expected }: VersionInfo) { + let text = '' + let title = '' + let indicatorClass = '' + const versionLabel = `Next.js ${installed}` + switch (staleness) { + case 'newer-than-npm': + case 'fresh': + text = versionLabel + title = `Latest available version is detected (${installed}).` + indicatorClass = 'fresh' + break + case 'stale-patch': + case 'stale-minor': + text = `${versionLabel} (stale)` + title = `There is a newer version (${expected}) available, upgrade recommended! ` + indicatorClass = 'stale' + break + case 'stale-major': { + text = `${versionLabel} (outdated)` + title = `An outdated version detected (latest is ${expected}), upgrade is highly recommended!` + indicatorClass = 'outdated' + break + } + case 'stale-prerelease': { + text = `${versionLabel} (stale)` + title = `There is a newer canary version (${expected}) available, please upgrade! ` + indicatorClass = 'stale' + break + } + case 'unknown': + text = `${versionLabel} (unknown)` + title = 'No Next.js version data was found.' + indicatorClass = 'unknown' + break + default: + break + } + return { text, indicatorClass, title } +} diff --git a/packages/next/src/client/components/react-dev-overlay/utils/webpack-module-path.test.ts b/packages/next/src/next-devtools/shared/webpack-module-path.test.ts similarity index 100% rename from packages/next/src/client/components/react-dev-overlay/utils/webpack-module-path.test.ts rename to packages/next/src/next-devtools/shared/webpack-module-path.test.ts diff --git a/packages/next/src/client/components/react-dev-overlay/utils/webpack-module-path.ts b/packages/next/src/next-devtools/shared/webpack-module-path.ts similarity index 100% rename from packages/next/src/client/components/react-dev-overlay/utils/webpack-module-path.ts rename to packages/next/src/next-devtools/shared/webpack-module-path.ts diff --git a/packages/next/src/next-devtools/types.ts b/packages/next/src/next-devtools/types.ts new file mode 100644 index 00000000000..e69de29bb2d diff --git a/packages/next/src/client/components/react-dev-overlay/app/app-dev-overlay-error-boundary.tsx b/packages/next/src/next-devtools/userspace/app/app-dev-overlay-error-boundary.tsx similarity index 87% rename from packages/next/src/client/components/react-dev-overlay/app/app-dev-overlay-error-boundary.tsx rename to packages/next/src/next-devtools/userspace/app/app-dev-overlay-error-boundary.tsx index 49e832601c2..3dadcf1defe 100644 --- a/packages/next/src/client/components/react-dev-overlay/app/app-dev-overlay-error-boundary.tsx +++ b/packages/next/src/next-devtools/userspace/app/app-dev-overlay-error-boundary.tsx @@ -1,10 +1,10 @@ import { PureComponent } from 'react' import { dispatcher } from 'next/dist/compiled/next-devtools' -import { RuntimeErrorHandler } from '../runtime-error-handler' -import { ErrorBoundary } from '../../error-boundary' +import { RuntimeErrorHandler } from '../../../client/dev/runtime-error-handler' +import { ErrorBoundary } from '../../../client/components/error-boundary' import DefaultGlobalError, { type GlobalErrorComponent, -} from '../../global-error' +} from '../../../client/components/global-error' type AppDevOverlayErrorBoundaryProps = { children: React.ReactNode diff --git a/packages/next/src/client/components/react-dev-overlay/app/app-dev-overlay-setup.ts b/packages/next/src/next-devtools/userspace/app/app-dev-overlay-setup.ts similarity index 100% rename from packages/next/src/client/components/react-dev-overlay/app/app-dev-overlay-setup.ts rename to packages/next/src/next-devtools/userspace/app/app-dev-overlay-setup.ts diff --git a/packages/next/src/client/components/react-dev-overlay/app/client-entry.tsx b/packages/next/src/next-devtools/userspace/app/client-entry.tsx similarity index 80% rename from packages/next/src/client/components/react-dev-overlay/app/client-entry.tsx rename to packages/next/src/next-devtools/userspace/app/client-entry.tsx index 6324d851012..201812caf47 100644 --- a/packages/next/src/client/components/react-dev-overlay/app/client-entry.tsx +++ b/packages/next/src/next-devtools/userspace/app/client-entry.tsx @@ -1,7 +1,7 @@ import React from 'react' -import { getSocketUrl } from '../../../dev/hot-reloader/get-socket-url' -import { HMR_ACTIONS_SENT_TO_BROWSER } from '../../../../server/dev/hot-reloader-types' -import GlobalError from '../../global-error' +import { getSocketUrl } from '../../../client/dev/hot-reloader/get-socket-url' +import { HMR_ACTIONS_SENT_TO_BROWSER } from '../../../server/dev/hot-reloader-types' +import GlobalError from '../../../client/components/global-error' import { AppDevOverlayErrorBoundary } from './app-dev-overlay-error-boundary' // if an error is thrown while rendering an RSC stream, this will catch it in dev diff --git a/packages/next/src/client/components/react-dev-overlay/app/errors/intercept-console-error.ts b/packages/next/src/next-devtools/userspace/app/errors/intercept-console-error.ts similarity index 86% rename from packages/next/src/client/components/react-dev-overlay/app/errors/intercept-console-error.ts rename to packages/next/src/next-devtools/userspace/app/errors/intercept-console-error.ts index 67c888e8cb4..f7bcd95e09a 100644 --- a/packages/next/src/client/components/react-dev-overlay/app/errors/intercept-console-error.ts +++ b/packages/next/src/next-devtools/userspace/app/errors/intercept-console-error.ts @@ -1,7 +1,7 @@ -import isError from '../../../../../lib/is-error' -import { isNextRouterError } from '../../../is-next-router-error' +import isError from '../../../../lib/is-error' +import { isNextRouterError } from '../../../../client/components/is-next-router-error' import { handleConsoleError } from './use-error-handler' -import { parseConsoleArgs } from '../../../../lib/console' +import { parseConsoleArgs } from '../../../../client/lib/console' export const originConsoleError = globalThis.console.error diff --git a/packages/next/src/client/components/react-dev-overlay/app/errors/replay-ssr-only-errors.tsx b/packages/next/src/next-devtools/userspace/app/errors/replay-ssr-only-errors.tsx similarity index 91% rename from packages/next/src/client/components/react-dev-overlay/app/errors/replay-ssr-only-errors.tsx rename to packages/next/src/next-devtools/userspace/app/errors/replay-ssr-only-errors.tsx index 3dc7dea3f7f..01db82fb58c 100644 --- a/packages/next/src/client/components/react-dev-overlay/app/errors/replay-ssr-only-errors.tsx +++ b/packages/next/src/next-devtools/userspace/app/errors/replay-ssr-only-errors.tsx @@ -1,7 +1,7 @@ import { useEffect } from 'react' import { handleClientError } from './use-error-handler' -import { isNextRouterError } from '../../../is-next-router-error' -import { MISSING_ROOT_TAGS_ERROR } from '../../../../../shared/lib/errors/constants' +import { isNextRouterError } from '../../../../client/components/is-next-router-error' +import { MISSING_ROOT_TAGS_ERROR } from '../../../../shared/lib/errors/constants' function readSsrError(): (Error & { digest?: string }) | null { if (typeof document === 'undefined') { diff --git a/packages/next/src/client/components/react-dev-overlay/app/errors/stitched-error.ts b/packages/next/src/next-devtools/userspace/app/errors/stitched-error.ts similarity index 94% rename from packages/next/src/client/components/react-dev-overlay/app/errors/stitched-error.ts rename to packages/next/src/next-devtools/userspace/app/errors/stitched-error.ts index 53dac47ad7b..e1a448933c7 100644 --- a/packages/next/src/client/components/react-dev-overlay/app/errors/stitched-error.ts +++ b/packages/next/src/next-devtools/userspace/app/errors/stitched-error.ts @@ -1,5 +1,5 @@ import React from 'react' -import isError from '../../../../../lib/is-error' +import isError from '../../../../lib/is-error' const ownerStacks = new WeakMap() const componentStacks = new WeakMap() diff --git a/packages/next/src/client/components/react-dev-overlay/app/errors/use-error-handler.ts b/packages/next/src/next-devtools/userspace/app/errors/use-error-handler.ts similarity index 92% rename from packages/next/src/client/components/react-dev-overlay/app/errors/use-error-handler.ts rename to packages/next/src/next-devtools/userspace/app/errors/use-error-handler.ts index 2c82127bca0..72e39d51c12 100644 --- a/packages/next/src/client/components/react-dev-overlay/app/errors/use-error-handler.ts +++ b/packages/next/src/next-devtools/userspace/app/errors/use-error-handler.ts @@ -1,8 +1,11 @@ import { useEffect } from 'react' -import { isNextRouterError } from '../../../is-next-router-error' -import { formatConsoleArgs, parseConsoleArgs } from '../../../../lib/console' -import isError from '../../../../../lib/is-error' -import { createConsoleError } from './console-error' +import { isNextRouterError } from '../../../../client/components/is-next-router-error' +import { + formatConsoleArgs, + parseConsoleArgs, +} from '../../../../client/lib/console' +import isError from '../../../../lib/is-error' +import { createConsoleError } from '../../../shared/console-error' import { coerceError, setOwnerStackIfAvailable } from './stitched-error' const queueMicroTask = diff --git a/packages/next/src/client/components/react-dev-overlay/pages/hydration-error-state.ts b/packages/next/src/next-devtools/userspace/pages/hydration-error-state.ts similarity index 96% rename from packages/next/src/client/components/react-dev-overlay/pages/hydration-error-state.ts rename to packages/next/src/next-devtools/userspace/pages/hydration-error-state.ts index 1529529ce92..7b5f8e2e155 100644 --- a/packages/next/src/client/components/react-dev-overlay/pages/hydration-error-state.ts +++ b/packages/next/src/next-devtools/userspace/pages/hydration-error-state.ts @@ -2,17 +2,13 @@ import { getHydrationWarningType, isHydrationError as isReact18HydrationError, isHydrationWarning as isReact18HydrationWarning, -} from './react-18-hydration-error-info' +} from '../../shared/react-18-hydration-error' import { isHydrationError as isReact19HydrationError, isErrorMessageWithComponentStackDiff as isReact19HydrationWarning, -} from '../../react-19-hydration-error' +} from '../../shared/react-19-hydration-error' +import type { HydrationErrorState } from '../../shared/hydration-error' -export type HydrationErrorState = { - // Hydration warning template format: - warning?: string - reactOutputComponentDiff?: string -} // We only need this for React 18 or hydration console errors in React 19. // Once we surface console.error in the dev overlay in pages router, we should only // use this for React 18. diff --git a/packages/next/src/client/components/react-dev-overlay/pages/pages-dev-overlay-error-boundary.tsx b/packages/next/src/next-devtools/userspace/pages/pages-dev-overlay-error-boundary.tsx similarity index 100% rename from packages/next/src/client/components/react-dev-overlay/pages/pages-dev-overlay-error-boundary.tsx rename to packages/next/src/next-devtools/userspace/pages/pages-dev-overlay-error-boundary.tsx diff --git a/packages/next/src/client/components/react-dev-overlay/pages/pages-dev-overlay-setup.tsx b/packages/next/src/next-devtools/userspace/pages/pages-dev-overlay-setup.tsx similarity index 91% rename from packages/next/src/client/components/react-dev-overlay/pages/pages-dev-overlay-setup.tsx rename to packages/next/src/next-devtools/userspace/pages/pages-dev-overlay-setup.tsx index 63475661aae..d2b98eccbf7 100644 --- a/packages/next/src/client/components/react-dev-overlay/pages/pages-dev-overlay-setup.tsx +++ b/packages/next/src/next-devtools/userspace/pages/pages-dev-overlay-setup.tsx @@ -5,9 +5,9 @@ import { attachHydrationErrorState, storeHydrationErrorStateFromConsoleArgs, } from './hydration-error-state' -import { Router } from '../../../router' +import { Router } from '../../../client/router' import { getComponentStack, getOwnerStack } from '../app/errors/stitched-error' -import { isRecoverableError } from '../../../react-client-callbacks/on-recoverable-error' +import { isRecoverableError } from '../../../client/react-client-callbacks/on-recoverable-error' import { getSquashedHydrationErrorDetails } from './hydration-error-state' import { PagesDevOverlayErrorBoundary } from './pages-dev-overlay-error-boundary' @@ -25,7 +25,7 @@ const usePagesDevOverlayBridge = () => { React.useEffect(() => { const { handleStaticIndicator } = - require('../../../dev/hot-reloader/pages/hot-reloader-pages') as typeof import('../../../dev/hot-reloader/pages/hot-reloader-pages') + require('../../../client/dev/hot-reloader/pages/hot-reloader-pages') as typeof import('../../../client/dev/hot-reloader/pages/hot-reloader-pages') Router.events.on('routeChangeComplete', handleStaticIndicator) diff --git a/packages/next/src/client/components/react-dev-overlay/utils/dev-indicator/use-app-dev-rendering-indicator.tsx b/packages/next/src/next-devtools/userspace/use-app-dev-rendering-indicator.tsx similarity index 100% rename from packages/next/src/client/components/react-dev-overlay/utils/dev-indicator/use-app-dev-rendering-indicator.tsx rename to packages/next/src/next-devtools/userspace/use-app-dev-rendering-indicator.tsx diff --git a/packages/next/src/client/components/react-dev-overlay/utils/get-source-map-from-file.ts b/packages/next/src/server/dev/get-source-map-from-file.ts similarity index 83% rename from packages/next/src/client/components/react-dev-overlay/utils/get-source-map-from-file.ts rename to packages/next/src/server/dev/get-source-map-from-file.ts index 4bbf9ad7af8..db01f991865 100644 --- a/packages/next/src/client/components/react-dev-overlay/utils/get-source-map-from-file.ts +++ b/packages/next/src/server/dev/get-source-map-from-file.ts @@ -3,7 +3,22 @@ import path from 'path' import url from 'url' import type { RawSourceMap } from 'next/dist/compiled/source-map08' import dataUriToBuffer from 'next/dist/compiled/data-uri-to-buffer' -import { getSourceMapUrl } from './get-source-map-url' + +function getSourceMapUrl(fileContents: string): string | null { + const regex = /\/\/[#@] ?sourceMappingURL=([^\s'"]+)\s*$/gm + let match = null + for (;;) { + let next = regex.exec(fileContents) + if (next == null) { + break + } + match = next + } + if (!(match && match[1])) { + return null + } + return match[1].toString() +} export async function getSourceMapFromFile( filename: string diff --git a/packages/next/src/server/dev/hot-reloader-turbopack.ts b/packages/next/src/server/dev/hot-reloader-turbopack.ts index cc3fd3a68ec..6b8bdc6222a 100644 --- a/packages/next/src/server/dev/hot-reloader-turbopack.ts +++ b/packages/next/src/server/dev/hot-reloader-turbopack.ts @@ -34,7 +34,7 @@ import { BLOCKED_PAGES } from '../../shared/lib/constants' import { getOverlayMiddleware, getSourceMapMiddleware, -} from '../../client/components/react-dev-overlay/server/middleware-turbopack' +} from './middleware-turbopack' import { PageNotFoundError } from '../../shared/lib/utils' import { debounce } from '../utils' import { deleteCache, deleteFromRequireCache } from './require-cache' @@ -83,7 +83,7 @@ import { setBundlerFindSourceMapImplementation, type ModernSourceMapPayload, } from '../patch-error-inspect' -import { getNextErrorFeedbackMiddleware } from '../../client/components/react-dev-overlay/server/get-next-error-feedback-middleware' +import { getNextErrorFeedbackMiddleware } from '../../next-devtools/server/get-next-error-feedback-middleware' import { formatIssue, getTurbopackJsConfig, @@ -94,10 +94,10 @@ import { type EntryIssuesMap, type TopLevelIssuesMap, } from '../../shared/lib/turbopack/utils' -import { getDevOverlayFontMiddleware } from '../../client/components/react-dev-overlay/font/get-dev-overlay-font-middleware' +import { getDevOverlayFontMiddleware } from '../../next-devtools/server/font/get-dev-overlay-font-middleware' import { devIndicatorServerState } from './dev-indicator-server-state' -import { getDisableDevIndicatorMiddleware } from './dev-indicator-middleware' -import { getRestartDevServerMiddleware } from '../../client/components/react-dev-overlay/server/restart-dev-server-middleware' +import { getDisableDevIndicatorMiddleware } from '../../next-devtools/server/dev-indicator-middleware' +import { getRestartDevServerMiddleware } from '../../next-devtools/server/restart-dev-server-middleware' // import { getSupportedBrowsers } from '../../build/utils' const wsServer = new ws.Server({ noServer: true }) diff --git a/packages/next/src/server/dev/hot-reloader-types.ts b/packages/next/src/server/dev/hot-reloader-types.ts index 283fbf53304..247d32958fb 100644 --- a/packages/next/src/server/dev/hot-reloader-types.ts +++ b/packages/next/src/server/dev/hot-reloader-types.ts @@ -6,7 +6,7 @@ import type getBaseWebpackConfig from '../../build/webpack-config' import type { RouteDefinition } from '../route-definitions/route-definition' import type { Project, Update as TurbopackUpdate } from '../../build/swc/types' import type { VersionInfo } from './parse-version-info' -import type { DebugInfo } from '../../client/components/react-dev-overlay/types' +import type { DebugInfo } from '../../next-devtools/shared/types' import type { DevIndicatorServerState } from './dev-indicator-server-state' export const enum HMR_ACTIONS_SENT_TO_BROWSER { diff --git a/packages/next/src/server/dev/hot-reloader-webpack.ts b/packages/next/src/server/dev/hot-reloader-webpack.ts index d650d90bda1..02ea8355b22 100644 --- a/packages/next/src/server/dev/hot-reloader-webpack.ts +++ b/packages/next/src/server/dev/hot-reloader-webpack.ts @@ -10,7 +10,7 @@ import { type webpack, StringXor } from 'next/dist/compiled/webpack/webpack' import { getOverlayMiddleware, getSourceMapMiddleware, -} from '../../client/components/react-dev-overlay/server/middleware-webpack' +} from './middleware-webpack' import { WebpackHotMiddleware } from './hot-middleware' import { join, relative, isAbsolute, posix, dirname } from 'path' import { @@ -83,11 +83,11 @@ import type { WebpackError } from 'webpack' import { PAGE_TYPES } from '../../lib/page-types' import { FAST_REFRESH_RUNTIME_RELOAD } from './messages' import { getNodeDebugType } from '../lib/utils' -import { getNextErrorFeedbackMiddleware } from '../../client/components/react-dev-overlay/server/get-next-error-feedback-middleware' -import { getDevOverlayFontMiddleware } from '../../client/components/react-dev-overlay/font/get-dev-overlay-font-middleware' -import { getDisableDevIndicatorMiddleware } from './dev-indicator-middleware' +import { getNextErrorFeedbackMiddleware } from '../../next-devtools/server/get-next-error-feedback-middleware' +import { getDevOverlayFontMiddleware } from '../../next-devtools/server/font/get-dev-overlay-font-middleware' +import { getDisableDevIndicatorMiddleware } from '../../next-devtools/server/dev-indicator-middleware' import getWebpackBundler from '../../shared/lib/get-webpack-bundler' -import { getRestartDevServerMiddleware } from '../../client/components/react-dev-overlay/server/restart-dev-server-middleware' +import { getRestartDevServerMiddleware } from '../../next-devtools/server/restart-dev-server-middleware' const MILLISECONDS_IN_NANOSECOND = BigInt(1_000_000) diff --git a/packages/next/src/client/components/react-dev-overlay/server/middleware-turbopack.ts b/packages/next/src/server/dev/middleware-turbopack.ts similarity index 97% rename from packages/next/src/client/components/react-dev-overlay/server/middleware-turbopack.ts rename to packages/next/src/server/dev/middleware-turbopack.ts index 086c8f1ed21..989784ad2a5 100644 --- a/packages/next/src/client/components/react-dev-overlay/server/middleware-turbopack.ts +++ b/packages/next/src/server/dev/middleware-turbopack.ts @@ -4,20 +4,20 @@ import { type OriginalStackFrameResponse, type OriginalStackFramesRequest, type OriginalStackFramesResponse, -} from './shared' -import { middlewareResponse } from './middleware-response' +} from '../../next-devtools/server/shared' +import { middlewareResponse } from '../../next-devtools/server/middleware-response' import fs, { constants as FS } from 'fs/promises' import path from 'path' import url from 'url' -import { launchEditor } from '../utils/launch-editor' +import { launchEditor } from '../../next-devtools/server/launch-editor' import type { StackFrame } from 'next/dist/compiled/stacktrace-parser' import { SourceMapConsumer, type BasicSourceMapConsumer, type NullableMappedPosition, } from 'next/dist/compiled/source-map08' -import type { Project, TurbopackStackFrame } from '../../../../build/swc/types' -import { getSourceMapFromFile } from '../utils/get-source-map-from-file' +import type { Project, TurbopackStackFrame } from '../../build/swc/types' +import { getSourceMapFromFile } from './get-source-map-from-file' import { findSourceMap, type SourceMapPayload } from 'node:module' import { pathToFileURL } from 'node:url' import { inspect } from 'node:util' diff --git a/packages/next/src/client/components/react-dev-overlay/server/middleware-webpack.ts b/packages/next/src/server/dev/middleware-webpack.ts similarity index 98% rename from packages/next/src/client/components/react-dev-overlay/server/middleware-webpack.ts rename to packages/next/src/server/dev/middleware-webpack.ts index 905218a3d80..202efa18040 100644 --- a/packages/next/src/client/components/react-dev-overlay/server/middleware-webpack.ts +++ b/packages/next/src/server/dev/middleware-webpack.ts @@ -7,16 +7,15 @@ import { type BasicSourceMapConsumer, } from 'next/dist/compiled/source-map08' import type { StackFrame } from 'next/dist/compiled/stacktrace-parser' -import { getSourceMapFromFile } from '../utils/get-source-map-from-file' -import { launchEditor } from '../utils/launch-editor' +import { getSourceMapFromFile } from './get-source-map-from-file' +import { launchEditor } from '../../next-devtools/server/launch-editor' import { getOriginalCodeFrame, type OriginalStackFrameResponse, type OriginalStackFramesRequest, type OriginalStackFramesResponse, -} from './shared' -import { middlewareResponse } from './middleware-response' -export { parseStack } from '../utils/parse-stack' +} from '../../next-devtools/server/shared' +import { middlewareResponse } from '../../next-devtools/server/middleware-response' export { getSourceMapFromFile } import type { IncomingMessage, ServerResponse } from 'http' @@ -25,7 +24,7 @@ import type { NullableMappedPosition, RawSourceMap, } from 'next/dist/compiled/source-map08' -import { formatFrameSourceFile } from '../utils/webpack-module-path' +import { formatFrameSourceFile } from '../../next-devtools/shared/webpack-module-path' import type { MappedPosition } from 'source-map' import { inspect } from 'util' diff --git a/packages/next/src/server/dev/next-dev-server.ts b/packages/next/src/server/dev/next-dev-server.ts index 2137b2f95cb..7988f5baa61 100644 --- a/packages/next/src/server/dev/next-dev-server.ts +++ b/packages/next/src/server/dev/next-dev-server.ts @@ -69,7 +69,7 @@ import type { ServerOnInstrumentationRequestError } from '../app-render/types' import type { ServerComponentsHmrCache } from '../response-cache' import { logRequests } from './log-requests' import { FallbackMode, fallbackModeToFallbackField } from '../../lib/fallback' -import type { PagesDevOverlayBridgeType } from '../../client/components/react-dev-overlay/pages/pages-dev-overlay-setup' +import type { PagesDevOverlayBridgeType } from '../../next-devtools/userspace/pages/pages-dev-overlay-setup' import { ensureInstrumentationRegistered, getInstrumentationModule, @@ -81,7 +81,7 @@ let PagesDevOverlayBridgeImpl: PagesDevOverlayBridgeType const ReactDevOverlay: PagesDevOverlayBridgeType = (props) => { if (PagesDevOverlayBridgeImpl === undefined) { PagesDevOverlayBridgeImpl = ( - require('../../client/components/react-dev-overlay/pages/pages-dev-overlay-setup') as typeof import('../../client/components/react-dev-overlay/pages/pages-dev-overlay-setup') + require('../../next-devtools/userspace/pages/pages-dev-overlay-setup') as typeof import('../../next-devtools/userspace/pages/pages-dev-overlay-setup') ).PagesDevOverlayBridge } return React.createElement(PagesDevOverlayBridgeImpl, props) diff --git a/packages/next/src/client/components/react-dev-overlay/utils/node-stack-frames.ts b/packages/next/src/server/dev/node-stack-frames.ts similarity index 97% rename from packages/next/src/client/components/react-dev-overlay/utils/node-stack-frames.ts rename to packages/next/src/server/dev/node-stack-frames.ts index 8be87c80f78..06852658018 100644 --- a/packages/next/src/client/components/react-dev-overlay/utils/node-stack-frames.ts +++ b/packages/next/src/server/dev/node-stack-frames.ts @@ -3,7 +3,7 @@ import type { StackFrame } from 'next/dist/compiled/stacktrace-parser' import { decorateServerError, type ErrorSourceType, -} from '../../../../shared/lib/error-source' +} from '../../shared/lib/error-source' function getFilesystemFrame(frame: StackFrame): StackFrame { const f: StackFrame = { ...frame } diff --git a/packages/next/src/client/components/react-dev-overlay/utils/parse-stack.ts b/packages/next/src/server/lib/parse-stack.ts similarity index 100% rename from packages/next/src/client/components/react-dev-overlay/utils/parse-stack.ts rename to packages/next/src/server/lib/parse-stack.ts diff --git a/packages/next/src/server/patch-error-inspect.ts b/packages/next/src/server/patch-error-inspect.ts index 8a11aab605a..39a01db10a1 100644 --- a/packages/next/src/server/patch-error-inspect.ts +++ b/packages/next/src/server/patch-error-inspect.ts @@ -7,8 +7,8 @@ import * as url from 'url' import type * as util from 'util' import { SourceMapConsumer as SyncSourceMapConsumer } from 'next/dist/compiled/source-map' import type { StackFrame } from 'next/dist/compiled/stacktrace-parser' -import { parseStack } from '../client/components/react-dev-overlay/server/middleware-webpack' -import { getOriginalCodeFrame } from '../client/components/react-dev-overlay/server/shared' +import { parseStack } from './lib/parse-stack' +import { getOriginalCodeFrame } from '../next-devtools/server/shared' import { workUnitAsyncStorage } from './app-render/work-unit-async-storage.external' import { dim } from '../lib/picocolors' diff --git a/packages/next/src/server/render.tsx b/packages/next/src/server/render.tsx index a2c231da051..03bab47bfef 100644 --- a/packages/next/src/server/render.tsx +++ b/packages/next/src/server/render.tsx @@ -103,7 +103,7 @@ import { ReflectAdapter } from './web/spec-extension/adapters/reflect' import { getCacheControlHeader } from './lib/cache-control' import { getErrorSource } from '../shared/lib/error-source' import type { DeepReadonly } from '../shared/lib/deep-readonly' -import type { PagesDevOverlayBridgeType } from '../client/components/react-dev-overlay/pages/pages-dev-overlay-setup' +import type { PagesDevOverlayBridgeType } from '../next-devtools/userspace/pages/pages-dev-overlay-setup' import { getScriptNonceFromHeader } from './app-render/get-script-nonce-from-header' let tryGetPreviewData: typeof import('./api-utils/node/try-get-preview-data').tryGetPreviewData diff --git a/packages/next/src/server/request-meta.ts b/packages/next/src/server/request-meta.ts index 6f572cef878..a3aa5966d2f 100644 --- a/packages/next/src/server/request-meta.ts +++ b/packages/next/src/server/request-meta.ts @@ -7,7 +7,7 @@ import type { CloneableBody } from './body-streams' import type { RouteMatch } from './route-matches/route-match' import type { NEXT_RSC_UNION_QUERY } from '../client/components/app-router-headers' import type { ServerComponentsHmrCache } from './response-cache' -import type { PagesDevOverlayBridgeType } from '../client/components/react-dev-overlay/pages/pages-dev-overlay-setup' +import type { PagesDevOverlayBridgeType } from '../next-devtools/userspace/pages/pages-dev-overlay-setup' // FIXME: (wyattjoh) this is a temporary solution to allow us to pass data between bundled modules export const NEXT_REQUEST_META = Symbol.for('NextInternalRequestMeta') diff --git a/packages/next/src/server/web/globals.ts b/packages/next/src/server/web/globals.ts index 336a963c79a..c8bbe56d741 100644 --- a/packages/next/src/server/web/globals.ts +++ b/packages/next/src/server/web/globals.ts @@ -55,7 +55,7 @@ export function ensureInstrumentationRegistered() { } function getUnsupportedModuleErrorMessage(module: string) { - // warning: if you change these messages, you must adjust how react-dev-overlay's middleware detects modules not found + // warning: if you change these messages, you must adjust how dev-overlay's middleware detects modules not found return `The edge runtime does not support Node.js '${module}' module. Learn More: https://nextjs.org/docs/messages/node-module-in-edge-runtime` } diff --git a/packages/next/src/server/web/sandbox/context.ts b/packages/next/src/server/web/sandbox/context.ts index 81d90a4e249..a5f64fb9747 100644 --- a/packages/next/src/server/web/sandbox/context.ts +++ b/packages/next/src/server/web/sandbox/context.ts @@ -33,12 +33,12 @@ interface ModuleContext { warnedEvals: Set } -let getServerError: typeof import('../../../client/components/react-dev-overlay/utils/node-stack-frames').getServerError +let getServerError: typeof import('../../dev/node-stack-frames').getServerError let decorateServerError: typeof import('../../../shared/lib/error-source').decorateServerError if (process.env.NODE_ENV === 'development') { getServerError = ( - require('../../../client/components/react-dev-overlay/utils/node-stack-frames') as typeof import('../../../client/components/react-dev-overlay/utils/node-stack-frames') as typeof import('../../../client/components/react-dev-overlay/utils/node-stack-frames') + require('../../dev/node-stack-frames') as typeof import('../../dev/node-stack-frames') as typeof import('../../dev/node-stack-frames') ).getServerError decorateServerError = ( require('../../../shared/lib/error-source') as typeof import('../../../shared/lib/error-source') diff --git a/packages/next/src/server/web/sandbox/sandbox.ts b/packages/next/src/server/web/sandbox/sandbox.ts index 921039fcfef..e33fd7853d3 100644 --- a/packages/next/src/server/web/sandbox/sandbox.ts +++ b/packages/next/src/server/web/sandbox/sandbox.ts @@ -44,7 +44,7 @@ type RunnerFn = (params: RunnerFnParams) => Promise function withTaggedErrors(fn: RunnerFn): RunnerFn { if (process.env.NODE_ENV === 'development') { const { getServerError } = - require('../../../client/components/react-dev-overlay/utils/node-stack-frames') as typeof import('../../../client/components/react-dev-overlay/utils/node-stack-frames') + require('../../dev/node-stack-frames') as typeof import('../../dev/node-stack-frames') return (params) => fn(params) diff --git a/packages/next/src/client/components/react-dev-overlay/utils/format-webpack-messages.ts b/packages/next/src/shared/lib/format-webpack-messages.ts similarity index 100% rename from packages/next/src/client/components/react-dev-overlay/utils/format-webpack-messages.ts rename to packages/next/src/shared/lib/format-webpack-messages.ts diff --git a/packages/next/taskfile.js b/packages/next/taskfile.js index e9afcada946..37cc70a9a38 100644 --- a/packages/next/taskfile.js +++ b/packages/next/taskfile.js @@ -2579,6 +2579,13 @@ export async function next_compile(task, opts) { 'nextbuildstatic', 'nextbuildstatic_esm', 'nextbuild_esm', + 'next_devtools_entrypoint', + 'next_devtools_server', + 'next_devtools_server_esm', + 'next_devtools_shared', + 'next_devtools_shared_esm', + 'next_devtools_userspace', + 'next_devtools_userspace_esm', 'pages', 'pages_esm', 'lib', @@ -2720,6 +2727,67 @@ export async function client_esm(task, opts) { .target('dist/esm/client') } +export async function next_devtools_entrypoint(task, opts) { + await task + .source('src/next-devtools/dev-overlay.shim.ts') + .swc('client', { dev: opts.dev, interopClientDefaultExport: true }) + .target('dist/next-devtools') +} + +export async function next_devtools_server(task, opts) { + await task + .source( + 'src/next-devtools/server/**/!(*.test|*.stories).+(js|ts|tsx|woff2)' + ) + .swc('client', { dev: opts.dev, interopClientDefaultExport: true }) + .target('dist/next-devtools/server') +} + +export async function next_devtools_server_esm(task, opts) { + await task + .source( + 'src/next-devtools/server/**/!(*.test|*.stories).+(js|ts|tsx|woff2)' + ) + .swc('client', { dev: opts.dev, esm: true }) + .target('dist/esm/next-devtools/server') +} + +export async function next_devtools_shared(task, opts) { + await task + .source( + 'src/next-devtools/shared/**/!(*.test|*.stories).+(js|ts|tsx|woff2)' + ) + .swc('client', { dev: opts.dev, interopClientDefaultExport: true }) + .target('dist/next-devtools/shared') +} + +export async function next_devtools_shared_esm(task, opts) { + await task + .source( + 'src/next-devtools/shared/**/!(*.test|*.stories).+(js|ts|tsx|woff2)' + ) + .swc('client', { dev: opts.dev, esm: true }) + .target('dist/esm/next-devtools/shared') +} + +export async function next_devtools_userspace(task, opts) { + await task + .source( + 'src/next-devtools/userspace/**/!(*.test|*.stories).+(js|ts|tsx|woff2)' + ) + .swc('client', { dev: opts.dev, interopClientDefaultExport: true }) + .target('dist/next-devtools/userspace') +} + +export async function next_devtools_userspace_esm(task, opts) { + await task + .source( + 'src/next-devtools/userspace/**/!(*.test|*.stories).+(js|ts|tsx|woff2)' + ) + .swc('client', { dev: opts.dev, esm: true }) + .target('dist/esm/next-devtools/userspace') +} + // export is a reserved keyword for functions export async function nextbuildstatic(task, opts) { await task @@ -2884,6 +2952,19 @@ export default async function (task) { ['nextbuild', 'nextbuild_esm', 'nextbuildjest'], opts ) + await task.watch( + 'src/next-devtools', + [ + 'next_devtools_entrypoint', + 'next_devtools_server', + 'next_devtools_server_esm', + 'next_devtools_shared', + 'next_devtools_shared_esm', + 'next_devtools_userspace', + 'next_devtools_userspace_esm', + ], + opts + ) await task.watch('src/experimental/testing', 'experimental_testing', opts) await task.watch('src/experimental/testmode', 'experimental_testmode', opts) await task.watch('src/export', 'nextbuildstatic', opts) diff --git a/packages/next/test-runner-jest.config.js b/packages/next/test-runner-jest.config.js index ceb3e8ffbf6..c68e9dd387c 100644 --- a/packages/next/test-runner-jest.config.js +++ b/packages/next/test-runner-jest.config.js @@ -13,6 +13,6 @@ module.exports = { * to merge testRunnerConfig properties with your own * @see https://jestjs.io/docs/configuration */ - rootDir: '/../src/client/components/react-dev-overlay/', + rootDir: '/../src/next-devtools/dev-overlay/', testMatch: ['**/*.stories.tsx', '**/*.test.tsx'], } diff --git a/packages/next/tsconfig.json b/packages/next/tsconfig.json index adecb564e15..454c1b70927 100644 --- a/packages/next/tsconfig.json +++ b/packages/next/tsconfig.json @@ -27,7 +27,7 @@ // TODO: Enable types by telling Turbopack to ignore this alias. // tsconfig#paths are for type locations not source locations. // "next/dist/compiled/next-devtools": [ - // "./src/client/components/react-dev-overlay/entrypoint.d.ts" + // "./src/next-devtools/entrypoint.ts" // ], "next/dist/shared/lib/image-loader": ["./src/shared/lib/image-loader.ts"] } diff --git a/test/production/app-dir/browser-chunks/browser-chunks.test.ts b/test/production/app-dir/browser-chunks/browser-chunks.test.ts index d020a4a4cc3..7c661e528d8 100644 --- a/test/production/app-dir/browser-chunks/browser-chunks.test.ts +++ b/test/production/app-dir/browser-chunks/browser-chunks.test.ts @@ -22,7 +22,8 @@ describe('browser-chunks', () => { (source) => /webpack:\/\/_N_E\/(\.\.\/)*src\/server\//.test(source) || source.includes('next/dist/esm/server') || - source.includes('next/dist/server') + source.includes('next/dist/server') || + source.includes('next-devtools/server') ) if (serverSources.length > 0) { @@ -36,35 +37,7 @@ describe('browser-chunks', () => { it('must not bundle any dev overlay into browser chunks', () => { const devOverlaySources = sources.filter((source) => { - return ( - (/webpack:\/\/_N_E\/(\.\.\/)*src\/client\/components\/react-dev-overlay\//.test( - source - ) || - /next\/dist\/(esm\/)?client\/components\/react-dev-overlay/.test( - source - )) && - !( - // This is not dev-overlay frontend code. - // TODO: Move code into dedicated folder to make distinction clearer. - ( - source.endsWith( - 'client/components/react-dev-overlay/app/errors/use-error-handler.ts' - ) || - source.endsWith( - 'client/components/react-dev-overlay/app/errors/stitched-error.ts' - ) || - source.endsWith( - 'client/components/react-dev-overlay/app/app-dev-overlay-setup.ts' - ) || - source.endsWith( - 'client/components/react-dev-overlay/app/errors/console-error.ts' - ) || - source.endsWith( - 'client/components/react-dev-overlay/app/errors/intercept-console-error.ts' - ) - ) - ) - ) + return source.includes('next-devtools/dev-overlay') }) if (devOverlaySources.length > 0) { diff --git a/tsec-exemptions.json b/tsec-exemptions.json index 65baa44de7d..1b56b16ed3b 100644 --- a/tsec-exemptions.json +++ b/tsec-exemptions.json @@ -16,7 +16,7 @@ "packages/next/src/client/components/errors/graceful-degrade-boundary.tsx" ], "ban-script-appendchild-calls": [ - "packages/next/src/client/components/react-dev-overlay/dev-overlay.browser.tsx" + "packages/next/src/next-devtools/dev-overlay.browser.tsx" ], "ban-script-content-assignments": ["packages/next/src/client/script.tsx"], "ban-script-src-assignments": [