fix: improve docs example (#4355)

* fix: improve docs example

* final touches

* chore: prettier

* lockfile

* ci?

* downgrade types node

* fresh lockfile

* lockfile and npmrc

* remove debug log

* Merge branch 'main' into docs-template-ts

* merging lockfiles suck

* update lockfile

* satisfy linter

2 files changed, 30 insertions, 19 deletions

diff --git a/examples/docs/src/components/Footer/AvatarList.astro b/examples/docs/src/components/Footer/AvatarList.astro
index e5880a03a..5926936d6 100644
--- a/examples/docs/src/components/Footer/AvatarList.astro
+++ b/examples/docs/src/components/Footer/AvatarList.astro
@@ -1,12 +1,23 @@
 ---
 // fetch all commits for just this page's path
-const path = 'docs/' + Astro.props.path;
-const url = `https://api.github.com/repos/withastro/astro/commits?path=${path}`;
-const commitsURL = `https://github.com/withastro/astro/commits/main/${path}`;
-
-async function getCommits(url) {
+type Props = {
+	path: string;
+};
+const { path } = Astro.props as Props;
+const resolvedPath = `examples/docs/${path}`;
+const url = `https://api.github.com/repos/withastro/astro/commits?path=${resolvedPath}`;
+const commitsURL = `https://github.com/withastro/astro/commits/main/${resolvedPath}`;
+
+type Commit = {
+	author: {
+		id: string;
+		login: string;
+	};
+};
+
+async function getCommits(url: string) {
 	try {
-		const token = import.meta.env.SNOWPACK_PUBLIC_GITHUB_TOKEN;
+		const token = import.meta.env.SNOWPACK_PUBLIC_GITHUB_TOKEN ?? 'hello';
 		if (!token) {
 			throw new Error(
 				'Cannot find "SNOWPACK_PUBLIC_GITHUB_TOKEN" used for escaping rate-limiting.'
@@ -32,27 +43,24 @@ async function getCommits(url) {
 			);
 		}
 
-		return data;
+		return data as Commit[];
 	} catch (e) {
 		console.warn(`[error]  /src/components/AvatarList.astro 
-    ${e?.message ?? e}`);
-		return new Array();
+    ${(e as any)?.message ?? e}`);
+		return [] as Commit[];
 	}
 }
 
-function removeDups(arr) {
-	if (!arr) {
-		return new Array();
-	}
-	let map = new Map();
+function removeDups(arr: Commit[]) {
+	const map = new Map<string, Commit['author']>();
 
 	for (let item of arr) {
-		let author = item.author;
+		const author = item.author;
 		// Deduplicate based on author.id
 		map.set(author.id, { login: author.login, id: author.id });
 	}
 
-	return Array.from(map.values());
+	return [...map.values()];
 }
 
 const data = await getCommits(url);
diff --git a/examples/docs/src/components/Footer/Footer.astro b/examples/docs/src/components/Footer/Footer.astro
index d13f832e5..1ec756b86 100644
--- a/examples/docs/src/components/Footer/Footer.astro
+++ b/examples/docs/src/components/Footer/Footer.astro
@@ -1,16 +1,19 @@
 ---
 import AvatarList from './AvatarList.astro';
-const { path } = Astro.props;
+type Props = {
+	path: string;
+};
+const { path } = Astro.props as Props;
 ---
 
 <footer>
-	<AvatarList {path} />
+	<AvatarList path={path} />
 </footer>
 
 <style>
 	footer {
 		margin-top: auto;
-		padding: 2rem 0;
+		padding: 2rem;
 		border-top: 3px solid var(--theme-divider);
 	}
 </style>