mirror of
https://github.com/SkyfallWasTaken/skyfalldev.git
synced 2024-12-04 22:57:32 +00:00
Add GitHub Heatmap
This commit is contained in:
parent
4f9f3bd2a3
commit
06af2248b1
7 changed files with 68 additions and 3 deletions
|
@ -1,11 +1,12 @@
|
|||
import { defineConfig } from "astro/config";
|
||||
import mdx from "@astrojs/mdx";
|
||||
import sitemap from "@astrojs/sitemap";
|
||||
|
||||
import tailwind from "@astrojs/tailwind";
|
||||
|
||||
import svelte from "@astrojs/svelte";
|
||||
|
||||
// https://astro.build/config
|
||||
export default defineConfig({
|
||||
site: "https://skyfall.dev",
|
||||
integrations: [mdx(), sitemap(), tailwind()],
|
||||
});
|
||||
integrations: [mdx(), sitemap(), tailwind(), svelte()]
|
||||
});
|
BIN
bun.lockb
BIN
bun.lockb
Binary file not shown.
|
@ -11,6 +11,10 @@
|
|||
"astro": "astro"
|
||||
},
|
||||
"dependencies": {
|
||||
"@astrojs/svelte": "^5.6.0",
|
||||
"activity-calendar-widget": "^0.0.14",
|
||||
"octokit": "^4.0.2",
|
||||
"svelte": "^4.2.18",
|
||||
"tailwind-merge": "^2.3.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
|
|
48
src/components/homepage/GitHubHeatmap.svelte
Normal file
48
src/components/homepage/GitHubHeatmap.svelte
Normal file
|
@ -0,0 +1,48 @@
|
|||
<script lang="ts">
|
||||
import ActivityCalendarWidget from "activity-calendar-widget/svelte";
|
||||
import { Octokit } from "octokit";
|
||||
|
||||
async function loadGitHubActivity() {
|
||||
const octokit = new Octokit();
|
||||
const events = await octokit.rest.activity.listPublicEventsForUser({
|
||||
username: "SkyfallWasTaken",
|
||||
});
|
||||
|
||||
const eventsMap: Map<string, number> = new Map();
|
||||
events.data.forEach((event) => {
|
||||
if (!event.created_at) return;
|
||||
|
||||
let count = eventsMap.get(event.created_at);
|
||||
if (!count) {
|
||||
eventsMap.set(event.created_at, 1);
|
||||
} else {
|
||||
count += 1;
|
||||
eventsMap.set(event.created_at, count);
|
||||
}
|
||||
});
|
||||
|
||||
const array: { date: string; activities: any[] }[] = [];
|
||||
eventsMap.forEach((value, key) => {
|
||||
array.push({
|
||||
date: key.slice(0, 11),
|
||||
activities: Array(value).fill({}),
|
||||
});
|
||||
});
|
||||
console.log(array);
|
||||
return array;
|
||||
}
|
||||
</script>
|
||||
|
||||
<div class="w-full">
|
||||
{#await loadGitHubActivity()}
|
||||
<p>Give us a mo...</p>
|
||||
{:then data}
|
||||
<ActivityCalendarWidget daysToRender={365} {data} levelColorMode={"dark"} />
|
||||
{/await}
|
||||
</div>
|
||||
|
||||
<style>
|
||||
img {
|
||||
width: 82px;
|
||||
}
|
||||
</style>
|
1
src/components/ui/Hr.astro
Normal file
1
src/components/ui/Hr.astro
Normal file
|
@ -0,0 +1 @@
|
|||
<hr class="h-px my-12 bg-surface1 border-0" />
|
|
@ -4,6 +4,8 @@ import Header from "../components/Header.astro";
|
|||
import Footer from "../components/Footer.astro";
|
||||
import { SITE_TITLE, SITE_DESCRIPTION } from "../consts";
|
||||
import Button from "../components/ui/Button.astro";
|
||||
import Hr from "../components/ui/Hr.astro";
|
||||
import GitHubHeatmap from "../components/homepage/GitHubHeatmap.svelte";
|
||||
---
|
||||
|
||||
<!doctype html>
|
||||
|
@ -26,6 +28,10 @@ import Button from "../components/ui/Button.astro";
|
|||
<a href="/blog"><Button>Read my blog</Button></a>
|
||||
</div>
|
||||
</div>
|
||||
<Hr />
|
||||
<div class="flex flex-col gap-4 w-full lg:w-[40%]">
|
||||
<GitHubHeatmap client:load />
|
||||
</div>
|
||||
</main>
|
||||
<Footer />
|
||||
</body>
|
||||
|
|
5
svelte.config.js
Normal file
5
svelte.config.js
Normal file
|
@ -0,0 +1,5 @@
|
|||
import { vitePreprocess } from '@astrojs/svelte';
|
||||
|
||||
export default {
|
||||
preprocess: vitePreprocess(),
|
||||
}
|
Loading…
Reference in a new issue