Enforce uvai.io as the canonical frontend and tighten backend CORS

[Codex]

Multiple live frontends (Vercel/Cloudflare) created branding confusion; the product needs a single canonical domain (uvai.io) with redirects and api.uvai.io for the backend.

• Frontend canonicalization

  • Set metadataBase/Open Graph URLs to https://uvai.io.
  • Added middleware to 308-redirect all non-canonical hosts to uvai.io in production while allowing local dev hosts.

• Backend alignment

  • CORS allowlists now include only uvai.io, www.uvai.io, api.uvai.io, and local dev origins.
  • Production defaults updated to mirror the canonical domains.

• Docs

  • SESSION_HANDOFF updated to state uvai.io (frontend) and api.uvai.io (backend) and note legacy hosts should redirect.

Example redirect logic:

// apps/web/src/middleware.ts
export function middleware(request: NextRequest) {
  const host = request.headers.get('host');
  if (!host || process.env.NODE_ENV !== 'production' || allowedHosts.has(host)) {
    return NextResponse.next();
  }
  const url = new URL(request.url);
  url.hostname = 'uvai.io';
  url.protocol = 'https:';
  url.port = '';
  return NextResponse.redirect(url, 308);
}

Original prompt

---

This section details on the original issue you should resolve

<issue_title>🟡 Consolidate 5 deployed frontends into single canonical URL</issue_title>
<issue_description>## Problem
The same product has 5 different frontend deployments:

URL	Status	What It Is
event-relay-web.vercel.app	✅ Live	EventRelay Next.js frontend
v0-uvai.vercel.app	✅ Live	'EventRelay — Video to Software'
uvai-io.pages.dev	✅ Live	'UVAI.io - Video Intelligence Platform' (Cloudflare Pages)
youtube-extension.vercel.app	✅ Live (200)	YOUTUBE-EXTENSION frontend
uvai-backend-*.us-central1.run.app	✅ Live (200)	Cloud Run backend API

Plus existing domains: uvai.io, sell.solutions, myai.directory

The Mess

• Users/investors don't know which URL is the product
• 4 separate Vercel/Cloudflare deployments burning resources
• No canonical domain pointing to the 'real' product

Proposed Solution

1. Choose ONE canonical domain: uvai.io (you own it)
2. Point uvai.io → the best frontend (event-relay-web.vercel.app or uvai-io.pages.dev)
3. Set up redirects from all other URLs → uvai.io
4. Keep Cloud Run backend as API at api.uvai.io
5. Delete/archive duplicate Vercel projects

Acceptance Criteria

• uvai.io serves the product
• api.uvai.io serves the backend
• All other URLs redirect to uvai.io
• Single Vercel project for the frontend</issue_description>

Comments on the Issue (you are @codex[agent] in this section)

• Fixes 🟡 Consolidate 5 deployed frontends into single canonical URL #82

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Actions	Updated (UTC)
v0-uvai	Error		Mar 20, 2026 4:17pm

[groupthinking]

@copilot Prompt Yourself: Identify and remove the root cause of the Turbopack/Next.js build failure in apps/web/src/app/layout.js.

Key failure:

• "asset is not placeable in ESM chunks, so it doesn't have a module id"
• Also, your logs warn: The "middleware" file convention is deprecated. Switch to "proxy" (see Next.js docs).

Solution Plan:

1. Inspect apps/web/src/app/layout.js for any non-ESM compatible asset imports—e.g. importing images, CSS, or binary assets in ways incompatible with Next.js ESM support.
2. Refactor asset imports. Use Next.js conventions (next/image for images, etc.) or place public assets in /public and reference by URL.
3. If using old middleware conventions, rename/migrate files to use the new "proxy" API as per Next.js migration docs.

Example code fix for asset imports in layout.js:

// BAD: (will fail)
// import myImage from './my-image.png';

// GOOD: Use next/image for images
import Image from 'next/image';

export default function Layout() {
  return (
    <main>
      <Image src="/my-image.png" alt="desc" width={400} height={300} />
      {/* ... */}
    </main>
  );
}

Action Items:

• Audit apps/web/src/app/layout.js for asset imports; refactor using Next.js best practices (docs: https://nextjs.org/docs/pages/building-your-application/optimizing/images).
• Migrate any deprecated "middleware" uses to "proxy".
• Re-run your build and verify green CI.

Reference:

• Next.js ESM chunks/assets docs: https://nextjs.org/docs/messages/asset-not-placeable
• Middleware to proxy migration: https://nextjs.org/docs/messages/middleware-to-proxy

Prompt Yourself:

• Does layout.js use any non-standard imports?
• Have all middleware files been migrated?
• Test the build locally before pushing.

Ready to build.

[Copilot]

@copilot Prompt Yourself: Identify and remove the root cause of the Turbopack/Next.js build failure in apps/web/src/app/layout.js.

Key failure:
...

Addressed in d69533b. I removed the generated apps/web/src/app/layout.js* artifacts that Turbopack was resolving instead of layout.tsx, migrated apps/web/src/middleware.ts to apps/web/src/proxy.ts, and cleaned the broken JSX/dead reference in apps/web/src/app/dashboard/page.tsx and apps/web/src/app/page.tsx so npm run build:web now passes locally. No UI changed in this fix, so there isn’t a meaningful screenshot to attach.

[groupthinking]

Closing: has merge conflicts with main after PR #113 merge. CORS and canonical URL enforcement can be done in a fresh PR if needed.