fix: normalize "original" locale to "en" for datetime formatting

[leonardthethird]

Fix datetime strings being partially localized based on OS language when site is in "Untranslated" mode.

When users select "Untranslated" mode, the locale is set to "original" which is not a valid BCP 47 tag. Browser Intl APIs fall back to OS language, causing mixed-language strings like "Revealed el próximo mes".

Adds a normalizeIntlLocale() utility that maps "original" to "en" and applies it consistently across all components using Intl-based date formatting.

Fixes #4122

Generated with Claude Code

Summary by CodeRabbit

• Bug Fixes
  • Improved locale normalization for date/time displays so formatting is consistent across the app and handles the special "original" locale reliably.
• Chores
  • Added a shared locale-normalization utility and applied it across date/time components to centralize behavior.

[coderabbitai]

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info

⚙️ Run configuration

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro

Run ID: 8d3771f7-a84d-4a8d-a4be-8220b790a308

📥 Commits

Reviewing files that changed from the base of the PR and between e30cc43 and 930360b.

📒 Files selected for processing (1)

• front_end/src/app/(main)/(home)/components/research_and_updates.tsx

🚧 Files skipped from review as they are similar to previous changes (1)

• front_end/src/app/(main)/(home)/components/research_and_updates.tsx

---

📝 Walkthrough

Walkthrough

Adds a locale normalization helper and applies it across date/time formatting utilities and several UI components so Intl APIs receive normalized locale values (maps "original" → "en"; other locales unchanged).

Changes

Cohort / File(s)	Summary
Locale Normalization Utility front_end/src/utils/formatters/date.ts	Added export function normalizeIntlLocale(locale: string): string (maps "original" to "en"). Updated formatDate, formatDatetime, and formatRelativeDate to pass normalized locale into Intl formatting calls.
Home / Research & Updates front_end/src/app/(main)/(home)/components/research_and_updates.tsx	Replaced direct getLocale() usage with normalizeIntlLocale(await getLocale()) before passing locale to formatting/Intl usage.
Consumer Post Card (upcoming) front_end/src/components/consumer_post_card/upcoming_cp.tsx	Switched useLocale() → normalizeIntlLocale(useLocale()) for lang prop and intlFormatDistance locale option.
CP Reveal Time front_end/src/components/cp_reveal_time/cp_reveal_time.tsx	Applied normalizeIntlLocale(useLocale()) for locale used in intlFormat and RelativeTime.
Local Daytime UI front_end/src/components/ui/local_daytime.tsx	Removed prior manual/original-locale workaround; instead uses normalizeIntlLocale(useLocale()) for computed locale used in display and lang prop.

Estimated code review effort

🎯 3 (Moderate) | ⏱️ ~20 minutes

Poem

🐇 I nibbled at locales, found one quite odd,
"original" I munched and turned to "en" with a nod.
Dates now hop tidy, time strings aligned,
No more mixed-language crumbs left behind. 🥕✨

🚥 Pre-merge checks | ✅ 4

✅ Passed checks (4 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Title check	✅ Passed	The title clearly and specifically describes the main fix: normalizing the 'original' locale to 'en' for datetime formatting to resolve locale inconsistencies.
Linked Issues check	✅ Passed	The PR directly addresses issue #4122 by implementing normalizeIntlLocale() to map 'original' to 'en', preventing mixed-language datetime strings when the site is in Untranslated mode.
Out of Scope Changes check	✅ Passed	All changes are scoped to normalizing the 'original' locale in datetime formatting utilities and related components; no unrelated modifications detected.

_{✏️ Tip: You can configure your own custom pre-merge checks in the settings.}

✨ Finishing Touches

• 📝 Generate docstrings (stacked PR)
• 📝 Generate docstrings (commit on current branch)

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Commit unit tests in branch claude/issue-4122-some-feed-tile-text-inconsistently

📝 Coding Plan

• Generate coding plan for human review comments

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

[coderabbitai]

🧹 Nitpick comments (1)

front_end/src/utils/formatters/date.ts (1)

192-198: Add a small regression test around normalizeIntlLocale.

This helper is now the single guard for Untranslated mode, so a focused test for "original" -> "en" plus one passthrough locale would make the bugfix harder to regress.

🤖 Prompt for AI Agents

Verify each finding against the current code and only fix it if needed.

In `@front_end/src/utils/formatters/date.ts` around lines 192 - 198, Add a small
unit test suite for normalizeIntlLocale: import normalizeIntlLocale from its
module, then add two tests — one asserting normalizeIntlLocale("original")
returns "en" and another asserting normalizeIntlLocale("fr") (or "en-US")
returns the same input (passthrough). Use the project's test framework (e.g.,
Jest) and place the test alongside other utils tests so it runs in CI; name the
tests clearly like "returns en for 'original' (Untranslated mode)" and "passes
through valid locales".

