import { useState, useEffect, ReactNode } from 'react';
import styles from './password-gate.module.scss';
import Head from 'next/head';
import { useRouter } from 'next/router';
const HARDCODED_PASSWORD = 'GONI';
const STORAGE_KEY = 'site-authenticated';
interface Props {
children: ReactNode;
}
export default function PasswordGate({ children }: Props) {
const [authenticated, setAuthenticated] = useState(false);
const [checked, setChecked] = useState(false);
const [password, setPassword] = useState('');
const [error, setError] = useState(false);
const router = useRouter();
const checkAuth = () => {
const stored = sessionStorage.getItem(STORAGE_KEY);
setAuthenticated(stored === 'true');
setChecked(true);
};
useEffect(() => {
checkAuth();
// Revalida en cada cambio de ruta (navegación con Link)
router.events.on('routeChangeStart', checkAuth);
return () => {
router.events.off('routeChangeStart', checkAuth);
};
}, []);
const handleSubmit = (e: React.FormEvent) => {
e.preventDefault();
if (password === HARDCODED_PASSWORD) {
sessionStorage.setItem(STORAGE_KEY, 'true');
setAuthenticated(true);
setError(false);
setPassword('');
} else {
setError(true);
}
};
// evita parpadeo mientras se verifica sessionStorage
if (!checked) return null;
if (!authenticated) {
return (
<>
Arturo Goñi
);
}
return <>{children};
}