aheh/github-profile-readme-generator
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge branch 'master' of https://github.com/rahuldkjain/github-profile-readme-generator

Browse Source
This commit is contained in:
Citrinin
2020-10-25 11:35:34 +03:00
parent 66561ce2a1 bca0f7a18c
commit f3ca29df8b
21 changed files with 722 additions and 55 deletions
Download Patch File Download Diff File Expand all files Collapse all files
jest.config.js
+9
View File
@@ -12,4 +12,13 @@ module.exports = {
__PATH_PREFIX__: ``,
},
setupFiles: [`<rootDir>/loadershim.js`],
snapshotSerializers: ["enzyme-to-json/serializer"],
"coverageThreshold": {
"global": {
"branches": 100,
"functions": 100,
"lines": 100,
"statements": 100
}
}
}
package-lock.json
Generated
+1 -1
View File
@@ -28673,4 +28673,4 @@
"integrity": "sha512-V50KMwwzqJV0NpZIZFwfOD5/lyny3WlSzRiXgA0G7VUnRlqttta1L6UQIHzd6EuBY/cHGfwTIck7w1yH6Q5zUw=="
}
}
}
}
package.json
+4 -2
View File
@@ -6,6 +6,9 @@
"author": "Rahul Jain <rahuldkjain@gmail.com>",
"dependencies": {
"@primer/octicons-react": "^10.0.0",
"enzyme": "^3.11.0",
"enzyme-adapter-react-16": "^1.15.5",
"enzyme-to-json": "^3.6.1",
"gatsby": "^2.23.12",
"gatsby-image": "^2.4.9",
"gatsby-plugin-google-analytics": "^2.3.11",
@@ -35,7 +38,6 @@
"identity-obj-proxy": "3.0.0",
"jest": "26.4.2",
"prettier": "2.0.5",
"react-test-renderer": "16.13.1",
"tailwindcss": "^1.7.6"
},
"keywords": [
@@ -49,7 +51,7 @@
"start": "npm run develop",
"serve": "gatsby serve",
"clean": "gatsby clean",
"test": "jest",
"test": "jest -i -u --coverage",
"deploy": "gatsby build --prefix-paths && gh-pages -d public -b master"
},
"repository": {
src/components/__tests__/__snapshots__/donate.test.js.snap
+102
View File
@@ -0,0 +1,102 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`Donate renders correctly 1`] = `
Array [
<div
className="text-center text-4xl my-2"
>
Support 
<span
aria-label="praying hand emoji"
role="img"
>
🙏
</span>
</div>,
<div
className="flex flex-col sm:flex-row items-start justify-between"
>
<div
className="w-full sm:w-2/3"
>
<div
className="text-2xl mb-2"
>
Are you using the tool and happy with it to create your GitHub Profile?
</div>
<div
className="text-lg"
>
Your kind support keeps open-source tools like this free for others.
</div>
<div
className="mt-4"
>
<a
className="flex items-center justify-start w-20"
href="https://twitter.com/intent/tweet?text=Wow:&url=https%3A%2F%2Frahuldkjain.github.io%2Fgithub-profile-readme-generator"
>
<img
alt="tweet github profile readme generator"
className="w-20"
src="https://img.shields.io/twitter/url?style=social&url=https%3A%2F%2Frahuldkjain.github.io%2Fgithub-profile-readme-generator"
/>
</a>
Let the world know how you feel using this tool. Share with others on twitter.
</div>
</div>
<div
className="w-full sm:w-1/3 flex flex-col justify-center items-center"
>
<span>
Tip
<span
aria-label="Dollar medal"
role="img"
>
💰
</span>
</span>
<a
className="flex items-center justify-evenly bg-red-500 text-white py-2 px-4 my-2"
href="https://ko-fi.com/A0A81XXSX"
rel="noreferrer"
target="_blank"
>
<img
alt="Buy ko-fi for rahuldkjain"
className="w-6 h-6 mr-2"
src="https://www.vectorlogo.zone/logos/ko-fi/ko-fi-icon.svg"
/>
Buy me a ko-fi
</a>
<a
className="flex items-center justify-evenly bg-blue-500 text-white py-2 px-4 my-2"
href="https://www.paypal.me/rahuldkjain/10"
rel="noreferrer"
target="_blank"
>
<img
alt="Donate rahuldkjain via paypal"
className="w-6 h-6 mr-2"
src="https://cdn.worldvectorlogo.com/logos/paypal-icon.svg"
/>
Paypal
</a>
<a
className="flex items-center justify-evenly bg-orange-500 text-white py-2 px-4 my-2"
href="https://www.buymeacoffee.com/rahuldkjain"
rel="noreferrer"
target="_blank"
>
<img
alt="Buy rahuldkjain A Coffee"
className="w-6 h-6 mr-2"
src="https://www.vectorlogo.zone/logos/buymeacoffee/buymeacoffee-icon.svg"
/>
Buy me a coffee
</a>
</div>
</div>,
]
`;
src/components/__tests__/__snapshots__/footer.test.js.snap
+169
View File
@@ -0,0 +1,169 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`Footer component Matches the snapshot 1`] = `
<div
className="bg-gray-100 p-4 flex flex-col justify-center items-center shadow-inner mt-2"
>
<div
className="w-full flex flex-col sm:flex-row justify-evenly py-2"
>
<div
className="ml-2 sm:ml-0 sm:mr-6 order-last sm:order-none flex"
>
<h1
className="text-base font-bold font-title text-xl sm:text-2xl mt-3 sm:mt-0"
>
<div
className="flex sm:flex-col items-start mb-3 sm:mb-0"
>
<img
alt="github profile markdown generator logo"
className="hidden sm:block h-24"
src="test-file-stub"
/>
<div
className="mr-2 sm:mr-0"
>
GitHub Profile
<img
alt="github profile markdown generator logo"
className="inline sm:hidden h-12"
src="test-file-stub"
/>
<span
className="block sm:inline"
>
README Generator
</span>
</div>
</div>
</h1>
</div>
<div
className="text-xl sm:text-base font-light sm:font-normal"
>
<div
className="font-title font-bold mb-4 sm:mb-2"
>
<strong>
Pages
</strong>
</div>
<div
className="ml-2 sm:ml-0"
>
<a
href="/addons"
>
Addons
</a>
</div>
<div
className="ml-2 sm:ml-0"
>
<a
href="/support"
>
Support
</a>
</div>
<div
className="ml-2 sm:ml-0"
>
<a
href="/about"
>
About
</a>
</div>
</div>
<div
className="text-xl sm:text-base font-light sm:font-normal"
>
<div
className="font-title font-bold my-4 sm:my-0 sm:mb-2"
>
<strong>
More
</strong>
</div>
<div
className="ml-2 sm:ml-0"
>
<a
aria-label="Github rahuldkjain/github-profile-readme-generator"
href="https://github.com/rahuldkjain/github-profile-readme-generator"
target="blank"
>
Github
</a>
</div>
<div
className="ml-2 sm:ml-0"
>
<a
aria-label="Releases on Github rahuldkjain/github-profile-readme-generator"
href="https://github.com/rahuldkjain/github-profile-readme-generator/releases"
target="blank"
>
Releases
</a>
</div>
<div>
<a
aria-label="Issues in rahuldkjain/github-profile-readme-generator"
href="https://github.com/rahuldkjain/github-profile-readme-generator/issues"
target="blank"
>
Issues
</a>
</div>
<div>
<a
aria-label="Pull Requests in rahuldkjain/github-profile-readme-generator"
href="https://github.com/rahuldkjain/github-profile-readme-generator/pulls"
target="blank"
>
Pull Requests
</a>
</div>
</div>
<div>
<div
className="font-title font-bold text-xl sm:text-base my-4 sm:my-0 sm:mb-2"
>
<strong>
Join Community
</strong>
</div>
<div>
<a
aria-label="Discord of the community"
href="https://discord.gg/HHMs7Eg"
target="blank"
>
<img
alt="Discord of the community"
className="h-12"
src="test-file-stub"
/>
</a>
</div>
</div>
</div>
<div
className="py-2 mt-2"
>
Developed in India
<span
aria-label="india"
role="img"
>
🇮🇳
</span>
</div>
</div>
`;
src/components/__tests__/__snapshots__/loader.test.js.snap
+23
View File
@@ -0,0 +1,23 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`Loader renders correctly 1`] = `
<div
className="loader"
>
<span>
↓
</span>
<span>
↓
</span>
<span>
↓
</span>
<span>
↓
</span>
<span>
↓
</span>
</div>
`;
src/components/__tests__/__snapshots__/subtitle.test.js.snap
+19
View File
@@ -0,0 +1,19 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`Subtitle renders correctly 1`] = `
<div
className="flex justify-center items-start flex-col w-full px-2 sm:px-6 mb-10"
>
<div
className="text-xl sm:text-2xl font-bold font-title mt-2 mb-2"
>
Subtitle
</div>
<input
className="outline-none w-full text-xs sm:text-lg sm:w-1/2 border-t-0 border-l-0 border-r-0 border solid border-gray-900 py-1 px-2 focus:border-blue-700"
id="subtitle"
onChange={[Function]}
value="A passionate frontend developer from India"
/>
</div>
`;
src/components/__tests__/__snapshots__/title.test.js.snap
+3 -3
View File
@@ -1,6 +1,6 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`Title renders correctly 1`] = `
exports[`Title renders title component correctly 1`] = `
<div
className="flex justify-center items-start flex-col w-full px-2 sm:px-6 mb-10"
>
@@ -16,14 +16,14 @@ exports[`Title renders correctly 1`] = `
className="outline-none w-24 sm:w-40 mr-10 border-t-0 border-l-0 border-r-0 border solid border-gray-900 py-1 px-2 focus:border-blue-700 prefix"
id="title-prefix"
onChange={[Function]}
value="Hi 👋, I'm"
value="test_title"
/>
<input
className="outline-none placeholder-gray-700 w-1/2 sm:w-1/3 border-t-0 border-l-0 border-r-0 border solid border-gray-900 py-1 px-2 focus:border-blue-700"
id="title-name"
onChange={[Function]}
placeholder="name"
value=""
value="test_data"
/>
</div>
</div>
src/components/__tests__/__snapshots__/work.test.js.snap
+184
View File
@@ -0,0 +1,184 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`Work renders work component correctly 1`] = `
<div
className="flex justify-center items-start flex-col w-full px-2 sm:px-6 mb-10"
>
<div
className="text-xl sm:text-2xl font-bold font-title mt-2 mb-2"
>
Work
</div>
<div
className="text-xs sm:text-lg flex flex-col sm:flex-row mb-10 justify-center sm:justify-start items-center sm:items-start w-full px-4 sm:px-0"
>
<input
className="outline-none placeholder-gray-700 mr-8 w-full sm:w-1/3 border-t-0 border-l-0 border-r-0 border solid border-gray-900 py-1 px-2 focus:border-blue-700"
id="currentWork-prefix"
onChange={[Function]}
placeholder="Hi, I'm "
value="test_currentwork"
/>
<input
className="outline-none placeholder-gray-700 mr-8 w-full sm:w-1/4 border-t-0 border-l-0 border-r-0 border solid border-gray-900 py-1 px-2 focus:border-blue-700"
id="currentWork"
onChange={[Function]}
placeholder="project name"
/>
<input
className="outline-none placeholder-gray-700 mr-8 sm:mr-0 text-blue-700 w-full sm:w-1/4 border-t-0 border-l-0 border-r-0 border solid border-gray-900 py-1 px-2 focus:border-blue-700"
id="currentWork-link"
onChange={[Function]}
placeholder="project link"
value="test_currentwork"
/>
</div>
<div
className="text-xs sm:text-lg flex flex-col sm:flex-row mb-10 justify-center sm:justify-start items-center sm:items-start w-full px-4 sm:px-0"
>
<input
className="outline-none mr-8 w-full sm:w-1/3 border-t-0 border-l-0 border-r-0 border solid border-gray-900 py-1 px-2 focus:border-blue-700"
id="collaborateOn-prefix"
onChange={[Function]}
/>
<input
className="outline-none placeholder-gray-700 mr-8 w-full sm:w-1/4 border-t-0 border-l-0 border-r-0 border solid border-gray-900 py-1 px-2 focus:border-blue-700"
id="collaborateOn"
onChange={[Function]}
placeholder="project name"
/>
<input
className="outline-none placeholder-gray-700 mr-8 sm:mr-0 text-blue-700 w-full sm:w-1/4 border-t-0 border-l-0 border-r-0 border solid border-gray-900 py-1 px-2 focus:border-blue-700"
id="collaborateOn-link"
onChange={[Function]}
placeholder="project link"
/>
</div>
<div
className="text-xs sm:text-lg flex flex-col sm:flex-row mb-10 justify-center sm:justify-start items-center sm:items-start w-full px-4 sm:px-0"
>
<input
className="outline-none placeholder-gray-700 mr-8 w-full sm:w-1/3 border-t-0 border-l-0 border-r-0 border solid border-gray-900 py-1 px-2 focus:border-blue-700"
id="helpWith-prefix"
onChange={[Function]}
/>
<input
className="outline-none placeholder-gray-700 mr-8 w-full sm:w-1/4 border-t-0 border-l-0 border-r-0 border solid border-gray-900 py-1 px-2 focus:border-blue-700"
id="helpWith"
onChange={[Function]}
placeholder="project name"
/>
<input
className="outline-none placeholder-gray-700 mr-8 sm:mr-0 text-blue-700 w-full sm:w-1/4 border-t-0 border-l-0 border-r-0 border solid border-gray-900 py-1 px-2 focus:border-blue-700"
id="helpWith-link"
onChange={[Function]}
placeholder="project link"
/>
</div>
<div
className="text-xs sm:text-lg flex flex-col sm:flex-row mb-10 justify-center sm:justify-start items-center sm:items-start w-full px-4 sm:px-0"
>
<input
className="outline-none mr-8 w-full sm:w-1/3 border-t-0 border-l-0 border-r-0 border solid border-gray-900 py-1 px-2 focus:border-blue-700"
id="currentLearn-prefix"
onChange={[Function]}
/>
<input
className="outline-none placeholder-gray-700 w-full sm:w-1/3 border-t-0 border-l-0 border-r-0 border solid border-gray-900 py-1 px-2 focus:border-blue-700"
id="currentLearn"
onChange={[Function]}
placeholder="Frameworks, courses etc."
/>
</div>
<div
className="text-xs sm:text-lg flex flex-col sm:flex-row mb-10 justify-center sm:justify-start items-center sm:items-start w-full px-4 sm:px-0"
>
<input
className="outline-none mr-8 w-full sm:w-1/3 border-t-0 border-l-0 border-r-0 border solid border-gray-900 py-1 px-2 focus:border-blue-700"
id="ama-prefix"
onChange={[Function]}
/>
<input
className="outline-none placeholder-gray-700 mr-8 sm:mr-0 w-full sm:w-1/3 border-t-0 border-l-0 border-r-0 border solid border-gray-900 py-1 px-2 focus:border-blue-700"
id="ama"
onChange={[Function]}
placeholder="react, vue and gsap"
/>
</div>
<div
className="text-xs sm:text-lg flex flex-col sm:flex-row mb-10 justify-center sm:justify-start items-center sm:items-start w-full px-4 sm:px-0"
>
<input
className="outline-none mr-8 w-full sm:w-1/3 border-t-0 border-l-0 border-r-0 border solid border-gray-900 py-1 px-2 focus:border-blue-700"
id="contact-prefix"
onChange={[Function]}
/>
<input
className="outline-none placeholder-gray-700 mr-8 sm:mr-0 w-full sm:w-1/3 border-t-0 border-l-0 border-r-0 border solid border-gray-900 py-1 px-2 focus:border-blue-700"
id="contact"
onChange={[Function]}
placeholder="example@gmail.com"
/>
</div>
<div
className="text-xs sm:text-lg flex flex-col sm:flex-row mb-10 justify-center sm:justify-start items-center sm:items-start w-full px-4 sm:px-0"
>
<input
className="outline-none mr-8 w-full sm:w-1/3 border-t-0 border-l-0 border-r-0 border solid border-gray-900 py-1 px-2 focus:border-blue-700"
id="portfolio-prefix"
onChange={[Function]}
/>
<input
className="outline-none placeholder-gray-700 mr-8 sm:mr-0 text-blue-700 w-full sm:w-1/3 border-t-0 border-l-0 border-r-0 border solid border-gray-900 py-1 px-2 focus:border-blue-700"
id="portfolio"
onChange={[Function]}
placeholder="portfolio link"
/>
</div>
<div
className="text-xs sm:text-lg flex flex-col sm:flex-row mb-10 justify-center sm:justify-start items-center sm:items-start w-full px-4 sm:px-0"
>
<input
className="outline-none mr-8 w-full sm:w-1/3 border-t-0 border-l-0 border-r-0 border solid border-gray-900 py-1 px-2 focus:border-blue-700"
id="blog-prefix"
onChange={[Function]}
/>
<input
className="outline-none placeholder-gray-700 mr-8 sm:mr-0 text-blue-700 w-full sm:w-1/3 border-t-0 border-l-0 border-r-0 border solid border-gray-900 py-1 px-2 focus:border-blue-700"
id="blog"
onChange={[Function]}
placeholder="blog link"
/>
</div>
<div
className="text-xs sm:text-lg flex flex-col sm:flex-row mb-10 justify-center sm:justify-start items-center sm:items-start w-full px-4 sm:px-0"
>
<input
className="outline-none mr-8 w-full sm:w-1/3 border-t-0 border-l-0 border-r-0 border solid border-gray-900 py-1 px-2 focus:border-blue-700"
id="resume-prefix"
onChange={[Function]}
/>
<input
className="outline-none placeholder-gray-700 mr-8 sm:mr-0 text-blue-700 w-full sm:w-1/3 border-t-0 border-l-0 border-r-0 border solid border-gray-900 py-1 px-2 focus:border-blue-700"
id="resume"
onChange={[Function]}
placeholder="resume link"
/>
</div>
<div
className="text-xs sm:text-lg flex flex-col sm:flex-row mb-10 justify-center sm:justify-start items-center sm:items-start w-full px-4 sm:px-0"
>
<input
className="outline-none mr-8 w-full sm:w-1/3 border-t-0 border-l-0 border-r-0 border solid border-gray-900 py-1 px-2 focus:border-blue-700"
id="funFact-prefix"
onChange={[Function]}
/>
<input
className="outline-none placeholder-gray-700 mr-8 sm:mr-0 w-full sm:w-1/3 border-t-0 border-l-0 border-r-0 border solid border-gray-900 py-1 px-2 focus:border-blue-700"
id="funFact"
onChange={[Function]}
placeholder="I think I am funny"
/>
</div>
</div>
`;
src/components/__tests__/donate.test.js
+13
View File
@@ -0,0 +1,13 @@
import React from "react"
import renderer from "react-test-renderer"
import Donate from "../donate"
describe("Donate", () => {
it("renders correctly", () => {
const tree = renderer
.create(<Donate />)
.toJSON()
expect(tree).toMatchSnapshot()
})
})
src/components/__tests__/footer.test.js
+11
View File
@@ -0,0 +1,11 @@
import React from "react"
import renderer from "react-test-renderer"
import Footer from "../footer"
describe("Footer component", () => {
test("Matches the snapshot", () => {
const footer = renderer.create(<Footer />).toJSON();
expect(footer).toMatchSnapshot();
});
});
src/components/__tests__/loader.test.js
+11
View File
@@ -0,0 +1,11 @@
import React from "react"
import renderer from "react-test-renderer"
import Loader from "../loader"
describe("Loader", () => {
it("renders correctly", () => {
const tree = renderer.create(<Loader />).toJSON()
expect(tree).toMatchSnapshot()
})
})
src/components/__tests__/subtitle.test.js
+13
View File
@@ -0,0 +1,13 @@
import React from "react"
import renderer from "react-test-renderer"
import Subtitle from "../subtitle"
describe("Subtitle", () => {
it("renders correctly", () => {
const tree = renderer
.create(<Subtitle data={{ subtitle: "A passionate frontend developer from India" }} />)
.toJSON()
expect(tree).toMatchSnapshot()
})
})
src/components/__tests__/title.test.js
+24 -7
View File
@@ -1,13 +1,30 @@
import React from "react"
import renderer from "react-test-renderer"
import Title from "../title"
import {configure, shallow} from "enzyme";
import toJson from "enzyme-to-json";
import Adapter from "enzyme-adapter-react-16";
configure({ adapter: new Adapter() });
describe("Title", () => {
it("renders correctly", () => {
const tree = renderer
.create(<Title prefix={{ title: "Hi 👋, I'm" }} data={{ title: "" }} />)
.toJSON()
expect(tree).toMatchSnapshot()
})
const mockEvent = { target: { value: "This is a mock event" } },
props = {
prefix: {
title: "test_title",
currentWork: "test_currentwork"
},
data: {title: "test_data"},
link: {currentWork: "test_currentwork"},
handlePrefixChange: jest.fn().mockReturnValue({}),
handleLinkChange: jest.fn().mockReturnValue({}),
handleDataChange: jest.fn().mockReturnValue({}),
};
it("renders title component correctly", () => {
const component = shallow(<Title {...props}/>);
component.find('input').at(0).simulate('change', mockEvent);
component.find('input').at(1).simulate('change', mockEvent);
expect(toJson(component)).toMatchSnapshot();
});
})
src/components/__tests__/work.test.js
+32
View File
@@ -0,0 +1,32 @@
import React from "react";
import { shallow, configure } from 'enzyme';
import toJson from 'enzyme-to-json';
import Adapter from 'enzyme-adapter-react-16';
import Work from "../work"
configure({ adapter: new Adapter() });
describe("Work", () => {
const props = {
prefix: {
title: "test_title",
currentWork: "test_currentwork"
},
data: {title: "test_data"},
link: {currentWork: "test_currentwork"},
handlePrefixChange: jest.fn().mockReturnValue({}),
handleLinkChange: jest.fn().mockReturnValue({}),
handleDataChange: jest.fn().mockReturnValue({}),
},
mockEvent = { target: { value: "This is a mock event" } };
it("renders work component correctly", () => {
let i;
const component = shallow(<Work {...props}/>);
for (i = 0; i < component.find('input').length; i++) {
component.find('input').at(i).simulate('change', mockEvent);
}
expect(toJson(component)).toMatchSnapshot();
});
});
src/components/footer.js
+4 -4
View File
@@ -7,7 +7,7 @@ const Footer = () => {
return (
<div className="bg-gray-100 p-4 flex flex-col justify-center items-center shadow-inner mt-2">
<div className="w-full flex flex-col sm:flex-row justify-evenly py-2">
<div className="ml-2 sm:ml-0 sm:mr-6 order-last sm:order-none flex">
<div className="sm:ml-0 sm:mr-6 order-last sm:order-none flex">
<h1 className="text-base font-bold font-title text-xl sm:text-2xl mt-3 sm:mt-0">
<div className="flex sm:flex-col items-start mb-3 sm:mb-0">
<img
@@ -69,7 +69,7 @@ const Footer = () => {
Releases
</a>
</div>
<div>
<div className="ml-2 sm:ml-0">
<a
href="https://github.com/rahuldkjain/github-profile-readme-generator/issues"
aria-label="Issues in rahuldkjain/github-profile-readme-generator"
@@ -78,7 +78,7 @@ const Footer = () => {
Issues
</a>
</div>
<div>
<div className="ml-2 sm:ml-0">
<a
href="https://github.com/rahuldkjain/github-profile-readme-generator/pulls"
aria-label="Pull Requests in rahuldkjain/github-profile-readme-generator"
@@ -92,7 +92,7 @@ const Footer = () => {
<div className="font-title font-bold text-xl sm:text-base my-4 sm:my-0 sm:mb-2">
<strong>Join Community</strong>
</div>
<div>
<div class="ml-2 sm:ml-0">
<a
href="https://discord.gg/HHMs7Eg"
aria-label="Discord of the community"
src/components/markdown.js
+39 -12
View File
@@ -1,7 +1,10 @@
import React from "react"
import { isMediumUsernameValid } from "../utils/validation"
import { icons, skills, skillWebsites } from "../constants/skills"
import { githubStatsLinkGenerator, topLanguagesLinkGenerator } from "../utils/link-generators"
import {
githubStatsLinkGenerator,
topLanguagesLinkGenerator,
} from "../utils/link-generators"
const Markdown = props => {
const Title = props => {
@@ -81,11 +84,12 @@ const Markdown = props => {
return ""
}
const VisitorsBadge = props => {
let link = "https://komarev.com/ghpvc/?username="
+ props.github
+ `&label=${props.badgeOptions.badgeLabel}`
+ `&color=${props.badgeOptions.badgeColor}`
+ `&style=${props.badgeOptions.badgeStyle}`
let link =
"https://komarev.com/ghpvc/?username=" +
props.github +
`&label=${props.badgeOptions.badgeLabel}` +
`&color=${props.badgeOptions.badgeColor}` +
`&style=${props.badgeOptions.badgeStyle}`
if (props.show) {
return (
<>
@@ -98,7 +102,10 @@ const Markdown = props => {
return ""
}
const TwitterBadge = props => {
let link = "https://img.shields.io/twitter/follow/" + props.twitter + "?logo=twitter&style=for-the-badge"
let link =
"https://img.shields.io/twitter/follow/" +
props.twitter +
"?logo=twitter&style=for-the-badge"
if (props.show) {
return (
<>
@@ -128,7 +135,10 @@ const Markdown = props => {
if (show) {
return (
<>
{`<p>&nbsp;<img align="center" src="${githubStatsLinkGenerator({github: github, options})}" alt="${github}" /></p>`}
{`<p>&nbsp;<img align="center" src="${githubStatsLinkGenerator({
github: github,
options,
})}" alt="${github}" /></p>`}
<br />
<br />
</>
@@ -158,6 +168,7 @@ const Markdown = props => {
social.topcoder ||
social.hackerearth ||
social.geeks_for_geeks ||
social.discord ||
social.rssurl
)
}
@@ -205,7 +216,10 @@ const Markdown = props => {
if (!props.showStats) {
return (
<>
{`<p><img align="center" src="${topLanguagesLinkGenerator({github: props.github, options: props.options})}" alt="${props.github}" /></p>`}
{`<p><img align="center" src="${topLanguagesLinkGenerator({
github: props.github,
options: props.options,
})}" alt="${props.github}" /></p>`}
<br />
<br />
</>
@@ -213,7 +227,10 @@ const Markdown = props => {
}
return (
<>
{`<p><img align="left" src="${topLanguagesLinkGenerator({github: props.github, options: props.options })}" alt="${props.github}" /></p>`}
{`<p><img align="left" src="${topLanguagesLinkGenerator({
github: props.github,
options: props.options,
})}" alt="${props.github}" /></p>`}
<br />
<br />
</>
@@ -236,7 +253,7 @@ const Markdown = props => {
badgeOptions={{
badgeLabel: encodeURI(props.data.badgeLabel),
badgeColor: props.data.badgeColor,
badgeStyle: props.data.badgeStyle
badgeStyle: props.data.badgeStyle,
}}
/>
</>
@@ -320,7 +337,10 @@ const Markdown = props => {
<>
<SectionTitle label="Connect with me:" />
{`<p align="left">`}
</>) : ""}
</>
) : (
""
)}
<br />
<>
<DisplaySocial
@@ -462,6 +482,13 @@ const Markdown = props => {
username={props.social.topcoder}
/>
</>
<>
<DisplaySocial
base="https://discord.gg"
icon="https://cdn.jsdelivr.net/npm/simple-icons@3.0.1/icons/discord.svg"
username={props.social.discord}
/>
</>
<>
<DisplaySocial
base=""
src/components/markdownPreview.js
+35 -19
View File
@@ -1,6 +1,9 @@
import React from "react"
import { icons, skills, skillWebsites } from "../constants/skills"
import { githubStatsLinkGenerator, topLanguagesLinkGenerator } from "../utils/link-generators"
import {
githubStatsLinkGenerator,
topLanguagesLinkGenerator,
} from "../utils/link-generators"
const MarkdownPreview = props => {
const TitlePreview = props => {
@@ -20,8 +23,7 @@ const MarkdownPreview = props => {
return null
}
const SectionTitle = props => {
if (!props.visible)
return null
if (!props.visible) return null
else if (props.label) {
return <h3 className="w-full text-lg sm:text-xl">{props.label}</h3>
}
@@ -113,14 +115,13 @@ const MarkdownPreview = props => {
return null
}
const SocialPreview = props => {
let viewSocial = false;
let viewSocial = false
Object.keys(props.social).forEach(key => {
if (props.social[key] && key != 'github')
viewSocial = true;
if (props.social[key] && key != "github") viewSocial = true
})
return (
<div className="flex justify-start items-end flex-wrap">
<SectionTitle label="Connect with me:" visible={viewSocial}/>
<SectionTitle label="Connect with me:" visible={viewSocial} />
<DisplaySocial
base="https://codepen.io"
icon="https://cdn.jsdelivr.net/npm/simple-icons@3.0.1/icons/codepen.svg"
@@ -222,6 +223,11 @@ const MarkdownPreview = props => {
icon="https://cdn.jsdelivr.net/npm/simple-icons@3.0.1/icons/leetcode.svg"
username={props.social.leetcode}
/>
<DisplaySocial
base="https://discord.gg"
icon="https://cdn.jsdelivr.net/npm/simple-icons@3.0.1/icons/discord.svg"
username={props.social.discord}
/>
<DisplaySocial
base=""
icon="https://cdn.jsdelivr.net/npm/simple-icons@3.0.1/icons/rss.svg"
@@ -231,11 +237,12 @@ const MarkdownPreview = props => {
)
}
const VisitorsBadgePreview = props => {
let link = "https://komarev.com/ghpvc/?username="
+ props.github
+ `&label=${props.badgeOptions.badgeLabel}`
+ `&color=${props.badgeOptions.badgeColor}`
+ `&style=${props.badgeOptions.badgeStyle}`
let link =
"https://komarev.com/ghpvc/?username=" +
props.github +
`&label=${props.badgeOptions.badgeLabel}` +
`&color=${props.badgeOptions.badgeColor}` +
`&style=${props.badgeOptions.badgeStyle}`
if (props.show) {
return (
<div className="text-left my-2">
@@ -247,7 +254,10 @@ const MarkdownPreview = props => {
return null
}
const TwitterBadgePreview = props => {
let link = "https://img.shields.io/twitter/follow/" + props.twitter + "?logo=twitter&style=for-the-badge"
let link =
"https://img.shields.io/twitter/follow/" +
props.twitter +
"?logo=twitter&style=for-the-badge"
if (props.show) {
return (
<div className="text-left my-2">
@@ -276,21 +286,27 @@ const MarkdownPreview = props => {
return null
}
const GitHubStatsPreview = ({github, options, show })=> {
const GitHubStatsPreview = ({ github, options, show }) => {
if (show) {
return (
<div className="text-center mx-4 mb-4">
<img src={githubStatsLinkGenerator({github, options})} alt={github} />
<img
src={githubStatsLinkGenerator({ github, options })}
alt={github}
/>
</div>
)
}
return null
}
const TopLanguagesPreview = ({github, options, show})=> {
const TopLanguagesPreview = ({ github, options, show }) => {
if (show) {
return (
<div className="text-center mx-4 mb-4">
<img src={topLanguagesLinkGenerator({github, options})} alt={props.github} />
<img
src={topLanguagesLinkGenerator({ github, options })}
alt={props.github}
/>
</div>
)
}
@@ -314,7 +330,7 @@ const MarkdownPreview = props => {
})
return listSkills.length > 0 ? (
<div className="flex flex-wrap justify-start items-center">
<SectionTitle label="Languages and Tools:" visible={true}/>
<SectionTitle label="Languages and Tools:" visible={true} />
{listSkills}
</div>
) : (
@@ -331,7 +347,7 @@ const MarkdownPreview = props => {
badgeOptions={{
badgeLabel: encodeURI(props.data.badgeLabel),
badgeColor: props.data.badgeColor,
badgeStyle: props.data.badgeStyle
badgeStyle: props.data.badgeStyle,
}}
/>
<GithubProfileTrophyPreview
src/components/social.js
+14
View File
@@ -303,6 +303,20 @@ const Social = props => {
}
/>
</div>
<div className="w-1/2 flex justify-center items-center text-xxs sm:text-lg py-4 pr-2 sm:pr-0">
<img
src="https://cdn.jsdelivr.net/npm/simple-icons@3.1.0/icons/discord.svg"
className="w-6 h-6 sm:w-8 sm:h-8 mr-1 sm:mr-4"
alt="discord"
/>
<input
id="discord"
placeholder="discord invite (only code)"
className="outline-none placeholder-gray-700 w-32 sm:w-1/2 border-t-0 border-l-0 border-r-0 border solid border-gray-900 py-1 px-2 focus:border-blue-700"
value={props.social.discord}
onChange={event => props.handleSocialChange("discord", event)}
/>
</div>
<div className="w-1/2 flex justify-center items-center text-xxs sm:text-lg py-4 pr-2 sm:pr-0">
<img
src="https://cdn.jsdelivr.net/npm/simple-icons@3.1.0/icons/rss.svg"
src/constants/skills.js
+3
View File
@@ -105,6 +105,7 @@ const categorizedSkills = {
"cockroachdb",
"elasticsearch",
"sqlite",
"mssql",
],
},
@@ -432,6 +433,7 @@ const icons = {
postman: "https://www.vectorlogo.zone/logos/getpostman/getpostman-icon.svg",
erlang: "https://www.vectorlogo.zone/logos/erlang/erlang-official.svg",
sqlite: "https://www.vectorlogo.zone/logos/sqlite/sqlite-icon.svg",
mssql: "https://cdn.worldvectorlogo.com/logos/microsoft-sql-server.svg",
middleman:
"https://raw.githubusercontent.com/leungwensen/svg-icon/b84b3f3a3da329b7c1d02346865f8e98beb05413/dist/svg/logos/middleman.svg",
matlab: "https://raw.githubusercontent.com/simple-icons/simple-icons/master/icons/mathworks.svg",
@@ -579,6 +581,7 @@ const skillWebsites = {
travisci: "https://travis-ci.org",
apachecordova: "https://cordova.apache.org/",
sqlite: "https://www.sqlite.org/",
mssql: "https://www.microsoft.com/en-us/sql-server",
postman: "https://postman.com",
erlang: "https://www.erlang.org/",
middleman: "https://middlemanapp.com/",
src/pages/index.js
+9 -7
View File
@@ -27,7 +27,7 @@ import SEO from "../components/seo"
import {
isGitHubUsernameValid,
isMediumUsernameValid,
isTwitterUsernameValid
isTwitterUsernameValid,
} from "../utils/validation"
import Layout from "../components/layout"
@@ -117,6 +117,7 @@ const DEFAULT_SOCIAL = {
topcoder: "",
hackerearth: "",
geeks_for_geeks: "",
discord: "",
rssurl: "",
}
@@ -184,7 +185,8 @@ const IndexPage = () => {
const handleSocialChange = (field, e) => {
let change = { ...social }
change[field] = e.target.value.toLowerCase()
change[field] =
field === "discord" ? e.target.value : e.target.value.toLowerCase()
setSocial(change)
}
@@ -472,7 +474,7 @@ const IndexPage = () => {
)
setSkills(restoreDataSkills || DEFAULT_SKILLS)
} catch (error) {
} finally {
} finally {
setRestore("")
}
}
@@ -485,7 +487,7 @@ const IndexPage = () => {
setRestore(reader.result)
}
}
return (
<Layout>
<div className="m-4 sm:p-4">
@@ -721,14 +723,14 @@ const IndexPage = () => {
onChange={e => setRestore(e.target.value)}
/>
<div class="overflow-hidden relative w-64 mt-4 mb-4">
<div className="overflow-hidden relative w-64 mt-4 mb-4">
<input
class="cursor-pointer absolute block opacity-0 pin-r pin-t before:cursor-pointer"
className="cursor-pointer absolute block opacity-0 pin-r pin-t before:cursor-pointer"
type="file"
name="vacancyImageFiles"
onChange={handleFileInput}
/>
<button class="text-xxs sm:text-sm border-2 w-40 border-solid border-gray-900 bg-gray-100 flex items-center justify-center py-1">
<button className="text-xxs sm:text-sm border-2 w-40 border-solid border-gray-900 bg-gray-100 flex items-center justify-center py-1">
Upload json file
</button>
</div>