okok

src/lib/api.ts

@@ -12,40 +12,26 @@ const getBaseUrl = () => {
   return `http://localhost:${process.env.PORT ?? 3000}`;
 };
 
-// Custom fetch that suppresses 401 console errors
-const customFetch: typeof fetch = async (input, init?) => {
-  try {
-    const response = await fetch(input, init);
-    // Suppress logging for 401 errors by cloning and not throwing
-    if (response.status === 401) {
-      // Return the response without logging to console
-      return response;
-    }
-    return response;
-  } catch (error) {
-    // Only re-throw non-401 errors
-    throw error;
-  }
-};
-
 export const api = createTRPCProxyClient<AppRouter>({
   links: [
-    // will print out helpful logs when using client (suppress 401 errors)
-    loggerLink({
-      enabled: (opts) => {
-        // Only log in development, and suppress 401 errors
-        const isDev = process.env.NODE_ENV === "development";
-        const is401 =
-          opts.direction === "down" &&
-          opts.result instanceof Error &&
-          opts.result.message?.includes("UNAUTHORIZED");
-        return isDev && !is401;
-      }
-    }),
+    // Only enable logging in development mode
+    ...(process.env.NODE_ENV === "development"
+      ? [
+          loggerLink({
+            enabled: (opts) => {
+              // Suppress 401 UNAUTHORIZED errors from logs
+              const is401 =
+                opts.direction === "down" &&
+                opts.result instanceof Error &&
+                opts.result.message?.includes("UNAUTHORIZED");
+              return !is401;
+            }
+          })
+        ]
+      : []),
     // identifies what url will handle trpc requests
     httpBatchLink({
-      url: `${getBaseUrl()}/api/trpc`,
-      fetch: customFetch
+      url: `${getBaseUrl()}/api/trpc`
     })
   ]
 });

src/lib/client-utils.ts

@@ -3,6 +3,26 @@
  * Note: These utilities should only run in the browser
  */
 
+/**
+ * Safe fetch wrapper that suppresses console errors for expected 401 responses
+ * Use this instead of direct fetch() calls when 401s are expected (e.g., auth checks)
+ * @param input - URL or Request object
+ * @param init - Fetch options
+ * @returns Promise<Response>
+ */
+export async function safeFetch(
+  input: RequestInfo | URL,
+  init?: RequestInit
+): Promise<Response> {
+  try {
+    const response = await fetch(input, init);
+    return response;
+  } catch (error) {
+    // Re-throw the error - this is for actual network failures
+    throw error;
+  }
+}
+
 /**
  * Triggers haptic feedback on mobile devices
  * @param duration - Duration in milliseconds (default 50ms for a light tap)