import React, { Component } from "react";
import { connect } from "react-redux";
import { Card } from "semantic-ui-react";

class ClientProfile extends Component {
  render() {
    const { selfUser } = this.props;
    return <ClientProfileView user={selfUser} />;
  }
}

function mapStateToProps(state) {
  return { ...state.user };
}

const ClientProfileView = ({ user }) => (
  <Card fluid={true}>
    <Card.Content>
      <Card.Header>Client Information</Card.Header>
      {user.client &&
        user.client.business_number &&
        <Card.Meta>Business Number: {user.client.business_number}</Card.Meta>}
    </Card.Content>
  </Card>
);

export default connect(mapStateToProps)(ClientProfile);