@wular/pnext 0.0.4 → 0.0.7

package/src/compat/lifecycle/error-funnel.ts

@@ -8,23 +8,23 @@
 // Dedupe: the same request may surface an error at both the render site and the top-level catch, so a
 // per-work-unit flag ensures the user hook fires exactly once.
 
-import { getWorkUnit } from '../../request/context';
-import { getRequestRuntime } from '../../routing/request-runtime';
-import { selectRouteForRequest } from '../../routing/routes';
-import path from 'node:path';
-import type { RouteManifestEntry } from '../../types';
-import type { RequestErrorContext, RequestErrorInfo } from '../../extensions';
+import { getWorkUnit } from '../../request/context'
+import { getRequestRuntime } from '../../routing/request-environment'
+import { selectRouteForRequest } from '../../routing/routes'
+import path from 'node:path'
+import type { RouteManifestEntry } from '../../types'
+import type { RequestErrorContext, RequestErrorInfo } from '../../extensions'
 import {
   isForbiddenError,
   isNotFoundError,
   isRedirectError,
   isUnauthorizedError,
-} from '../../api/navigation';
-import { isPostpone } from '../../ppr';
-import { markErrorLogged } from '../../utils/error-log';
-import { getUserOnRequestError, instrumentationReady } from './instrumentation';
+} from '../../api/navigation'
+import { isPostpone } from '../../render/ppr'
+import { markErrorLogged } from '../../utils/error-log'
+import { getUserOnRequestError, instrumentationReady } from './instrumentation'
 
-const ERROR_REPORTED_KEY = Symbol.for('pnext.errorReported');
+const ERROR_REPORTED_KEY = Symbol.for('pnext.errorReported')
 
 /** True for Next control-flow errors that must NOT be reported to the hook. */
 function isControlFlowError(error: unknown): boolean {
@@ -35,16 +35,16 @@ function isControlFlowError(error: unknown): boolean {
     isUnauthorizedError(error) ||
     isPostpone(error) ||
     isNextDynamicNoSsr(error)
-  );
+  )
 }
 
 /** next/dynamic ssr:false bailout digest (skip-next-internal-error asserts skip). */
 function isNextDynamicNoSsr(error: unknown): boolean {
-  const digest = (error as { digest?: unknown } | null | undefined)?.digest;
+  const digest = (error as { digest?: unknown } | null | undefined)?.digest
   return (
     digest === 'NEXT_DYNAMIC_NO_SSR_CODE' ||
     (typeof digest === 'string' && digest.startsWith('DYNAMIC_SERVER_USAGE'))
-  );
+  )
 }
 
 /**
@@ -53,15 +53,13 @@ function isNextDynamicNoSsr(error: unknown): boolean {
  * onRequestError `routePath` field reports. Mirrors pnext-cli's toNextRoute.
  */
 function toDisplayRoute(route: RouteManifestEntry): string {
-  let value = route.route || '/';
+  let value = route.route || '/'
   if (route.catchAll) {
-    const pattern = route.catchAllOptional
-      ? `[[...${route.catchAll}]]`
-      : `[...${route.catchAll}]`;
-    value = value.replace(`:${route.catchAll}*`, pattern);
+    const pattern = route.catchAllOptional ? `[[...${route.catchAll}]]` : `[...${route.catchAll}]`
+    value = value.replace(`:${route.catchAll}*`, pattern)
   }
-  for (const param of route.params) value = value.replace(`:${param}`, `[${param}]`);
-  return value;
+  for (const param of route.params) value = value.replace(`:${param}`, `[${param}]`)
+  return value
 }
 
 /** Return `Pages Router` when route files live under pages/, otherwise `App Router`. */
