diff --git a/src/api-helpers/card-data-adapter.ts b/src/api-helpers/card-data-adapter.ts index 38b42d6..c400cf9 100644 --- a/src/api-helpers/card-data-adapter.ts +++ b/src/api-helpers/card-data-adapter.ts @@ -15,6 +15,7 @@ import { CodeReviewsData } from '@/components/templates/CodeReviews'; import { OSSContribsData } from '@/components/templates/OSSContribs'; import { sum } from 'ramda'; import { Username } from '@/components/templates/index'; +import { DependantsData } from '@/components/templates/Dependants'; export const getDataFromGithubResponse = (data: GitHubDataResponse) => { const intro: IntroCardProps | null = { @@ -92,6 +93,15 @@ export const getDataFromGithubResponse = (data: GitHubDataResponse) => { } : null; + const userReviewers: DependantsData | null = + data.top_reviewers.length >= 2 + ? { + userAvatar: data.user.avatar_url, + dependants: data.top_reviewers, + username: data.user.login + } + : null; + return { username: data.user.login, [CardTypes.UNWRAPPED_INTRO]: intro, @@ -102,7 +112,8 @@ export const getDataFromGithubResponse = (data: GitHubDataResponse) => { [CardTypes.ZEN_OR_NINJA]: zenOrNinja, [CardTypes.CONTRIBUTION_STREAK]: contributionStreak, [CardTypes.TOP_REVIEWERS]: codeReviewerStats, - [CardTypes.OSS_CONTRIBUTION]: ossContribsData + [CardTypes.OSS_CONTRIBUTION]: ossContribsData, + [CardTypes.IT_TAKES_A_VILLAGE]: userReviewers } as Record< CardTypes, | IntroCardProps @@ -114,6 +125,7 @@ export const getDataFromGithubResponse = (data: GitHubDataResponse) => { | StreakData | CodeReviewsData | OSSContribsData + | DependantsData | null > & Username; diff --git a/src/api-helpers/general.ts b/src/api-helpers/general.ts index 2ce400e..8a3f2ad 100644 --- a/src/api-helpers/general.ts +++ b/src/api-helpers/general.ts @@ -1,7 +1,5 @@ import { websiteUrl } from '../constants/general'; -import { IntroCardProps } from '../components/templates/IntroCard'; -import { TimeOfTheDayData } from '../components/templates/TimeOfTheDay'; -import { GitHubDataResponse, GithubData } from '../types/api-responses'; +import { GitHubDataResponse } from '../types/api-responses'; import { CardTypes } from '../types/cards'; import { getDataFromGithubResponse } from './card-data-adapter'; @@ -11,38 +9,9 @@ export function arrayBufferToBuffer(arrayBuffer: ArrayBuffer): Buffer { return nodeBuffer; } -export const cardTemplateAdaptor = (data: GithubData) => { - let result: Record< - keyof typeof CardTypes, - IntroCardProps | TimeOfTheDayData | null - >; - result = { - [CardTypes.UNWRAPPED_INTRO]: { - username: data.data.username, - year: data.data.year - }, - [CardTypes.DAY_NIGHT_CYCLE]: { - prsDuringDay: data.data.commits_during_day, - totalPrs: data.data.total_commits - }, - [CardTypes.YOUR_CONTRIBUTIONS]: null, - [CardTypes.CONTRIBUTION_STREAK]: null, - [CardTypes.ZEN_OR_NINJA]: null, - [CardTypes.IT_TAKES_A_VILLAGE]: null, - [CardTypes.GUARDIAN_OF_PROD]: null, - [CardTypes.TOP_REVIEWERS]: null, - [CardTypes.PR_TIME_LAGS]: null, - [CardTypes.PR_REVIEWED_VS_AUTHORED]: null, - [CardTypes.PRODUCTION_BREAKING]: null, - [CardTypes.OSS_CONTRIBUTION]: null - }; - - return result; -}; - export const abbreviateNumber = (value: number): string => { if (value > 1000) { - return String(Number((value / 1000).toFixed(2))) + 'k'; + return String(Number((value / 1000).toFixed(2))) + 'K'; } return String(value); }; diff --git a/src/components/templates/Dependants.tsx b/src/components/templates/Dependants.tsx index c8a94a5..0341f59 100644 --- a/src/components/templates/Dependants.tsx +++ b/src/components/templates/Dependants.tsx @@ -1,26 +1,26 @@ import React, { FC } from 'react'; import { websiteUrl } from '../../constants/general'; import { RootCard } from './RootCard'; -import { GithubReview } from '../../mocks/github'; import { Username } from '@/components/templates/index'; export type DependantsData = { - user: GithubReview; - dependants: GithubReview[]; + userAvatar: string; + dependants: string[]; + username: string; }; export const Dependants: FC = ({ - user, + username, dependants, - username + userAvatar }) => { const village = `${websiteUrl}/assets/images/village.png`; - const attachedNodes = dependants.map( - (d) => '@' + shortenUsername(d.userName) - ); + const attachedNodes = dependants + .slice(0, 4) + .map((userName) => '@' + shortenUsername(userName)); const centralNode = { - userName: '@' + shortenUsername(user.userName), - avatar: user.avatar + userName: '@' + shortenUsername(username), + avatar: userAvatar }; return ( @@ -36,14 +36,15 @@ export const Dependants: FC = ({

And shipping

your code involved

- {attachedNodes.length} people{' '} - this year! + {dependants.length} people this + year!

@@ -84,6 +85,9 @@ const Graph: FC<{ 'my-4 flex relative top-4 p-1 mx-1 bg-[#788DDE] rounded-full items-center' } > +

+ My top reviewers +

+

+ My top reviewers +

+

+ My top reviewers +

+

+ My top reviewers +

( const shortenUsername = (username: string) => { const split = username.split(''); - if (split.length > 20) { - return split.slice(0, 20).join('') + '...'; + if (split.length > 18) { + return split.slice(0, 18).join('') + '...'; } return username; }; diff --git a/src/mocks/github.ts b/src/mocks/github.ts index 69d2d7c..5b95b8a 100644 --- a/src/mocks/github.ts +++ b/src/mocks/github.ts @@ -53,9 +53,7 @@ export const ghData = { export type GithubReview = { name: string; userName: string; - avatar: string; - recievedFromUser?: boolean; - gaveToUser?: boolean; + avatar?: string; }; export const updatedGhData = { diff --git a/src/pages/api/preview/dependants.tsx b/src/pages/api/preview/dependants.tsx index 56ac8a2..68e8609 100644 --- a/src/pages/api/preview/dependants.tsx +++ b/src/pages/api/preview/dependants.tsx @@ -1,57 +1,32 @@ import { createImageUsingVercel } from '@/api-helpers/vercel-generator'; import { CardTypes } from '../../../types/cards'; import { DependantsData } from '../../../components/templates/Dependants'; -import { GithubReview } from '../../../mocks/github'; -import { Username } from '@/components/templates'; export const config = { runtime: 'edge' }; -const generateStringOfNCharacters = (n: number) => { - return Array(n).fill('a').join(''); -}; - -export const generateRandomNumberBetween = ( - min: number = 0, - max: number = 40 -) => { - return Math.floor(Math.random() * (max - min + 1) + min); -}; - -const mockGithubDependants: GithubReview[] = [ - { - name: 'John Doe', - userName: generateStringOfNCharacters(generateRandomNumberBetween()), - avatar: 'https://picsum.photos/id/11/200' - }, - { - name: 'Jane Doe', - userName: generateStringOfNCharacters(generateRandomNumberBetween()), - avatar: 'https://picsum.photos/id/21/200' - }, - { - name: 'John Smith', - userName: generateStringOfNCharacters(generateRandomNumberBetween()), - avatar: 'https://picsum.photos/id/31/200' - }, - { - name: 'Smith', - userName: generateStringOfNCharacters(generateRandomNumberBetween()), - avatar: 'https://picsum.photos/id/31/200' - } +const mockGithubDependants = [ + 'jayantbhjandoiahdoahdlal', + 'amoghjalan', + 'dhruvagarwal', + 'shivam-bit', + 'e-for-eshaan', + 'sidmohanty11', + 'Sing-Li', + 'adnanhashmi09', + 'axonasif', + 'Palanikannan1437', + 'Dnouv', + 'dkurt' ]; -const mockGithubUser: GithubReview = { - name: 'eshaan', - userName: 'eshaan007', - avatar: 'https://picsum.photos/id/41/200' -}; +const mockGithubUser = 'eshaan007'; -const data: DependantsData & Username = { +const data: DependantsData = { dependants: mockGithubDependants, - user: mockGithubUser, - username: 'jayantbh' + username: mockGithubUser, + userAvatar: 'https://avatars.githubusercontent.com/u/70485812?v=4' }; const generateUsingVercel = async () => {