Skip to content

🐛 fix(i18n): preserve locale selection across navigation and prevent CORS errors #730

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

Merged
kubestellar-prow merged 3 commits into from
Jan 28, 2026
+40 −29
Merged

🐛 fix(i18n): preserve locale selection across navigation and prevent CORS errors #730

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
13754e4
feat: add redirect for localized docs URLs to non-localized version
rudy128 Jan 15, 2026
b9c5a60
fix: replace standard Link with LocalizedLink for improved internatio…
rudy128 Jan 15, 2026
80bba9e
fix: update DocsNavbar links to use getBaseUrl for localized URLs
rudy128 Jan 15, 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
25 changes: 13 additions & 12 deletions src/components/Navbar.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,7 @@
"use client";

import React, { useState, useEffect, useRef } from "react";
import { Link as LocalizedLink } from "@/i18n/navigation";
import Link from "next/link";
import Image from "next/image";
import { GridLines, StarField, LanguageSwitcher } from "./index";
Expand Down Expand Up @@ -615,7 +616,7 @@ export default function Navbar() {
</svg>
{t("products")}
</Link>
<Link
<LocalizedLink
href="/ladder"
className="flex items-center px-4 py-2 text-sm text-gray-300 hover:bg-emerald-900/30 rounded transition-all duration-200 hover:text-emerald-300 hover:shadow-md"
>
Expand All @@ -633,7 +634,7 @@ export default function Navbar() {
></path>
</svg>
{t("ladder")}
</Link>
</LocalizedLink>
<Link
href="/docs/contribution-guidelines/security/security-inc"
className="flex items-center px-4 py-2 text-sm text-gray-300 hover:bg-emerald-900/30 rounded transition-all duration-200 hover:text-emerald-300 hover:shadow-md"
Expand Down Expand Up @@ -740,7 +741,7 @@ export default function Navbar() {
</svg>
{t("programs")}
</Link>
<Link
<LocalizedLink
href="/#contact"
className="flex items-center px-4 py-2 text-sm text-gray-300 hover:bg-cyan-900/30 rounded transition-all duration-200 hover:text-cyan-300 hover:shadow-md"
>
Expand All @@ -758,8 +759,8 @@ export default function Navbar() {
></path>
</svg>
{t("contactUs")}
</Link>
<Link
</LocalizedLink>
<LocalizedLink
href="/partners"
className="flex items-center px-4 py-2 text-sm text-gray-300 hover:bg-cyan-900/30 rounded transition-all duration-200 hover:text-cyan-300 hover:shadow-md"
>
Expand All @@ -777,7 +778,7 @@ export default function Navbar() {
></path>
</svg>
{t("partners")}
</Link>
</LocalizedLink>
</div>
</div>
</div>
Expand Down Expand Up @@ -1139,7 +1140,7 @@ export default function Navbar() {
</Link>
</div>
<div className="relative mb-2">
<Link
<LocalizedLink
href="/ladder"
className="text-sm sm:text-base font-medium text-gray-300 flex items-center space-x-1 px-3 py-2 rounded-lg"
>
Expand All @@ -1159,7 +1160,7 @@ export default function Navbar() {
</svg>
</div>
<span>{t("ladder")}</span>
</Link>
</LocalizedLink>
</div>
<div className="relative mb-4">
<Link
Expand Down Expand Up @@ -1237,7 +1238,7 @@ export default function Navbar() {
</Link>
</div>
<div className="relative mb-2">
<Link
<LocalizedLink
href="/#contact"
className="text-sm sm:text-base font-medium text-gray-300 flex items-center space-x-1 px-3 py-2 rounded-lg"
>
Expand All @@ -1257,10 +1258,10 @@ export default function Navbar() {
</svg>
</div>
<span>{t("contactUs")}</span>
</Link>
</LocalizedLink>
</div>
<div className="relative mb-4">
<Link
<LocalizedLink
href="/partners"
className="text-sm sm:text-base font-medium text-gray-300 flex items-center space-x-1 px-3 py-2 rounded-lg"
>
Expand All @@ -1280,7 +1281,7 @@ export default function Navbar() {
</svg>
</div>
<span>{t("partners")}</span>
</Link>
</LocalizedLink>
</div>
<div className="border-t border-gray-400/50 mb-4"></div>
<div className="mb-4">
Expand Down
32 changes: 16 additions & 16 deletions src/components/docs/DocsNavbar.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@ import Image from "next/image";
import { useTheme } from "next-themes";
// import { useSearchParams, usePathname, useRouter } from 'next/navigation'
import { VERSIONS } from '@/config/versions'
import { getLocalizedUrl } from "@/lib/url";
import { getLocalizedUrl, getBaseUrl } from "@/lib/url";
import { VersionSelector } from './VersionSelector';

type DropdownType = "contribute" | "community" | "language" | "github" | null;
Expand Down Expand Up @@ -360,8 +360,8 @@ export default function DocsNavbar() {
</svg>
<span>Products</span>
</Link>
<Link
href="/ladder"
<a
href={`${getBaseUrl()}/en/ladder`}
className={dropdownItemClasses}
>
<svg
Expand All @@ -378,7 +378,7 @@ export default function DocsNavbar() {
></path>
</svg>
<span>Ladder</span>
</Link>
</a>

<Link
href="/docs/contribution-guidelines/security/security-inc"
Expand Down Expand Up @@ -443,24 +443,24 @@ export default function DocsNavbar() {
</svg>
Programs
</Link>
<Link
href="/#contact"
<a
href={`${getBaseUrl()}/en#contact`}
className={dropdownItemClasses}
>
<svg className="w-5 h-5 mr-2.5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth="2" d="M3 8l7.89 4.26a2 2 0 002.22 0L21 8M5 19h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z" />
</svg>
Contact Us
</Link>
<Link
href="/partners"
</a>
<a
href={`${getBaseUrl()}/en/partners`}
className={dropdownItemClasses}
>
<svg className="w-5 h-5 mr-2.5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth="2" d="M17 20h5v-2a3 3 0 00-5.356-1.857M17 20H7m10 0v-2c0-.656-.126-1.283-.356-1.857M7 20H2v-2a3 3 0 015.356-1.857M7 20v-2c0-.656.126-1.283.356-1.857m0 0a5.002 5.002 0 019.288 0M15 7a3 3 0 11-6 0 3 3 0 016 0zm6 3a2 2 0 11-4 0 2 2 0 014 0zM7 10a2 2 0 11-4 0 2 2 0 014 0z" />
</svg>
Partners
</Link>
</a>
</div>
)}
</div>
Expand Down Expand Up @@ -896,7 +896,7 @@ export default function DocsNavbar() {
</svg>
Products
</Link>
<Link href="/ladder" className={`flex items-center px-3 py-2 text-sm rounded-md transition-colors ${
<a href={`${getBaseUrl()}/en/ladder`} className={`flex items-center px-3 py-2 text-sm rounded-md transition-colors ${
isDark
? 'text-gray-300 hover:bg-neutral-800'
: 'text-gray-700 hover:bg-gray-100'
Expand All @@ -905,7 +905,7 @@ export default function DocsNavbar() {
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth="2" d="M13 7h8m0 0v8m0-8l-8 8-4-4-6 6" />
</svg>
Ladder
</Link>
</a>
<Link href="/docs/contribution-guidelines/security/security-inc" className={`flex items-center px-3 py-2 text-sm rounded-md transition-colors ${
isDark
? 'text-gray-300 hover:bg-neutral-800'
Expand Down Expand Up @@ -941,7 +941,7 @@ export default function DocsNavbar() {
Programs
</Link>
{/* --- REMOVED LADDER LINK FROM HERE --- */}
<Link href="/#contact" className={`flex items-center px-3 py-2 text-sm rounded-md transition-colors ${
<a href={`${getBaseUrl()}/en#contact`} className={`flex items-center px-3 py-2 text-sm rounded-md transition-colors ${
isDark
? 'text-gray-300 hover:bg-neutral-800'
: 'text-gray-700 hover:bg-gray-100'
Expand All @@ -950,8 +950,8 @@ export default function DocsNavbar() {
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth="2" d="M3 8l7.89 4.26a2 2 0 002.22 0L21 8M5 19h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z" />
</svg>
Contact Us
</Link>
<Link href="/partners" className={`flex items-center px-3 py-2 text-sm rounded-md transition-colors ${
</a>
<a href={`${getBaseUrl()}/en/partners`} className={`flex items-center px-3 py-2 text-sm rounded-md transition-colors ${
isDark
? 'text-gray-300 hover:bg-neutral-800'
: 'text-gray-700 hover:bg-gray-100'
Expand All @@ -960,7 +960,7 @@ export default function DocsNavbar() {
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth="2" d="M17 20h5v-2a3 3 0 00-5.356-1.857M17 20H7m10 0v-2c0-.656-.126-1.283-.356-1.857M7 20H2v-2a3 3 0 015.356-1.857M7 20v-2c0-.656.126-1.283.356-1.857m0 0a5.002 5.002 0 019.288 0M15 7a3 3 0 11-6 0 3 3 0 016 0zm6 3a2 2 0 11-4 0 2 2 0 014 0zM7 10a2 2 0 11-4 0 2 2 0 014 0z" />
</svg>
Partners
</Link>
</a>

{/* Version selector - mobile */}
<div className={`md:hidden pt-3 border-t mt-3 ${
Expand Down
12 changes: 11 additions & 1 deletion src/middleware.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -15,6 +15,16 @@ export default function middleware(request: NextRequest) {
return NextResponse.redirect("https://kubestellar.io/docs", 301);
}

// Redirect localized docs URLs to non-localized version
// e.g., /es/docs/... -> /docs/...
const docsPathMatch = request.nextUrl.pathname.match(/^\/([a-z]{2}(?:-[A-Z]{2})?|SC)\/docs\//);
if (docsPathMatch) {
const url = request.nextUrl.clone();
// Remove the locale prefix from the pathname
url.pathname = url.pathname.replace(/^\/[a-z]{2}(?:-[A-Z]{2})?\/docs\//, '/docs/').replace(/^\/SC\/docs\//, '/docs/');
return NextResponse.redirect(url, 307);
}

// Explicitly handle root path to ensure consistent redirect to /en
// This helps override any cached redirects in browsers like Safari
if (request.nextUrl.pathname === "/") {
Expand All @@ -29,7 +39,7 @@ export default function middleware(request: NextRequest) {

export const config = {
matcher: [
"/((?!docs|api|_next|_vercel|agenda|blog|code|community|drive|infomercial|join_us|joinus|ladder|ladder_stats|linkedin|quickstart|slack|survey|tv|youtube|.*\\..*).*)",
"/((?!docs|api|_next|_vercel|agenda|blog|code|community|drive|infomercial|join_us|joinus|ladder_stats|linkedin|quickstart|slack|survey|tv|youtube|.*\\..*).*)",
"/",
],
};
Loading