feat: Add API to retrieve authentication status and display user game opinions with colored borders in the game list.

frontend/src/PersonDetails.tsx

@@ -1,14 +1,7 @@
 import { useState, useEffect } from "react";
 import { Link, useParams } from "react-router-dom";
-import {
-  Person,
-  AddOpinionRequest,
-  Game,
-  GameList,
-  AuthStatusRequest,
-  AuthStatusResponse,
-} from "../items";
-import { apiFetch } from "./api";
+import { Person, AddOpinionRequest, Game, GameList } from "../items";
+import { apiFetch, get_auth_status } from "./api";
 import { GameImage } from "./GameImage";
 
 export const PersonDetails = () => {
@@ -20,31 +13,14 @@ export const PersonDetails = () => {
   const [currentUser, setCurrentUser] = useState<string>("");
 
   useEffect(() => {
-    const token = localStorage.getItem("token");
-    if (token) {
-      const req = AuthStatusRequest.create({ token });
-      const buffer = AuthStatusRequest.encode(req).finish();
-
-      apiFetch("/auth/get_auth_status", {
-        method: "POST",
-        headers: {
-          "Content-Type": "application/octet-stream",
-        },
-        body: buffer,
-      })
-        .then((res) => res.arrayBuffer())
-        .then((buffer) => {
-          try {
-            const response = AuthStatusResponse.decode(new Uint8Array(buffer));
-            if (response.authenticated) {
-              setCurrentUser(response.username);
-            }
-          } catch (e) {
-            console.error("Failed to decode auth status:", e);
-          }
-        })
-        .catch(console.error);
+    async function fetchUser() {
+      const token = localStorage.getItem("token");
+      if (token) {
+        const authStatus = await get_auth_status();
+        setCurrentUser(authStatus?.username || "");
+      }
     }
+    fetchUser();
   }, []);
 
   useEffect(() => {