Fix dynamic default locale routing
This commit is contained in:
@@ -9,11 +9,13 @@ import { cn } from "@/lib/utils";
|
||||
|
||||
type FloatingPreferencesProps = {
|
||||
locale: string;
|
||||
defaultLocale: "de" | "en" | "ar";
|
||||
className?: string;
|
||||
};
|
||||
|
||||
export function FloatingPreferences({
|
||||
locale,
|
||||
defaultLocale,
|
||||
className,
|
||||
}: FloatingPreferencesProps) {
|
||||
const t = useTranslations("navigation");
|
||||
@@ -39,6 +41,7 @@ export function FloatingPreferences({
|
||||
/>
|
||||
<LocaleToggle
|
||||
locale={locale}
|
||||
defaultLocale={defaultLocale}
|
||||
className="h-9 w-9 rounded-pill border border-transparent bg-transparent p-0 text-foreground/80 hover:bg-accent hover:text-foreground"
|
||||
/>
|
||||
</div>
|
||||
|
||||
@@ -17,6 +17,7 @@ const PENDING_TOAST_STORAGE_KEY = "mohfarawati-pending-toast";
|
||||
|
||||
type LocaleToggleProps = {
|
||||
locale: string;
|
||||
defaultLocale?: AppLocale;
|
||||
className?: string;
|
||||
showLabel?: boolean;
|
||||
};
|
||||
@@ -29,6 +30,7 @@ const localeChangedMessages: Record<AppLocale, string> = {
|
||||
|
||||
export function LocaleToggle({
|
||||
locale,
|
||||
defaultLocale = "de",
|
||||
className,
|
||||
showLabel = false,
|
||||
}: LocaleToggleProps) {
|
||||
@@ -82,7 +84,7 @@ export function LocaleToggle({
|
||||
)}
|
||||
>
|
||||
<a
|
||||
href={getLocalizedPath(targetLocale, currentPath)}
|
||||
href={getLocalizedPath(targetLocale, currentPath, defaultLocale)}
|
||||
onClick={() => {
|
||||
const message = localeChangedMessages[targetLocale];
|
||||
|
||||
|
||||
@@ -2,7 +2,7 @@ import Link from "next/link";
|
||||
import { useLocale, useTranslations } from "next-intl";
|
||||
|
||||
import { Container } from "@/components/layout/container";
|
||||
import { getLocalizedPath } from "@/lib/locale";
|
||||
import { AppLocale, getLocalizedPath } from "@/lib/locale";
|
||||
|
||||
const navItems = [
|
||||
{ key: "home", path: "" },
|
||||
@@ -11,7 +11,11 @@ const navItems = [
|
||||
{ key: "contact", path: "/contact" },
|
||||
];
|
||||
|
||||
export function SiteFooter() {
|
||||
type SiteFooterProps = {
|
||||
defaultLocale: AppLocale;
|
||||
};
|
||||
|
||||
export function SiteFooter({ defaultLocale }: SiteFooterProps) {
|
||||
const locale = useLocale();
|
||||
const tNav = useTranslations("navigation");
|
||||
const tFooter = useTranslations("footer");
|
||||
@@ -23,7 +27,7 @@ export function SiteFooter() {
|
||||
{navItems.map((item) => (
|
||||
<Link
|
||||
key={item.key}
|
||||
href={getLocalizedPath(locale, item.path || "/")}
|
||||
href={getLocalizedPath(locale, item.path || "/", defaultLocale)}
|
||||
className="text-muted-foreground hover:text-foreground"
|
||||
>
|
||||
{tNav(item.key)}
|
||||
|
||||
@@ -34,6 +34,7 @@ const disabledMobileNavItemClassName =
|
||||
type SiteHeaderProps = {
|
||||
lightLogoUrl?: string | null;
|
||||
darkLogoUrl?: string | null;
|
||||
defaultLocale: "de" | "en" | "ar";
|
||||
};
|
||||
|
||||
function getDirectionalReveal(direction: "rtl" | "ltr") {
|
||||
@@ -57,9 +58,11 @@ function isNavItemActive(currentPath: string, itemPath: string) {
|
||||
}
|
||||
|
||||
function NavLinks({
|
||||
defaultLocale,
|
||||
onNavigate,
|
||||
mobile = false,
|
||||
}: {
|
||||
defaultLocale: "de" | "en" | "ar";
|
||||
onNavigate?: () => void;
|
||||
mobile?: boolean;
|
||||
}) {
|
||||
@@ -113,7 +116,7 @@ function NavLinks({
|
||||
return (
|
||||
<Link
|
||||
key={item.key}
|
||||
href={getLocalizedPath(locale, itemPath)}
|
||||
href={getLocalizedPath(locale, itemPath, defaultLocale)}
|
||||
className={cn(
|
||||
"relative z-10 rounded-pill transition-colors",
|
||||
mobile ? "px-4 py-3 text-sm font-medium" : "px-3.5 py-2 text-sm font-medium xl:px-4",
|
||||
@@ -142,6 +145,7 @@ function NavLinks({
|
||||
export function SiteHeader({
|
||||
lightLogoUrl,
|
||||
darkLogoUrl,
|
||||
defaultLocale,
|
||||
}: SiteHeaderProps) {
|
||||
const [isOpen, setIsOpen] = useState(false);
|
||||
const [isScrolled, setIsScrolled] = useState(false);
|
||||
@@ -210,7 +214,7 @@ export function SiteHeader({
|
||||
)}
|
||||
>
|
||||
<Link
|
||||
href={getLocalizedPath(locale)}
|
||||
href={getLocalizedPath(locale, "/", defaultLocale)}
|
||||
className="inline-flex items-center gap-2.5 rounded-pill px-1 py-1 sm:gap-3 lg:py-2"
|
||||
onClick={handleLogoClick}
|
||||
>
|
||||
@@ -277,7 +281,7 @@ export function SiteHeader({
|
||||
isArabic ? "w-auto max-w-none" : "min-w-[27rem] max-w-[42rem]",
|
||||
)}
|
||||
>
|
||||
<NavLinks />
|
||||
<NavLinks defaultLocale={defaultLocale} />
|
||||
</motion.nav>
|
||||
</div>
|
||||
|
||||
@@ -293,6 +297,7 @@ export function SiteHeader({
|
||||
<div className={desktopControlRailClassName}>
|
||||
<LocaleToggle
|
||||
locale={locale}
|
||||
defaultLocale={defaultLocale}
|
||||
className={desktopControlButtonClassName}
|
||||
/>
|
||||
<SoundToggle
|
||||
@@ -405,7 +410,7 @@ export function SiteHeader({
|
||||
</div>
|
||||
) : (
|
||||
<Link
|
||||
href={getLocalizedPath(locale, itemPath)}
|
||||
href={getLocalizedPath(locale, itemPath, defaultLocale)}
|
||||
className={cn(
|
||||
"flex items-center justify-between rounded-nested px-4 py-3 text-sm font-medium transition-colors",
|
||||
isActive
|
||||
@@ -435,6 +440,7 @@ export function SiteHeader({
|
||||
<div className="flex items-center justify-between gap-2">
|
||||
<LocaleToggle
|
||||
locale={locale}
|
||||
defaultLocale={defaultLocale}
|
||||
className={mobileControlButtonClassName}
|
||||
/>
|
||||
<div className="flex items-center gap-2">
|
||||
|
||||
Reference in New Issue
Block a user