Skip to content

feat(web): add /watch/easter route page #167

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
up-tandem wants to merge 3 commits into
base: main
Choose a base branch
from
Open

feat(web): add /watch/easter route page #167

Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
5b11c63
feat(web): add /watch/easter route page
up-tandem Mar 3, 2026
4de3b87
fix(web): move easter page to /watch/easter route and add post-filter…
up-tandem Mar 3, 2026
92c0497
Merge branch 'main' into feat/164-watch-easter
up-tandem Mar 3, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
46 changes: 46 additions & 0 deletions apps/web/src/app/watch/easter/page.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,46 @@
import type { Metadata } from "next"
import { getLocale } from "@/lib/locale"
import { getWatchExperience } from "@/lib/content"
import { SectionRenderer, type Section } from "@/components/sections"
import { ExperienceEmpty } from "@/components/ExperienceEmpty"
import { ExperienceError } from "@/components/ExperienceError"

export const metadata: Metadata = {
title: "Watch Easter",
description:
"Watch Easter content, livestreams, and featured videos on Forge.",
alternates: {
canonical: "/watch/easter",
},
}
Comment on lines +8 to +15
Copy link
Copy Markdown

@coderabbitai coderabbitai bot Mar 3, 2026 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

⚠️ Potential issue | 🟡 Minor

🧩 Analysis chain

🏁 Script executed:

#!/bin/bash
# Search for metadataBase configuration in app layouts
rg -n 'metadataBase\s*:' apps/web/src/app --type=ts --type=tsx

Repository: JesusFilm/forge

Length of output: 86

🏁 Script executed:

#!/bin/bash
# Check layout files for metadata configuration
fd -t f 'layout\.(tsx|ts)' apps/web/src/app -x sed -n '1,250p' {}

Repository: JesusFilm/forge

Length of output: 276

🏁 Script executed:

#!/bin/bash
# Search for metadataBase in app directory (broader search)
rg 'metadataBase' apps/web/src/app

Repository: JesusFilm/forge

Length of output: 41

🏁 Script executed:

#!/bin/bash
# Find all layout files in the app directory and show their content
fd 'layout\.(tsx|ts)$' apps/web/src/app -x cat {} \; -print

Repository: JesusFilm/forge

Length of output: 289

🏁 Script executed:

#!/bin/bash
# Find all layout files in the app directory
fd 'layout\.(tsx|ts)$' apps/web/src/app

Repository: JesusFilm/forge

Length of output: 86

🏁 Script executed:

#!/bin/bash
# Show contents of each layout file
for file in $(fd 'layout\.(tsx|ts)$' apps/web/src/app); do
  echo "=== $file ==="
  cat "$file"
  echo ""
done

Repository: JesusFilm/forge

Length of output: 313

🏁 Script executed:

#!/bin/bash
# Search for metadataBase anywhere in the codebase (not just app directory)
rg 'metadataBase' apps/web/src

Repository: JesusFilm/forge

Length of output: 41

Configure metadataBase at the app level to ensure canonical URL resolution across environments.

The root layout (apps/web/src/app/layout.tsx) does not export metadataBase. Line 13 uses a relative canonical path (/watch/easter), which requires app-level metadataBase configuration for correct resolution. Without it, canonical URLs can be incorrect in some runtime environments.

Add to apps/web/src/app/layout.tsx:

export const metadata: Metadata = {
  metadataBase: new URL(process.env.NEXT_PUBLIC_APP_URL || "http://localhost:3000"),
  // ... rest of metadata
}
🤖 Prompt for AI Agents 
Verify each finding against the current code and only fix it if needed.

In `@apps/web/src/app/watch/easter/page.tsx` around lines 8 - 15, The page
metadata uses a relative canonical (export const metadata in page.tsx with
alternates.canonical="/watch/easter") but the app root layout does not export
metadataBase, so canonical URL resolution can be incorrect; to fix, open the
root layout component that exports metadata (look for export const metadata in
layout.tsx) and add a metadata.metadataBase set to a URL constructed from the
environment (e.g. new URL(process.env.NEXT_PUBLIC_APP_URL ||
"http://localhost:3000")) so the alternates.canonical resolves to an absolute
URL across environments.

Copy link
Copy Markdown
Contributor Author

@up-tandem up-tandem Mar 3, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Good catch — this is the first page in the app to use alternates.canonical. Adding metadataBase to the root layout is an app-wide concern that should be addressed separately (no NEXT_PUBLIC_APP_URL env var exists yet). Noted for a follow-up.

Copy link
Copy Markdown

@coderabbitai coderabbitai bot Mar 3, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@up-tandem, understood — makes perfect sense to handle this as a separate app-wide change once the environment variable infrastructure is in place.

Would you like me to create a GitHub issue to track adding metadataBase configuration and the NEXT_PUBLIC_APP_URL environment variable for proper canonical URL resolution?

✏️ Learnings added 
Learnt from: up-tandem
Repo: JesusFilm/forge PR: 167
File: apps/web/src/app/watch/easter/page.tsx:8-15
Timestamp: 2026-03-03T02:58:25.939Z
Learning: The `NEXT_PUBLIC_APP_URL` environment variable does not exist yet in the codebase and needs to be added when implementing app-wide `metadataBase` configuration for Next.js metadata.

Note: Learnings are effective only in the context of similar code segments. To apply general coding guidelines, please configure review instructions. You can manage existing learnings in the app.


export default async function EasterPage() {
const locale = await getLocale()
const result = await getWatchExperience(locale, { slug: "easter" })

if (result.error) {
return <ExperienceError message={result.error.message} />
}

const experience = result.data
if (!experience?.sections?.length) {
return <ExperienceEmpty />
}

const sections = experience.sections.filter(
(s): s is Section => s !== null && s.__typename !== "Error",
)

if (sections.length === 0) {
return <ExperienceEmpty />
}

return (
<main className="min-h-screen">
{sections.map((section, i) => {
const key = section.id ?? `section-${i}`
return <SectionRenderer key={key} section={section} />
})}
</main>
)
}
Loading