r-freeman/portfolio
1
0
Fork 0
mirror of https://github.com/r-freeman/portfolio.git synced 2024-11-11 18:45:41 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Added raspberry pi data to dashboard

Browse Source
This commit is contained in:
Ryan Freeman 2023-07-30 19:47:25 +01:00
parent f483162e64
commit 1534b88abf
5 changed files with 39 additions and 55 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
app/api/rpi/[slug]/route.ts
View File

@ -1,5 +1,5 @@
import {NextResponse} from 'next/server'
import {getRamUsage, getRootFsUsage, getSysLoad, getTemp, getUptime} from '@/lib/grafana'
import {getRamUsage, getRootFsUsage, getSysLoad, getTemp, getUptime} from '@/lib/pi'
export const fetchCache = 'force-no-store'

51
app/dashboard/page.tsx
View File

@ -9,19 +9,10 @@ export const metadata = {
description: 'This is my digital life in numbers, I use this dashboard to keep track of various metrics across platforms like Spotify, GitHub, Twitter and for monitoring the performance of my Raspberry Pi using Grafana and Prometheus.'
}
const config = {
refreshInterval: 30000
}
export const dynamic = 'force-dynamic'
export default async function Dashboard() {
const metrics = await getDashboardData()
// const tempData = (useSWR('api/grafana/temp', fetcher, config)).data as { temp: string }
// const sysLoadData = (useSWR('api/grafana/sysload', fetcher, config)).data as { sysLoad: string }
// const ramData = (useSWR('api/grafana/ram', fetcher, config)).data as { ramUsage: string }
// const rootFsData = (useSWR('api/grafana/rootfs', fetcher, config)).data as { rootFsUsage: string }
// const uptimeData = (useSWR('api/grafana/uptime', fetcher, config)).data as { days: number }
return (
<SimpleLayout heading="Dashboard."
@ -41,48 +32,6 @@ export default async function Dashboard() {
))}
</CardGroup>
))}
{/*<CardGroup title="Raspberry Pi">*/}
{/* <Card as="li">*/}
{/* <h2 className="text-base font-semibold transition group-hover:text-indigo-500 text-zinc-800 dark:text-zinc-400">*/}
{/* <Card.Link href="#">Temperature</Card.Link>*/}
{/* </h2>*/}
{/* <Card.Description className="mt-0 text-zinc-800 dark:text-zinc-100 font-semibold text-3xl">*/}
{/* {tempData ? `${tempData.temp}℃` : "—"}*/}
{/* </Card.Description>*/}
{/* </Card>*/}
{/* <Card as="li">*/}
{/* <h2 className="text-base font-semibold transition group-hover:text-indigo-500 text-zinc-800 dark:text-zinc-400">*/}
{/* <Card.Link href="#">Sys load (5m avg)</Card.Link>*/}
{/* </h2>*/}
{/* <Card.Description className="mt-0 text-zinc-800 dark:text-zinc-100 font-semibold text-3xl">*/}
{/* {sysLoadData ? `${sysLoadData.sysLoad}%` : "—"}*/}
{/* </Card.Description>*/}
{/* </Card>*/}
{/* <Card as="li">*/}
{/* <h2 className="text-base font-semibold transition group-hover:text-indigo-500 text-zinc-800 dark:text-zinc-400">*/}
{/* <Card.Link href="#">RAM usage</Card.Link>*/}
{/* </h2>*/}
{/* <Card.Description className="mt-0 text-zinc-800 dark:text-zinc-100 font-semibold text-3xl">*/}
{/* {ramData ? `${ramData.ramUsage}%` : "—"}*/}
{/* </Card.Description>*/}
{/* </Card>*/}
{/* <Card as="li">*/}
{/* <h2 className="text-base font-semibold transition group-hover:text-indigo-500 text-zinc-800 dark:text-zinc-400">*/}
{/* <Card.Link href="#">Root FS usage</Card.Link>*/}
{/* </h2>*/}
{/* <Card.Description className="mt-0 text-zinc-800 dark:text-zinc-100 font-semibold text-3xl">*/}
{/* {rootFsData ? `${rootFsData.rootFsUsage}%` : "—"}*/}
{/* </Card.Description>*/}
{/* </Card>*/}
{/* <Card as="li">*/}
{/* <h2 className="text-base font-semibold transition group-hover:text-indigo-500 text-zinc-800 dark:text-zinc-400">*/}
{/* <Card.Link href="#">Uptime days</Card.Link>*/}
{/* </h2>*/}
{/* <Card.Description className="mt-0 text-zinc-800 dark:text-zinc-100 font-semibold text-3xl">*/}
{/* {uptimeData ? `${numberFormat(uptimeData.days)}` : "—"}*/}
{/* </Card.Description>*/}
{/* </Card>*/}
{/*</CardGroup>*/}
</SimpleLayout>
)
}

3
components/ui/Views.tsx
View File

@ -14,9 +14,8 @@ type ViewsProps = {
shouldRender?: boolean
}
const supabase = createPagesBrowserClient()
export function Views({as: Component = 'span', slug, className, shouldUpdateViews = true, shouldRender = true}: ViewsProps) {
const supabase = createPagesBrowserClient()
const {data} = useSWR(`/api/views/${slug}`, fetcher) as { data: { views: number } }
const {mutate} = useSWRConfig()

38
lib/dashboard.ts
View File

@ -3,8 +3,9 @@ import {createServerComponentClient} from '@supabase/auth-helpers-nextjs'
import {getTopRepo, getTotalFollowers, getTotalForks, getTotalRepos, getTotalStars} from '@/lib/github'
import {getAllArticles} from '@/lib/getAllArticles'
import {getTopArtist, getTopGenre} from '@/lib/spotify'
import {getRamUsage, getRootFsUsage, getSysLoad, getTemp, getUptime} from '@/lib/pi'
import {getStats} from '@/lib/statsfm'
import {Metric} from '@/types'
import {getStats} from "@/lib/statsfm";
export async function getDashboardData() {
const supabase = createServerComponentClient({cookies})
@ -21,6 +22,11 @@ export async function getDashboardData() {
const topArtist = await getTopArtist()
const {genre} = await getTopGenre()
const {hoursListened, minutesListened, streams} = await getStats()
const {temp} = await getTemp()
const {sysLoad} = await getSysLoad()
const {ramUsage} = await getRamUsage()
const {rootFsUsage} = await getRootFsUsage()
const {days} = await getUptime()
const metrics: Metric[] = [
{
@ -94,6 +100,36 @@ export async function getDashboardData() {
value: +views,
group: "Blog",
href: "/writing"
},
{
title: "Temp",
value: `${temp} ℃`,
group: "Raspberry Pi",
href: ""
},
{
title: "Sys load (5m avg)",
value: `${sysLoad}%`,
group: "Raspberry Pi",
href: ""
},
{
title: "RAM usage",
value: `${ramUsage}%`,
group: "Raspberry Pi",
href: ""
},
{
title: "Root FS usage",
value: `${rootFsUsage}%`,
group: "Raspberry Pi",
href: ""
},
{
title: "Uptime days",
value: `${Math.round(days)}`,
group: "Raspberry Pi",
href: ""
}
]

0
lib/grafana.ts → lib/pi.ts
View File