From f656aba7d9b70148e52a018e8f067445de9e4f2d Mon Sep 17 00:00:00 2001
From: Jordan Eldredge <jordan@jordaneldredge.com>
Date: Wed, 5 Feb 2025 17:54:42 -0800
Subject: [PATCH] Improve graphql error logging

---
 packages/skin-museum-client/src/utils.js | 33 ++++++++++++++++--------
 1 file changed, 22 insertions(+), 11 deletions(-)

diff --git a/packages/skin-museum-client/src/utils.js b/packages/skin-museum-client/src/utils.js
index db85095d..dc3e76bf 100644
--- a/packages/skin-museum-client/src/utils.js
+++ b/packages/skin-museum-client/src/utils.js
@@ -93,23 +93,34 @@ export function filenameIsReadme(filename) {
 }
 
 // Tools like Prettier can infer that a string is GraphQL if it uses this tagged
-// template liteal.
+// template literal.
 export function gql(strings) {
   return strings[0];
 }
 
 export async function fetchGraphql(query, variables = {}) {
   const url = `${API_URL}/graphql`;
-  const response = await fetch(url, {
-    method: "POST",
-    headers: {
-      "Content-Type": "application/json",
-      Accept: "application/json",
-    },
-    mode: "cors",
-    credentials: "include",
-    body: JSON.stringify({ query, variables }),
-  });
+  let response;
+  try {
+    response = await fetch(url, {
+      method: "POST",
+      headers: {
+        "Content-Type": "application/json",
+        Accept: "application/json",
+      },
+      mode: "cors",
+      credentials: "include",
+      body: JSON.stringify({ query, variables }),
+    });
+  } catch (error) {
+    console.error("Failed to fetch", {
+      message: error.message,
+      url,
+      query,
+      variables,
+    });
+    throw error;
+  }
   if (response.status === 403) {
     window.location = `${API_URL}/auth`;
   }