Let _not-found and _error set their title, and apply titleTemplate to the default one #825

Version

void 1.9.0

Problem

With head: { titleTemplate: '%s | My App' } in void.config.ts, every page's tab gets the app name, except the error pages:

renderPageFailure() resolves the head with no page title, so resolveHead() never applies the template. It then adds its own title after that step:

title: head?.title ?? (status === 404 ? 'Not Found' : 'Internal Server Error')

_not-found and _error can't change this either. They can't have a .server.ts, so they have no head, and a headDefaults.title set in middleware would reach every page that sets no title of its own, not just the error pages. So the error pages can't say "Page not found" to match their heading, and they're the only tabs without the app name.

Proposal

1. Apply the template to the default title, by passing it through resolveHead() as the page title: Not Found | My App. That's a small change, and it makes these pages match every other page without any code in the app.

2. Let error pages set their title. For example, a head export from _not-found and _error, taking the error they render:

   // pages/_not-found.tsx
   export const head = { title: 'Page not found' };

   // pages/_error.tsx
   export const head = (error: PageError) => ({
     title: error.status === 404 ? 'Page not found' : 'Something went wrong',
   });

Prior art

• Next.js: not-found.tsx can export metadata, and the root layout's title.template applies to it.
• Nuxt: error.vue calls useHead(), and the app's titleTemplate applies.
• SvelteKit: +error.svelte sets its title with <svelte:head>.