Merge pull request #306 from csarnataro/add-skype-and-telegram-to-social-links

Add social links to Skype and Telegram

README.md

@@ -222,6 +222,8 @@ const config = {
     dev: '',
     stackoverflow: '', // format: userid/username
     website: '',
+    skype: '',
+    telegram: '',
     phone: '',
     email: '',
   },
@@ -446,7 +448,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, Mastodon, Facebook, Instagram, Dribbble, Behance, Medium, dev, Stack Overflow, personal website, phone and email.
+You can link your social media services you're using, including LinkedIn, Twitter, Mastodon, Facebook, Instagram, Dribbble, Behance, Medium, dev, Stack Overflow, Skype, Telegram, personal website, phone and email.
 
 ```js
 // gitprofile.config.js
@@ -463,6 +465,8 @@ const config = {
     medium: '',
     dev: '',
     stackoverflow: '',
+    skype: '',
+    telegram: '',
     website: '',
     phone: '',
     email: '',

gitprofile.config.js

@@ -21,6 +21,8 @@ const config = {
     medium: 'arifszn',
     dev: 'arifszn',
     stackoverflow: '', // format: userid/username
+    skype: '',
+    telegram: '',
     website: 'https://arifszn.com',
     phone: '',
     email: 'arifulalamszn@gmail.com',

package-lock.json

@@ -1,12 +1,12 @@
 {
   "name": "@arifszn/gitprofile",
-  "version": "2.3.0",
+  "version": "2.4.0",
   "lockfileVersion": 2,
   "requires": true,
   "packages": {
     "": {
       "name": "@arifszn/gitprofile",
-      "version": "2.3.0",
+      "version": "2.4.0",
       "license": "MIT",
       "dependencies": {
         "react": "^18.2.0",

package.json

@@ -1,7 +1,7 @@
 {
   "name": "@arifszn/gitprofile",
   "description": "Create an automatic portfolio based on GitHub profile",
-  "version": "2.3.0",
+  "version": "2.4.0",
   "license": "MIT",
   "author": "arifszn",
   "repository": {

src/components/GitProfile.jsx

@@ -255,6 +255,8 @@ GitProfile.propTypes = {
       dev: PropTypes.string,
       stackoverflow: PropTypes.string,
       website: PropTypes.string,
+      skype: PropTypes.string,
+      telegram: PropTypes.string,
       phone: PropTypes.string,
       email: PropTypes.string,
     }),

src/components/details/index.jsx

@@ -15,8 +15,10 @@ import {
   FaDev,
   FaFacebook,
   FaGlobe,
+  FaSkype,
   FaMastodon,
   FaStackOverflow,
+  FaTelegram,
 } from 'react-icons/fa';
 import PropTypes from 'prop-types';
 import { skeleton } from '../../helpers/utils';
@@ -210,6 +212,23 @@ const Details = ({ profile, loading, social, github }) => {
                   link={social.website}
                 />
               )}
+              {social?.skype && (
+                <ListItem
+                  icon={<FaSkype className="mr-2" />}
+                  title="Skype"
+                  value={social.skype}
+                  link={`skype:${social.skype}?chat`}
+                />
+              )}
+              {social?.telegram && (
+                <ListItem
+                  icon={<FaTelegram className="mr-2" />}
+                  title="Telegram"
+                  value={social.telegram}
+                  link={`https://t.me/${social.telegram}`}
+                />
+              )}
+
               {social?.phone && (
                 <ListItem
                   icon={<RiPhoneFill className="mr-2" />}

src/helpers/utils.jsx

@@ -158,6 +158,8 @@ export const sanitizeConfig = (config) => {
       website: config?.social?.website,
       phone: config?.social?.phone,
       email: config?.social?.email,
+      skype: config?.social?.skype,
+      telegram: config?.social?.telegram,
     },
     resume: {
       fileUrl: config?.resume?.fileUrl || '',

types/index.d.ts

@@ -94,6 +94,16 @@ export interface Social {
    */
   website?: string;
 
+  /**
+   * Skype username
+   */
+  skype?: string;
+
+  /**
+   * Telegram username
+   */
+  telegram?: string;
+
   /**
    * Phone
    */