extend api_client for loading match data

web/pw-server/src/lib/api_client.ts

@@ -24,23 +24,15 @@ export class ApiClient {
   }
 
   async get(url: string, params?: Record<string, string>): Promise<any> {
-    const headers = { "Content-Type": "application/json" };
-
-    if (this.sessionToken) {
-      headers["Authorization"] = `Bearer ${this.sessionToken}`;
+    const response = await this.getRequest(url, params);
+    this.checkResponse(response);
+    return await response.json();
   }
 
-    if (params) {
-      let searchParams = new URLSearchParams(params);
-      url = `${url}?${searchParams}`;
-    }
-
-    const response = await this.fetch_fn(url, {
-      method: "GET",
-      headers,
-    });
-
-    return await this.getJsonResponse(response);
+  async getText(url: string, params?: Record<string, string>): Promise<any> {
+    const response = await this.getRequest(url, params);
+    this.checkResponse(response);
+    return await response.text();
   }
 
   async post(url: string, data: any): Promise<any> {
@@ -57,13 +49,30 @@ export class ApiClient {
       body: JSON.stringify(data),
     });
 
-    return await this.getJsonResponse(response);
+    this.checkResponse(response);
+    return await response.json();
   }
 
-  private async getJsonResponse(response: Response): Promise<any> {
-    if (response.ok) {
-      return await response.json();
-    } else {
+  private async getRequest(url: string, params: Record<string, string>): Promise<Response> {
+    const headers = { "Content-Type": "application/json" };
+
+    if (this.sessionToken) {
+      headers["Authorization"] = `Bearer ${this.sessionToken}`;
+    }
+
+    if (params) {
+      let searchParams = new URLSearchParams(params);
+      url = `${url}?${searchParams}`;
+    }
+
+    return await this.fetch_fn(url, {
+      method: "GET",
+      headers,
+    });
+  }
+
+  private checkResponse(response: Response) {
+    if (!response.ok) {
       throw new ApiError(response.status, response.statusText);
     }
   }

web/pw-server/src/routes/matches/[match_id].svelte

@@ -1,34 +1,26 @@
 <script lang="ts" context="module">
-  function fetchJson(url: string): Promise<Response> {
-    return fetch(url, {
-      headers: {
-        "Content-Type": "application/json",
-      },
-    });
-  }
-
-  export async function load({ params }) {
-    // TODO: handle failure cases better
+  import { ApiClient } from "$lib/api_client";
+  export async function load({ params, fetch }) {
+    try {
       const matchId = params["match_id"];
-    const matchDataResponse = await fetchJson(`/api/matches/${matchId}`);
-    if (!matchDataResponse.ok) {
-    }
-    const matchLogResponse = await fetchJson(`/api/matches/${matchId}/log`);
-
-    if (matchDataResponse.ok && matchLogResponse.ok) {
+      const apiClient = new ApiClient(fetch);
+      const [matchData, matchLog] = await Promise.all([
+        apiClient.get(`/api/matches/${matchId}`),
+        apiClient.getText(`/api/matches/${matchId}/log`),
+      ]);
       return {
         props: {
-          matchData: await matchDataResponse.json(),
-          matchLog: await matchLogResponse.text(),
+          matchData: matchData,
+          matchLog: matchLog,
         },
       };
-    }
-
+    } catch (error) {
       return {
-      status: matchDataResponse.status,
-      error: new Error("failed to load match"),
+        status: error.status,
+        error: error,
       };
     }
+  }
 </script>
 
 <script lang="ts">