[]previous and next page

Metadata and head

metadata, generateMetadata, viewport and generateViewport keep their Next.js names and their fields.

For agentsUpdated

metadata, generateMetadata, viewport and generateViewport keep their Next.js names and their fields. A route or layout module exports them, and Dusk merges the chain outermost first, with Next's title template rules: a page title is wrapped in the layout's template, absolute skips it, and every other field replaces the one above. The server writes the merged head before the body, and a navigation replaces it on the client. generateMetadata receives params, search, parent and the loader data, so it reads data the loader already loaded. The complete rules are in Dusk metadata.

jsx
export const generateMetadata = ({ loaderData }) => ({
  title: `${loaderData.title} | Blog`,
  description: loaderData.body,
  openGraph: { title: loaderData.title },
});

Two Next.js shapes change. params is a plain object, not a promise, so there is no await params. And the search argument is the raw query record, which is what Next's searchParams is. The head export still works (it returns tags, and script is refused); the metadata tags win over it for the same tag.

File conventions are explicit rather than discovered by name. A sitemap, a robots file and a manifest are API routes that export GET from sitemapRoute, robotsRoute and manifestRoute (@shadow-js/dusk/server), which receive the request event, so they can answer per host (a status host, say). A social image is an API route that returns an ImageResponse (@shadow-js/dusk/og). Static files (icon.svg, favicon.ico, robots.txt) stay in public/. The exception is the social images: opengraph-image and twitter-image, as a static file (.png, .jpg, .jpeg or .gif, with an optional .alt.txt beside it) or as a module (.tsx, .ts, ...) that returns the tree, are discovered in src/, in src/routes/ and in every route folder, and the pages get their tags, as in Next.js. A static file gives its size, type and alt text (see Static social images). A module such as Next's app/blog/[slug]/opengraph-image.tsx is served at the folder's URL with the params, and its alt, size and contentType exports write the tags (see Dynamic social images).