Merge pull request #88 from golles/add_instagram

Add social: Instagram

README.md

@@ -164,6 +164,7 @@ const config = {
     linkedin: '',
     twitter: '',
     facebook: '',
+    instagram: '',
     dribbble: '',
     behance: '',
     medium: '',
@@ -361,7 +362,7 @@ Your avatar and bio will be fetched from GitHub automatically.
 
 ### Social Links
 
-You can link your social media services you're using, including LinkedIn, Twitter, Facebook, Dribbble, Behance, Medium, dev, personal website, phone and email.
+You can link your social media services you're using, including LinkedIn, Twitter, Facebook, Instagram, Dribbble, Behance, Medium, dev, personal website, phone and email.
 
 ```js
 // gitprofile.config.js
@@ -371,6 +372,7 @@ module.exports = {
     linkedin: 'ariful-alam',
     twitter: 'arif_swozon',
     facebook: '',
+    instagram: '',
     dribbble: '',
     behance: '',
     medium: '',

gitprofile.config.js

@@ -14,6 +14,7 @@ const config = {
     linkedin: 'ariful-alam',
     twitter: 'arif_szn',
     facebook: '',
+    instagram: '',
     dribbble: '',
     behance: '',
     medium: '',

src/components/GitProfile.jsx

@@ -239,6 +239,7 @@ GitProfile.propTypes = {
       linkedin: PropTypes.string,
       twitter: PropTypes.string,
       facebook: PropTypes.string,
+      instagram: PropTypes.string,
       dribbble: PropTypes.string,
       behance: PropTypes.string,
       medium: PropTypes.string,

src/components/details/index.jsx

@@ -1,5 +1,9 @@
 import { MdLocationOn, MdMail } from 'react-icons/md';
-import { AiFillGithub, AiFillMediumSquare } from 'react-icons/ai';
+import {
+  AiFillGithub,
+  AiFillInstagram,
+  AiFillMediumSquare,
+} from 'react-icons/ai';
 import { SiTwitter } from 'react-icons/si';
 import { GrLinkedinOption } from 'react-icons/gr';
 import { CgDribbble } from 'react-icons/cg';
@@ -128,6 +132,14 @@ const Details = ({ profile, loading, social, github }) => {
                   link={`https://www.facebook.com/${social.facebook}`}
                 />
               )}
+              {typeof social.instagram !== 'undefined' && social.instagram && (
+                <ListItem
+                  icon={<AiFillInstagram className="mr-2" />}
+                  title="Instagram:"
+                  value={social.instagram}
+                  link={`https://www.instagram.com/${social.instagram}`}
+                />
+              )}
               {typeof social.medium !== 'undefined' && social.medium && (
                 <ListItem
                   icon={<AiFillMediumSquare className="mr-2" />}

src/helpers/utils.jsx

@@ -191,6 +191,11 @@ export const sanitizeConfig = (config) => {
         typeof config.social.facebook !== 'undefined'
           ? config.social.facebook
           : '',
+      instagram:
+        typeof config.social !== 'undefined' &&
+        typeof config.social.instagram !== 'undefined'
+          ? config.social.instagram
+          : '',
       dribbble:
         typeof config.social !== 'undefined' &&
         typeof config.social.dribbble !== 'undefined'

types/index.d.ts

@@ -54,6 +54,11 @@ export interface Social {
    */
   facebook?: string;
 
+  /**
+   * Instagram
+   */
+  instagram?: string;
+
   /**
    * Dribbble
    */