Do not send network error to Sentry

ref DEV-2274

portal/src/ReactApp.tsx

@@ -8,6 +8,7 @@ import React, {
 import {
   Exception as SentryException,
   ErrorEvent as SentryErrorEvent,
+  EventHint,
   init as sentryInit,
 } from "@sentry/react";
 import { BrowserRouter, Routes, Route, Navigate } from "react-router-dom";
@@ -55,6 +56,7 @@ import {
   UnauthenticatedDialogContext,
   UnauthenticatedDialogContextValue,
 } from "./components/auth/UnauthenticatedDialogContext";
+import { isNetworkError } from "./util/error";
 
 async function loadSystemConfig(): Promise<SystemConfig> {
   const resp = await fetch("/api/system-config.json");
@@ -71,10 +73,13 @@ function isPosthogResetGroupsEvent(event: SentryErrorEvent) {
 }
 
 // DEV-1767: Unknown cause on posthog error, silence for now
-function sentryBeforeSend(event: SentryErrorEvent) {
+function sentryBeforeSend(event: SentryErrorEvent, hint: EventHint) {
   if (isPosthogResetGroupsEvent(event)) {
     return null;
   }
+  if (isNetworkError(hint.originalException)) {
+    return null;
+  }
   return event;
 }
 

portal/src/util/error.ts

@@ -0,0 +1,29 @@
+// The original work is https://github.com/sindresorhus/is-network-error/blob/main/index.js
+// The modifications are
+// 1. Remove the error message checking for Node.js, since this code does not run on Node.js.
+// 2. The original work also check error.stack === undefined on Safari >= 17, but in our observation,
+//    error.stack IS NOT undefined, so we removed that checking.
+// 3. The original work call Object.prototype.toString on error, and check if the string is "[object Error]",
+//    we just use instanceof to check if it is an error.
+const errorMessages = new Set([
+  "network error", // Chrome
+  "Failed to fetch", // Chrome
+  "NetworkError when attempting to fetch resource.", // Firefox
+  "The Internet connection appears to be offline.", // Safari 16
+  "Load failed", // Safari 17+
+  "Network request failed", // `cross-fetch`
+]);
+
+export function isNetworkError(error: unknown): boolean {
+  const isValid =
+    error &&
+    error instanceof Error &&
+    error.name === "TypeError" &&
+    typeof error.message === "string";
+
+  if (!isValid) {
+    return false;
+  }
+
+  return errorMessages.has(error.message);
+}