LasTres/js-src/components/menu-bar.tsx

43 lines
1002 B
TypeScript

'use strict'
import * as React from 'react'
export interface MenuBarProps {
isLoggedIn: boolean
};
export interface MenuItem {
onClick: () => void
text: string
};
export default function MenuBar (props: MenuBarProps): JSX.Element {
const isLoggedIn = props.isLoggedIn
const menuItems: MenuItem[] = []
fillMenu(menuItems, isLoggedIn)
return (
<nav className="menu-bar">
{
menuItems.map((item, i) => <a key={i} href="#" onClick={item.onClick}>{item.text}</a>)
}
</nav>
)
}
function fillMenu (menuItems: MenuItem[], isLoggedIn: boolean): void {
if (isLoggedIn) {
menuItems.push({
text: 'Cerrar Sesión',
onClick: () => { alert('logout') }
})
return
}
menuItems.push({
text: 'Regístrate',
onClick: () => { alert('register') }
})
menuItems.push({
text: 'Inicia Sesión',
onClick: () => { alert('login') }
})
}