Język wynikał z navigator.language liczonego przy każdym renderze, więc nie dało się go wybrać ani zalinkować. Teraz nośnikiem języka jest ścieżka. - src/router.ts: usePathname() na useSyncExternalStore + navigate(). pushState nie emituje zdarzenia, więc bez tego React nie widzi zmiany URL-a. - i18n: useLang(), localizePath(), stripLangPrefix(), setLang(). useT() czyta język ze ścieżki i jest reaktywne na nawigację. - Detekcja przeglądarki tylko przy pierwszym wejściu na "/" i tylko gdy w localStorage nic nie ma; wynik zapisujemy od razu, więc przekierowanie na /en zadziała najwyżej raz i nie nadpisze późniejszego wyboru użytkownika. Deep linki honorujemy bez ruszania. - App.tsx: jedna tablica tras dla obu języków (/en/privacy -> '/privacy'). Ustawia też document.documentElement.lang, bo index.html ma na sztywno "pl". - Header: przełącznik PL/EN (desktop + mobile), <button>, nie <a> — link przeładowałby dokument. - Hrefy w Header/Footer/PrivacyPolicyPage/PlatformPage przez localizePath, inaczej /en jest pułapką jednokierunkową: każdy klik wraca na PL. - index.html: hreflang pl/en/x-default; og:url z gethumanai.com na .pl (wskazywał na cudzą domenę). Bez nowych tłumaczeń treści — to osobny krok. Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
71 lines
3.3 KiB
TypeScript
71 lines
3.3 KiB
TypeScript
import React from 'react';
|
|
import { localizePath, stripLangPrefix, useLang } from '../i18n';
|
|
|
|
const Footer = () => {
|
|
const currentYear = new Date().getFullYear();
|
|
const lang = useLang();
|
|
|
|
// Same reasoning as the /#section nav links below: this footer is shared with
|
|
// /privacy and /platforma, so the logo needs a real href to get home from
|
|
// there. On the homepage that href would mean a full reload, so intercept the
|
|
// click and scroll to the top instead.
|
|
const handleLogoClick = (e: React.MouseEvent<HTMLAnchorElement>) => {
|
|
if (stripLangPrefix(window.location.pathname) !== '/') return;
|
|
e.preventDefault();
|
|
window.scrollTo({ top: 0, behavior: 'smooth' });
|
|
};
|
|
|
|
|
|
return (
|
|
<footer className="py-12 border-t border-white/5 bg-background">
|
|
<div className="container mx-auto px-6">
|
|
<div className="grid md:grid-cols-4 gap-12 mb-12">
|
|
<div className="col-span-2">
|
|
<a href={localizePath('/', lang)} onClick={handleLogoClick} className="text-2xl font-bold tracking-tight mb-4 block">
|
|
human<span className="text-primary">AI</span>
|
|
</a>
|
|
<p className="text-muted max-w-xs mb-6">
|
|
ludzka strona AI — budujemy praktyczne systemy AI dla ludzi i organizacji.
|
|
</p>
|
|
<div className="flex flex-col gap-2">
|
|
<a href="mailto:hello@gethumanai.pl" className="text-foreground/80 hover:text-primary transition-colors">
|
|
hello@gethumanai.pl
|
|
</a>
|
|
<a href="mailto:support@gethumanai.pl" className="text-foreground/80 hover:text-primary transition-colors">
|
|
support@gethumanai.pl
|
|
</a>
|
|
</div>
|
|
</div>
|
|
|
|
<div>
|
|
<h4 className="font-bold mb-6 text-sm uppercase tracking-wider">Nawigacja</h4>
|
|
<ul className="space-y-4">
|
|
<li><a href={localizePath('/#offerings', lang)} className="text-muted hover:text-foreground transition-colors">Oferta</a></li>
|
|
<li><a href={localizePath('/platforma', lang)} className="text-muted hover:text-foreground transition-colors">Platforma</a></li>
|
|
<li><a href={localizePath('/#contact', lang)} className="text-muted hover:text-foreground transition-colors">Kontakt</a></li>
|
|
</ul>
|
|
</div>
|
|
|
|
<div>
|
|
<h4 className="font-bold mb-6 text-sm uppercase tracking-wider">Prywatność</h4>
|
|
<ul className="space-y-4">
|
|
<li><a href={localizePath('/privacy', lang)} className="text-muted hover:text-foreground transition-colors">Polityka prywatności</a></li>
|
|
<li><a href={localizePath('/privacy#cookies', lang)} className="text-muted hover:text-foreground transition-colors">Cookies</a></li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
|
|
<div className="pt-8 border-t border-white/5 flex flex-col md:flex-row justify-between items-center gap-4 text-sm text-muted">
|
|
<p>© {currentYear} humanAI. Wszelkie prawa zastrzeżone.</p>
|
|
<div className="flex gap-8">
|
|
<span className="hover:text-foreground transition-colors cursor-pointer">LinkedIn</span>
|
|
<span className="hover:text-foreground transition-colors cursor-pointer">X / Twitter</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</footer>
|
|
);
|
|
};
|
|
|
|
export default Footer;
|