profile-piktor-v3 v0.0.3

Piktor Profile

This repo is used to host the Piktor Profile component that we have developed, to use as a module in our products.

Installation

• Install Piktor Profile using npm or yarn.

  npm install piktor-profile

  yarn add piktor-profile

• Import it into your project

  import PiktorProfile from 'piktor-profile';

• Use it as follows

  <PiktorProfile
    userData={user}
    callback={key => callbackHandler(key)}
    customStyle={customStyle}
    editable
  />

Props

1. UserData - Pass a user object in the structure mentioned below:

     {
       user_name: STRING,
       user_id: STRING,
       user_photo: STRING,
       user_email: STRING,
       user_mobile: STRING,
       designation: STRING,
       job_location: STRING,
       user_social_profiles: [
         {
           social_platform: STRING,
           activeIcon: FILE,
           inactiveIcon: FILE,
           isEnabled: BOOLEAN,
           username: STRING,
           link: STRING,
           id: STRING
         }
       ],
       aspirations: [],
       skills: [
         {
           "_id" : STRING,
           "name" : STRING,
           "id" : STRING,
           "icon" : FILE,
           "achievement" : BOOLEAN
         }
       ],
       recognitions: [
         {
           "_id" : STRING,
           "title" : STRING,
           "issuer" : STRING,
           "issue_date" : STRING,
           "description" : STRING,
           "id" : STRING
         }
       ],
       work_experience: [
         {
           "_id" : STRING,
           "title" : STRING,
           "company_name" : STRING,
           "start_date" : DATE,
           "end_date" : DATE || STRING,
           "description" : STRING,
           "place" : STRING
         }
       ],
       education: [
         {
           "_id" : STRING,
           "school" : STRING,
           "degree" : STRING,
           "start_year" : STRING,
           "end_year" : STRING,
           "id" : STRING
         }
       ],
       personalStatement: STRING
     }

2. Editing - Boolean to specify if profile is in edit state or not.

3. Editable - The boolean to specify whether it is editable, or view only.

4. customStyle - The style prop. Right now, it supports these properties: primaryColor, secondaryColor, fontFamilyMain, fontFamilyTitle, fontFamilyHeading.

5. callback - A generic callback for all connections from the profile to the application. You will receive a key, and an optional list of arguements, which you can handle in your application.