// components/Header.jsx
// Bandeiras SVG inline (estilizadas, formato circular de 18px)
const FlagBR = () => (
);
const FlagUS = () => (
);
const FlagES = () => (
);
const LANGS = [
{ code: 'pt', label: 'Português', short: 'PT', Flag: FlagBR },
{ code: 'en', label: 'English', short: 'EN', Flag: FlagUS },
{ code: 'es', label: 'Español', short: 'ES', Flag: FlagES },
];
const LangSwitcher = ({ inDrawer = false, onPick }) => {
const [open, setOpen] = React.useState(false);
const [lang, setLang] = React.useState('pt');
const ref = React.useRef(null);
React.useEffect(() => {
try {
const saved = localStorage.getItem('mai_lang');
if (saved && LANGS.find(l => l.code === saved)) setLang(saved);
} catch (e) {}
}, []);
React.useEffect(() => {
if (!open) return;
const onDoc = (e) => { if (ref.current && !ref.current.contains(e.target)) setOpen(false); };
document.addEventListener('mousedown', onDoc);
return () => document.removeEventListener('mousedown', onDoc);
}, [open]);
const pick = (code) => {
if (code === lang) {
setOpen(false);
if (onPick) onPick();
return;
}
setLang(code);
try { localStorage.setItem('mai_lang', code); } catch (e) {}
setOpen(false);
if (onPick) onPick();
// Reload so all components pick up the new dictionary
if (typeof window !== 'undefined' && window.MAI_SET_LANG) {
window.MAI_SET_LANG(code);
} else if (typeof window !== 'undefined') {
window.location.reload();
}
};
const current = LANGS.find(l => l.code === lang) || LANGS[0];
const Cur = current.Flag;
return (
{open ? (
{LANGS.map(l => {
const F = l.Flag;
const active = l.code === lang;
return (
-
);
})}
) : null}
);
};
const Header = () => {
const [scrolled, setScrolled] = React.useState(false);
const [menuOpen, setMenuOpen] = React.useState(false);
// detecta se a página atual está numa subpasta conhecida (blog/ ou legal/)
// e prefixa '../' nos paths relativos. Ignora qualquer prefix de servidor.
const pathInfo = (() => {
if (typeof window === 'undefined') return { isHome: true, prefix: '' };
const p = decodeURIComponent(window.location.pathname);
const segs = p.split('/').filter(Boolean);
const file = segs[segs.length - 1] || '';
const parent = segs[segs.length - 2] || '';
const inSubfolder = parent === 'blog' || parent === 'legal';
const prefix = inSubfolder ? '../' : '';
const isHome = !inSubfolder && (
file === '' || /^(index\.html|Member AI Site\.html)$/i.test(file)
);
return { isHome, prefix };
})();
const { isHome, prefix } = pathInfo;
// Brand link: clean URL on home (no #hero pollution); plain index.html elsewhere.
// The Hero section is at the very top of the page, so scrolling to top is
// visually identical to scrolling to #hero — but the URL stays clean.
const homeHref = isHome ? '/' : (prefix + 'index.html');
const planosHref = prefix + 'planos.html';
const blogHref = prefix + 'blog.html';
const suporteHref = prefix + 'suporte.html';
const homeAnchor = (anchor) => isHome ? anchor : (prefix + 'index.html' + anchor);
React.useEffect(() => {
const on = () => setScrolled(window.scrollY > 40);
on();
window.addEventListener('scroll', on, { passive: true });
return () => window.removeEventListener('scroll', on);
}, []);
React.useEffect(() => {
if (menuOpen) {
document.body.classList.add('menu-open');
} else {
document.body.classList.remove('menu-open');
}
return () => document.body.classList.remove('menu-open');
}, [menuOpen]);
const close = () => setMenuOpen(false);
// Brand click on the home page: smooth-scroll to top and strip any #hash
// (e.g. a stale #hero left over from a prior visit or a shared link).
const goHome = (e) => {
close();
if (!isHome) return; // off-home: let the browser navigate to /
e.preventDefault();
try { window.scrollTo({ top: 0, behavior: 'smooth' }); }
catch (err) { window.scrollTo(0, 0); }
try {
window.history.replaceState(null, '',
window.location.pathname + window.location.search);
} catch (err) {}
};
return (
{/* Drawer mobile */}
);
};