@@ -70,30 +68,30 @@ function routeKindFromFile(
   route: RouteManifestEntry,
 ): 'Pages Router' | 'App Router' {
   if (!runtimeRoot) {
-    return 'App Router';
+    return 'App Router'
   }
-  const normalized = path.normalize(route.file);
-  const pagesRoot = path.join(runtimeRoot, 'pages');
-  const appRoot = path.join(runtimeRoot, 'app');
+  const normalized = path.normalize(route.file)
+  const pagesRoot = path.join(runtimeRoot, 'pages')
+  const appRoot = path.join(runtimeRoot, 'app')
   return normalized.startsWith(pagesRoot + path.sep) || normalized === pagesRoot
     ? 'Pages Router'
     : normalized.startsWith(appRoot + path.sep) || normalized === appRoot
       ? 'App Router'
-      : 'App Router';
+      : 'App Router'
 }
 
 interface RouteMatch {
-  route: RouteManifestEntry;
-  routePath: string;
+  route: RouteManifestEntry
+  routePath: string
 }
 
 function resolveRoute(pathname: string): RouteMatch | undefined {
-  const runtime = getRequestRuntime();
-  if (!runtime) return undefined;
-  const selectedPath = pathname.split('?')[0] ?? pathname;
-  const matched = selectRouteForRequest(runtime.routes, selectedPath, undefined);
-  if (!matched) return undefined;
-  return { route: matched.route, routePath: toDisplayRoute(matched.route) };
+  const runtime = getRequestRuntime()
+  if (!runtime) return undefined
+  const selectedPath = pathname.split('?')[0] ?? pathname
+  const matched = selectRouteForRequest(runtime.routes, selectedPath, undefined)
+  if (!matched) return undefined
+  return { route: matched.route, routePath: toDisplayRoute(matched.route) }
 }
 
 /**
@@ -103,9 +101,9 @@ function resolveRoute(pathname: string): RouteMatch | undefined {
  */
 function resolveRoutePath(path: string): string | undefined {
   try {
-    return resolveRoute(path)?.routePath;
+    return resolveRoute(path)?.routePath
   } catch {
-    return undefined;
+    return undefined
   }
 }
 
