Jean-Luc Makiola
672b17fd13
- Add useTranslation() to TopNav, BottomTabBar, FabMenu, UserMenu - Internationalize ConfirmDialog, AuthPromptModal, ExternalLinkDialog - Extract all onboarding flow strings (Welcome, HobbyPicker, ItemBrowser, Review, Done) - Internationalize settings page (weight unit, currency, API keys, import/export) - Internationalize login page and root error boundary - All dialogs in __root.tsx use t() for UI chrome Phase 34, Plan 02 (core navigation and global UI)
48 lines
1.4 KiB
TypeScript
48 lines
1.4 KiB
TypeScript
import { Link } from "@tanstack/react-router";
|
|
import { useTranslation } from "react-i18next";
|
|
import { useUIStore } from "../stores/uiStore";
|
|
|
|
export function AuthPromptModal() {
|
|
const { t } = useTranslation();
|
|
const showAuthPrompt = useUIStore((s) => s.showAuthPrompt);
|
|
const closeAuthPrompt = useUIStore((s) => s.closeAuthPrompt);
|
|
|
|
if (!showAuthPrompt) return null;
|
|
|
|
return (
|
|
<div className="fixed inset-0 z-50 flex items-center justify-center">
|
|
<div
|
|
className="absolute inset-0 bg-black/30"
|
|
onClick={closeAuthPrompt}
|
|
onKeyDown={(e) => {
|
|
if (e.key === "Escape") closeAuthPrompt();
|
|
}}
|
|
/>
|
|
<div className="relative bg-white rounded-xl shadow-lg p-6 max-w-sm mx-4 w-full">
|
|
<h3 className="text-lg font-semibold text-gray-900 mb-2">
|
|
{t("auth.joinGearBox")}
|
|
</h3>
|
|
<p className="text-sm text-gray-600 mb-6">
|
|
{t("auth.signInDescription")}
|
|
</p>
|
|
<div className="flex flex-col gap-3">
|
|
<Link
|
|
to="/login"
|
|
className="w-full text-center px-4 py-2.5 text-sm font-medium text-white bg-gray-700 hover:bg-gray-800 rounded-lg transition-colors"
|
|
onClick={closeAuthPrompt}
|
|
>
|
|
{t("auth.signIn")}
|
|
</Link>
|
|
<Link
|
|
to="/login"
|
|
className="w-full text-center px-4 py-2.5 text-sm font-medium text-gray-700 bg-gray-100 hover:bg-gray-200 rounded-lg transition-colors"
|
|
onClick={closeAuthPrompt}
|
|
>
|
|
{t("auth.createAccount")}
|
|
</Link>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|