);
// Profile button — silhouette when logged out, colored initials when logged in.
// Universally legible state cue (Gmail/Slack pattern). Click → menu/login.
const ProfileButton = ({ state, onToggle, name = 'Member', initials = 'M' }) => {
const isIn = state === 'logged-in';
return (
);
};
// Language dropdown trigger — shared between utility bar + footer.
// Language list — English is default; rest in the order the client requested.
// Translation is wired through the free Google Translate widget. Picking a
// language sets the page's translation target via the widget's hidden select
// element. NOTE on quality: Google Translate is machine translation; brand /
// Sanskrit terms (Prajna, Avadhanam, Jai Srimanarayana) may get
// translated awkwardly. Consider upgrading to Weglot or community-translated
// strings post-launch if the quality matters.
const LANGUAGES = ['English', 'German', 'Hindi', 'Telegu', 'Tamil', 'Kanada'];
// Map our display names → Google Translate language codes. Empty string for
// English means "restore the page to its original (untranslated) state".
const LANG_TO_GTRANS = {
English: '',
German: 'de',
Hindi: 'hi',
Telegu: 'te',
Tamil: 'ta',
Kanada: 'kn',
};
// Ensure the Google Translate widget script is loaded exactly once per page
// session. Subsequent calls are no-ops.
const ensureGoogleTranslateLoaded = () => {
if (typeof window === 'undefined' || window.__prajnaGTransInit) return;
window.__prajnaGTransInit = true;
// Hidden mount point. The widget renders a select.goog-te-combo inside it
// which we drive programmatically when the user picks a language.
if (!document.getElementById('google_translate_element')) {
const mount = document.createElement('div');
mount.id = 'google_translate_element';
mount.style.display = 'none';
document.body.appendChild(mount);
}
window.googleTranslateElementInit = () => {
try {
new window.google.translate.TranslateElement(
{ pageLanguage: 'en', includedLanguages: 'de,hi,te,ta,kn', autoDisplay: false },
'google_translate_element'
);
} catch (e) { /* widget already initialized — ignore */ }
};
const script = document.createElement('script');
script.src = 'https://translate.google.com/translate_a/element.js?cb=googleTranslateElementInit';
script.async = true;
document.head.appendChild(script);
};
// Apply a translation by simulating a change on the hidden Google select.
// The widget script loads async, so poll for ~6 seconds before giving up.
const applyGoogleTranslate = (langName) => {
const code = LANG_TO_GTRANS[langName] || '';
let attempts = 0;
const tryApply = () => {
const select = document.querySelector('.goog-te-combo');
if (select) {
select.value = code;
select.dispatchEvent(new Event('change'));
return;
}
if (attempts++ < 30) setTimeout(tryApply, 200);
};
tryApply();
};
const LangToggle = ({ subdued }) => {
const [open, setOpen] = React.useState(false);
const [lang, setLang] = React.useState('English');
const ref = React.useRef(null);
// Mount: inject the Google Translate widget (once per page) then restore
// whatever language the user previously picked and apply that translation.
React.useEffect(() => {
ensureGoogleTranslateLoaded();
try {
const saved = localStorage.getItem('prajna-lang');
if (saved && LANGUAGES.includes(saved)) {
setLang(saved);
if (saved !== 'English') applyGoogleTranslate(saved);
}
} catch (e) { /* localStorage blocked — ignore */ }
}, []);
React.useEffect(() => {
if (!open) return;
const handler = (e) => {
if (ref.current && !ref.current.contains(e.target)) setOpen(false);
};
document.addEventListener('mousedown', handler);
return () => document.removeEventListener('mousedown', handler);
}, [open]);
const pick = (l) => {
setLang(l);
try { localStorage.setItem('prajna-lang', l); } catch (e) { /* ignore */ }
applyGoogleTranslate(l);
setOpen(false);
};
return (