@@ -118,8 +116,8 @@ function resolveRoutePath(path: string): string | undefined {
  * core reports an ISR revalidation error.
  */
 function errorDigest(error: unknown): string | undefined {
-  const digest = (error as { digest?: unknown } | null | undefined)?.digest;
-  return typeof digest === 'string' ? digest : undefined;
+  const digest = (error as { digest?: unknown } | null | undefined)?.digest
+  return typeof digest === 'string' ? digest : undefined
 }
 
 function buildContext(
@@ -127,24 +125,22 @@ function buildContext(
   context: RequestErrorContext,
   path: string,
 ): Record<string, unknown> {
-  const runtime = getRequestRuntime();
-  const match = runtime ? resolveRoute(path) : undefined;
-  const out: Record<string, unknown> = {};
-  out.routerKind = match
-    ? routeKindFromFile(runtime?.config.root, match.route)
-    : 'App Router';
-  out.routeType = context.routeKind === 'route-handler' ? 'route' : 'render';
-  const routePath = match ? match.routePath : resolveRoutePath(path);
-  if (routePath) out.routePath = routePath;
+  const runtime = getRequestRuntime()
+  const match = runtime ? resolveRoute(path) : undefined
+  const out: Record<string, unknown> = {}
+  out.routerKind = match ? routeKindFromFile(runtime?.config.root, match.route) : 'App Router'
+  out.routeType = context.routeKind === 'route-handler' ? 'route' : 'render'
+  const routePath = match ? match.routePath : resolveRoutePath(path)
+  if (routePath) out.routePath = routePath
   if (context.routeKind === 'html') {
     out.renderSource =
-      (context as { renderSource?: string }).renderSource ?? 'react-server-components';
+      (context as { renderSource?: string }).renderSource ?? 'react-server-components'
   }
-  const revalidateReason = (context as { revalidateReason?: string }).revalidateReason;
-  if (revalidateReason) out.revalidateReason = revalidateReason;
-  const digest = errorDigest(error);
-  if (digest) out.digest = digest;
-  return out;
+  const revalidateReason = (context as { revalidateReason?: string }).revalidateReason
+  if (revalidateReason) out.revalidateReason = revalidateReason
+  const digest = errorDigest(error)
+  if (digest) out.digest = digest
+  return out
 }
 
 /**
@@ -154,25 +150,25 @@ function buildContext(
  * context the endpoint would (routeType 'action', RSC-payload source) or the suite sees a render context.
  */
 function buildActionContext(error: unknown, path: string): Record<string, unknown> {
-  const runtime = getRequestRuntime();
-  const match = runtime ? resolveRoute(path) : undefined;
+  const runtime = getRequestRuntime()
+  const match = runtime ? resolveRoute(path) : undefined
   const out: Record<string, unknown> = {
     routerKind: match ? routeKindFromFile(runtime?.config.root, match.route) : 'App Router',
     routeType: 'action',
     renderSource: 'react-server-components-payload',
-  };
-  const routePath = match ? match.routePath : resolveRoutePath(path);
-  if (routePath) out.routePath = routePath;
-  const digest = errorDigest(error);
-  if (digest) out.digest = digest;
-  return out;
+  }
+  const routePath = match ? match.routePath : resolveRoutePath(path)
+  if (routePath) out.routePath = routePath
+  const digest = errorDigest(error)
+  if (digest) out.digest = digest
+  return out
 }
 
 /** True when the failing request is a server-action invocation (JS/form dispatch). */
 function isServerActionRequest(headers: Headers): boolean {
-  if (headers.has('next-action')) return true;
-  const accept = headers.get('accept') ?? '';
-  return accept.includes('text/x-component');
+  if (headers.has('next-action')) return true
+  const accept = headers.get('accept') ?? ''
+  return accept.includes('text/x-component')
 }
 
 /**
@@ -184,23 +180,23 @@ function isServerActionRequest(headers: Headers): boolean {
  * (redirect()/notFound()) and never throws.
  */
 export async function reportActionErrorToUser(error: unknown, request: Request): Promise<void> {
-  if (isControlFlowError(error)) return;
+  if (isControlFlowError(error)) return
 
-  const unit = getWorkUnit();
+  const unit = getWorkUnit()
   if (unit) {
-    const bag = (unit.compat ??= {});
-    if (bag[ERROR_REPORTED_KEY]) return;
-    bag[ERROR_REPORTED_KEY] = true;
+    const bag = (unit.compat ??= {})
+    if (bag[ERROR_REPORTED_KEY]) return
+    bag[ERROR_REPORTED_KEY] = true
   }
 
-  await instrumentationReady();
-  const hook = getUserOnRequestError();
-  if (!hook) return;
+  await instrumentationReady()
+  const hook = getUserOnRequestError()
+  if (!hook) return
 
-  let path = request.url;
+  let path = request.url
   try {
-    const parsed = new URL(request.url);
-    path = parsed.pathname + parsed.search;
+    const parsed = new URL(request.url)
+    path = parsed.pathname + parsed.search
   } catch {
     // request.url is already a path.
   }
@@ -210,18 +206,18 @@ export async function reportActionErrorToUser(error: unknown, request: Request):
       error,
       { path, method: request.method, headers: headersToObject(request.headers) },
       buildActionContext(error, path),
-    );
+    )
   } catch (hookError) {
-    console.error('instrumentation onRequestError failed:', hookError);
+    console.error('instrumentation onRequestError failed:', hookError)
   }
 }
 
 function headersToObject(headers: Headers): Record<string, string> {
-  const out: Record<string, string> = {};
+  const out: Record<string, string> = {}
   headers.forEach((value, key) => {
-    out[key] = value;
-  });
-  return out;
+    out[key] = value
+  })
+  return out
 }
 
 /**
@@ -233,24 +229,24 @@ export async function reportRequestErrorToUser(
   requestInfo: RequestErrorInfo,
   context: RequestErrorContext,
 ): Promise<void> {
-  if (isControlFlowError(error)) return;
+  if (isControlFlowError(error)) return
 
-  const unit = getWorkUnit();
+  const unit = getWorkUnit()
   if (unit) {
-    const bag = (unit.compat ??= {});
-    if (bag[ERROR_REPORTED_KEY]) return;
-    bag[ERROR_REPORTED_KEY] = true;
+    const bag = (unit.compat ??= {})
+    if (bag[ERROR_REPORTED_KEY]) return
+    bag[ERROR_REPORTED_KEY] = true
   }
 
-  await instrumentationReady();
-  const hook = getUserOnRequestError();
-  if (!hook) return;
+  await instrumentationReady()
+  const hook = getUserOnRequestError()
+  if (!hook) return
 
   // `path` is the original URL incl. search (dynamic-routes asserts search present).
-  let path = requestInfo.url;
+  let path = requestInfo.url
   try {
-    const parsed = new URL(requestInfo.url);
-    path = parsed.pathname + parsed.search;
+    const parsed = new URL(requestInfo.url)
+    path = parsed.pathname + parsed.search
   } catch {
     // requestInfo.url is already a path.
   }
@@ -260,20 +256,20 @@ export async function reportRequestErrorToUser(
   // the action context so it matches what the endpoint would have reported.
   const hookContext = isServerActionRequest(requestInfo.headers)
     ? buildActionContext(error, path)
-    : buildContext(error, context, path);
+    : buildContext(error, context, path)
 
   try {
     await hook(
       error,
       { path, method: requestInfo.method, headers: headersToObject(requestInfo.headers) },
       hookContext,
-    );
+    )
   } catch (hookError) {
-    console.error('instrumentation onRequestError failed:', hookError);
+    console.error('instrumentation onRequestError failed:', hookError)
   }
 }
 
-let guardInstalled = false;
+let guardInstalled = false
 
 /**
  * Server-lifecycle safety net for SSR errors that escape as unhandled promise rejections instead of
@@ -296,11 +292,11 @@ let guardInstalled = false;
  * throw at the SSR site and route it through reportRequestError; this net only guarantees survival.
  */
 export function installUnhandledRejectionGuard(): void {
-  if (guardInstalled) return;
-  if (typeof process === 'undefined' || typeof process.on !== 'function') return;
-  guardInstalled = true;
+  if (guardInstalled) return
+  if (typeof process === 'undefined' || typeof process.on !== 'function') return
+  guardInstalled = true
   process.on('unhandledRejection', (reason: unknown) => {
-    if (isControlFlowError(reason)) return;
-    if (markErrorLogged(reason)) console.error(reason);
-  });
+    if (isControlFlowError(reason)) return
+    if (markErrorLogged(reason)) console.error(reason)
+  })
 }

