Rename reload to refresh in new router (#41448)

Renames `router.reload` to `router.refresh` to better reflect that it refreshes the rendered page instead of being a blank slate.


## Bug

- [ ] Related issues linked using `fixes #number`
- [ ] Integration tests added
- [ ] Errors have a helpful link attached, see `contributing.md`

## Feature

- [ ] Implements an existing feature request or RFC. Make sure the feature request has been accepted for implementation before opening a PR.
- [ ] Related issues linked using `fixes #number`
- [ ] Integration tests added
- [ ] Documentation added
- [ ] Telemetry added. In case of a feature if it's used or not.
- [ ] Errors have a helpful link attached, see `contributing.md`

## Documentation / Examples

- [ ] Make sure the linting passes by running `pnpm lint`
- [ ] The "examples guidelines" are followed from [our contributing doc](https://github.com/vercel/next.js/blob/canary/contributing/examples/adding-examples.md)

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

@@ -16,7 +16,7 @@ import type { FlightRouterState, FlightData } from '../../server/app-render'
 import {
   ACTION_NAVIGATE,
   ACTION_PREFETCH,
-  ACTION_RELOAD,
+  ACTION_REFRESH,
   ACTION_RESTORE,
   ACTION_SERVER_PATCH,
   reducer,
@@ -245,11 +245,11 @@ function Router({
           navigate(href, 'push', Boolean(options.forceOptimisticNavigation))
         })
       },
-      reload: () => {
+      refresh: () => {
         // @ts-ignore startTransition exists
         React.startTransition(() => {
           dispatch({
-            type: ACTION_RELOAD,
+            type: ACTION_REFRESH,
 
             // TODO-APP: revisit if this needs to be passed.
             cache: {

packages/next/client/components/react-dev-overlay/hot-reloader.tsx

@@ -343,7 +343,7 @@ function processMessage(
         return window.location.reload()
       }
       startTransition(() => {
-        router.reload()
+        router.refresh()
         onRefresh(dispatch)
       })
 

packages/next/client/components/reducer.ts

@@ -501,19 +501,19 @@ export type FocusAndScrollRef = {
   apply: boolean
 }
 
-export const ACTION_RELOAD = 'reload'
+export const ACTION_REFRESH = 'refresh'
 export const ACTION_NAVIGATE = 'navigate'
 export const ACTION_RESTORE = 'restore'
 export const ACTION_SERVER_PATCH = 'server-patch'
 export const ACTION_PREFETCH = 'prefetch'
 
 /**
- * Reload triggers a reload of the full page data.
+ * Refresh triggers a refresh of the full page data.
  * - fetches the Flight data and fills subTreeData at the root of the cache.
  * - The router state is updated at the root of the state tree.
  */
-interface ReloadAction {
-  type: typeof ACTION_RELOAD
+interface RefreshAction {
+  type: typeof ACTION_REFRESH
   cache: CacheNode
   mutable: {
     previousTree?: FlightRouterState
@@ -656,7 +656,7 @@ type AppRouterState = {
 function clientReducer(
   state: Readonly<AppRouterState>,
   action: Readonly<
-    | ReloadAction
+    | RefreshAction
     | NavigateAction
     | RestoreAction
     | ServerPatchAction
@@ -1009,7 +1009,7 @@ function clientReducer(
         tree: tree,
       }
     }
-    case ACTION_RELOAD: {
+    case ACTION_REFRESH: {
       const { cache, mutable } = action
       const href = state.canonicalUrl
 
@@ -1068,7 +1068,7 @@ function clientReducer(
       // FlightDataPath with more than two items means unexpected Flight data was returned
       if (flightDataPath.length !== 2) {
         // TODO-APP: handle this case better
-        console.log('RELOAD FAILED')
+        console.log('REFRESH FAILED')
         return state
       }
 
@@ -1172,7 +1172,7 @@ function clientReducer(
 function serverReducer(
   state: Readonly<AppRouterState>,
   _action: Readonly<
-    | ReloadAction
+    | RefreshAction
     | NavigateAction
     | RestoreAction
     | ServerPatchAction

packages/next/shared/lib/app-router-context.ts

@@ -30,21 +30,21 @@ interface NavigateOptions {
 
 export interface AppRouterInstance {
   /**
-   * Reload the current page. Fetches new data from the server.
+   * Refresh the current page.
    */
-  reload(): void
+  refresh(): void
   /**
-   * Hard navigate to the provided href. Fetches new data from the server.
+   * Navigate to the provided href.
    * Pushes a new history entry.
    */
   push(href: string, options?: NavigateOptions): void
   /**
-   * Hard navigate to the provided href. Does not fetch data from the server if it was already fetched.
+   * Navigate to the provided href.
    * Replaces the current history entry.
    */
   replace(href: string, options?: NavigateOptions): void
   /**
-   * Soft prefetch the provided href. Does not fetch data from the server if it was already fetched.
+   * Prefetch the provided href.
    */
   prefetch(href: string): void
 }

test/e2e/app-dir/app/app/navigation/link.js

@@ -17,7 +17,7 @@ export default function HardLink({ href, children, ...props }) {
         e.preventDefault()
         React.startTransition(() => {
           router.push(href)
-          router.reload()
+          router.refresh()
         })
       }}
     >