first ugly version of authenticated backend requests.

needs some refactoring, but it works?

frontend/src/app/page.tsx

@@ -8,6 +8,7 @@ Log.setLogger(console);
 
 export default function Page() {
   const auth = useAuth();
+  console.log(auth);
 
   switch (auth.activeNavigator) {
     case "signinSilent":

frontend/src/app/users/page.tsx

@@ -0,0 +1,31 @@
+"use client";
+import { getUser } from "muzak/data/fetch";
+import { useEffect, useState } from "react";
+
+export default function Page() {
+  const [userData, setUserData] = useState<User[]>([]);
+
+  useEffect(() => {
+    async function getUsers() {
+      const user = getUser();
+      const access_token = user?.access_token;
+      const headers = new Headers();
+      headers.set("Authorization", `Bearer ${access_token}`);
+      headers.set("Content-Type", "application/json; charset=utf-8");
+      const users = await fetch("http://127.0.0.1:8001/api/user/", { headers });
+      const userData = await users.json();
+      setUserData(userData);
+    }
+    getUsers();
+  }, []);
+
+  return (
+    <div className="flex min-h-screen flex-col items-center justify-around">
+      {userData.length > 0 ? (
+        userData.map((user) => <div key={user.id}>{user.email}</div>)
+      ) : (
+        <div>Loading users...</div>
+      )}
+    </div>
+  );
+}