From de2cfb9f6b2ec9c734bda5c99f127c48917095c1 Mon Sep 17 00:00:00 2001 From: Akash Singh Date: Sun, 10 Mar 2024 00:00:36 +0530 Subject: [PATCH] Shows all my github followers on about me page --- .github/workflows/deploy.yml | 1 - .../src/prepverse-theme/about-me-profile.tsx | 264 ++++++++++++++---- 2 files changed, 216 insertions(+), 49 deletions(-) diff --git a/.github/workflows/deploy.yml b/.github/workflows/deploy.yml index aa28b03c..11971703 100644 --- a/.github/workflows/deploy.yml +++ b/.github/workflows/deploy.yml @@ -24,7 +24,6 @@ jobs: - name: Set Variables Data env: - CI: true REACT_APP_FOLLOWERS_ACCESS_KEY: ${{ secrets.REACT_APP_FOLLOWERS_ACCESS_KEY }} run: | echo ${{ secrets.REACT_APP_FOLLOWERS_ACCESS_KEY }} diff --git a/documentation/src/prepverse-theme/about-me-profile.tsx b/documentation/src/prepverse-theme/about-me-profile.tsx index 1f9fe11d..af1fe6b3 100644 --- a/documentation/src/prepverse-theme/about-me-profile.tsx +++ b/documentation/src/prepverse-theme/about-me-profile.tsx @@ -4,13 +4,56 @@ import { useInView } from "framer-motion"; import { CommonThemedImage } from "./common-themed-image"; import { GithubIcon } from "@site/src/prepverse-theme/icons/github"; import { TwitterIcon, LinkedInIcon, InstagramIcon } from "@site/src/prepverse-theme/icons/popover"; -import { LandingSectionCtaButton } from "./landing-section-cta-button"; -import {GitHubFollowers} from "./common-header/github-followers"; -import {GithubFollowersAvatar} from "./common-header/github-followers-avatar"; +import { LandingSectionCtaButton } from "./landing-section-cta-button"; +import { GitHubFollowers } from "./common-header/github-followers"; +import { GithubFollowersAvatar } from "./common-header/github-followers-avatar"; + +const GithubFollowers = ({ className }: { className?: string }) => { + return ( +
+

+ +

+
+ +
+ ); +}; + +const LeetCodeBadges = ({ className }: { className?: string }) => { + return ( + + ); +}; + +const apps = [ + { + name: "GitHub Followers", + showcase: GithubFollowers, + }, +]; export const AboutMeProfile = ({ className }: { className?: string }) => { + const [activeApp, setActiveApp] = React.useState(apps[0]); + + const ShowcaseComponent = React.useMemo(() => { + return activeApp.showcase; + }, [activeApp.name]); + return ( -
{ "bg-no-repeat", "rounded-2xl landing-sm:rounded-3xl", "border dark:border-gray-700 border-gray-200", - "not-prose", )} >
- -
{ className={clsx( "text-base landing-sm:text-2xl", "dark:text-gray-300 text-gray-900", - "rounded-full", - "border dark:border-gray-700 border-gray-200", "font-semibold", "flex items-center", - "p-2" )} > - LeetCode Badges +
{ "border-b border-gray-200 dark:border-gray-700", )} /> +
*/} + +
-
-

+
- -

+
+
f.name === activeApp.name, + )})) translateZ(0px)`, + }} + /> + {apps.map((app, index) => ( + + ))} +
+
+
+
+ +
-
+
);