Files
pagodera/components/mobile-menu.tsx
Evandro Fonseca Junior b5093cb49a feat(i18n): enhance locale support and add under-construction messages
- Updated Header.tsx to use current locale in navigation links for proper routing
- Increased MiniSparkline chart dimensions in market-stats.tsx for better visibility
- Added under-construction translations for market, about, and prices pages in en.json and pt.json
- Minor formatting adjustments with added blank lines across multiple components

These changes improve internationalization and user experience by ensuring locale-aware navigation and providing informative placeholders for upcoming features.
2025-10-26 17:47:12 -03:00

69 lines
2.1 KiB
TypeScript

"use client";
import { Menu } from "lucide-react";
import { useState } from "react";
import { Sheet, SheetContent, SheetTrigger } from "@/components/ui/sheet";
import { Button } from "@/components/ui/button";
import { Separator } from "@/components/ui/separator";
import { ThemeToggle } from "./theme-toggle";
import { LanguageSwitcher } from "./language-switcher";
import { useTranslations } from "next-intl";
import Link from "next/link";
interface MobileMenuProps {
links: Array<{ href: string; label: string }>;
}
export function MobileMenu({ links }: MobileMenuProps) {
const [open, setOpen] = useState(false);
const t = useTranslations("header");
return (
<Sheet open={open} onOpenChange={setOpen}>
<SheetTrigger asChild>
<Button variant="outline" size="icon" className="md:hidden">
<Menu className="h-[1.2rem] w-[1.2rem]" />
<span className="sr-only">{t("menu")}</span>
</Button>
</SheetTrigger>
<SheetContent side="right" className="w-[300px] sm:w-[400px]">
<div className="flex flex-col space-y-4 mt-4">
{/* Navigation Links */}
<div className="space-y-2">
{links.map(({ href, label }) => (
<Link
key={href}
href={href}
className="block px-3 py-2 text-sm font-medium rounded-md hover:bg-accent hover:text-accent-foreground transition-colors"
onClick={() => setOpen(false)}
>
{label}
</Link>
))}
</div>
<Separator />
{/* Theme and Language Controls */}
<div className="space-y-4">
<div className="flex items-center justify-between">
<span className="text-sm font-medium">{t("theme.light")}</span>
<ThemeToggle />
</div>
<div className="flex items-center justify-between">
<span className="text-sm font-medium">{t("language")}</span>
<LanguageSwitcher />
</div>
</div>
</div>
</SheetContent>
</Sheet>
);
}