16 |
17 |
18 |
19 |
20 |
--------------------------------------------------------------------------------
/tailwind.config.js:
--------------------------------------------------------------------------------
1 | /** @type {import('tailwindcss').Config} */
2 | export default {
3 | content: ["./src/**/*.{js,jsx}", "./*.html"],
4 | theme: {
5 | extend: {
6 | colors: {
7 | bgBlack: "#212325",
8 | lightBlue: "#9CDAF1",
9 | darkBlue: "#368186",
10 | lightRed: "#F4CBB2",
11 | lightGrey: "#ABABAB",
12 | darkGrey: "#2E3136",
13 | },
14 | fontFamily: {
15 | primary: "Inter",
16 | secondary: "Borel"
17 | },
18 | screens: {
19 | xxl: "1751px",
20 | mmd: "851px",
21 | gsm: "571px",
22 | msm: "491px",
23 | vsm: "441px",
24 | vvsm: "351px",
25 | },
26 | },
27 | },
28 | plugins: [],
29 | };
30 |
--------------------------------------------------------------------------------
/src/components/Cursor.jsx:
--------------------------------------------------------------------------------
1 | import { useEffect } from "react";
2 | import moveCursor from "../utils/moveCursor";
3 |
4 | const Cursor = () => {
5 | useEffect(() => {
6 | moveCursor();
7 | });
8 |
9 | return (
10 | <>
11 |
15 |
19 |
20 | );
21 | };
22 |
23 | export default Cursor;
24 |
--------------------------------------------------------------------------------
/src/components/Footer.jsx:
--------------------------------------------------------------------------------
1 | const Footer = () => {
2 | return (
3 |
18 | );
19 | };
20 |
21 | export default Footer;
22 |
--------------------------------------------------------------------------------
/src/utils/validateGithubUsername.js:
--------------------------------------------------------------------------------
1 | import { octokit } from "./getOctokit";
2 |
3 | export default async function validateGithubUsername(ghUsername) {
4 | try {
5 | const res = await octokit.rest.users.getByUsername({
6 | username: ghUsername,
7 | });
8 | //Storing data to local storage before returning
9 | storeDataToLocalStorage(res);
10 | return true;
11 | } catch (error) {
12 | console.clear();
13 | return false;
14 | }
15 | }
16 |
17 | //Store user data to local storage
18 | function storeDataToLocalStorage(res) {
19 | localStorage.setItem("username", res.data.login);
20 | localStorage.setItem("followers", res.data.followers);
21 | localStorage.setItem("location", res.data.location);
22 | localStorage.setItem("avatar", res.data.avatar_url);
23 | localStorage.setItem("githubUrl", res.data.html_url);
24 | }
25 |
--------------------------------------------------------------------------------
/features.txt:
--------------------------------------------------------------------------------
1 | Canvas on login page
2 | Lazy Loading
3 | Search Functionality
4 | Dependabot
5 | Dockerise
6 | CI/CD
7 |
8 |
9 | Data fetch Done:
10 |
11 | Separate Card:
12 | badgeDetailsIcon
13 |
14 |
15 | Implemented:
16 |
17 |
18 | >Username
19 | >Followers
20 | >Location
21 | >Badge
22 |
23 | >Total Contributions
24 | >Issues Opened
25 | >Issues Closed
26 | >Total Commits
27 | >Total Pull Requests
28 |
29 | Separate Card:
30 | [getActiveDays()]
31 | >Active Days(activeDays)
32 | >Most Productive Date(mostProductiveDate) + maxContributionCount on that day(maxContributionCount)
33 | >Max. Streak(maxStreak)
34 |
35 | Separate Card:
36 | >Top Repo 1
37 | >Top Repo 2
38 | >Top Repo 3
39 |
40 | Separate Card:
41 | >Popular Pr name
42 | >Popular Pr state
43 | >Popular Pr creation date
44 | >Popular Pr URL
45 |
46 | Separate Card:
47 | [getMostUsedLanguage()]
48 | >Most used languages[Array of 5]
49 | {Show using piechart by utilising chart.js}
50 |
51 |
52 |
53 |
54 |
--------------------------------------------------------------------------------
/src/utils/getAllRepos.js:
--------------------------------------------------------------------------------
1 | import { octokit } from "./getOctokit";
2 |
3 | export default async function getAllRepos(username){
4 | try {
5 | let page = 1;
6 | let repos = [];
7 |
8 | // eslint-disable-next-line no-constant-condition
9 | while (true) {
10 | const response = await octokit.request(`GET https://api.github.com/users/${username}/repos?page=${page}`);
11 | const data = await response.data;
12 |
13 | if (data.length === 0) {
14 | // No more repositories, break the loop
15 | break;
16 | }
17 |
18 | // Add the current page's repositories to the overall list
19 | repos = [...repos, ...data];
20 |
21 | // Move to the next page
22 | page++;
23 | }
24 | return repos;
25 | } catch (error) {
26 | console.error('Error fetching user repositories:', error);
27 | }
28 | }
--------------------------------------------------------------------------------
/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "wrapgit",
3 | "private": true,
4 | "version": "0.0.0",
5 | "type": "module",
6 | "scripts": {
7 | "dev": "vite",
8 | "build": "vite build",
9 | "lint": "eslint . --ext js,jsx --report-unused-disable-directives --max-warnings 0",
10 | "preview": "vite preview"
11 | },
12 | "dependencies": {
13 | "@cubejs-client/core": "^0.35.23",
14 | "chart.js": "^4.4.1",
15 | "octokit": "^3.1.2",
16 | "react": "^18.3.1",
17 | "react-dom": "^18.3.1",
18 | "react-github-calendar": "^4.1.3",
19 | "react-icons": "^5.2.1",
20 | "react-router-dom": "^6.22.1"
21 | },
22 | "devDependencies": {
23 | "@types/react": "^18.3.1",
24 | "@types/react-dom": "^18.3.0",
25 | "@vitejs/plugin-react": "^4.2.1",
26 | "autoprefixer": "^10.4.19",
27 | "eslint": "^8.55.0",
28 | "eslint-plugin-react": "^7.34.1",
29 | "eslint-plugin-react-hooks": "^4.6.2",
30 | "eslint-plugin-react-refresh": "^0.4.5",
31 | "postcss": "^8.4.33",
32 | "tailwindcss": "^3.4.1",
33 | "vite": "^5.1.7"
34 | }
35 | }
36 |
--------------------------------------------------------------------------------
/src/components/ContributionGraph.jsx:
--------------------------------------------------------------------------------
1 | /* eslint-disable react/prop-types */
2 | import { GiWinterGloves } from "react-icons/gi";
3 | import GithubContributionCalendar from "./GithubContributionCalendar";
4 |
5 | const ContributionGraph = ({userDetails}) => {
6 | const { username } = userDetails;
7 |
8 | return (
9 | 14 | {`"${quote ?? 'Hope is a good thing my friend.'}"`}19 |
15 | 16 | {`-${author ?? 'Master Mickey'}`} 17 | 18 |
16 | {alertError} 17 |
18 | 24 |242 | 243 | {/* Star on Github */} 244 | 249 | 254 | 255 | {/* Footer Section */} 256 | 257 |