diff --git a/packages/next/src/server/lib/router-utils/setup-dev.ts b/packages/next/src/server/lib/router-utils/setup-dev.ts
index 7886b0aaf9f46..16d122ee81664 100644
--- a/packages/next/src/server/lib/router-utils/setup-dev.ts
+++ b/packages/next/src/server/lib/router-utils/setup-dev.ts
@@ -47,6 +47,7 @@ import { normalizePathSep } from '../../../shared/lib/page-path/normalize-path-s
 import { createClientRouterFilter } from '../../../lib/create-client-router-filter'
 import { absolutePathToPage } from '../../../shared/lib/page-path/absolute-path-to-page'
 import { generateInterceptionRoutesRewrites } from '../../../lib/generate-interception-routes-rewrites'
+import { OutputState, store as consoleStore } from '../../../build/output/store'
 
 import {
   APP_BUILD_MANIFEST,
@@ -336,6 +337,8 @@ async function startWatcher(opts: SetupOpts) {
       )
     }
 
+    const buildingReported = new Set<string>()
+
     async function changeSubscription(
       page: string,
       endpoint: Endpoint | undefined,
@@ -744,13 +747,13 @@ async function startWatcher(opts: SetupOpts) {
                 break
               }
 
+              case 'span-end':
               case 'client-error': // { errorCount, clientId }
               case 'client-warning': // { warningCount, clientId }
               case 'client-success': // { clientId }
               case 'server-component-reload-page': // { clientId }
               case 'client-reload-page': // { clientId }
               case 'client-full-reload': // { stackTrace, hadRuntimeError }
-              case 'span-end': // { startTime, endTime, spanName, attributes }
                 // TODO
                 break
 
@@ -772,9 +775,10 @@ async function startWatcher(opts: SetupOpts) {
                 break
 
               default:
-                // Might have been a Next.js message...
                 if (!parsedData.event) {
-                  throw new Error(`unrecognized Turbopack message "${data}"`)
+                  throw new Error(
+                    `unrecognized Turbopack HMR message "${data}"`
+                  )
                 }
             }
           })
@@ -861,6 +865,35 @@ async function startWatcher(opts: SetupOpts) {
           throw new PageNotFoundError(`route not found ${page}`)
         }
 
+        if (!buildingReported.has(page)) {
+          buildingReported.add(page)
+          let suffix
+          switch (route.type) {
+            case 'app-page':
+              suffix = 'page'
+              break
+            case 'app-route':
+              suffix = 'route'
+              break
+            case 'page':
+            case 'page-api':
+              suffix = ''
+              break
+            default:
+              throw new Error('Unexpected route type ' + route.type)
+          }
+
+          consoleStore.setState(
+            {
+              loading: true,
+              trigger: `${page}${
+                !page.endsWith('/') && suffix.length > 0 ? '/' : ''
+              }${suffix} (client and server)`,
+            } as OutputState,
+            true
+          )
+        }
+
         switch (route.type) {
           case 'page': {
             if (isApp) {
@@ -870,6 +903,7 @@ async function startWatcher(opts: SetupOpts) {
             }
 
             await processResult('_app', await globalEntries.app?.writeToDisk())
+
             await loadBuildManifest('_app')
             await loadPagesManifest('_app')
 
@@ -877,6 +911,7 @@ async function startWatcher(opts: SetupOpts) {
               '_document',
               await globalEntries.document?.writeToDisk()
             )
+
             changeSubscription('_document', globalEntries?.document, () => {
               return { action: 'reloadPage' }
             })
@@ -886,7 +921,8 @@ async function startWatcher(opts: SetupOpts) {
               page,
               await route.htmlEndpoint.writeToDisk()
             )
-            changeSubscription(page, route.dataEndpoint, (pageName, change) => {
+
+            changeSubscription(page, route.htmlEndpoint, (pageName, change) => {
               switch (change) {
                 case ServerClientChangeType.Server:
                 case ServerClientChangeType.Both:
@@ -939,7 +975,8 @@ async function startWatcher(opts: SetupOpts) {
           }
           case 'app-page': {
             await processResult(page, await route.htmlEndpoint.writeToDisk())
-            changeSubscription(page, route.rscEndpoint, (_page, change) => {
+
+            changeSubscription(page, route.htmlEndpoint, (_page, change) => {
               switch (change) {
                 case ServerClientChangeType.Server:
                 case ServerClientChangeType.Both:
@@ -984,6 +1021,14 @@ async function startWatcher(opts: SetupOpts) {
             throw new Error(`unknown route type ${route.type} for ${page}`)
           }
         }
+
+        consoleStore.setState(
+          {
+            loading: false,
+            partial: 'client and server',
+          } as OutputState,
+          true
+        )
       },
     }