Add HackTheBox

netlify/functions/hackthebox.ts

@@ -0,0 +1,35 @@
+import { Handler } from '@netlify/functions'
+import { api } from "./shared/api"
+
+const handler: Handler = async (event, context) => {
+  let hackthebox = await api<{
+    profile: {
+      activity: {
+        id: string
+        date_diff: string
+        object_type: string
+        type: string
+        name: string
+        machine_avatar: string
+      }[]
+    }
+  }>
+  (`https://www.hackthebox.com/api/v4/profile/activity/1063999`)
+
+  let pwn = hackthebox.profile.activity.find((a) => a.object_type === "machine")
+  if (!pwn) {
+    return {
+      statusCode: 404,
+      body: ""
+    }
+  }
+  
+  pwn.machine_avatar = `https://www.hackthebox.com${pwn.machine_avatar}`
+  
+  return {
+    statusCode: 200,
+    body: JSON.stringify(pwn)
+  }
+}
+
+export { handler }

src/App.jsx

@@ -3,6 +3,7 @@ import "./App.css";
 
 import Lastfm from "./components/Lastfm";
 import Speedruncom from "./components/Speedruncom";
+import Hackthebox from "./components/hackthebox";
 
 function App() {
   return (
@@ -10,6 +11,7 @@ function App() {
       <h1>Simple website thingie</h1>
       <Lastfm/>
       <Speedruncom/>
+      <Hackthebox/>
     </div>
   );
 }

src/components/hackthebox.jsx

@@ -0,0 +1,25 @@
+import { useState, useEffect } from "react";
+
+export default function Hackthebox() {
+	const [hackthebox, setHackthebox] = useState({})
+  const getHackthebox = async () => {
+    const response = await fetch("/.netlify/functions/hackthebox").then(r => r.json())
+    setHackthebox(response)
+  }
+
+  useEffect(() => {
+    getHackthebox()
+  }, [])
+
+	if (hackthebox.name === undefined) {
+		return <></>
+	}
+
+	return (
+		<div id="hackthebox">
+			<p>Latest machine pwned on HackTheBox:</p>
+			<img alt="machine thumbnail" src={hackthebox.machine_avatar}></img>
+			<a href={`https://www.hackthebox.com/achievement/machine/1063999/${hackthebox.id}`}>{hackthebox.name}'s {hackthebox.type} {hackthebox.date_diff}</a>
+		</div>
+	)
+}