Merge pull request #12 from MyTonSwap/develop

Implement transaction reporting

lib/components/SwapButton/Inprogress.tsx

@@ -8,6 +8,7 @@ import { ImSpinner8 } from "react-icons/im";
 import "./Inprogress.scss";
 import { useEventsStore } from "../../store/events.store";
 import { useTranslation } from "react-i18next";
+import { sendTransaction } from "../../services/transaction";
 const Inprogress = () => {
     const { t } = useTranslation();
     const {
@@ -21,6 +22,7 @@ const Inprogress = () => {
         bestRoute,
         receive_rate,
         pay_rate,
+        transactionQueryId,
     } = useSwapStore();
     const { onSwap } = useEventsStore();
     useEffect(() => {
@@ -61,6 +63,10 @@ const Inprogress = () => {
                             hash: transactionHash,
                         },
                     });
+                    sendTransaction({
+                        hash: transactionHash,
+                        query_id: transactionQueryId!,
+                    });
                     setErrorMessage({
                         errorTitle: t("errors.transaction_failed"),
                         errorMessage: t("errors.unknown_error"),

lib/services/errorAnalytics.ts

@@ -3,8 +3,7 @@ import { WIDGET_VERSION } from "../constants";
 import toast from "react-hot-toast";
 import { useSwapStore } from "../store/swap.store";
 import { useWalletStore } from "../store/wallet.store";
-
-const ERROR_REPORTING_ENDPOINT = "https://app.mytonswap.com/api/stats/error";
+import { httpClient } from "./httpClient";
 
 interface ErrorReportBody {
     section: string;
@@ -15,7 +14,7 @@ interface ErrorReportBody {
 
 async function sendErrorReport(body: ErrorReportBody): Promise<void> {
     try {
-        await axios.post(ERROR_REPORTING_ENDPOINT, body);
+        await httpClient.post("/stats/error", body);
         console.log("Error reported successfully");
     } catch (reportingError) {
         console.error("Failed to report error:", reportingError);

lib/services/httpClient.ts

@@ -0,0 +1,17 @@
+import axios from "axios";
+
+import axiosRetry from "axios-retry";
+
+axiosRetry(axios, { retries: 3 });
+
+export const httpClient = axios.create({
+    baseURL: "https://app.mytonswap.com/api",
+    headers: {
+        "Content-Type": "application/json",
+    },
+});
+
+// httpClient.interceptors.request.use((config) => {
+//     config.headers["app-id"]
+//     return config;
+// })

lib/services/transaction.ts

@@ -0,0 +1,15 @@
+import { httpClient } from "./httpClient";
+
+type Transaction = {
+    query_id: string;
+    hash: string;
+};
+
+export const sendTransaction = async (transaction: Transaction) => {
+    try {
+        await httpClient.post("/v2/routes/boc/confirm", transaction);
+        console.log("Transaction reported successfully");
+    } catch (reportingError) {
+        console.error("Failed to report transaction:", reportingError);
+    }
+};

lib/store/swap.store.ts

@@ -38,6 +38,7 @@ type SwapStates = {
     transactionError: string | null;
     transactionErrorBody: string | null;
     transactionHash: string | null;
+    transactionQueryId: string | null;
     pinnedTokens: Asset[] | null;
 };
 
@@ -62,7 +63,7 @@ type SwapActions = {
         errorMessage: string | null;
         errorTitle: string | null;
     }) => void;
-    setTransactionHash: (hash: string) => void;
+    setTransactionHash: (hash: string, query_id: string) => void;
 
     refetchBestRoute: () => void;
 };
@@ -90,9 +91,12 @@ export const useSwapStore = create<SwapActions & SwapStates>((set, get) => ({
     transactionError: null,
     transactionErrorBody: null,
     transactionHash: null,
+    transactionQueryId: null,
     transactionBestRoute: null,
     pinnedTokens: null,
-    setTransactionHash(hash) {
+    assets: null,
+
+    setTransactionHash(hash, query_id) {
         const {
             pay_token,
             receive_token,
@@ -116,6 +120,7 @@ export const useSwapStore = create<SwapActions & SwapStates>((set, get) => ({
         });
         set(() => ({
             transactionHash: hash,
+            transactionQueryId: query_id,
             swapModal: ModalState.IN_PROGRESS,
         }));
     },
@@ -306,7 +311,6 @@ export const useSwapStore = create<SwapActions & SwapStates>((set, get) => ({
         }
     },
 
-    assets: null,
     async addToAssets(newAssets) {
         if (!newAssets) return;
         set((state) => {

lib/utils/swap.ts

@@ -63,7 +63,8 @@ export default async function swap(
         .then((result) => {
             const cell = Cell.fromBoc(Buffer.from(result.boc, "base64"))[0];
             const stateInstance = useSwapStore.getState();
-            stateInstance.setTransactionHash(cell.hash().toString("hex"));
+            const hash = cell.hash().toString("hex");
+            stateInstance.setTransactionHash(hash, rawMessage.query_id);
         })
         .catch((e) => {
             console.log(e);

package.json

@@ -119,6 +119,7 @@
         "@tonconnect/ui-react": "^2.0.9",
         "@uidotdev/usehooks": "^2.4.1",
         "axios": "^1.7.7",
+        "axios-retry": "^4.5.0",
         "framer-motion": "^11.11.2",
         "i18next": "^23.16.4",
         "i18next-browser-languagedetector": "^8.0.0",