@lifi/widget 2.0.0 → 2.1.0

package/cjs/i18n/uk.json

@@ -1,6 +1,15 @@
 {
+  "language": {
+    "name": "Українська",
+    "title": "Мова"
+  },
+  "format": {
+    "currency": "{{value, currency(currency: USD)}}",
+    "number": "{{value, number(maximumFractionDigits: 9)}}"
+  },
   "button": {
     "auto": "Авто",
+    "bridge": "Бридж",
     "buy": "Придбати",
     "buyNow": "Придбати",
     "cancel": "Скасувати",
@@ -12,81 +21,74 @@
     "delete": "Видалити",
     "disconnect": "Від'єднатись",
     "done": "Готово",
+    "exchange": "Обмін",
     "getGas": "Отримати газ",
     "hide": "Сховати",
     "learnMore": "Докладніше",
-    "lifiSwap": "LI.FI Swap",
+    "lifiCheckout": "LI.FI Checkout",
+    "lifiExchange": "LI.FI Обмін",
     "light": "Світла",
     "max": "макс",
     "ok": "Ок",
-    "okay": "Добре",
-    "removeSwap": "Видалити своп",
+    "removeTransaction": "Видалити транзакцію",
     "reset": "Скинути",
     "resetSettings": "Скинути налаштування",
-    "restartSwap": "Перезапустити своп",
-    "reviewGasSwap": "Переглянути своп газу",
+    "reviewBridge": "Переглянути бридж",
     "reviewPurchase": "Перегляд покупки",
     "reviewSwap": "Переглянути своп",
     "seeDetails": "Детальніше",
     "showAll": "Показати всі",
-    "startGasSwap": "Почати своп газу",
-    "startSwap": "Почати своп",
+    "startBridging": "Почати бридж",
+    "startSwapping": "Почати своп",
     "swap": "Своп",
     "tryAgain": "Спробувати ще раз",
     "viewCoverage": "Переглянути покриття",
     "viewOnExplorer": "Переглянути в оглядачі"
   },
-  "format": {
-    "currency": "{{value, currency(currency: USD)}}",
-    "number": "{{value, number(maximumFractionDigits: 9)}}"
-  },
   "header": {
-    "activeSwaps": "Активні свопи",
+    "activeTransactions": "Активні транзакції",
     "bridge": "Бридж",
     "checkout": "Розрахунок",
+    "exchange": "Обмін",
     "from": "Своп з",
     "gas": "Газ",
-    "gasSwap": "Своп газу",
     "payWith": "Сплатити за допомогою",
     "purchase": "Купівля",
     "purchaseDetails": "Деталі покупки",
-    "routes": "Ви отримаєте",
     "selectChain": "Виберіть чейн",
     "selectWallet": "Виберіть свій гаманець",
     "settings": "Налаштування",
     "swap": "Своп",
-    "swapDetails": "Деталі свопу",
-    "swapHistory": "Історія свопів",
     "to": "Своп на",
-    "walletConnected": "Гаманець підʼєднано"
-  },
-  "language": {
-    "name": "Українська",
-    "title": "Мова"
+    "transactionDetails": "Деталі транзакції",
+    "transactionHistory": "Історія транзакцій",
+    "walletConnected": "Гаманець підʼєднано",
+    "youGet": "Ви отримаєте"
   },
   "info": {
     "message": {
       "autoRefuel": "У вас замало {{chainName}} газу. Продовжуючи, ви отримаєте достатньо газу, щоб завершити обмін.",
-      "emptyActiveSwaps": "Тут відображатимуться незавершені свопи. Після завершення ви можете знайти їх в історії свопів.",
-      "emptySwapHistory": "Історія свопів зберігається лише локально та буде видалена, якщо ви очистите дані браузера.",
+      "emptyActiveTransactions": "Тут показуються незавершені транзакції. Після завершення ви можете знайти їх в історії транзакцій.",
       "emptyTokenList": "Нам не вдалося знайти токени на {{chainName}}, або у вас їх немає. Будь ласка, повторіть пошук або виберіть інший чейн.",
+      "emptyTransactionHistory": "Історія транзакцій зберігається лише локально та буде видалена, якщо ви очистите дані браузера.",
       "routeNotFound": "Спробуйте іншу комбінацію токенів."
     },
     "title": {
       "autoRefuel": "Отримати газ",
-      "emptyActiveSwaps": "Немає активних свопів",
-      "emptySwapHistory": "Немає останніх свопів",
+      "emptyActiveTransactions": "Немає активних транзакцій",
+      "emptyTransactionHistory": "Немає останніх транзакцій",
       "routeNotFound": "Немає доступних маршрутів"
     }
   },
   "success": {
     "message": {
-      "swapPartiallySuccessful": "Ми намагалися завершити своп, але {{tool}} не вистачило ліквідності токену {{tokenSymbol}}.",
-      "purchaseSuccessful": "Тепер ви маєте {{assetName}} в {{walletAddress}} гаманці на ланцюжку {{chainName}}.",
-      "swapSuccessful": "Зараз є {{amount, number(maximumFractionDigits: 9)}} {{tokenSymbol}} у гаманці {{walletAddress}} на чейні {{chainName}}."
+      "exchangePartiallySuccessful": "Ми намагалися завершити транзакцію, але {{tool}} не вистачило ліквідності токену {{tokenSymbol}}.",
+      "exchangeSuccessful": "Зараз є {{amount, number(maximumFractionDigits: 9)}} {{tokenSymbol}} у гаманці {{walletAddress}} на чейні {{chainName}}.",
+      "purchaseSuccessful": "Тепер ви маєте {{assetName}} в {{walletAddress}} гаманці на ланцюжку {{chainName}}."
     },
     "title": {
-      "gasSwapSuccessful": "Своп газу успішний",
+      "bridgePartiallySuccessful": "Бридж частково успішний",
+      "bridgeSuccessful": "Бридж успішний",
       "purchaseSuccessful": "Покупка успішна",
       "refundIssued": "Здійснено повернення коштів",
       "swapPartiallySuccessful": "Своп частково успішний",
@@ -95,8 +97,8 @@
   },
   "warning": {
     "message": {
-      "deleteActiveSwaps": "Активні свопи зберігаються лише локально й не можуть бути відновлені, якщо ви їх видалите.",
-      "deleteSwapHistory": "Історія свопів зберігається лише локально й не може бути відновлена, якщо ви їх видалите.",
+      "deleteActiveTransactions": "Активні транзакції зберігаються лише локально й не можуть бути відновлені, якщо ви їх видалите.",
+      "deleteTransactionHistory": "Історія транзакцій зберігається лише локально й не може бути відновлена, якщо ви їх видалите.",
       "highValueLoss": "Вартість отриманих токенів значно нижча, ніж обмінені токени та вартість транзакції.",
       "insufficientFunds": "У вас недостатньо коштів для здійснення свопу.",
       "insufficientGas": "Для завершення свопа у вас недостатньо газу. Вам необхідно додати хоча б:",
@@ -104,9 +106,9 @@
       "resetSettings": "Це скине пріоритет вашого маршруту, прослизання, ціну газу, увімкнені бриджі та обмінники."
     },
     "title": {
-      "deleteActiveSwaps": "Видалити всі активні свопи?",
-      "deleteSwap": "Видалити цей своп?",
-      "deleteSwapHistory": "Видалити історію свопів?",
+      "deleteActiveTransactions": "Видалити всі активні транзакції?",
+      "deleteTransaction": "Видалити цю транзакцію?",
+      "deleteTransactionHistory": "Видалити історію транзакцій?",
       "highValueLoss": "Висока втрата вартості",
       "insufficientGas": "Недостатня кількість газу",
       "rateChanged": "Курс змінився",
@@ -127,7 +129,6 @@
       "allowanceRequired": "Недостатня дозволена кількість",
       "balanceIsTooLow": "Баланс занадто низький",
       "chainSwitch": "Потрібно переключити чейн.",
-      "failed": "Помилка обміну.",
       "gasLimitIsTooLow": "Занадто низький ліміт газу",
       "insufficientFunds": "Недостатньо коштів",
       "slippageNotMet": "Не виконані умови прослизання",
@@ -142,6 +143,19 @@
       "walletEnsAddressInvalid": "Адреса гаманця недійсна або мережа не підтримує ENS."
     }
   },
+  "tooltip": {
+    "additionalProviderFee": "Додаткові комісії бриджів, обмінників та послуг.",
+    "estimatedNetworkFee": "Орієнтовна мережева плата.",
+    "estimatedTime": "Орієнтовний час виконання свопу в хвилинах.",
+    "notFound": {
+      "text": "Ми не змогли знайти цю сторінку.",
+      "title": "404"
+    },
+    "numberOfSteps": "Кількість кроків свопу. Кожен крок може містити 1-3 транзакції, які потребують підпису.",
+    "progressToNextUpdate": "Зображені дані автоматично оновляться через {{value}} секунд. Натисніть тут, щоб оновити вручну.",
+    "recommended": "Дешевий маршрут, який балансує складність і легкість використання.",
+    "settingsModified": "Налаштування (змінено)"
+  },
   "main": {
     "crossStepDetails": "Бридж з {{from}} до {{to}} через {{tool}}",
     "currentAmount": "Поточна сума",
@@ -198,6 +212,7 @@
     "selectToken": "Виберіть токен",
     "sendToAddress": "Відправити на {{address}}",
     "sendToWallet": "Надіслати на інший гаманець",
+    "sending": "Відправлення",
     "sentToAddress": "Відправлено на {{address}}",
     "stepBridge": "Бридж",
     "stepBridgeAndBuy": "Бридж та покупка",
@@ -207,7 +222,6 @@
     "stepSwapAndBuy": "Своп та покупка",
     "supportId": "Ідентифікатор підтримки",
     "swapStepDetails": "Своп на {{chain}} через {{tool}}",
-    "swapping": "Обмін",
     "tags": {
       "cheapest": "Дешевий",
       "fastest": "Швидкий",
@@ -243,19 +257,6 @@
     "showDestinationWallet": "Показати цільовий гаманець",
     "slippage": "Прослизання"
   },
-  "tooltip": {
-    "additionalProviderFee": "Додаткові комісії бриджів, обмінників та послуг.",
-    "estimatedNetworkFee": "Орієнтовна мережева плата.",
-    "estimatedTime": "Орієнтовний час виконання свопу в хвилинах.",
-    "notFound": {
-      "text": "Ми не змогли знайти цю сторінку.",
-      "title": "404"
-    },
-    "numberOfSteps": "Кількість кроків свопу. Кожен крок може містити 1-3 транзакції, які потребують підпису.",
-    "progressToNextUpdate": "Зображені дані автоматично оновляться через {{value}} секунд. Натисніть тут, щоб оновити вручну.",
-    "recommended": "Дешевий маршрут, який балансує складність і легкість використання.",
-    "settingsModified": "Налаштування (змінено)"
-  },
   "wallet": {
     "extensionNotFound": "Перш ніж вибрати цей гаманець, переконайтеся, що в браузері активне лише розширення {{name}}."
   }

package/cjs/i18n/vi.json

@@ -1,6 +1,15 @@
 {
+  "language": {
+    "name": "Tiếng Việt",
+    "title": "Ngôn ngữ"
+  },
+  "format": {
+    "currency": "{{value, currency(currency: USD)}}",
+    "number": "{{value, number(maximumFractionDigits: 9)}}"
+  },
   "button": {
     "auto": "Tự động",
+    "bridge": "Cầu",
     "buy": "Mua",
     "buyNow": "Mua ngay bây giờ",
     "cancel": "Huỷ bỏ",
@@ -12,94 +21,74 @@
     "delete": "Xóa",
     "disconnect": "Ngắt kết nối",
     "done": "Hoàn thành",
+    "exchange": "Hoán đổi",
     "getGas": "Thiết lập gas",
     "hide": "Ẩn",
     "learnMore": "Xem thêm",
-    "lifiSwap": "LI.FI Swap",
+    "lifiCheckout": "LI.FI Checkout",
+    "lifiExchange": "LI.FI Exchange",
     "light": "Sáng",
     "max": "Tối đa",
     "ok": "Ok",
-    "okay": "Okay",
-    "removeSwap": "Xoá",
+    "removeTransaction": "Xoá giao dịch",
     "reset": "Đặt lại",
     "resetSettings": "Đặt lại cài đặt",
-    "restartSwap": "Thiết lập lại",
-    "reviewGasSwap": "Xem lại gas swap",
+    "reviewBridge": "Xem xét cầu",
     "reviewPurchase": "Đánh giá thanh toán",
     "reviewSwap": "Xem lại Swap",
     "seeDetails": "Xem chi tiết",
     "showAll": "Hiển thị tất cả",
-    "startGasSwap": "Start gas swap",
-    "startSwap": "Bắt đầu Swap",
+    "startBridging": "Bắt đầu đi cầu",
+    "startSwapping": "Bắt đầu Swap",
     "swap": "Swap",
     "tryAgain": "Thử lại",
     "viewCoverage": "Xem phạm vi bảo hiểm",
     "viewOnExplorer": "Xem tại Explorer"
   },
-  "format": {
-    "currency": "{{value, currency(currency: USD)}}",
-    "number": "{{value, number(maximumFractionDigits: 9)}}"
-  },
   "header": {
-    "activeSwaps": "Active swaps",
-    "bridge": "Bridge",
+    "activeTransactions": "Các giao dịch hiện tại",
+    "bridge": "Cầu",
     "checkout": "Thanh toán",
+    "exchange": "Hoán đổi",
     "from": "Swap từ",
     "gas": "Gas",
-    "gasSwap": "Gas swap",
     "payWith": "Thanh toán bằng",
     "purchase": "Thanh toán",
     "purchaseDetails": "Thông tin chi tiết",
-    "routes": "Kết quả",
     "selectChain": "Chọn chain",
     "selectWallet": "Chọn ví",
     "settings": "Cài đặt",
     "swap": "Swap",
-    "swapDetails": "Thông tin swap",
-    "swapHistory": "Lịch sử Swap",
     "to": "Swap từ",
-    "walletConnected": "Wallet connected"
-  },
-  "language": {
-    "name": "Tiếng Việt",
-    "title": "Ngôn ngữ"
-  },
-  "settings": {
-    "enabledBridges": "Số lượng cầu khả dụng",
-    "enabledExchanges": "Số lượng sàn giao dịch khả dụng",
-    "gasPrice": {
-      "fast": "Nhanh",
-      "normal": "Bình thường",
-      "slow": "Chậm",
-      "title": "Giá gas"
-    },
-    "routePriority": "Tuyền đường ưu tiên",
-    "showDestinationWallet": "Hiển thị địa chỉ ví nhận",
-    "slippage": "Trượt giá"
+    "transactionDetails": "Chi tiết giao dịch",
+    "transactionHistory": "Lịch sử giao dịch",
+    "walletConnected": "Wallet connected",
+    "youGet": "Bạn nhận"
   },
   "info": {
     "message": {
       "autoRefuel": "Gas trên {{chainName}} chain của bạn đang thấp. Để tiếp tục, bạn nên có thêm gas để hoàn thành việc swap.",
-      "emptyActiveSwaps": "Các lệnh swap đang xử lý sẽ được hiện ở đây. Khi nào lệnh hoàn tất, bạn có thể kiểm tra lại tại mục lịch sử swap.",
-      "emptySwapHistory": "Lịch sử Swap chỉ được lưu trữ cục bộ và sẽ bị xóa nếu bạn xóa dữ liệu trình duyệt của mình.",
+      "emptyActiveTransactions": "Các lệnh swap đang xử lý sẽ được hiện ở đây. Khi nào lệnh hoàn tất, bạn có thể kiểm tra lại tại mục lịch sử swap.",
       "emptyTokenList": "Chúng tôi không thể tìm được Token ở {{chainName}} chain hoặc số dư của bạn không có. Vui lòng thử tìm kiếm lại hoặc chọn một chain khác.",
+      "emptyTransactionHistory": "Lịch sử Swap chỉ được lưu trữ cục bộ và sẽ bị xóa nếu bạn xóa dữ liệu trình duyệt của mình.",
       "routeNotFound": "Vui lòng chọn lại cặp token khác."
     },
     "title": {
       "autoRefuel": "Thiết lập Gas",
-      "emptyActiveSwaps": "Swap hiện không hoạt động",
-      "emptySwapHistory": "Không có lệnh Swap gần đây",
+      "emptyActiveTransactions": "Không có thông tin giao dịch hiện tại",
+      "emptyTransactionHistory": "Chưa có giao dịch",
       "routeNotFound": "Không có đường đi"
     }
   },
   "success": {
     "message": {
-      "swapPartiallySuccessful": "Chúng tôi đã cố gắng hoàn thành việc hoán đổi, nhưng {{tool}} đã cạn thanh khoản cho token {{tokenSymbol}}.",
-      "purchaseSuccessful": "Hiện tại bạn đang nắm giữ {{assetName}} tại ví {{walletAddress}} trên chain {{chainName}}.",
-      "swapSuccessful": "Hiện tại {{amount, number(maximumFractionDigits: 9)}} {{tokenSymbol}} trong ví {{walletAddress}} tại {{chainName}} chain."
+      "exchangePartiallySuccessful": "Chúng tôi đã cố gắng hoàn thành việc hoán đổi, nhưng {{tool}} đã cạn thanh khoản cho token {{tokenSymbol}}.",
+      "exchangeSuccessful": "Hiện tại {{amount, number(maximumFractionDigits: 9)}} {{tokenSymbol}} trong ví {{walletAddress}} tại {{chainName}} chain.",
+      "purchaseSuccessful": "Hiện tại bạn đang nắm giữ {{assetName}} tại ví {{walletAddress}} trên chain {{chainName}}."
     },
     "title": {
-      "gasSwapSuccessful": "Gas Swap thành công",
+      "bridgePartiallySuccessful": "Swap thành công một phần",
+      "bridgeSuccessful": "Bridge thành công",
       "purchaseSuccessful": "Mua thành công",
       "refundIssued": "Đã Refund",
       "swapPartiallySuccessful": "Swap thành công một phần",
@@ -108,8 +97,8 @@
   },
   "warning": {
     "message": {
-      "deleteActiveSwaps": "Các giao dịch đang hoạt động chỉ được lưu trữ cục bộ và không thể phục hồi nếu bạn xóa chúng.",
-      "deleteSwapHistory": "Lịch sử Swap chỉ lưu trữ cục bộ và không thể phục hồi khi bạn xoá chúng.",
+      "deleteActiveTransactions": "Các giao dịch đang hoạt động chỉ được lưu trữ cục bộ và không thể phục hồi nếu bạn xóa chúng.",
+      "deleteTransactionHistory": "Lịch sử Swap chỉ lưu trữ cục bộ và không thể phục hồi khi bạn xoá chúng.",
       "highValueLoss": "Giá trị của token nhận được đang thấp hơn rất nhiều so với token được swap và chi phí giao dịch.",
       "insufficientFunds": "Bạn không có đủ tiền để thực hiện tác vụ này.",
       "insufficientGas": "Bạn không đủ gas để thực hiện swap. Bạn cần thêm ít nhất:",
@@ -117,9 +106,9 @@
       "resetSettings": "Thao tác này sẽ đặt lại mức độ ưu tiên của tuyến đường, độ trượt giá, giá gas, bridge và sàn giao dịch."
     },
     "title": {
-      "deleteActiveSwaps": "Xoá tất cả các lệnh swap đang hoạt động?",
-      "deleteSwap": "Xoá lệnh swap?",
-      "deleteSwapHistory": "Xoá lịch sử Swap?",
+      "deleteActiveTransactions": "Xóa tất cả giao dịch đang thực hiện?",
+      "deleteTransaction": "Xóa giao dịch này?",
+      "deleteTransactionHistory": "Xoá lịch sử giao dịch?",
       "highValueLoss": "Tổn thất lớn",
       "insufficientGas": "Không đủ gas",
       "rateChanged": "Tỉ giá đã thay đổi",
@@ -140,7 +129,6 @@
       "allowanceRequired": "Sự cho phép không đủ",
       "balanceIsTooLow": "Số dư quá thấp",
       "chainSwitch": "Yêu cầu đổi chain",
-      "failed": "Việc Swap thất bại",
       "gasLimitIsTooLow": "Giới hạn gas quá thấp",
       "insufficientFunds": "Không đủ tài sản",
       "slippageNotMet": "Điều kiện trượt giá không được đáp ứng",
@@ -155,6 +143,19 @@
       "walletEnsAddressInvalid": "Địa chỉ ví không hợp lệ hoặc mạng lưới không hỗ trợ ENS."
     }
   },
+  "tooltip": {
+    "additionalProviderFee": "Cầu bổ sung, DEX và phí dịch vụ.",
+    "estimatedNetworkFee": "Phí mạng ước tính.",
+    "estimatedTime": "Thời gian thực hiện lệnh swap (phút).",
+    "notFound": {
+      "text": "Chúng tôi không thể tìm thấy trang này.",
+      "title": "404"
+    },
+    "numberOfSteps": "Một số bước swap. Mỗi bước có thể chứa 1-2 giao dịch yêu cầu chữ ký.",
+    "progressToNextUpdate": "Thông tin hiển thị sẽ tự động làm mới sau {{value}} giây. Bấm vào đây để cập nhật thủ công.",
+    "recommended": "Một tuyến đường giá rẻ cân bằng giữa sự phức tạp và dễ sử dụng.",
+    "settingsModified": "Thiết lập (Đã điều chỉnh)"
+  },
   "main": {
     "crossStepDetails": "Chuyển từ {{from}} đến {{to}} thông qua {{tool}}",
     "currentAmount": "Số lượng hiện tại",
@@ -211,16 +212,16 @@
     "selectToken": "Chọn Token",
     "sendToAddress": "Gửi đến {{address}}",
     "sendToWallet": "Gửi đến địa chỉ khác",
+    "sending": "Đang gửi",
     "sentToAddress": "Gửi đến {{address}}",
-    "stepBridge": "Bridge",
+    "stepBridge": "Cầu",
     "stepBridgeAndBuy": "Chuyển và mua",
     "stepDetails": "{{tool}} thông qua LI.FI",
     "stepSwap": "Swap",
     "stepSwapAndBridge": "Swap và Bridge",
     "stepSwapAndBuy": "Hoán đổi và mua",
-    "supportId": "Support ID",
+    "supportId": "Mã ID yêu cầu hỗ trợ",
     "swapStepDetails": "Swap tại {{chain}} thông qua {{tool}}",
-    "swapping": "Đang Swap",
     "tags": {
       "cheapest": "Rẻ",
       "fastest": "Nhanh",
@@ -243,18 +244,18 @@
     "insured": "Bạn đã bảo hiểm <0>{{amount, number(maximumFractionDigits: 9)}} {{tokenSymbol}}</0> trong quá trình vận chuyển:",
     "slippageError": "Lỗi trượt giá đối với token nhận được"
   },
-  "tooltip": {
-    "additionalProviderFee": "Cầu bổ sung, DEX và phí dịch vụ.",
-    "estimatedNetworkFee": "Phí mạng ước tính.",
-    "estimatedTime": "Thời gian thực hiện lệnh swap (phút).",
-    "notFound": {
-      "text": "Chúng tôi không thể tìm thấy trang này.",
-      "title": "404"
+  "settings": {
+    "enabledBridges": "Số lượng cầu khả dụng",
+    "enabledExchanges": "Số lượng sàn giao dịch khả dụng",
+    "gasPrice": {
+      "fast": "Nhanh",
+      "normal": "Bình thường",
+      "slow": "Chậm",
+      "title": "Giá gas"
     },
-    "numberOfSteps": "Một số bước swap. Mỗi bước có thể chứa 1-2 giao dịch yêu cầu chữ ký.",
-    "progressToNextUpdate": "Thông tin hiển thị sẽ tự động làm mới sau {{value}} giây. Bấm vào đây để cập nhật thủ công.",
-    "recommended": "Một tuyến đường giá rẻ cân bằng giữa sự phức tạp và dễ sử dụng.",
-    "settingsModified": "Thiết lập (Đã điều chỉnh)"
+    "routePriority": "Tuyền đường ưu tiên",
+    "showDestinationWallet": "Hiển thị địa chỉ ví nhận",
+    "slippage": "Trượt giá"
   },
   "wallet": {
     "extensionNotFound": "Chắc chắn rằng tiện ích trên trình duyệt {{name}} đã được kích hoạt tước khi chọn ví này."

package/cjs/pages/ActiveTransactionsPage/ActiveTransactionsPage.js

@@ -8,7 +8,6 @@ const react_1 = require("react");
 const react_i18next_1 = require("react-i18next");
 const ActiveTransactions_1 = require("../../components/ActiveTransactions");
 const Dialog_1 = require("../../components/Dialog");
-const Header_1 = require("../../components/Header");
 const providers_1 = require("../../providers");
 const stores_1 = require("../../stores");
 const ActiveTransactionsEmpty_1 = require("./ActiveTransactionsEmpty");
@@ -17,15 +16,16 @@ const ActiveTransactionsPage = () => {
     const { account } = (0, providers_1.useWallet)();
     const executingRoutes = (0, stores_1.useExecutingRoutesIds)(account.address);
     const deleteRoutes = (0, stores_1.useRouteExecutionStore)((store) => store.deleteRoutes);
+    const headerStoreContext = (0, stores_1.useHeaderStoreContext)();
     const [open, setOpen] = (0, react_1.useState)(false);
     const toggleDialog = (0, react_1.useCallback)(() => {
         setOpen((open) => !open);
     }, []);
     (0, react_1.useEffect)(() => {
         if (executingRoutes.length) {
-            return Header_1.useHeaderStore.getState().setAction((0, jsx_runtime_1.jsx)(material_1.IconButton, { size: "medium", edge: "end", onClick: toggleDialog, children: (0, jsx_runtime_1.jsx)(DeleteOutline_1.default, {}) }));
+            return headerStoreContext.getState().setAction((0, jsx_runtime_1.jsx)(material_1.IconButton, { size: "medium", edge: "end", onClick: toggleDialog, children: (0, jsx_runtime_1.jsx)(DeleteOutline_1.default, {}) }));
         }
-    }, [executingRoutes.length, toggleDialog]);
+    }, [executingRoutes.length, headerStoreContext, toggleDialog]);
     if (!executingRoutes.length) {
         return (0, jsx_runtime_1.jsx)(ActiveTransactionsEmpty_1.ActiveTransactionsEmpty, {});
     }

package/cjs/pages/RoutesPage/RoutesPage.js

@@ -3,7 +3,6 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.RoutesPage = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = require("react");
-const Header_1 = require("../../components/Header");
 const ProgressToNextUpdate_1 = require("../../components/ProgressToNextUpdate");
 const RouteCard_1 = require("../../components/RouteCard");
 const hooks_1 = require("../../hooks");
@@ -14,6 +13,7 @@ const RoutesPage = () => {
     const { navigateBack, navigate } = (0, hooks_1.useNavigateBack)();
     const { routes, isLoading, isFetching, dataUpdatedAt, refetchTime, refetch } = (0, hooks_1.useRoutes)();
     const setExecutableRoute = (0, stores_1.useSetExecutableRoute)();
+    const headerStoreContext = (0, stores_1.useHeaderStoreContext)();
     const handleRouteClick = (route) => {
         setExecutableRoute(route);
         navigate(utils_1.navigationRoutes.transactionExecution, {
@@ -28,10 +28,10 @@ const RoutesPage = () => {
         // eslint-disable-next-line react-hooks/exhaustive-deps
     }, []);
     (0, react_1.useEffect)(() => {
-        return Header_1.useHeaderStore
+        return headerStoreContext
             .getState()
             .setAction((0, jsx_runtime_1.jsx)(ProgressToNextUpdate_1.ProgressToNextUpdate, { updatedAt: dataUpdatedAt || new Date().getTime(), timeToUpdate: refetchTime, isLoading: isFetching, onClick: () => refetch(), sx: { marginRight: -1 }, size: "medium", edge: "end" }));
-    }, [dataUpdatedAt, isFetching, refetch, refetchTime]);
+    }, [dataUpdatedAt, headerStoreContext, isFetching, refetch, refetchTime]);
     const routeNotFound = !routes?.length && !isLoading && !isFetching;
     return ((0, jsx_runtime_1.jsx)(RoutesPage_style_1.Stack, { direction: "column", spacing: 2, flex: 1, children: routeNotFound ? ((0, jsx_runtime_1.jsx)(RouteCard_1.RouteNotFoundCard, {})) : isLoading ? (Array.from({ length: 3 }).map((_, index) => ((0, jsx_runtime_1.jsx)(RouteCard_1.RouteCardSkeleton, {}, index)))) : (routes?.map((route, index) => ((0, jsx_runtime_1.jsx)(RouteCard_1.RouteCard, { route: route, onClick: () => handleRouteClick(route), active: index === 0, expanded: routes?.length <= 2 }, route.id)))) }));
 };

package/cjs/pages/SelectEnabledToolsPage/SelectEnabledToolsPage.js

@@ -7,7 +7,6 @@ const CheckBoxOutlineBlankOutlined_1 = require("@mui/icons-material/CheckBoxOutl
 const CheckBoxOutlined_1 = require("@mui/icons-material/CheckBoxOutlined");
 const IndeterminateCheckBoxOutlined_1 = require("@mui/icons-material/IndeterminateCheckBoxOutlined");
 const material_1 = require("@mui/material");
-const Header_1 = require("../../components/Header");
 const react_1 = require("react");
 const shallow_1 = require("zustand/shallow");
 const ListItemText_1 = require("../../components/ListItemText");
@@ -18,6 +17,7 @@ const SelectEnabledToolsPage = ({ type }) => {
     const typeKey = type.toLowerCase();
     const { tools } = (0, hooks_1.useTools)();
     const [enabledTools, setTools] = (0, stores_1.useSettingsStore)((state) => [state[`enabled${type}`], state.setTools], shallow_1.shallow);
+    const headerStoreContext = (0, stores_1.useHeaderStoreContext)();
     const handleClick = (key) => {
         if (!tools) {
             return;
@@ -44,8 +44,8 @@ const SelectEnabledToolsPage = ({ type }) => {
                 setTools(type, toolKeys, toolKeys);
             }
         };
-        return Header_1.useHeaderStore.getState().setAction((0, jsx_runtime_1.jsx)(material_1.IconButton, { size: "medium", edge: "end", onClick: toggleCheckboxes, children: allToolsSelected ? ((0, jsx_runtime_1.jsx)(CheckBoxOutlined_1.default, {})) : enabledTools.length ? ((0, jsx_runtime_1.jsx)(IndeterminateCheckBoxOutlined_1.default, {})) : ((0, jsx_runtime_1.jsx)(CheckBoxOutlineBlankOutlined_1.default, {})) }));
-    }, [enabledTools.length, setTools, tools, type, typeKey]);
+        return headerStoreContext.getState().setAction((0, jsx_runtime_1.jsx)(material_1.IconButton, { size: "medium", edge: "end", onClick: toggleCheckboxes, children: allToolsSelected ? ((0, jsx_runtime_1.jsx)(CheckBoxOutlined_1.default, {})) : enabledTools.length ? ((0, jsx_runtime_1.jsx)(IndeterminateCheckBoxOutlined_1.default, {})) : ((0, jsx_runtime_1.jsx)(CheckBoxOutlineBlankOutlined_1.default, {})) }));
+    }, [enabledTools.length, headerStoreContext, setTools, tools, type, typeKey]);
     return ((0, jsx_runtime_1.jsx)(material_1.Container, { disableGutters: true, children: (0, jsx_runtime_1.jsx)(material_1.List, { sx: {
                 paddingLeft: 1.5,
                 paddingRight: 1.5,

package/cjs/pages/TransactionDetailsPage/ContactSupportButton.d.ts

@@ -0,0 +1,5 @@
+interface ContactSupportButtonProps {
+    supportId?: string;
+}
+export declare const ContactSupportButton: ({ supportId, }: ContactSupportButtonProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/cjs/pages/TransactionDetailsPage/ContactSupportButton.js

@@ -0,0 +1,25 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ContactSupportButton = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const material_1 = require("@mui/material");
+const react_i18next_1 = require("react-i18next");
+const hooks_1 = require("../../hooks/");
+const events_1 = require("../../types/events");
+const ContactSupportButton = ({ supportId, }) => {
+    const { t } = (0, react_i18next_1.useTranslation)();
+    const widgetEvents = (0, hooks_1.useWidgetEvents)();
+    const handleClick = () => {
+        if (!widgetEvents.all.has(events_1.WidgetEvent.RouteContactSupport)) {
+            const url = 'https://discord.gg/lifi';
+            const target = '_blank';
+            const rel = 'nofollow noreferrer';
+            window.open(url, target, rel);
+        }
+        else {
+            widgetEvents.emit(events_1.WidgetEvent.RouteContactSupport, { supportId });
+        }
+    };
+    return ((0, jsx_runtime_1.jsx)(material_1.Button, { onClick: handleClick, fullWidth: true, children: t('button.contactSupport') }));
+};
+exports.ContactSupportButton = ContactSupportButton;

package/cjs/pages/TransactionDetailsPage/TransactionDetailsPage.js

@@ -12,13 +12,13 @@ const shallow_1 = require("zustand/shallow");
 const Card_1 = require("../../components/Card");
 const ContractComponent_1 = require("../../components/ContractComponent");
 const Dialog_1 = require("../../components/Dialog");
-const Header_1 = require("../../components/Header");
 const Insurance_1 = require("../../components/Insurance");
 const Step_1 = require("../../components/Step");
 const hooks_1 = require("../../hooks");
 const providers_1 = require("../../providers");
 const stores_1 = require("../../stores");
 const utils_1 = require("../../utils");
+const ContactSupportButton_1 = require("./ContactSupportButton");
 const TransactionDetailsPage_style_1 = require("./TransactionDetailsPage.style");
 const TransactionDetailsPage = () => {
     const { t, i18n } = (0, react_i18next_1.useTranslation)();
@@ -26,6 +26,7 @@ const TransactionDetailsPage = () => {
     const { subvariant, contractComponent, contractSecondaryComponent } = (0, providers_1.useWidgetConfig)();
     const { state } = (0, react_router_dom_1.useLocation)();
     const [routeExecution, deleteRoute] = (0, stores_1.useRouteExecutionStore)((store) => [store.routes[state?.routeId], store.deleteRoute], shallow_1.shallow);
+    const headerStoreContext = (0, stores_1.useHeaderStoreContext)();
     const [open, setOpen] = (0, react_1.useState)(false);
     const toggleDialog = (0, react_1.useCallback)(() => {
         setOpen((open) => !open);
@@ -48,8 +49,8 @@ const TransactionDetailsPage = () => {
         await navigator.clipboard.writeText(supportId);
     };
     (0, react_1.useEffect)(() => {
-        return Header_1.useHeaderStore.getState().setAction((0, jsx_runtime_1.jsx)(material_1.IconButton, { size: "medium", edge: "end", onClick: toggleDialog, children: (0, jsx_runtime_1.jsx)(DeleteOutline_1.default, {}) }));
-    }, [toggleDialog]);
+        return headerStoreContext.getState().setAction((0, jsx_runtime_1.jsx)(material_1.IconButton, { size: "medium", edge: "end", onClick: toggleDialog, children: (0, jsx_runtime_1.jsx)(DeleteOutline_1.default, {}) }));
+    }, [headerStoreContext, toggleDialog]);
     const startedAt = new Date(routeExecution?.route.steps[0].execution?.process[0].startedAt ?? 0);
     return ((0, jsx_runtime_1.jsxs)(TransactionDetailsPage_style_1.Container, { children: [(0, jsx_runtime_1.jsxs)(material_1.Box, { sx: {
                     display: 'flex',
@@ -57,9 +58,9 @@ const TransactionDetailsPage = () => {
                     justifyContent: 'space-between',
                 }, pb: 1, children: [(0, jsx_runtime_1.jsx)(material_1.Typography, { fontSize: 12, children: new Intl.DateTimeFormat(i18n.language, { dateStyle: 'long' }).format(startedAt) }), (0, jsx_runtime_1.jsx)(material_1.Typography, { fontSize: 12, children: new Intl.DateTimeFormat(i18n.language, {
                             timeStyle: 'short',
-                        }).format(startedAt) })] }), (0, Step_1.getStepList)(routeExecution?.route), subvariant === 'nft' ? ((0, jsx_runtime_1.jsx)(ContractComponent_1.ContractComponent, { mt: 2, children: contractSecondaryComponent || contractComponent })) : null, routeExecution?.route?.insurance?.state === 'INSURED' ? ((0, jsx_runtime_1.jsx)(Insurance_1.Insurance, { mt: 2, status: routeExecution.status, feeAmountUsd: routeExecution.route.insurance.feeAmountUsd, insuredAmount: (0, utils_1.formatTokenAmount)(routeExecution.route.toAmountMin, routeExecution.route.toToken.decimals), insuredTokenSymbol: routeExecution.route.toToken.symbol, insurableRouteId: routeExecution.route.id, insuranceCoverageId: insuranceCoverageId })) : null, (0, jsx_runtime_1.jsxs)(Card_1.Card, { mt: 2, children: [(0, jsx_runtime_1.jsxs)(material_1.Box, { sx: {
+                        }).format(startedAt) })] }), (0, Step_1.getStepList)(routeExecution?.route, subvariant), subvariant === 'nft' ? ((0, jsx_runtime_1.jsx)(ContractComponent_1.ContractComponent, { mt: 2, children: contractSecondaryComponent || contractComponent })) : null, routeExecution?.route?.insurance?.state === 'INSURED' ? ((0, jsx_runtime_1.jsx)(Insurance_1.Insurance, { mt: 2, status: routeExecution.status, feeAmountUsd: routeExecution.route.insurance.feeAmountUsd, insuredAmount: (0, utils_1.formatTokenAmount)(routeExecution.route.toAmountMin, routeExecution.route.toToken.decimals), insuredTokenSymbol: routeExecution.route.toToken.symbol, insurableRouteId: routeExecution.route.id, insuranceCoverageId: insuranceCoverageId })) : null, (0, jsx_runtime_1.jsxs)(Card_1.Card, { mt: 2, children: [(0, jsx_runtime_1.jsxs)(material_1.Box, { sx: {
                             display: 'flex',
                             flex: 1,
-                        }, children: [(0, jsx_runtime_1.jsx)(Card_1.CardTitle, { flex: 1, children: t('main.supportId') }), (0, jsx_runtime_1.jsx)(material_1.Box, { mr: 1, mt: 1, children: (0, jsx_runtime_1.jsx)(material_1.IconButton, { size: "medium", onClick: copySupportId, children: (0, jsx_runtime_1.jsx)(ContentCopyRounded_1.default, { fontSize: "small" }) }) })] }), (0, jsx_runtime_1.jsx)(material_1.Typography, { variant: "body2", pt: 1, pb: 2, px: 2, sx: { wordBreak: 'break-all' }, children: supportId })] }), (0, jsx_runtime_1.jsx)(material_1.Box, { mt: 2, children: (0, jsx_runtime_1.jsx)(material_1.Button, { href: "https://discord.gg/lifi", target: "_blank", rel: "nofollow noreferrer", fullWidth: true, children: t('button.contactSupport') }) }), (0, jsx_runtime_1.jsxs)(Dialog_1.Dialog, { open: open, onClose: toggleDialog, children: [(0, jsx_runtime_1.jsx)(material_1.DialogTitle, { children: t('warning.title.deleteTransaction') }), (0, jsx_runtime_1.jsx)(material_1.DialogContent, { children: (0, jsx_runtime_1.jsx)(material_1.DialogContentText, { children: t('warning.message.deleteTransactionHistory') }) }), (0, jsx_runtime_1.jsxs)(material_1.DialogActions, { children: [(0, jsx_runtime_1.jsx)(material_1.Button, { onClick: toggleDialog, children: t('button.cancel') }), (0, jsx_runtime_1.jsx)(material_1.Button, { variant: "contained", onClick: handleDeleteRoute, autoFocus: true, children: t('button.delete') })] })] })] }));
+                        }, children: [(0, jsx_runtime_1.jsx)(Card_1.CardTitle, { flex: 1, children: t('main.supportId') }), (0, jsx_runtime_1.jsx)(material_1.Box, { mr: 1, mt: 1, children: (0, jsx_runtime_1.jsx)(material_1.IconButton, { size: "medium", onClick: copySupportId, children: (0, jsx_runtime_1.jsx)(ContentCopyRounded_1.default, { fontSize: "small" }) }) })] }), (0, jsx_runtime_1.jsx)(material_1.Typography, { variant: "body2", pt: 1, pb: 2, px: 2, sx: { wordBreak: 'break-all' }, children: supportId })] }), (0, jsx_runtime_1.jsx)(material_1.Box, { mt: 2, children: (0, jsx_runtime_1.jsx)(ContactSupportButton_1.ContactSupportButton, { supportId: supportId }) }), (0, jsx_runtime_1.jsxs)(Dialog_1.Dialog, { open: open, onClose: toggleDialog, children: [(0, jsx_runtime_1.jsx)(material_1.DialogTitle, { children: t('warning.title.deleteTransaction') }), (0, jsx_runtime_1.jsx)(material_1.DialogContent, { children: (0, jsx_runtime_1.jsx)(material_1.DialogContentText, { children: t('warning.message.deleteTransactionHistory') }) }), (0, jsx_runtime_1.jsxs)(material_1.DialogActions, { children: [(0, jsx_runtime_1.jsx)(material_1.Button, { onClick: toggleDialog, children: t('button.cancel') }), (0, jsx_runtime_1.jsx)(material_1.Button, { variant: "contained", onClick: handleDeleteRoute, autoFocus: true, children: t('button.delete') })] })] })] }));
 };
 exports.TransactionDetailsPage = TransactionDetailsPage;