import { Component, linkEvent } from 'inferno'; import { Link } from 'inferno-router'; import { repoUrl } from '../utils'; import { UserService } from '../services'; interface NavbarState { isLoggedIn: boolean; expanded: boolean; expandUserDropdown: boolean; } export class Navbar extends Component { emptyState: NavbarState = { isLoggedIn: UserService.Instance.loggedIn, expanded: false, expandUserDropdown: false } constructor(props: any, context: any) { super(props, context); this.state = this.emptyState; this.handleOverviewClick = this.handleOverviewClick.bind(this); // Subscribe to user changes UserService.Instance.sub.subscribe(user => { let loggedIn: boolean = user !== null; this.setState({isLoggedIn: loggedIn}); }); } render() { return (
{this.navbar()}
) } // TODO class active corresponding to current page // TODO toggle css collapse navbar() { return ( ); } expandUserDropdown(i: Navbar) { i.state.expandUserDropdown = !i.state.expandUserDropdown; i.setState(i.state); } handleLogoutClick(i: Navbar) { i.state.expandUserDropdown = false; UserService.Instance.logout(); } handleOverviewClick(i: Navbar) { i.state.expandUserDropdown = false; i.setState(i.state); let userPage = `/user/${UserService.Instance.user.id}`; i.context.router.history.push(userPage); } expandNavbar(i: Navbar) { i.state.expanded = !i.state.expanded; i.setState(i.state); } }