import React from 'react';
import superagent from 'superagent';

import { fromUnixTime } from "date-fns";
import { formatInTimeZone } from 'date-fns-tz'

import { Tab, Header } from 'semantic-ui-react'
import { DEFAULT_TIMEZONE } from '../../CloudApi/Constants.js';

import SocialBlockList from './SocialBlockList.jsx';
import SocialFriendsList from './SocialFriendsList.jsx';
import SocialNotifications from './SocialNotifications.jsx';
import SocialRoomHistory from './SocialRoomHistory.jsx';
import SocialUserHistory from './SocialUserHistory.jsx';
import MenuPageWrapper from '../../Wrappers/MenuPageWrapper.jsx';

export default class AccountSocial extends React.Component {
    async componentDidMount() {
        const res = await superagent.get(`/cloud/admin/account/${this.props.account.id}/social/profile`).accept('json');
        console.log(res.body);
    }
    
    render() {
        if (this.props.account) {
            const panes = [
                { menuItem: 'User History', render: () => <Tab.Pane attached={false}><SocialUserHistory account={this.props.account} /></Tab.Pane> },
                { menuItem: 'Room History', render: () => <Tab.Pane attached={false}><SocialRoomHistory account={this.props.account} /></Tab.Pane> },
                { menuItem: 'Friends', render: () => <Tab.Pane attached={false}><SocialFriendsList account={this.props.account} /></Tab.Pane> },
                { menuItem: 'Notifications', render: () => <Tab.Pane attached={false}><SocialNotifications account={this.props.account} /></Tab.Pane> },
                { menuItem: 'Blocks', render: () => <Tab.Pane attached={false}><SocialBlockList account={this.props.account} /></Tab.Pane> }
            ];

            return (
                <div>
                    <Header as="h2">Social</Header>
                    <Tab menu={{ secondary: true, pointing: true }} panes={panes} />
                </div>
            );
        } else {
            return null;
        }
    }
}