app: metadataBase is hardcoded to localhost, breaking all social previews in production

[joelpeace48-cell]

Problem

app/layout.tsx sets:

export const metadata: Metadata = {
  metadataBase: new URL("http://localhost:3000"),
  ...
}

Next.js resolves every relative Open Graph and Twitter image URL against
metadataBase. Deployed, this emits absolute URLs pointing at
http://localhost:3000 — so app/opengraph-image.tsx and
app/twitter-image.tsx (both of which exist and render) resolve to a host the
crawler cannot reach.

Every link shared to Twitter, LinkedIn, Slack, or Discord renders without a
preview card. For a project whose reach depends on grant reviewers and
hackathon judges following a link, this is a visible own-goal.

What to do

• Drive metadataBase from an environment variable
  (NEXT_PUBLIC_SITE_URL), falling back to the Vercel-provided
  VERCEL_URL for previews and to localhost only in development.
• Add openGraph.url and a canonical URL.
• Verify with a real crawler once deployed.

Acceptance criteria

• metadataBase resolved from the environment per deployment
• OG and Twitter image URLs absolute and reachable in production
• Canonical URL set
• Validated against a card-preview tool after deploy

Notes

Also worth setting metadata.title.template per route so shared deep links
carry a meaningful title rather than the site default.

[telemarkdigital-publisher]

I can take this. Plan: derive metadataBase from a validated public site URL/environment value, remove the localhost fallback from production metadata, and add a focused metadata test. Expected verification: npm test/build or the repo's Next.js validation target once dependencies are available.

[joelpeace48-cell]

HI @telemarkdigital-publisher , you're assigned, ensure all ci pipelines are green

[telemarkdigital-publisher]

Submitted PR #85 for this: https://github.com/FinesseStudioLab/modeltrace-frontend/pull/85\n\nScope: resolves metadataBase from NEXT_PUBLIC_SITE_URL/VERCEL_URL, adds canonical/Open Graph URL metadata, and keeps the broader SEO work out of scope because PR #81 already covers #66.\n\nVerification: npm test; npm run lint; npm run build; git diff --check.