package/src/compat/lifecycle/error-serialize.ts

@@ -11,36 +11,40 @@
 // NOTE: this function must NOT log the error to the server console. Core's renderer already logs the
 // render error exactly once right before it calls serializeError(); logging here too double-prints it.
 
-import type { SerializeErrorContext, SerializedError } from '../../extensions';
-import { isTaggedPrimitiveThrow, tagPrimitiveThrow, untagPrimitiveThrow } from '../client/errors/primitive-throw';
+import type { SerializeErrorContext, SerializedError } from '../../extensions'
+import {
+  isTaggedPrimitiveThrow,
+  tagPrimitiveThrow,
+  untagPrimitiveThrow,
+} from '../client/errors/primitive-throw'
 
 // React's production redaction text for RSC render errors (#441). Boundary
 // suites assert this verbatim in prod.
 const REDACTED_MESSAGE =
-  'Minified React error #441; visit https://react.dev/errors/441 for the full message or use the non-minified dev environment for full errors and additional helpful warnings.';
+  'Minified React error #441; visit https://react.dev/errors/441 for the full message or use the non-minified dev environment for full errors and additional helpful warnings.'
 
 // Next uses next/dist/compiled/string-hash; any stable non-negative hash whose
 // decimal string matches /\w+/ satisfies the compat assertions.
 function stableDigest(input: string): string {
-  let hash = 5381;
+  let hash = 5381
   for (let i = 0; i < input.length; i++) {
-    hash = (hash * 33) ^ input.charCodeAt(i);
+    hash = (hash * 33) ^ input.charCodeAt(i)
   }
-  return (hash >>> 0).toString();
+  return (hash >>> 0).toString()
 }
 
 function customDigest(error: Error): string | undefined {
-  const digest = (error as { digest?: unknown }).digest;
-  return typeof digest === 'string' && digest.length > 0 ? digest : undefined;
+  const digest = (error as { digest?: unknown }).digest
+  return typeof digest === 'string' && digest.length > 0 ? digest : undefined
 }
 
 // Next appends an error-code suffix to the hash digest when the thrown value
 // was not an Error: prod RSC wraps a nullish throw and reports `@E394`
 // (test/e2e/app-dir/errors asserts `digest: '<hash>@E394'` in the prod log).
 function digestSuffix(error: Error): string {
-  if (!isTaggedPrimitiveThrow(error)) return '';
-  const raw = untagPrimitiveThrow(error);
-  return raw === null || raw === undefined ? '@E394' : '';
+  if (!isTaggedPrimitiveThrow(error)) return ''
+  const raw = untagPrimitiveThrow(error)
+  return raw === null || raw === undefined ? '@E394' : ''
 }
 
 /**
@@ -49,9 +53,9 @@ function digestSuffix(error: Error): string {
  * snapshot asserts, and the raw value tagged so the digest picks up the nullish suffix.
  */
 export function wrapThrownValue(value: unknown): Error {
-  const error = tagPrimitiveThrow(value);
-  error.stack = `Error: ${error.message}\n    at stringify (<anonymous>)`;
-  return error;
+  const error = tagPrimitiveThrow(value)
+  error.stack = `Error: ${error.message}\n    at stringify (<anonymous>)`
+  return error
 }
 
 /**
@@ -62,26 +66,26 @@ export function wrapThrownValue(value: unknown): Error {
 export function formatErrorLog(trace: string, digest: string, error?: Error): string {
   // An error funneled out of a 'use cache' scope carries Next's environment tag;
   // util.inspect prints it before the digest, so the log must too.
-  const environmentName = (error as { environmentName?: unknown } | undefined)?.environmentName;
+  const environmentName = (error as { environmentName?: unknown } | undefined)?.environmentName
   const environment =
-    typeof environmentName === 'string' ? `  environmentName: '${environmentName}',\n` : '';
-  return `⨯ ${trace} {\n${environment}  digest: '${digest}'\n}`;
+    typeof environmentName === 'string' ? `  environmentName: '${environmentName}',\n` : ''
+  return `⨯ ${trace} {\n${environment}  digest: '${digest}'\n}`
 }
 
 export function serializeBoundaryError(ctx: SerializeErrorContext): SerializedError {
-  const { error, dev } = ctx;
-  const custom = customDigest(error);
+  const { error, dev } = ctx
+  const custom = customDigest(error)
   const digest =
-    custom ?? stableDigest(`${error.message}${error.stack ?? ''}`) + digestSuffix(error);
+    custom ?? stableDigest(`${error.message}${error.stack ?? ''}`) + digestSuffix(error)
 
   // Boundary components render `${error}` (e.g. `Global error: ${error}`), so
   // the prop must stringify as `Error: <message>` like React's transported
   // error. Return a real Error carrying the (possibly redacted) message + digest.
   const boundaryError = new Error(dev ? error.message : REDACTED_MESSAGE) as Error & {
-    digest?: string;
-  };
-  boundaryError.name = error.name || 'Error';
-  boundaryError.digest = digest;
-  boundaryError.stack = undefined;
-  return boundaryError;
+    digest?: string
+  }
+  boundaryError.name = error.name || 'Error'
+  boundaryError.digest = digest
+  boundaryError.stack = undefined
+  return boundaryError
 }

package/src/compat/lifecycle/error-ui.ts

@@ -4,8 +4,8 @@
 // these through the httpAccessFallbackUi / defaultGlobalErrorUi render extensions; a pure-core app
 // keeps its own compact fallback.
 
-import { h } from 'preact';
-import type { SerializedError } from '../../extensions';
+import { h } from 'preact'
+import type { SerializedError } from '../../extensions'
 
 // Next's HTTPAccessErrorFallback inline styles (access-error-styles.ts).
 const styles = {
@@ -30,9 +30,9 @@ const styles = {
     lineHeight: '49px',
   },
   h2: { fontSize: 14, fontWeight: 400, lineHeight: '49px', margin: 0 },
-} as const;
+} as const
 
-const httpFallbackCss = `body{color:#000;background:#fff;margin:0}.next-error-h1{border-right:1px solid rgba(0,0,0,.3)}@media (prefers-color-scheme:dark){body{color:#fff;background:#000}.next-error-h1{border-right:1px solid rgba(255,255,255,.3)}}`;
+const httpFallbackCss = `body{color:#000;background:#fff;margin:0}.next-error-h1{border-right:1px solid rgba(0,0,0,.3)}@media (prefers-color-scheme:dark){body{color:#fff;background:#000}.next-error-h1{border-right:1px solid rgba(255,255,255,.3)}}`
 
 export function httpAccessFallbackUi(status: number, message: string): unknown {
   return h(
@@ -45,7 +45,7 @@ export function httpAccessFallbackUi(status: number, message: string): unknown {
       h('h1', { className: 'next-error-h1', style: styles.h1 }, String(status)),
       h('div', { style: styles.desc }, h('h2', { style: styles.h2 }, message)),
     ),
-  );
+  )
 }
 
 // Next's DefaultGlobalError (builtin/global-error.tsx + error-styles.tsx). The
@@ -80,16 +80,34 @@ const errorStyles = {
   form: { margin: 0 },
   buttonGroup: { display: 'flex', gap: '8px', alignItems: 'center' },
   button: {
-    display: 'inline-flex', alignItems: 'center', justifyContent: 'center', height: '32px',
-    padding: '0 12px', fontSize: '14px', fontWeight: 500, lineHeight: '20px',
-    borderRadius: '6px', cursor: 'pointer', color: 'var(--next-error-btn-text)',
-    background: 'var(--next-error-btn-bg)', border: 'var(--next-error-btn-border)',
+    display: 'inline-flex',
+    alignItems: 'center',
+    justifyContent: 'center',
+    height: '32px',
+    padding: '0 12px',
+    fontSize: '14px',
+    fontWeight: 500,
+    lineHeight: '20px',
+    borderRadius: '6px',
+    cursor: 'pointer',
+    color: 'var(--next-error-btn-text)',
+    background: 'var(--next-error-btn-bg)',
+    border: 'var(--next-error-btn-border)',
   },
   buttonSecondary: {
-    display: 'inline-flex', alignItems: 'center', justifyContent: 'center', height: '32px',
-    padding: '0 12px', fontSize: '14px', fontWeight: 500, lineHeight: '20px',
-    borderRadius: '6px', cursor: 'pointer', color: 'var(--next-error-btn-secondary-text)',
-    background: 'var(--next-error-btn-secondary-bg)', border: 'var(--next-error-btn-secondary-border)',
+    display: 'inline-flex',
+    alignItems: 'center',
+    justifyContent: 'center',
+    height: '32px',
+    padding: '0 12px',
+    fontSize: '14px',
+    fontWeight: 500,
+    lineHeight: '20px',
+    borderRadius: '6px',
+    cursor: 'pointer',
+    color: 'var(--next-error-btn-secondary-text)',
+    background: 'var(--next-error-btn-secondary-bg)',
+    border: 'var(--next-error-btn-secondary-border)',
   },
   digestFooter: {
     position: 'fixed',
@@ -104,16 +122,25 @@ const errorStyles = {
     margin: '0',
     color: 'var(--next-error-digest)',
   },
-} as const;
+} as const
 
-const errorThemeCss =
-  `:root{--next-error-bg:#fff;--next-error-text:#171717;--next-error-title:#171717;--next-error-message:#171717;--next-error-digest:#666666;--next-error-btn-text:#fff;--next-error-btn-bg:#171717;--next-error-btn-border:none;--next-error-btn-secondary-text:#171717;--next-error-btn-secondary-bg:transparent;--next-error-btn-secondary-border:1px solid rgba(0,0,0,.08)}@media (prefers-color-scheme:dark){:root{--next-error-bg:#0a0a0a;--next-error-text:#ededed;--next-error-title:#ededed;--next-error-message:#ededed;--next-error-digest:#a0a0a0;--next-error-btn-text:#0a0a0a;--next-error-btn-bg:#ededed;--next-error-btn-border:none;--next-error-btn-secondary-text:#ededed;--next-error-btn-secondary-bg:transparent;--next-error-btn-secondary-border:1px solid rgba(255,255,255,.14)}}body{margin:0;color:var(--next-error-text);background:var(--next-error-bg);}`;
+const errorThemeCss = `:root{--next-error-bg:#fff;--next-error-text:#171717;--next-error-title:#171717;--next-error-message:#171717;--next-error-digest:#666666;--next-error-btn-text:#fff;--next-error-btn-bg:#171717;--next-error-btn-border:none;--next-error-btn-secondary-text:#171717;--next-error-btn-secondary-bg:transparent;--next-error-btn-secondary-border:1px solid rgba(0,0,0,.08)}@media (prefers-color-scheme:dark){:root{--next-error-bg:#0a0a0a;--next-error-text:#ededed;--next-error-title:#ededed;--next-error-message:#ededed;--next-error-digest:#a0a0a0;--next-error-btn-text:#0a0a0a;--next-error-btn-bg:#ededed;--next-error-btn-border:none;--next-error-btn-secondary-text:#ededed;--next-error-btn-secondary-bg:transparent;--next-error-btn-secondary-border:1px solid rgba(255,255,255,.14)}}body{margin:0;color:var(--next-error-text);background:var(--next-error-bg);}`
 
 function warningIcon() {
-  return h('svg', { width: '32', height: '32', viewBox: '-0.2 -1.5 32 32', fill: 'none', style: errorStyles.icon }, h('path', {
-    d: 'M16.9328 0C18.0839.000116771 19.1334.658832 19.634 1.69531L31.4299 26.1309C32.0708 27.4588 31.1036 28.9999 29.6291 29H2.00215C.527541 29-.439628 27.4588.201371 26.1309L11.9973 1.69531C12.4979.658823 13.5474 7.75066e-05 14.6984 0H16.9328ZM3.59493 26H28.0363L16.9328 3H14.6984L3.59493 26ZM15.8156 19C16.9202 19.0001 17.8156 19.8955 17.8156 21C17.8156 22.1045 16.9202 22.9999 15.8156 23C14.7111 23 13.8156 22.1046 13.8156 21C13.8156 19.8954 14.7111 19 15.8156 19ZM17.3156 16.5H14.3156V8.5H17.3156V16.5Z',
-    fill: 'var(--next-error-title)',
-  }));
+  return h(
+    'svg',
+    {
+      width: '32',
+      height: '32',
+      viewBox: '-0.2 -1.5 32 32',
+      fill: 'none',
+      style: errorStyles.icon,
+    },
+    h('path', {
+      d: 'M16.9328 0C18.0839.000116771 19.1334.658832 19.634 1.69531L31.4299 26.1309C32.0708 27.4588 31.1036 28.9999 29.6291 29H2.00215C.527541 29-.439628 27.4588.201371 26.1309L11.9973 1.69531C12.4979.658823 13.5474 7.75066e-05 14.6984 0H16.9328ZM3.59493 26H28.0363L16.9328 3H14.6984L3.59493 26ZM15.8156 19C16.9202 19.0001 17.8156 19.8955 17.8156 21C17.8156 22.1045 16.9202 22.9999 15.8156 23C14.7111 23 13.8156 22.1046 13.8156 21C13.8156 19.8954 14.7111 19 15.8156 19ZM17.3156 16.5H14.3156V8.5H17.3156V16.5Z',
+      fill: 'var(--next-error-title)',
+    }),
+  )
 }
 
 // The default/global-error document is served as a fully static document with no page-hydration
@@ -123,24 +150,24 @@ function warningIcon() {
 // bootstrap that reports the same message/digest via `reportError` (falling back to a synthetic error
 // event) so the client observes the same uncaught signal. Never runs in dev, where the redbox owns it.
 export function globalErrorReportScript(error: SerializedError): string {
-  const message = JSON.stringify(error.message ?? '');
-  const digest = JSON.stringify(error.digest ?? '');
-  return `<script>(function(){try{var e=new Error(${message});if(${digest})e.digest=${digest};if(typeof reportError==='function'){reportError(e);}else{window.dispatchEvent(new ErrorEvent('error',{error:e,message:e.message}));}}catch(_){}})();</script>`;
+  const message = JSON.stringify(error.message ?? '')
+  const digest = JSON.stringify(error.digest ?? '')
+  return `<script>(function(){try{var e=new Error(${message});if(${digest})e.digest=${digest};if(typeof reportError==='function'){reportError(e);}else{window.dispatchEvent(new ErrorEvent('error',{error:e,message:e.message}));}}catch(_){}})();</script>`
 }
 
 export function defaultGlobalErrorUi(error: SerializedError): unknown {
-  const digest = error.digest;
-  const isServerError = Boolean(digest);
+  const digest = error.digest
+  const isServerError = Boolean(digest)
   const message = isServerError
     ? 'A server error occurred. Reload to try again.'
-    : 'Reload to try again, or go back.';
+    : 'Reload to try again, or go back.'
   return h(
     'html',
     { id: '__next_error__' },
     h(
       'head',
       null,
-      h('title', null, "500: This page couldn’t load"),
+      h('title', null, '500: This page couldn’t load'),
       h('style', { dangerouslySetInnerHTML: { __html: errorThemeCss } }),
     ),
     h(
@@ -153,15 +180,23 @@ export function defaultGlobalErrorUi(error: SerializedError): unknown {
           'div',
           { style: errorStyles.card },
           warningIcon(),
-          h('h1', { style: errorStyles.title }, "This page couldn’t load"),
+          h('h1', { style: errorStyles.title }, 'This page couldn’t load'),
           h('p', { style: errorStyles.message }, message),
-          h('div', { style: errorStyles.buttonGroup },
-            h('form', { style: errorStyles.form }, h('button', { type: 'submit', style: errorStyles.button }, 'Reload')),
-            !isServerError ? h('button', { type: 'button', style: errorStyles.buttonSecondary }, 'Back') : null,
+          h(
+            'div',
+            { style: errorStyles.buttonGroup },
+            h(
+              'form',
+              { style: errorStyles.form },
+              h('button', { type: 'submit', style: errorStyles.button }, 'Reload'),
+            ),
+            !isServerError
+              ? h('button', { type: 'button', style: errorStyles.buttonSecondary }, 'Back')
+              : null,
           ),
         ),
       ),
       digest ? h('p', { style: errorStyles.digestFooter }, `ERROR ${digest}`) : null,
     ),
-  );
+  )
 }