🤖 Prompt for all review comments with AI agents

Verify each finding against the current code and only fix it if needed.

Nitpick comments:
In `@front_end/src/utils/formatters/date.ts`:
- Around line 192-198: Add a small unit test suite for normalizeIntlLocale:
import normalizeIntlLocale from its module, then add two tests — one asserting
normalizeIntlLocale("original") returns "en" and another asserting
normalizeIntlLocale("fr") (or "en-US") returns the same input (passthrough). Use
the project's test framework (e.g., Jest) and place the test alongside other
utils tests so it runs in CI; name the tests clearly like "returns en for
'original' (Untranslated mode)" and "passes through valid locales".

---

ℹ️ Review info

⚙️ Run configuration

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro

Run ID: 7c986d69-6129-4fac-b08b-7fe3c66e37ad

📥 Commits

Reviewing files that changed from the base of the PR and between 2e79b4d and e30cc43.

📒 Files selected for processing (5)

• front_end/src/app/(main)/(home)/components/research_and_updates.tsx
• front_end/src/components/consumer_post_card/upcoming_cp.tsx
• front_end/src/components/cp_reveal_time/cp_reveal_time.tsx
• front_end/src/components/ui/local_daytime.tsx
• front_end/src/utils/formatters/date.ts

[github-actions]

🚀 Preview Environment

Your preview environment is ready!

Resource	Details
🌐 Preview URL	https://metaculus-pr-4472-claude-issue-4122-some-feed-ti-preview.mtcl.cc
📦 Docker Image	ghcr.io/metaculus/metaculus:claude-issue-4122-some-feed-tile-text-inconsistently-930360b
🗄️ PostgreSQL	NeonDB branch preview/pr-4472-claude-issue-4122-some-feed-ti
⚡ Redis	Fly Redis mtc-redis-pr-4472-claude-issue-4122-some-feed-ti

Details

• Commit: 5c07500f715b36f7c026d67f30ff788c7a954004
• Branch: claude/issue-4122-some-feed-tile-text-inconsistently
• Fly App: metaculus-pr-4472-claude-issue-4122-some-feed-ti

---

ℹ️ Preview Environment Info

Isolation:

• PostgreSQL and Redis are fully isolated from production
• Each PR gets its own database branch and Redis instance
• Changes pushed to this PR will trigger a new deployment

Limitations:

• Background workers and cron jobs are not deployed in preview environments
• If you need to test background jobs, use Heroku staging environments

Cleanup:

• This preview will be automatically destroyed when the PR is closed

[leonardthethird]

@claude deal with failing unit tests / frontend checks.

[claude]

Claude finished @leonardthethird's task in 1m 35s —— View job

---

Fixed failing frontend lint check

• Identify failing CI checks — Frontend Checks failed at check linters step
• Read relevant code and test files — ESLint import/order error in research_and_updates.tsx
• Fix the failures — moved normalizeIntlLocale import into correct alphabetical position within the @/ import group
• Push fixes — committed and pushed as 930360b

Root cause: The normalizeIntlLocale import was placed in its own separate group (with a blank line above it) and was out of alphabetical order relative to other @/ imports. Fixed by removing the blank line and moving the import after @/utils/core/cn.
|