Refactor app-render to decouple type definitions (#47128

packages/next/src/client/components/app-router-announcer.tsx

@@ -1,6 +1,6 @@
 import { useEffect, useRef, useState } from 'react'
 import { createPortal } from 'react-dom'
-import type { FlightRouterState } from '../../server/app-render'
+import type { FlightRouterState } from '../../server/app-render/types'
 
 const ANNOUNCER_TYPE = 'next-route-announcer'
 const ANNOUNCER_ID = '__next-route-announcer__'

packages/next/src/client/components/app-router.tsx

@@ -12,7 +12,10 @@ import type {
   CacheNode,
   AppRouterInstance,
 } from '../../shared/lib/app-router-context'
-import type { FlightRouterState, FlightData } from '../../server/app-render'
+import type {
+  FlightRouterState,
+  FlightData,
+} from '../../server/app-render/types'
 import type { ErrorComponent } from './error-boundary'
 import { reducer } from './router-reducer/router-reducer'
 import {

packages/next/src/client/components/layout-router.tsx

@@ -8,7 +8,7 @@ import type {
   FlightRouterState,
   FlightSegmentPath,
   ChildProp,
-} from '../../server/app-render'
+} from '../../server/app-render/types'
 import type { ErrorComponent } from './error-boundary'
 import { FocusAndScrollRef } from './router-reducer/router-reducer-types'
 

packages/next/src/client/components/match-segments.ts

@@ -1,4 +1,4 @@
-import type { Segment } from '../../server/app-render'
+import type { Segment } from '../../server/app-render/types'
 
 export const matchSegment = (
   existingSegment: Segment,

packages/next/src/client/components/navigation.ts

@@ -1,7 +1,7 @@
 // useLayoutSegments() // Only the segments for the current place. ['children', 'dashboard', 'children', 'integrations'] -> /dashboard/integrations (/dashboard/layout.js would get ['children', 'dashboard', 'children', 'integrations'])
 
 import { useContext, useMemo } from 'react'
-import type { FlightRouterState } from '../../server/app-render'
+import type { FlightRouterState } from '../../server/app-render/types'
 import {
   AppRouterContext,
   LayoutRouterContext,

packages/next/src/client/components/request-async-storage.ts

@@ -1,9 +1,7 @@
 import type { AsyncLocalStorage } from 'async_hooks'
 import { PreviewData } from '../../../types'
-import type {
-  ReadonlyHeaders,
-  ReadonlyRequestCookies,
-} from '../../server/app-render'
+import type { ReadonlyHeaders } from '../../server/app-render/readonly-headers'
+import type { ReadonlyRequestCookies } from '../../server/app-render/readonly-request-cookies'
 import { createAsyncLocalStorage } from './async-local-storage'
 
 export interface RequestStore {

packages/next/src/client/components/router-reducer/apply-router-state-patch-to-tree.test.tsx

@@ -1,5 +1,8 @@
 import React from 'react'
-import type { FlightData, FlightRouterState } from '../../../server/app-render'
+import type {
+  FlightData,
+  FlightRouterState,
+} from '../../../server/app-render/types'
 import { applyRouterStatePatchToTree } from './apply-router-state-patch-to-tree'
 
 const getInitialRouterStateTree = (): FlightRouterState => [

packages/next/src/client/components/router-reducer/apply-router-state-patch-to-tree.ts

@@ -1,7 +1,7 @@
 import type {
   FlightRouterState,
   FlightSegmentPath,
-} from '../../../server/app-render'
+} from '../../../server/app-render/types'
 import { matchSegment } from '../match-segments'
 
 /**

packages/next/src/client/components/router-reducer/create-initial-router-state.test.tsx

@@ -1,5 +1,5 @@
 import React from 'react'
-import { FlightRouterState } from '../../../server/app-render'
+import type { FlightRouterState } from '../../../server/app-render/types'
 import { CacheNode, CacheStates } from '../../../shared/lib/app-router-context'
 import { createInitialRouterState } from './create-initial-router-state'
 

packages/next/src/client/components/router-reducer/create-initial-router-state.ts

@@ -1,6 +1,6 @@
 import type { ReactNode } from 'react'
 import type { CacheNode } from '../../../shared/lib/app-router-context'
-import type { FlightRouterState } from '../../../server/app-render'
+import type { FlightRouterState } from '../../../server/app-render/types'
 
 import { CacheStates } from '../../../shared/lib/app-router-context'
 import { createHrefFromUrl } from './create-href-from-url'

packages/next/src/client/components/router-reducer/create-optimistic-tree.test.ts

@@ -1,5 +1,5 @@
 import { createOptimisticTree } from './create-optimistic-tree'
-import type { FlightRouterState } from '../../../server/app-render'
+import type { FlightRouterState } from '../../../server/app-render/types'
 
 const getInitialRouterStateTree = (): FlightRouterState => [
   '',

packages/next/src/client/components/router-reducer/create-optimistic-tree.ts

@@ -1,4 +1,4 @@
-import type { FlightRouterState } from '../../../server/app-render'
+import type { FlightRouterState } from '../../../server/app-render/types'
 import { matchSegment } from '../match-segments'
 
 /**

packages/next/src/client/components/router-reducer/fetch-server-response.ts

@@ -1,7 +1,10 @@
 'use client'
 
 import { createFromFetch } from 'next/dist/compiled/react-server-dom-webpack/client'
-import type { FlightRouterState, FlightData } from '../../../server/app-render'
+import type {
+  FlightRouterState,
+  FlightData,
+} from '../../../server/app-render/types'
 import {
   NEXT_ROUTER_PREFETCH,
   NEXT_ROUTER_STATE_TREE,

packages/next/src/client/components/router-reducer/fill-cache-with-new-subtree-data.test.tsx

@@ -1,7 +1,7 @@
 import React from 'react'
 import { fillCacheWithNewSubTreeData } from './fill-cache-with-new-subtree-data'
 import { CacheStates, CacheNode } from '../../../shared/lib/app-router-context'
-import { FlightData } from '../../../server/app-render'
+import type { FlightData } from '../../../server/app-render/types'
 
 const getFlightData = (): FlightData => {
   return [

packages/next/src/client/components/router-reducer/fill-cache-with-new-subtree-data.ts

@@ -1,5 +1,5 @@
 import { CacheNode, CacheStates } from '../../../shared/lib/app-router-context'
-import type { FlightDataPath } from '../../../server/app-render'
+import type { FlightDataPath } from '../../../server/app-render/types'
 import { invalidateCacheByRouterState } from './invalidate-cache-by-router-state'
 import { fillLazyItemsTillLeafWithHead } from './fill-lazy-items-till-leaf-with-head'
 

packages/next/src/client/components/router-reducer/fill-lazy-items-till-leaf-with-head.test.tsx

@@ -1,7 +1,7 @@
 import React from 'react'
 import { fillLazyItemsTillLeafWithHead } from './fill-lazy-items-till-leaf-with-head'
 import { CacheStates, CacheNode } from '../../../shared/lib/app-router-context'
-import { FlightData } from '../../../server/app-render'
+import type { FlightData } from '../../../server/app-render/types'
 
 const getFlightData = (): FlightData => {
   return [

packages/next/src/client/components/router-reducer/fill-lazy-items-till-leaf-with-head.ts

@@ -1,5 +1,5 @@
 import { CacheNode, CacheStates } from '../../../shared/lib/app-router-context'
-import type { FlightRouterState } from '../../../server/app-render'
+import type { FlightRouterState } from '../../../server/app-render/types'
 
 export function fillLazyItemsTillLeafWithHead(
   newCache: CacheNode,

packages/next/src/client/components/router-reducer/invalidate-cache-below-flight-segmentpath.test.tsx

@@ -1,5 +1,5 @@
 import React from 'react'
-import type { FlightData } from '../../../server/app-render'
+import type { FlightData } from '../../../server/app-render/types'
 import { invalidateCacheBelowFlightSegmentPath } from './invalidate-cache-below-flight-segmentpath'
 import { CacheStates, CacheNode } from '../../../shared/lib/app-router-context'
 import { fillCacheWithNewSubTreeData } from './fill-cache-with-new-subtree-data'

packages/next/src/client/components/router-reducer/invalidate-cache-below-flight-segmentpath.ts

@@ -1,5 +1,5 @@
 import type { CacheNode } from '../../../shared/lib/app-router-context'
-import type { FlightSegmentPath } from '../../../server/app-render'
+import type { FlightSegmentPath } from '../../../server/app-render/types'
 
 /**
  * Fill cache up to the end of the flightSegmentPath, invalidating anything below it.

packages/next/src/client/components/router-reducer/invalidate-cache-by-router-state.test.tsx

@@ -1,7 +1,7 @@
 import React from 'react'
 import { invalidateCacheByRouterState } from './invalidate-cache-by-router-state'
 import { CacheStates, CacheNode } from '../../../shared/lib/app-router-context'
-import { FlightRouterState } from '../../../server/app-render'
+import type { FlightRouterState } from '../../../server/app-render/types'
 
 describe('invalidateCacheByRouterState', () => {
   it('should invalidate the cache by router state', () => {

packages/next/src/client/components/router-reducer/invalidate-cache-by-router-state.ts

@@ -1,5 +1,5 @@
 import type { CacheNode } from '../../../shared/lib/app-router-context'
-import type { FlightRouterState } from '../../../server/app-render'
+import type { FlightRouterState } from '../../../server/app-render/types'
 
 /**
  * Invalidate cache one level down from the router state.

packages/next/src/client/components/router-reducer/is-navigating-to-new-root-layout.test.ts

@@ -1,4 +1,4 @@
-import type { FlightRouterState } from '../../../server/app-render'
+import type { FlightRouterState } from '../../../server/app-render/types'
 import { isNavigatingToNewRootLayout } from './is-navigating-to-new-root-layout'
 
 describe('shouldHardNavigate', () => {

packages/next/src/client/components/router-reducer/is-navigating-to-new-root-layout.ts

@@ -1,4 +1,4 @@
-import type { FlightRouterState } from '../../../server/app-render'
+import type { FlightRouterState } from '../../../server/app-render/types'
 
 export function isNavigatingToNewRootLayout(
   currentTree: FlightRouterState,

packages/next/src/client/components/router-reducer/reducers/find-head-in-cache.test.tsx

@@ -1,5 +1,5 @@
 import React from 'react'
-import { FlightRouterState } from '../../../../server/app-render'
+import type { FlightRouterState } from '../../../../server/app-render/types'
 import {
   CacheNode,
   CacheStates,

packages/next/src/client/components/router-reducer/reducers/find-head-in-cache.ts

@@ -1,4 +1,4 @@
-import type { FlightRouterState } from '../../../../server/app-render'
+import type { FlightRouterState } from '../../../../server/app-render/types'
 import type { ChildSegmentMap } from '../../../../shared/lib/app-router-context'
 
 export function findHeadInCache(

packages/next/src/client/components/router-reducer/reducers/navigate-reducer.test.tsx

@@ -1,6 +1,6 @@
 import React from 'react'
 import type { fetchServerResponse as fetchServerResponseType } from '../fetch-server-response'
-import type { FlightData } from '../../../../server/app-render'
+import type { FlightData } from '../../../../server/app-render/types'
 const flightData: FlightData = [
   [
     'children',
@@ -68,7 +68,7 @@ jest.mock('../fetch-server-response', () => {
     },
   }
 })
-import { FlightRouterState } from '../../../../server/app-render'
+import { FlightRouterState } from '../../../../server/app-render/types'
 import {
   CacheNode,
   CacheStates,

packages/next/src/client/components/router-reducer/reducers/navigate-reducer.ts

@@ -5,7 +5,7 @@ import {
 import type {
   FlightDataPath,
   FlightSegmentPath,
-} from '../../../../server/app-render'
+} from '../../../../server/app-render/types'
 import { fetchServerResponse } from '../fetch-server-response'
 import { createRecordFromThenable } from '../create-record-from-thenable'
 import { readRecordValue } from '../read-record-value'

packages/next/src/client/components/router-reducer/reducers/prefetch-reducer.test.tsx

@@ -1,6 +1,6 @@
 import React from 'react'
 import type { fetchServerResponse as fetchServerResponseType } from '../fetch-server-response'
-import type { FlightData } from '../../../../server/app-render'
+import type { FlightData } from '../../../../server/app-render/types'
 jest.mock('../fetch-server-response', () => {
   const flightData: FlightData = [
     [
@@ -32,7 +32,7 @@ jest.mock('../fetch-server-response', () => {
     },
   }
 })
-import { FlightRouterState } from '../../../../server/app-render'
+import { FlightRouterState } from '../../../../server/app-render/types'
 import {
   CacheNode,
   CacheStates,

packages/next/src/client/components/router-reducer/reducers/refresh-reducer.test.tsx

@@ -1,6 +1,6 @@
 import React from 'react'
 import type { fetchServerResponse } from '../fetch-server-response'
-import type { FlightData } from '../../../../server/app-render'
+import type { FlightData } from '../../../../server/app-render/types'
 jest.mock('../fetch-server-response', () => {
   const flightData: FlightData = [
     [
@@ -39,7 +39,7 @@ jest.mock('../fetch-server-response', () => {
     },
   }
 })
-import { FlightRouterState } from '../../../../server/app-render'
+import { FlightRouterState } from '../../../../server/app-render/types'
 import {
   CacheNode,
   CacheStates,

packages/next/src/client/components/router-reducer/reducers/restore-reducer.test.tsx

@@ -1,5 +1,5 @@
 import React from 'react'
-import { FlightRouterState } from '../../../../server/app-render'
+import type { FlightRouterState } from '../../../../server/app-render/types'
 import {
   CacheNode,
   CacheStates,

packages/next/src/client/components/router-reducer/reducers/server-patch-reducer.test.tsx

@@ -3,7 +3,7 @@ import type { fetchServerResponse as fetchServerResponseType } from '../fetch-se
 import type {
   FlightData,
   FlightRouterState,
-} from '../../../../server/app-render'
+} from '../../../../server/app-render/types'
 jest.mock('../fetch-server-response', () => {
   const flightData: FlightData = [
     [

packages/next/src/client/components/router-reducer/router-reducer-types.ts

@@ -1,5 +1,8 @@
 import type { CacheNode } from '../../../shared/lib/app-router-context'
-import type { FlightRouterState, FlightData } from '../../../server/app-render'
+import type {
+  FlightRouterState,
+  FlightData,
+} from '../../../server/app-render/types'
 import { fetchServerResponse } from './fetch-server-response'
 
 export const ACTION_REFRESH = 'refresh'

packages/next/src/client/components/router-reducer/should-hard-navigate.test.tsx

@@ -1,5 +1,8 @@
 import React from 'react'
-import type { FlightData, FlightRouterState } from '../../../server/app-render'
+import type {
+  FlightData,
+  FlightRouterState,
+} from '../../../server/app-render/types'
 import { shouldHardNavigate } from './should-hard-navigate'
 
 describe('shouldHardNavigate', () => {

packages/next/src/client/components/router-reducer/should-hard-navigate.ts

@@ -2,7 +2,7 @@ import type {
   FlightRouterState,
   FlightDataPath,
   Segment,
-} from '../../../server/app-render'
+} from '../../../server/app-render/types'
 import { matchSegment } from '../match-segments'
 
 // TODO-APP: flightSegmentPath will be empty in case of static response, needs to be handled.