From 80eb046c5710e906988cb190ceeead3b586ce343 Mon Sep 17 00:00:00 2001
From: Mimi Immutable <mimi.tran@immutable.com>
Date: Fri, 10 Jan 2025 12:58:23 +1100
Subject: [PATCH] Create useErrorHandler hook

---
 .../add-tokens/hooks/useErrorHandler.ts       | 68 +++++++++++++++++++
 1 file changed, 68 insertions(+)
 create mode 100644 packages/checkout/widgets-lib/src/widgets/add-tokens/hooks/useErrorHandler.ts

diff --git a/packages/checkout/widgets-lib/src/widgets/add-tokens/hooks/useErrorHandler.ts b/packages/checkout/widgets-lib/src/widgets/add-tokens/hooks/useErrorHandler.ts
new file mode 100644
index 0000000000..8eb541c383
--- /dev/null
+++ b/packages/checkout/widgets-lib/src/widgets/add-tokens/hooks/useErrorHandler.ts
@@ -0,0 +1,68 @@
+import { useContext } from 'react';
+import { AddTokensError, AddTokensErrorTypes } from '../types';
+import { EventTargetContext } from '../../../context/event-target-context/EventTargetContext';
+import { sendAddTokensFailedEvent } from '../AddTokensWidgetEvents';
+import { useError } from '../../../lib/squid/hooks/useError';
+import { AddTokensContext } from '../context/AddTokensContext';
+import { useProvidersContext } from '../../../context/providers-context/ProvidersContext';
+
+export const useErrorHandler = () => {
+  const {
+    addTokensState: { id: contextId },
+  } = useContext(AddTokensContext);
+
+  const {
+    providersState: {
+      checkout,
+    },
+  } = useProvidersContext();
+
+  const { showErrorHandover } = useError(checkout.config.environment);
+
+  const {
+    eventTargetState: { eventTarget },
+  } = useContext(EventTargetContext);
+
+  const handleTransactionError = (err: unknown) => {
+    const reason = `${(err as any)?.reason || (err as any)?.message || ''
+    }`.toLowerCase();
+
+    let errorType = AddTokensErrorTypes.WALLET_FAILED;
+
+    if (reason.includes('failed') && reason.includes('open confirmation')) {
+      errorType = AddTokensErrorTypes.WALLET_POPUP_BLOCKED;
+    }
+
+    if (reason.includes('rejected') && reason.includes('user')) {
+      errorType = AddTokensErrorTypes.WALLET_REJECTED;
+    }
+
+    if (
+      reason.includes('failed to submit')
+            && reason.includes('highest gas limit')
+    ) {
+      errorType = AddTokensErrorTypes.WALLET_REJECTED_NO_FUNDS;
+    }
+
+    if (
+      reason.includes('status failed')
+            || reason.includes('transaction failed')
+    ) {
+      errorType = AddTokensErrorTypes.TRANSACTION_FAILED;
+      sendAddTokensFailedEvent(eventTarget, errorType);
+    }
+
+    if (reason.includes('unrecognized chain')) {
+      errorType = AddTokensErrorTypes.UNRECOGNISED_CHAIN;
+    }
+
+    const error: AddTokensError = {
+      type: errorType,
+      data: { error: err },
+    };
+
+    showErrorHandover(errorType, { contextId, error });
+  };
+
+  return { handleTransactionError };
+};