import React from 'react';
import { Modal, Button, Nav, NavItem } from 'react-bootstrap';
import { WaitIcon, Profile } from '../../components';
import { app } from '../../core/app';
import { server } from '../../commons/server';
import { changeWorkspace } from '../session';

export default class WorkspaceSel extends React.Component {

    constructor(props) {
        super(props);

        this.close = this.close.bind(this);
    }

    componentWillMount() {
        const self = this;
        const handler = app.add(evt => {
            if (evt === 'open-ws-sel') {
                server.post('/api/sys/workspaces').then(res => {
                    self.setState({ list: res });
                });
                self.setState({ show: true });
            }
        });

        this.state = { handler: handler };
    }

    shouldComponentUpdate(np, newState) {
        return !!newState.show;
    }

    componentWillUnmount() {
        app.remove(this.state.handler);
    }

    close() {
        this.setState({ show: null });
        this.forceUpdate();
    }

    changeWs(ws) {
        return () => {
            changeWorkspace(ws.id);
        };
    }

    render() {
        if (!this.state.show) {
            return null;
        }

        const list = this.state.list;
        const wsid = app.getState().session.userWorkspaceId;

        const bodyStyle = {
            overflowY: 'auto',
            maxHeight: window.innerHeight * 0.7
        };

        return React.createElement(
            Modal,
            { show: this.state.show },
            React.createElement(
                Modal.Header,
                { closeButton: true, onHide: this.close },
                React.createElement(
                    Modal.Title,
                    { id: 'contained-modal-title' },
                    __('changews')
                )
            ),
            React.createElement(
                Modal.Body,
                null,
                React.createElement(
                    'div',
                    { style: bodyStyle },
                    list ? React.createElement(
                        Nav,
                        { bsStyle: 'pills', stacked: true, className: 'nav-select' },
                        list.map(ws => React.createElement(
                            NavItem,
                            { bsStyle: 'pills',
                                key: ws.id,
                                onClick: this.changeWs(ws),
                                active: ws.id === wsid,
                                disabled: ws.id === wsid },
                            React.createElement(Profile, { type: 'ws', title: ws.name, size: 'small' })
                        ))
                    ) : React.createElement(WaitIcon, { type: 'card' })
                )
            ),
            React.createElement(
                Modal.Footer,
                null,
                React.createElement(
                    Button,
                    { bsStyle: 'primary', onClick: this.close },
                    __('action.cancel')
                )
            )
        );
    }
}

WorkspaceSel.propTypes = {};