You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
|
|
|
import React, { Component } from "react";
|
|
|
|
import { connect } from "react-redux";
|
|
|
|
import { Card, Container, Header, Label, List } from "semantic-ui-react";
|
|
|
|
|
|
|
|
class Profile extends Component {
|
|
|
|
render() {
|
|
|
|
const { selfUser } = this.props;
|
|
|
|
return <ProfileView user={selfUser} />;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
function mapStateToProps(state) {
|
|
|
|
return { ...state.user };
|
|
|
|
}
|
|
|
|
|
|
|
|
const ProfileView = ({ user }) => (
|
|
|
|
<Container>
|
|
|
|
<Header>Profile</Header>
|
|
|
|
<Card>
|
|
|
|
<Card.Content>
|
|
|
|
<Card.Header>{user.username || "No username!"}</Card.Header>
|
|
|
|
<Card.Meta>{user.email || "No email!"}</Card.Meta>
|
|
|
|
<Card.Description>
|
|
|
|
<span>
|
|
|
|
{user.client && "Client"}{user.provider && "Provider"}
|
|
|
|
{!user.client && !user.provider && "User Registration Not Completed"}
|
|
|
|
</span>
|
|
|
|
{user.first_name} {user.last_name}
|
|
|
|
{user.userinfo && <List>
|
|
|
|
{Object.keys(user.userinfo).map(function(key) {
|
|
|
|
return (<List.Item key={key}>
|
|
|
|
{key}: {user.userinfo[key]}
|
|
|
|
</List.Item>)
|
|
|
|
})}
|
|
|
|
</List>}
|
|
|
|
</Card.Description>
|
|
|
|
</Card.Content>
|
|
|
|
<Card.Content extra>
|
|
|
|
<Label color={user.is_active ? "teal" : "red"} size="tiny" tag>
|
|
|
|
{user.is_active ? "Active" : "Deactivated"}
|
|
|
|
</Label>
|
|
|
|
</Card.Content>
|
|
|
|
</Card>
|
|
|
|
</Container>
|
|
|
|
);
|
|
|
|
|
|
|
|
export default connect(mapStateToProps)(Profile);
|