mirror of
https://github.com/SkyfallWasTaken/skyfalldev.git
synced 2024-11-10 04:09:38 +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 { defineConfig } from "astro/config";
|
||||||
import mdx from "@astrojs/mdx";
|
import mdx from "@astrojs/mdx";
|
||||||
import sitemap from "@astrojs/sitemap";
|
import sitemap from "@astrojs/sitemap";
|
||||||
|
|
||||||
import tailwind from "@astrojs/tailwind";
|
import tailwind from "@astrojs/tailwind";
|
||||||
|
|
||||||
|
import svelte from "@astrojs/svelte";
|
||||||
|
|
||||||
// https://astro.build/config
|
// https://astro.build/config
|
||||||
export default defineConfig({
|
export default defineConfig({
|
||||||
site: "https://skyfall.dev",
|
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"
|
"astro": "astro"
|
||||||
},
|
},
|
||||||
"dependencies": {
|
"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"
|
"tailwind-merge": "^2.3.0"
|
||||||
},
|
},
|
||||||
"devDependencies": {
|
"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 Footer from "../components/Footer.astro";
|
||||||
import { SITE_TITLE, SITE_DESCRIPTION } from "../consts";
|
import { SITE_TITLE, SITE_DESCRIPTION } from "../consts";
|
||||||
import Button from "../components/ui/Button.astro";
|
import Button from "../components/ui/Button.astro";
|
||||||
|
import Hr from "../components/ui/Hr.astro";
|
||||||
|
import GitHubHeatmap from "../components/homepage/GitHubHeatmap.svelte";
|
||||||
---
|
---
|
||||||
|
|
||||||
<!doctype html>
|
<!doctype html>
|
||||||
|
@ -26,6 +28,10 @@ import Button from "../components/ui/Button.astro";
|
||||||
<a href="/blog"><Button>Read my blog</Button></a>
|
<a href="/blog"><Button>Read my blog</Button></a>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
<Hr />
|
||||||
|
<div class="flex flex-col gap-4 w-full lg:w-[40%]">
|
||||||
|
<GitHubHeatmap client:load />
|
||||||
|
</div>
|
||||||
</main>
|
</main>
|
||||||
<Footer />
|
<Footer />
|
||||||
</body>
|
</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