From 9ac5c72703e1cf1b69eb3e6cd3602de82e2cb8dc Mon Sep 17 00:00:00 2001
From: Vadim Tokar <vtokar@gear.foundation>
Date: Fri, 29 Nov 2024 18:38:55 +0400
Subject: [PATCH] fix: fetchWithGuard error handling

---
 idea/frontend/src/features/metadata/consts.ts               | 5 +++++
 idea/frontend/src/features/metadata/hooks/use-metadata.ts   | 4 ++--
 idea/frontend/src/features/sails/api/consts.ts              | 6 +++++-
 idea/frontend/src/features/sails/hooks/use-sails.ts         | 5 ++---
 idea/frontend/src/shared/helpers/index.ts                   | 5 ++++-
 .../frontend/src/shared/services/rpcService/model/consts.ts | 1 -
 6 files changed, 18 insertions(+), 8 deletions(-)
 create mode 100644 idea/frontend/src/features/metadata/consts.ts

diff --git a/idea/frontend/src/features/metadata/consts.ts b/idea/frontend/src/features/metadata/consts.ts
new file mode 100644
index 0000000000..a904d716cf
--- /dev/null
+++ b/idea/frontend/src/features/metadata/consts.ts
@@ -0,0 +1,5 @@
+const errorMessage = {
+  metadataNotFound: 'MetadataNotFound',
+};
+
+export { errorMessage };
diff --git a/idea/frontend/src/features/metadata/hooks/use-metadata.ts b/idea/frontend/src/features/metadata/hooks/use-metadata.ts
index 20b3b638b3..5d3755f61e 100644
--- a/idea/frontend/src/features/metadata/hooks/use-metadata.ts
+++ b/idea/frontend/src/features/metadata/hooks/use-metadata.ts
@@ -2,11 +2,11 @@ import { HexString, ProgramMetadata } from '@gear-js/api';
 import { useAlert } from '@gear-js/react-hooks';
 import { useEffect, useMemo, useState } from 'react';
 
-import { RPCError, RPCErrorCode } from '@/shared/services/rpcService';
 import { useChain } from '@/hooks';
 import { getLocalMetadata } from '@/features/local-indexer';
 
 import { fetchMetadata } from '../api/requests';
+import { errorMessage } from '../consts';
 
 function useMetadata(hash?: HexString | null | undefined) {
   const alert = useAlert();
@@ -30,7 +30,7 @@ function useMetadata(hash?: HexString | null | undefined) {
 
     getMetadata(hash)
       .then(({ result }) => result.hex && setMetadataHex(result.hex))
-      .catch(({ message, code }: RPCError) => code !== RPCErrorCode.MetadataNotFound && alert.error(message))
+      .catch(({ message }) => message !== errorMessage.metadataNotFound && alert.error(message))
       .finally(() => setIsMetadataReady(true));
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [hash]);
diff --git a/idea/frontend/src/features/sails/api/consts.ts b/idea/frontend/src/features/sails/api/consts.ts
index 560213d2b6..12e4862e2d 100644
--- a/idea/frontend/src/features/sails/api/consts.ts
+++ b/idea/frontend/src/features/sails/api/consts.ts
@@ -3,4 +3,8 @@ const METHOD = {
   GET_EVENTS: 'event.all',
 } as const;
 
-export { METHOD };
+const errorMessage = {
+  sailsIdlNotFound: 'SailsIdlNotFound',
+};
+
+export { METHOD, errorMessage };
diff --git a/idea/frontend/src/features/sails/hooks/use-sails.ts b/idea/frontend/src/features/sails/hooks/use-sails.ts
index 4a7939c2b4..17379c60cd 100644
--- a/idea/frontend/src/features/sails/hooks/use-sails.ts
+++ b/idea/frontend/src/features/sails/hooks/use-sails.ts
@@ -3,10 +3,9 @@ import { useAlert } from '@gear-js/react-hooks';
 import { useQuery } from '@tanstack/react-query';
 import { useEffect } from 'react';
 
-import { RPCError, RPCErrorCode } from '@/shared/services/rpcService';
-
 import { getIdl } from '../api';
 import { useSailsInit } from './use-sails-init';
+import { errorMessage } from '../api/consts';
 
 function useSails(codeId: HexString | null | undefined) {
   const sails = useSailsInit();
@@ -29,7 +28,7 @@ function useSails(codeId: HexString | null | undefined) {
 
   useEffect(() => {
     if (!error) return;
-    if (error instanceof RPCError && error.code === RPCErrorCode.MetadataNotFound) return;
+    if (error.message === errorMessage.sailsIdlNotFound) return;
 
     alert.error(error.message);
     // eslint-disable-next-line react-hooks/exhaustive-deps
diff --git a/idea/frontend/src/shared/helpers/index.ts b/idea/frontend/src/shared/helpers/index.ts
index 928eb8b7b3..a09941388e 100644
--- a/idea/frontend/src/shared/helpers/index.ts
+++ b/idea/frontend/src/shared/helpers/index.ts
@@ -131,7 +131,10 @@ const fetchWithGuard = async <T extends object>(...args: Parameters<typeof fetch
   }
   const response = await fetch(...args);
 
-  if (!response.ok) throw new Error(response.statusText);
+  if (!response.ok) {
+    const result = await response.json();
+    throw new Error('error' in result ? result.error : response.statusText);
+  }
 
   return response.json() as T;
 };
diff --git a/idea/frontend/src/shared/services/rpcService/model/consts.ts b/idea/frontend/src/shared/services/rpcService/model/consts.ts
index 99cd36861f..cbfb33ac61 100644
--- a/idea/frontend/src/shared/services/rpcService/model/consts.ts
+++ b/idea/frontend/src/shared/services/rpcService/model/consts.ts
@@ -2,7 +2,6 @@ enum RPCErrorCode {
   ParseError = -32700,
   InvalidRequest = -32600,
   MethodNotFound = -32601,
-  MetadataNotFound = -32404,
   InvalidParams = -32602,
   InternalError = -32603,
 }