I #5: Add "showForLoggedIn" flag for navigation elements #6

Merged
Aelita4 merged 1 commits from 5_dont_show_login into main 2023-11-17 10:59:30 +00:00
1 changed files with 17 additions and 7 deletions

View File

@ -8,6 +8,7 @@ interface NavElement {
title: string;
type: "simple" | "dropdown";
url: string;
showForLoggedIn: boolean;
dropdowns?: Array<NavElement>;
}
@ -16,40 +17,49 @@ const lang = await getLocales(getHighestWeightedLanguage(Astro.request.headers.g
const listOfElements: Array<NavElement> = [{
title: lang["Link_home"],
type: "simple",
url: "/"
url: "/",
showForLoggedIn: true
}, {
title: lang["Link_login"],
type: "simple",
url: "/login"
url: "/login",
showForLoggedIn: false
}, {
title: lang["Link_register"],
type: "simple",
url: "/register"
url: "/register",
showForLoggedIn: false
},{
title: lang["Link_dropdown"],
type: "dropdown",
url: "about:blank",
showForLoggedIn: true,
dropdowns: [{
title: "drop1",
type: "simple",
url: "aaa"
url: "aaa",
showForLoggedIn: true
}, {
title: "drop2",
type: "simple",
url: "aaa"
url: "aaa",
showForLoggedIn: true
}, {
title: "drop3",
type: "simple",
url: "aaa"
url: "aaa",
showForLoggedIn: true
}]
}];
const { loggedIn } = Astro.props;
const filteredList = listOfElements.filter(element => (element.showForLoggedIn && loggedIn === "true") || loggedIn === "false");
---
<nav>
<ul>
{listOfElements.map(element =>
{filteredList.map(element =>
element.type === "dropdown" ?
<div class="nav-item nav-item-dropdown">
<li><a href={element.url} class="nav-url">{element.title}</a></li>