import _                                  from 'lodash';
import { Meteor }                         from 'meteor/meteor';

import React, { Component }               from 'react';
import { Link }                           from 'react-router';
import { If, Case }                       from '/imports/client/components/Logic';
import { Avatar }                         from '/imports/client/components/Avatar';

import { logout }                         from '/imports/client/app/utils/loginMethods';

import { EmailPane }                      from '/imports/client/views/verify/EmailPane';
import ReactSVG                           from 'react-svg'


export class VerifyLayout extends Component {

  render() {
    const user = this.props.data.user;

    return (
      <div className = "wizardLayout-box">
        <div className = "wizardLayout-top">
            <div className="container">
                <div className = "wizardLayout-topSpace logo-space-0">
                    <ReactSVG
                          path="/files/images/svg/logo--white.svg"
                          className="enterPane__logo"
                      />
                 </div>
                  <div className = "wizardLayout-topGroup">
                    <div className = "wizardLayout-topItem">
                      <Avatar
                        user  = {user}
                        size  = {20}
                        small = {true}
                      />
                      &nbsp;
                      {user.getFullName()}
                    </div>
                    <div
                      className = "wizardLayout-topItem"
                      onClick   = {() => logout()}
                    >
                      <i className="icon icon-simple icon-power"></i>
                    </div>
                  </div>
            </div>
        </div>

        <div className = "wizardLayout-wrap">
          <div className = "wizardLayout-content">

            <EmailPane
              user = {user}
            />
            
          </div>
        </div>
      </div>
    );
  };
  
};