diff --git a/src/app/components/AcessibilityBar.js b/src/app/components/AcessibilityBar.js
index 5311d2621a691fcfecca5e9cc1098df59dabe397..c3d6b6cbe869da4de053cd36c93b17c88f386038 100644
--- a/src/app/components/AcessibilityBar.js
+++ b/src/app/components/AcessibilityBar.js
@@ -13,6 +13,7 @@ export default function AcessibilityBar() {
const sizes = ['xs', 'sm', 'base', 'lg', 'xl', '2xl', '3xl', '4xl', '5xl', '6xl', '7xl', '8xl', '9xl'];
const [defaultSizes, setDefaultSizes] = useState({});
const [sizeProperties, setSizeProperties] = useState({});
+ const [loggedIn, setLoggedIn] = useState(false);
const router = useRouter();
const pathname = usePathname()
@@ -24,6 +25,10 @@ export default function AcessibilityBar() {
});
}
+ useEffect(() => {
+ // Remove erro de hidratação forçando o cliente a usar localStorage e tirando isso do server
+ setLoggedIn(isLoggedIn());
+ }, [])
function changeFont(action) {
@@ -178,7 +183,7 @@ export default function AcessibilityBar() {
3- Ir para a busca.
</button>
- {!isLoggedIn() &&
+ {!loggedIn &&
<button className='font-light' onClick={() => router.push("/entrar")}>
4- Ir para login.
</button>
@@ -223,7 +228,7 @@ export default function AcessibilityBar() {
1- Ir para o conteúdo.
</button>
- {!isLoggedIn() &&
+ {!loggedIn &&
<button className='font-light' onClick={() => router.push("/entrar")}>
2- Ir para login.
</button>
diff --git a/src/app/components/FiltersModal.js b/src/app/components/FiltersModal.js
index c9d23a3fd0968b491743be5c3241cead619b6eb8..deb92008225133e335b816cb1a61d3563fc134c3 100644
--- a/src/app/components/FiltersModal.js
+++ b/src/app/components/FiltersModal.js
@@ -49,7 +49,7 @@ export default function FiltersModal({
<p className=' text-2xl font-bold text-darkGray-HC-white '>
Filtros de Pesquisa
</p>
- <CloseIcon onClick={handleClose} sx={{ color: "#6c8080", fontSize: "35px" }} />
+ <CloseIcon className="cursor-pointer" onClick={handleClose} sx={{ color: "#6c8080", fontSize: "35px" }} />
</div>
</div>
<div className='p-6'>
@@ -80,4 +80,4 @@ export default function FiltersModal({
</div>
</div>
);
-}
\ No newline at end of file
+}
diff --git a/src/app/components/Header.js b/src/app/components/Header.js
index b90f9a66d38fee8b9f91b05e2d4c1eb60c829d6f..62d9ef58f553dae4f4f1725d1a1c8bb26479abe3 100644
--- a/src/app/components/Header.js
+++ b/src/app/components/Header.js
@@ -98,7 +98,7 @@ function DefaultContent({
<>
<Notifications />
- <p className="max-md:hidden"><AccountMenu /></p>
+ <div className="max-md:hidden"><AccountMenu /></div>
</>
) : (
<button
diff --git a/src/app/components/MenuProfile.js b/src/app/components/MenuProfile.js
index d6cb93882ca9cddd010fb44680a3318d3ab3d9bd..1e03cd29df1d00077ff5ddb06afdc3db7a92d27e 100644
--- a/src/app/components/MenuProfile.js
+++ b/src/app/components/MenuProfile.js
@@ -87,8 +87,13 @@ export default function AccountMenu() {
if (isLoggedIn()) {
let data = JSON.parse(getStoredValue("user_data"));
setId(data["id"]);
+ setLogged(isLoggedIn());
+ }
+ let token = getStoredValue("access_token");
+ if (token) {
+ let user = getStoredValue("user_data");
+ setUserData(JSON.parse(user));
}
- setLogged(isLoggedIn());
}, []);
const handleClick = (event) => {
@@ -109,14 +114,6 @@ export default function AccountMenu() {
window.location.reload();
};
- useEffect(() => {
- let token = getStoredValue("access_token");
- if (token) {
- let user = getStoredValue("user_data");
- setUserData(JSON.parse(user));
- }
- }, []);
-
return (
<>
{logged ? (
diff --git a/src/app/components/NavigationBar.js b/src/app/components/NavigationBar.js
index d387ed9b983fad643bc777d5a50bf6731b37a59f..c97b63a8d4f829987c206ed5b82e17b51c3dd61d 100644
--- a/src/app/components/NavigationBar.js
+++ b/src/app/components/NavigationBar.js
@@ -41,6 +41,7 @@ const navItems = [
export default function NavigationBar({ mobileSearch }) {
const [id, setId] = useState(null);
const [needLoginOpen, setNeedLoginOpen] = useState(false);
+ const [loggedIn, setLoggedIn] = useState(false);
const pathname = usePathname();
const searchParams = useSearchParams();
@@ -49,6 +50,7 @@ export default function NavigationBar({ mobileSearch }) {
useEffect(() => {
if (isLoggedIn()) {
const userData = getStoredValue("user_data");
+ setLoggedIn(true);
if (userData) {
const data = JSON.parse(userData);
setId(data["id"]);
@@ -115,9 +117,9 @@ export default function NavigationBar({ mobileSearch }) {
<li key={index} className="flex w-20 flex-col items-center justify-center p-3">
<Link
href={
- item.label === "Publicar" && !isLoggedIn()
+ item.label === "Publicar" && !loggedIn
? "#"
- : item.label === "perfil" && isLoggedIn()
+ : item.label === "perfil" && loggedIn
? `/perfil/${id}`
: getHref(item.href)
}
diff --git a/src/app/components/SideBar.js b/src/app/components/SideBar.js
index 89fbe3f0fe3884f02e993c5eb152bd8552975c31..cab36c5274669799e44a0c7c5c16cd552f3ef3f6 100644
--- a/src/app/components/SideBar.js
+++ b/src/app/components/SideBar.js
@@ -116,6 +116,7 @@ export default function SideBar({ setFilterState, filterState }) {
};
const [needLoginOpen, setNeedLoginOpen] = useState(false);
+ const [loggedIn, setLoggedIn] = useState(false);
const handleLogout = () => {
removeFromLocalStorage("access_token");
@@ -129,7 +130,6 @@ export default function SideBar({ setFilterState, filterState }) {
const handleOpenLogin = () => {
-
if (!isLoggedIn()) {
setNeedLoginOpen(true);
}
@@ -140,6 +140,7 @@ export default function SideBar({ setFilterState, filterState }) {
useEffect(() => {
if (isLoggedIn()) {
let data = JSON.parse(getStoredValue("user_data"));
+ setLoggedIn(true);
setId(data["id"]);
}
}, []);
@@ -151,18 +152,18 @@ export default function SideBar({ setFilterState, filterState }) {
<div className="max-md:hidden min-h-0 overflow-y-auto flex flex-col text-darkGray-HC-white-underline font-light">
<div className="flex flex-col justify-start items-center gap-2 w-full mb-5">
{acessoRapido
- .filter(item => isLoggedIn() || (item.title !== "Sair" && item.href !== "/perfil"))
+ .filter(item => loggedIn || (item.title !== "Sair" && item.href !== "/perfil"))
.map((item, index) => {
return (
<Link
onClick={() => {
if (item.title === "Sair") {
handleLogout();
- } else if (item.href === "/publicar" && !isLoggedIn()) {
+ } else if (item.href === "/publicar" && !loggedIn) {
handleOpenLogin();
}
}}
- href={item.href === "/publicar" ? (isLoggedIn() ? "/publicar" : "") : getHref(item.href)}
+ href={item.href === "/publicar" ? (loggedIn ? "/publicar" : "") : getHref(item.href)}
key={index}
alt={item.title}
title={item.title}
@@ -184,4 +185,4 @@ export default function SideBar({ setFilterState, filterState }) {
</div>
</>
);
-}
\ No newline at end of file
+}
diff --git a/src/app/components/needLoginModal.js b/src/app/components/needLoginModal.js
index fbc83a33bde745424bd95e7c950eef58198438ae..875cda90947b6595cc2413a053a9e9ef914720d5 100644
--- a/src/app/components/needLoginModal.js
+++ b/src/app/components/needLoginModal.js
@@ -7,7 +7,7 @@ export default function NeedLoginModal({ open, setOpen }) {
return (
<>
<Modal
- open={open && isLoggedIn}
+ open={open}
className="grid h-screen place-items-center m-5"
onClose={() => setOpen(false)}
slotProps={{