import * as React from 'react'
import { connect } from 'react-redux'
import { AppState } from '../../../root/reducers'
import { getPaths } from '@lml/core-ui'
import { getAuthProfile, logout, isSuperuser } from '@lml/cosmo-ui-auth'
import { func } from 'prop-types'
import { ProfileModel } from '../../../auth/data'
import {
    Icon,
    Dropdown,
    DropdownItem,
    StylableComponent,
    StylableComponentProps,
} from 'cosmoui'

interface UserMenuProps extends StylableComponentProps { }

interface UserMenuComponentProps extends UserMenuProps {
    // this is massive hack - see my notes in allocation navbar items file
    paths: string[]
    profile: ProfileModel
    routes: any[]
    isSuperuser: boolean
    logout: () => void
}

class UserMenuComponent extends StylableComponent<UserMenuComponentProps> {
    public render() {
        return (
            <Dropdown
                name="authUserMenu"
                position="right"
                icon={<Icon icon="Down" size={22} fill={this.gray()} />}>
                <DropdownItem
                    id="userType"
                    key="userType"
                    active={false}
                    onClick={this.noop}>
                    User type: {this.userType()}
                </DropdownItem>
                <DropdownItem
                    id="logout"
                    key="logout"
                    active={false}
                    onClick={this.handleLogout}>
                    Logout
                </DropdownItem>
            </Dropdown>
        )
    }

    private userType(): string {
        return this.props.isSuperuser ? 'Manager' : 'Controller'
    }

    private handleLogout = () => {
        this.props.logout()
    }

    private noop = (): null => null
}

const mapStateToProps = (state: AppState, ownProps: UserMenuProps) => ({
    paths: getPaths(state),
    profile: getAuthProfile(state),
    isSuperuser: isSuperuser(state),
})

const mapActionsToProps = {
    logout,
}

export const UserMenu = connect(mapStateToProps, mapActionsToProps)(UserMenuComponent)