[WIP] Feature/auto horizon error (#1195)

* first pass at adding horizon and generic notifications

* Added translations

* fix translations

* fix sentry errors

* update error type

* fix error

* show horizon error msg

@shared/api/internal.ts

@@ -452,6 +452,11 @@ export const getAccountIndexerBalances = async (
     throw new Error(_err);
   }
 
+  if ("error" in data && (data?.error?.horizon || data?.error?.soroban)) {
+    const _err = JSON.stringify(data.error);
+    captureException(`Failed to fetch account balances - ${_err}`);
+  }
+
   const formattedBalances = {} as NonNullable<
     AccountBalancesInterface["balances"]
   >;
@@ -1040,6 +1045,7 @@ export const saveSettings = async ({
     isValidatingSafeAssetsEnabled: true,
     isExperimentalModeEnabled: false,
     isRpcHealthy: false,
+    userNotification: { enabled: false, message: "" },
     settingsState: SettingsState.IDLE,
     isSorobanPublicEnabled: false,
     error: "",

@shared/api/types.ts

@@ -52,6 +52,7 @@ export interface Response {
   isExperimentalModeEnabled: boolean;
   isSorobanPublicEnabled: boolean;
   isRpcHealthy: boolean;
+  userNotification: UserNotification;
   settingsState: SettingsState;
   networkDetails: NetworkDetails;
   sorobanRpcUrl: string;
@@ -149,10 +150,16 @@ export enum SettingsState {
   SUCCESS = "SUCCESS",
 }
 
+export interface UserNotification {
+  enabled: boolean;
+  message: string;
+}
+
 export interface IndexerSettings {
   settingsState: SettingsState;
   isSorobanPublicEnabled: boolean;
   isRpcHealthy: boolean;
+  userNotification: UserNotification;
 }
 
 export type Settings = {
@@ -204,6 +211,7 @@ export interface AccountBalancesInterface {
   tokensWithNoBalance: string[];
   isFunded: boolean | null;
   subentryCount: number;
+  error?: { horizon: any; soroban: any };
 }
 
 export interface AccountHistoryInterface {

extension/src/background/helpers/account.ts

@@ -164,16 +164,28 @@ export const getIsRpcHealthy = async (networkDetails: NetworkDetails) => {
   return rpcHealth.status === "healthy";
 };
 
+export const getUserNotification = async () => {
+  let response = { enabled: false, message: "" };
+
+  try {
+    const res = await fetch(`${INDEXER_URL}/user-notification`);
+    response = await res.json();
+  } catch (e) {
+    captureException(`Failed to load user notification - ${JSON.stringify(e)}`);
+    console.error(e);
+  }
+
+  return response;
+};
+
 export const getFeatureFlags = async () => {
   let featureFlags = { useSorobanPublic: false };
 
   try {
     const res = await fetch(`${INDEXER_URL}/feature-flags`);
     featureFlags = await res.json();
   } catch (e) {
-    captureException(
-      `Failed to load feature flag for Soroban mainnet - ${JSON.stringify(e)}`,
-    );
+    captureException(`Failed to load feature flag - ${JSON.stringify(e)}`);
     console.error(e);
   }
 

extension/src/background/messageListener/popupMessageListener.ts

@@ -73,6 +73,7 @@ import {
   getIsExperimentalModeEnabled,
   getIsHardwareWalletActive,
   getIsRpcHealthy,
+  getUserNotification,
   getSavedNetworks,
   getNetworkDetails,
   getNetworksList,
@@ -1231,6 +1232,7 @@ export const popupMessageListener = (request: Request, sessionStore: Store) => {
     const networkDetails = await getNetworkDetails();
     const featureFlags = await getFeatureFlags();
     const isRpcHealthy = await getIsRpcHealthy(networkDetails);
+    const userNotification = await getUserNotification();
 
     return {
       allowList: await getAllowList(),
@@ -1243,6 +1245,7 @@ export const popupMessageListener = (request: Request, sessionStore: Store) => {
       networksList: await getNetworksList(),
       isSorobanPublicEnabled: featureFlags.useSorobanPublic,
       isRpcHealthy,
+      userNotification,
     };
   };
 

extension/src/popup/ducks/settings.ts

@@ -48,6 +48,7 @@ const indexerInitialState: IndexerSettings = {
   settingsState: SettingsState.IDLE,
   isSorobanPublicEnabled: false,
   isRpcHealthy: false,
+  userNotification: { enabled: false, message: "" },
 };
 
 const initialState = {
@@ -109,6 +110,7 @@ export const saveSettings = createAsyncThunk<
       ...settingsInitialState,
       isSorobanPublicEnabled: false,
       isRpcHealthy: false,
+      userNotification: { enabled: false, message: "" },
       settingsState: SettingsState.IDLE,
     };
 
@@ -244,6 +246,7 @@ const settingsSlice = createSlice({
           isExperimentalModeEnabled,
           isSorobanPublicEnabled,
           isRpcHealthy,
+          userNotification,
         } = action?.payload || {
           ...initialState,
         };
@@ -260,6 +263,7 @@ const settingsSlice = createSlice({
           isExperimentalModeEnabled,
           isSorobanPublicEnabled,
           isRpcHealthy,
+          userNotification,
           settingsState: SettingsState.SUCCESS,
         };
       },

extension/src/popup/locales/en/translation.json

@@ -195,6 +195,7 @@
   "History": "History",
   "Home": "Home",
   "Home Domain": "Home Domain",
+  "Horizon is temporarily experiencing issues": "Horizon is temporarily experiencing issues",
   "HORIZON RPC URL": "HORIZON RPC URL",
   "I have my 12 word seed phrase": "I have my 12 word seed phrase",
   "I have my recovery phrase safe": "I have my recovery phrase safe",
@@ -330,6 +331,7 @@
   "Please double-check its information and characteristics": {
     " This can help you identify fraudulent assets": "Please double-check its information and characteristics. This can help you identify fraudulent assets."
   },
+  "Please note the following the message": "Please note the following the message",
   "Please proceed with caution": "Please proceed with caution.",
   "Please select a different network before removing it": "Please select a different network before removing it.",
   "Please select each word in the same order you have": "Please select each word in the same order you have",
@@ -401,6 +403,7 @@
   "Signing this transaction is not possible at the moment": "Signing this transaction is not possible at the moment.",
   "Signs for external accounts": "Signs for external accounts",
   "Some features may be disabled at this time": "Some features may be disabled at this time.",
+  "Some of your assets may not appear, but they are still safe on the network!": "Some of your assets may not appear, but they are still safe on the network!",
   "Soroban RPC is temporarily experiencing issues": "Soroban RPC is temporarily experiencing issues",
   "SOROBAN RPC URL": "SOROBAN RPC URL",
   "Source": "Source",

extension/src/popup/locales/pt/translation.json

@@ -195,6 +195,7 @@
   "History": "History",
   "Home": "Home",
   "Home Domain": "Home Domain",
+  "Horizon is temporarily experiencing issues": "Horizon is temporarily experiencing issues",
   "HORIZON RPC URL": "HORIZON RPC URL",
   "I have my 12 word seed phrase": "I have my 12 word seed phrase",
   "I have my recovery phrase safe": "I have my recovery phrase safe",
@@ -330,6 +331,7 @@
   "Please double-check its information and characteristics": {
     " This can help you identify fraudulent assets": "Please double-check its information and characteristics. This can help you identify fraudulent assets."
   },
+  "Please note the following the message": "Please note the following the message",
   "Please proceed with caution": "Please proceed with caution.",
   "Please select a different network before removing it": "Please select a different network before removing it.",
   "Please select each word in the same order you have": "Please select each word in the same order you have",
@@ -401,6 +403,7 @@
   "Signing this transaction is not possible at the moment": "Signing this transaction is not possible at the moment.",
   "Signs for external accounts": "Signs for external accounts",
   "Some features may be disabled at this time": "Some features may be disabled at this time.",
+  "Some of your assets may not appear, but they are still safe on the network!": "Some of your assets may not appear, but they are still safe on the network!",
   "Soroban RPC is temporarily experiencing issues": "Soroban RPC is temporarily experiencing issues",
   "SOROBAN RPC URL": "SOROBAN RPC URL",
   "Source": "Source",

extension/src/popup/views/Account/index.tsx

@@ -22,6 +22,7 @@ import {
 import {
   settingsNetworkDetailsSelector,
   settingsSorobanSupportedSelector,
+  settingsSelector,
 } from "popup/ducks/settings";
 import { View } from "popup/basics/layout/View";
 import {
@@ -80,6 +81,7 @@ export const Account = () => {
   const publicKey = useSelector(publicKeySelector);
   const networkDetails = useSelector(settingsNetworkDetailsSelector);
   const isSorobanSuported = useSelector(settingsSorobanSupportedSelector);
+  const { userNotification } = useSelector(settingsSelector);
   const currentAccountName = useSelector(accountNameSelector);
   const allAccounts = useSelector(allAccountsSelector);
   const [sortedBalances, setSortedBalances] = useState([] as AssetType[]);
@@ -89,7 +91,7 @@ export const Account = () => {
 
   const sorobanClient = useContext(SorobanContext);
 
-  const { balances, isFunded } = accountBalances;
+  const { balances, isFunded, error } = accountBalances;
 
   useEffect(() => {
     // reset to avoid any residual data eg switching between send and swap or
@@ -275,6 +277,28 @@ export const Account = () => {
                   </Notification>
                 </div>
               )}
+              {error?.horizon && (
+                <div className="AccountView__fetch-fail">
+                  <Notification
+                    title={t("Horizon is temporarily experiencing issues")}
+                    variant="primary"
+                  >
+                    {t(
+                      "Some of your assets may not appear, but they are still safe on the network!",
+                    )}
+                  </Notification>
+                </div>
+              )}
+              {userNotification?.enabled && (
+                <div className="AccountView__fetch-fail">
+                  <Notification
+                    title={t("Please note the following the message")}
+                    variant="primary"
+                  >
+                    {userNotification.message}
+                  </Notification>
+                </div>
+              )}
 
               {isFunded && !hasError && (
                 <div className="AccountView__assets-wrapper">
@@ -285,7 +309,7 @@ export const Account = () => {
                   />
                 </div>
               )}
-              {!isFunded && !hasError && (
+              {!isFunded && !hasError && !error?.horizon && (
                 <NotFundedMessage
                   canUseFriendbot={!!networkDetails.friendbotUrl}
                   setIsAccountFriendbotFunded={setIsAccountFriendbotFunded}