diff --git a/src/app/components/NavigationBar.js b/src/app/components/NavigationBar.js index 47b0a79420fb99942ff5e708b558846cb7545be9..c173f59bba8b0a32c4f86ba96aa8c575dc1840a7 100644 --- a/src/app/components/NavigationBar.js +++ b/src/app/components/NavigationBar.js @@ -53,12 +53,12 @@ export default function NavigationBar({ mobileSearch}) { const navItems = [ { label: "Pesquisar", href: "#", icon: SearchIcon }, - { label: "Recursos", href: "/busca?page=LearningObject", icon: SubjectIcon }, - { label: "Coleções", href: "/busca?page=Collection", icon: CollectionsBookmarkIcon }, - { label: "Publicar", href: "/publicar", icon: FileUploadIcon }, - { label: "MEC", href: "/busca?page=MEC", icon: VerifiedIcon }, { label: "Perfil", href: "/perfil", icon: Person }, + { label: "Coleções", href: "/busca?page=Collection", icon: CollectionsBookmarkIcon }, + { label: "Recursos", href: "/busca?page=LearningObject", icon: SubjectIcon }, { label: "Sobre", href: "/sobre", icon: HelpIcon }, + { label: "MEC", href: "/busca?page=MEC", icon: VerifiedIcon }, + { label: "Publicar", href: "/publicar", icon: FileUploadIcon }, { label: "Contato", href: "/contato", icon: EmailRoundedIcon }, { label: "Sair", href: "", icon: LogoutRounded}, ] diff --git a/src/app/components/Overlay.js b/src/app/components/Overlay.js index 76a0624759fb4e33ad037a9a610ed2e646506051..bcf2f37124a61754227a56d92c2e19ef9395a091 100644 --- a/src/app/components/Overlay.js +++ b/src/app/components/Overlay.js @@ -89,7 +89,7 @@ export default function Overlay({ <div className="grid w-full pt-[160px] h-dvh text-base 2xl:grid-cols-[150px_minmax(0,1fr)_500px] xl:grid-cols-[150px_minmax(0,1fr)_400px] grid-cols-[150px_minmax(0,1fr)]" > - <div className="min-h-0"> + <div className="min-h-0 overflow-y-auto"> <SideBar setFilterState={setFilterState} filterState={filterState} /> </div> {children} diff --git a/src/app/components/SideBar.js b/src/app/components/SideBar.js index 5b6f95deb2dcf28864d9111d13f0379e7ab8039b..de221a3f6a377f2dc627c049e0573a972ab54351 100644 --- a/src/app/components/SideBar.js +++ b/src/app/components/SideBar.js @@ -12,8 +12,10 @@ import { Person } from "@mui/icons-material"; import FileUploadIcon from '@mui/icons-material/FileUpload'; import { isLoggedIn } from "../handlers/loginHandler"; import NeedLoginModal from "./needLoginModal"; +import LogoutRounded from '@mui/icons-material/LogoutRounded'; import { getStoredValue, + removeFromLocalStorage, } from "../handlers/localStorageHandler"; /** @@ -24,18 +26,11 @@ import { const acessoRapido = [ { - title: "Publicar", - icon: FileUploadIcon, - href: "/publicar", - id: "Publicar Recurso", - }, - { - title: "MEC", - icon: VerifiedIcon, - href: "MEC", - id: "MEC", + title: "Meu perfil", + icon: Person, + href: "/perfil", + id: "Perfil", }, - { title: "Coleções", icon: CollectionsBookmarkIcon, @@ -48,23 +43,35 @@ const acessoRapido = [ href: "LearningObject", id: "Recursos", }, - { - title: "Perfil", - icon: Person, - href: "/perfil", - id: "Perfil", - }, { title: "Sobre", icon: HelpIcon, href: "/sobre", id: "Sobre", }, + { + title: "MEC", + icon: VerifiedIcon, + href: "MEC", + id: "MEC", + }, + { + title: "Publicar", + icon: FileUploadIcon, + href: "/publicar", + id: "Publicar Recurso", + }, { title: "Contato", icon: EmailRoundedIcon, href: "/contato", id: "Contato", + }, + { + title: "Sair", + icon: LogoutRounded, + href: "/sobre", + id: "sobre", } ]; @@ -108,7 +115,17 @@ export default function SideBar({ setFilterState, filterState }) { } }; - const [needLoginOpen, setNeedLoginOpen] = useState(false); + const [needLoginOpen, setNeedLoginOpen] = useState(false); + + const handleLogout = () => { + removeFromLocalStorage("access_token"); + removeFromLocalStorage("user_data"); + removeFromLocalStorage("uid"); + removeFromLocalStorage("expiry"); + removeFromLocalStorage("token-type"); + removeFromLocalStorage("client"); + window.location.reload(); + } const handleOpenLogin = () => { @@ -132,18 +149,24 @@ export default function SideBar({ setFilterState, filterState }) { <NeedLoginModal open={needLoginOpen} setOpen={setNeedLoginOpen} /> <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-3 w-full "> + <div className="flex flex-col justify-start items-center gap-3 w-full mb-5"> {acessoRapido - .filter(item => isLoggedIn() || item.href !== "/perfil") + .filter(item => isLoggedIn() || (item.title !== "Sair" && item.href !== "/perfil")) .map((item, index) => { return ( <Link - onClick={item.href === "/publicar" ? handleOpenLogin : () => { }} + onClick={() => { + if (item.title === "Sair") { + handleLogout(); + } else if (item.href === "/publicar" && !isLoggedIn()) { + handleOpenLogin(); + } + }} href={item.href === "/publicar" ? (isLoggedIn() ? "/publicar" : "") : getHref(item.href)} key={index} alt={item.title} title={item.title} - className={`aspect-square cursor-pointer hover:bg-lightGray-HC-white hover:text-darkGray-HC-dark-underline focus:bg-lightGray-HC-white text-center rounded-lg pt-2 w-[80px] + className={`aspect-square cursor-pointer hover:bg-lightGray-HC-white hover:text-darkGray-HC-dark-underline focus:bg-lightGray-HC-white text-center rounded-lg pt-2 w-[88px] ${(page === item.href) || (pathname.startsWith(item.href)) ? "bg-lightGray-HC-white text-darkGray-HC-dark-underline font-bold" : ""} `} >