Fix 401/403/404 logged as app errors instead of user errors in production [Sentry #18P]

frontend/src/public/api/__tests__/isUserError.test.ts

@@ -0,0 +1,16 @@
+// <reference types="jest" />
+import { isUserError, USER_ERROR_STATUSES } from '../isUserError';
+
+describe('isUserError', () => {
+  it.each([401, 403, 404])('status %d returns true (user error)', (status) => {
+    expect(isUserError(status)).toBe(true);
+  });
+
+  it.each([400, 500, 502, 503])('status %d returns false (app/server error)', (status) => {
+    expect(isUserError(status)).toBe(false);
+  });
+
+  it('USER_ERROR_STATUSES contains only 401, 403, 404', () => {
+    expect(USER_ERROR_STATUSES).toEqual([401, 403, 404]);
+  });
+});

frontend/src/public/api/commonRequest.ts

@@ -9,6 +9,7 @@ import { identifyAppPartOnClient } from '../utils/identifyAppPart/identifyAppPar
 import { getCurrentToken } from '../utils/auth';
 import { envBackendURL } from '../constants/enviroment';
 import { isRequestCanceled } from '../utils/isRequestCanceled';
+import { isUserError } from './isUserError';
 
 export type TRequestType = 'public' | 'local';
 export type TResponseType = 'json' | 'text' | 'empty';
@@ -80,7 +81,11 @@ axiosInstance.interceptors.response.use(
     }
 
     if (error.response) {
-      logger.error('Response Error:', error.response.data);
+      if (isUserError(error.response.status)) {
+        logger.info('Response Error:', error.response.data);
+      } else {
+        logger.error('Response Error:', error.response.data);
+      }
     } else if (error.request) {
       logger.error('Request Error:', error.request);
     } else {

frontend/src/public/api/isUserError.ts

@@ -0,0 +1,5 @@
+export const USER_ERROR_STATUSES = [401, 403, 404];
+
+export function isUserError(status: number): boolean {
+  return USER_ERROR_STATUSES.includes(status);
+}