diff --git a/lib/dashboard.ts b/lib/dashboard.ts new file mode 100644 index 0000000..3a0ce3f --- /dev/null +++ b/lib/dashboard.ts @@ -0,0 +1,28 @@ +import {getTotalFollowers, getTotalRepos, getTotalStars} from '@/lib/github' + +export async function dashboard() { + const [totalRepos, totalFollowers] = await Promise.all([ + getTotalRepos(), + getTotalFollowers() + ]) + + const totalStars = await getTotalStars(totalRepos) + + return [ + { + title: "GitHub Repos", + total: totalRepos, + href: "https://github.com/r-freeman/" + }, + { + title: "GitHub Followers", + total: totalFollowers, + href: "https://github.com/r-freeman/" + }, + { + title: "GitHub Stars", + total: totalStars, + href: "https://github.com/r-freeman/" + } + ] +} \ No newline at end of file diff --git a/lib/github.ts b/lib/github.ts index de4dd7c..2bb4057 100644 --- a/lib/github.ts +++ b/lib/github.ts @@ -1,5 +1,5 @@ -import fetch from 'node-fetch' import type {Repo} from '@/types' +import fetcher from "@/lib/fetcher"; const GITHUB_ACCESS_TOKEN = process.env.GITHUB_ACCESS_TOKEN const GITHUB_GRAPHQL = "https://api.github.com/graphql" @@ -51,7 +51,7 @@ type TotalStarsResponse = { } export async function getPinnedRepos() { - const response = await fetch(GITHUB_GRAPHQL, { + const response = await fetcher(GITHUB_GRAPHQL, { method: 'POST', headers: { 'Content-Type': 'application/json', @@ -78,13 +78,13 @@ export async function getPinnedRepos() { } }` }) - }).then(r => r.json()) as PinnedReposResponse + }) as PinnedReposResponse return response.data.user.pinnedItems.nodes } export async function getTotalRepos() { - const response = await fetch(GITHUB_GRAPHQL, { + const response = await fetcher(GITHUB_GRAPHQL, { method: 'POST', headers: { 'Content-Type': 'application/json', @@ -99,13 +99,13 @@ export async function getTotalRepos() { } }` }) - }).then(r => r.json()) as TotalReposResponse + }) as TotalReposResponse return response.data.user.repositories.totalCount } export async function getTotalFollowers() { - const response = await fetch(GITHUB_GRAPHQL, { + const response = await fetcher(GITHUB_GRAPHQL, { method: 'POST', headers: { 'Content-Type': 'application/json', @@ -120,13 +120,13 @@ export async function getTotalFollowers() { } }` }) - }).then(r => r.json()) as TotalFollowersResponse + }) as TotalFollowersResponse return response.data.user.followers.totalCount } export async function getTotalStars(totalRepos: number) { - const response = await fetch(GITHUB_GRAPHQL, { + const response = await fetcher(GITHUB_GRAPHQL, { method: 'POST', headers: { 'Content-Type': 'application/json', @@ -145,7 +145,7 @@ export async function getTotalStars(totalRepos: number) { } }` }) - }).then(r => r.json()) as TotalStarsResponse + }) as TotalStarsResponse return response.data.user.repositories.nodes .reduce((acc, node) => acc + node.stargazers.totalCount, 0) diff --git a/pages/dashboard.tsx b/pages/dashboard.tsx index 0ae054f..a5ee187 100644 --- a/pages/dashboard.tsx +++ b/pages/dashboard.tsx @@ -1,19 +1,19 @@ import Head from 'next/head' import {GetStaticProps} from 'next' -import useSWR from 'swr' +import useSWR from "swr"; import {SimpleLayout} from '@/components/SimpleLayout' import {Card} from '@/components/Card' import {numberFormat} from '@/lib/numberFormat' +import {dashboard} from '@/lib/dashboard' import fetcher from '@/lib/fetcher' -import {getTotalFollowers, getTotalRepos, getTotalStars} from '@/lib/github' -type DashboardProps = { - totalRepos: number - totalFollowers: number - totalStars: number +type CardProps = { + title: string + total: number + href: string } -export default function Dashboard({totalRepos, totalFollowers, totalStars}: DashboardProps) { +export default function Dashboard({cards}: { cards: CardProps[] }) { const {data} = useSWR('/api/views/', fetcher) const totalArticleViews = Number(data?.views) @@ -43,33 +43,19 @@ export default function Dashboard({totalRepos, totalFollowers, totalStars}: Dash role="list" className="grid grid-cols-1 gap-x-12 gap-y-16 sm:grid-cols-2 lg:grid-cols-3" > - + {cards.map((card) => ( + +

+ {card.title} +

+ + {numberFormat(card.total)} + +
+ ))} +

- GitHub Repos -

- - {numberFormat(totalRepos)} - -
- -

- GitHub Followers -

- - {numberFormat(totalFollowers)} - -
- -

- GitHub Stars -

- - {numberFormat(totalStars)} - -
- -

- Total Article Views + Total Article Views

{totalArticleViews > 0 ? numberFormat(totalArticleViews) : '—'} @@ -82,18 +68,9 @@ export default function Dashboard({totalRepos, totalFollowers, totalStars}: Dash } export const getStaticProps: GetStaticProps = async () => { - const [totalRepos, totalFollowers] = await Promise.all([ - getTotalRepos(), - getTotalFollowers() - ]) - - const totalStars = await getTotalStars(totalRepos) - return { props: { - totalRepos, - totalFollowers, - totalStars + cards: (await dashboard()) } } }