@influitive/profile-card

Profile Card

A pop over component that displays the an specific user information and provide some relevant links.

###Installation Add "@influitive/profile-card": "X.X.XX" to the projects package JSON ( X.X.XX corresponds to the version you want to use)

Run npm install

###Usage In your component:

import ProfileCard from '@influitive/profile-card/lib';

<ProfileCard
  id={contactUUID} 
  disableViewProfile={aBooleanProp}
  disableMessage={aBooleanProp}
  children={wrappedElement} />

###Props

• id Uuid of the user whose information is to be display inside the card.
• disableViewProfile When true hides the link to the user public profile.
• disableMessage When true hides the link to message that contact.
• children Corresponds to the element to be wrapped. The profile card should be toggle when clicking on this element.

Extra Considerations: You will need to style the element that is being wrapped. For avatar images we are normally using:

.profile {
  width: 32px;
  border-radius: 100%;
}

###How it works profile-card is just a regular component built using react-redux. When the children element is clickedan ajax call to the /api/people/${id}.json endpoint to fetch that especific user information.