@tonconnect/ui 2.0.2 → 2.0.3-beta.1

package/lib/index.cjs

@@ -10036,18 +10036,26 @@ const WalletsModal = () => {
     return (_a2 = appState.connectRequestParameters) == null ? void 0 : _a2.value;
   });
   const onClose = (closeReason) => {
-    setWalletsModalState({
-      status: "closed",
-      closeReason
-    });
-    setSelectedWalletInfo(null);
-    setInfoTab(false);
+    tonConnectUI.closeModal(closeReason);
   };
   const unsubscribe = connector.onStatusChange((wallet) => {
     if (wallet) {
       onClose("wallet-selected");
     }
   });
+  const onSelectAllWallets = () => {
+    setSelectedTab("all-wallets");
+  };
+  const onSelectUniversal = () => {
+    setSelectedTab("universal");
+  };
+  const clearSelectedWalletInfo = () => {
+    setSelectedWalletInfo(null);
+  };
+  onCleanup(() => {
+    setSelectedWalletInfo(null);
+    setInfoTab(false);
+  });
   onCleanup(unsubscribe);
   return createComponent(StyledModal, {
     get opened() {
@@ -10112,7 +10120,7 @@ const WalletsModal = () => {
                         get additionalRequest() {
                           return additionalRequest();
                         },
-                        onBackClick: () => setSelectedWalletInfo(null)
+                        onBackClick: clearSelectedWalletInfo
                       });
                     }
                   }), createComponent(Match, {
@@ -10131,7 +10139,7 @@ const WalletsModal = () => {
                         get additionalRequest() {
                           return additionalRequest();
                         },
-                        onSelectAllWallets: () => setSelectedTab("all-wallets")
+                        onSelectAllWallets
                       });
                     }
                   }), createComponent(Match, {
@@ -10143,7 +10151,7 @@ const WalletsModal = () => {
                         get walletsList() {
                           return walletsList();
                         },
-                        onBack: () => setSelectedTab("universal"),
+                        onBack: onSelectUniversal,
                         onSelect: setSelectedWalletInfo
                       });
                     }
@@ -10398,6 +10406,7 @@ const SingleWalletModal = () => {
     }
   });
   const connector = useContext(ConnectorContext);
+  const tonConnectUI = useContext(TonConnectUiContext);
   const [infoTab, setInfoTab] = createSignal(false);
   const additionalRequestLoading = () => {
     var _a2;
@@ -10411,11 +10420,7 @@ const SingleWalletModal = () => {
     return (_a2 = appState.connectRequestParameters) == null ? void 0 : _a2.value;
   });
   const onClose = (closeReason) => {
-    setSingleWalletModalState({
-      status: "closed",
-      closeReason
-    });
-    setInfoTab(false);
+    tonConnectUI.closeSingleWalletModal(closeReason);
   };
   const unsubscribe = connector.onStatusChange((wallet) => {
     if (wallet) {
@@ -10423,6 +10428,9 @@ const SingleWalletModal = () => {
     }
   });
   onCleanup(unsubscribe);
+  onCleanup(() => {
+    setInfoTab(false);
+  });
   return createComponent(StyledModal, {
     get opened() {
       return getSingleWalletModalIsOpened();
@@ -10572,8 +10580,10 @@ class WalletsModalManager {
     __publicField(this, "connector");
     __publicField(this, "setConnectRequestParametersCallback");
     __publicField(this, "consumers", []);
+    __publicField(this, "tracker");
     __publicField(this, "state", walletsModalState());
     this.connector = options.connector;
+    this.tracker = options.tracker;
     this.setConnectRequestParametersCallback = options.setConnectRequestParametersCallback;
     createEffect(() => {
       const state = walletsModalState();
@@ -10583,6 +10593,7 @@ class WalletsModalManager {
   }
   open() {
     return __async(this, null, function* () {
+      this.tracker.trackConnectionStarted();
       const walletsList = yield this.connector.getWallets();
       const embeddedWallet = walletsList.find(sdk.isWalletInfoCurrentlyEmbedded);
       if (embeddedWallet) {
@@ -10592,8 +10603,11 @@ class WalletsModalManager {
       }
     });
   }
-  close() {
-    widgetController.closeWalletsModal("action-cancelled");
+  close(reason = "action-cancelled") {
+    if (reason === "action-cancelled") {
+      this.tracker.trackConnectionError("Connection was cancelled");
+    }
+    widgetController.closeWalletsModal(reason);
   }
   onStateChange(onChange) {
     this.consumers.push(onChange);
@@ -10653,8 +10667,10 @@ class SingleWalletModalManager {
     __publicField(this, "connector");
     __publicField(this, "setConnectRequestParametersCallback");
     __publicField(this, "consumers", []);
+    __publicField(this, "tracker");
     __publicField(this, "state", singleWalletModalState());
     this.connector = options.connector;
+    this.tracker = options.tracker;
     this.setConnectRequestParametersCallback = options.setConnectRequestParametersCallback;
     createEffect(() => {
       const state = singleWalletModalState();
@@ -10664,6 +10680,7 @@ class SingleWalletModalManager {
   }
   open(wallet) {
     return __async(this, null, function* () {
+      this.tracker.trackConnectionStarted();
       const fetchedWalletsList = yield this.connector.getWallets();
       const walletsList = applyWalletsListConfiguration(
         fetchedWalletsList,
@@ -10680,10 +10697,15 @@ class SingleWalletModalManager {
       if (isExternalWalletExist) {
         return this.openSingleWalletModal(externalWallet);
       }
-      throw new TonConnectUIError(`Trying to open modal window with unknown wallet "${wallet}".`);
+      const error = `Trying to open modal window with unknown wallet "${wallet}".`;
+      this.tracker.trackConnectionError(error);
+      throw new TonConnectUIError(error);
     });
   }
-  close() {
+  close(reason = "action-cancelled") {
+    if (reason === "action-cancelled") {
+      this.tracker.trackConnectionError("Connection was cancelled");
+    }
     widgetController.closeSingleWalletModal("action-cancelled");
   }
   onStateChange(onChange) {
@@ -10722,10 +10744,96 @@ class SingleWalletModalManager {
     });
   }
 }
+class TonConnectUITracker {
+  constructor(eventDispatcher) {
+    __publicField(this, "eventPrefix", "ton-connect-ui-");
+    __publicField(this, "eventDispatcher");
+    this.eventDispatcher = eventDispatcher != null ? eventDispatcher : new sdk.BrowserEventDispatcher();
+  }
+  dispatchUserActionEvent(eventDetails) {
+    var _a2;
+    try {
+      const eventName = `${this.eventPrefix}${eventDetails.type}`;
+      (_a2 = this.eventDispatcher) == null ? void 0 : _a2.dispatchEvent(eventName, eventDetails).catch();
+    } catch (e2) {
+    }
+  }
+  trackConnectionStarted(...args) {
+    try {
+      const event = sdk.createConnectionStartedEvent(...args);
+      this.dispatchUserActionEvent(event);
+    } catch (e2) {
+    }
+  }
+  trackConnectionCompleted(...args) {
+    try {
+      const event = sdk.createConnectionCompletedEvent(...args);
+      this.dispatchUserActionEvent(event);
+    } catch (e2) {
+    }
+  }
+  trackConnectionError(...args) {
+    try {
+      const event = sdk.createConnectionErrorEvent(...args);
+      this.dispatchUserActionEvent(event);
+    } catch (e2) {
+    }
+  }
+  trackConnectionRestoringStarted(...args) {
+    try {
+      const event = sdk.createConnectionRestoringStartedEvent(...args);
+      this.dispatchUserActionEvent(event);
+    } catch (e2) {
+    }
+  }
+  trackConnectionRestoringCompleted(...args) {
+    try {
+      const event = sdk.createConnectionRestoringCompletedEvent(...args);
+      this.dispatchUserActionEvent(event);
+    } catch (e2) {
+    }
+  }
+  trackConnectionRestoringError(...args) {
+    try {
+      const event = sdk.createConnectionRestoringErrorEvent(...args);
+      this.dispatchUserActionEvent(event);
+    } catch (e2) {
+    }
+  }
+  trackDisconnection(...args) {
+    try {
+      const event = sdk.createDisconnectionEvent(...args);
+      this.dispatchUserActionEvent(event);
+    } catch (e2) {
+    }
+  }
+  trackTransactionSentForSignature(...args) {
+    try {
+      const event = sdk.createTransactionSentForSignatureEvent(...args);
+      this.dispatchUserActionEvent(event);
+    } catch (e2) {
+    }
+  }
+  trackTransactionSigned(...args) {
+    try {
+      const event = sdk.createTransactionSignedEvent(...args);
+      this.dispatchUserActionEvent(event);
+    } catch (e2) {
+    }
+  }
+  trackTransactionSigningFailed(...args) {
+    try {
+      const event = sdk.createTransactionSigningFailedEvent(...args);
+      this.dispatchUserActionEvent(event);
+    } catch (e2) {
+    }
+  }
+}
 class TonConnectUI {
   constructor(options) {
     __publicField(this, "walletInfoStorage", new WalletInfoStorage());
     __publicField(this, "preferredWalletStorage", new PreferredWalletStorage());
+    __publicField(this, "tracker");
     __publicField(this, "walletInfo", null);
     __publicField(this, "systemThemeChangeUnsubscribe", null);
     __publicField(this, "actionsConfiguration");
@@ -10739,20 +10847,26 @@ class TonConnectUI {
     if (options && "connector" in options && options.connector) {
       this.connector = options.connector;
     } else if (options && "manifestUrl" in options && options.manifestUrl) {
-      this.connector = new sdk.TonConnect({ manifestUrl: options.manifestUrl });
+      this.connector = new sdk.TonConnect({
+        manifestUrl: options.manifestUrl,
+        eventDispatcher: options == null ? void 0 : options.eventDispatcher
+      });
     } else {
       throw new TonConnectUIError(
         "You have to specify a `manifestUrl` or a `connector` in the options."
       );
     }
+    this.tracker = new TonConnectUITracker(options == null ? void 0 : options.eventDispatcher);
     this.modal = new WalletsModalManager({
       connector: this.connector,
+      tracker: this.tracker,
       setConnectRequestParametersCallback: (callback) => {
         this.connectRequestParametersCallback = callback;
       }
     });
     this.singleWalletModal = new SingleWalletModalManager({
       connector: this.connector,
+      tracker: this.tracker,
       setConnectRequestParametersCallback: (callback) => {
         this.connectRequestParametersCallback = callback;
       }
@@ -10765,10 +10879,14 @@ class TonConnectUI {
     const rootId = this.normalizeWidgetRoot(options == null ? void 0 : options.widgetRootId);
     this.subscribeToWalletChange();
     if ((options == null ? void 0 : options.restoreConnection) !== false) {
+      this.tracker.trackConnectionRestoringStarted();
       this.connectionRestored = new Promise((resolve) => __async(this, null, function* () {
         yield this.connector.restoreConnection();
         if (!this.connector.connected) {
+          this.tracker.trackConnectionRestoringError("Connection was not restored");
           this.walletInfoStorage.removeWalletInfo();
+        } else {
+          this.tracker.trackConnectionRestoringCompleted(this.wallet);
         }
         resolve(this.connector.connected);
       }));
@@ -10866,8 +10984,8 @@ class TonConnectUI {
       return this.modal.open();
     });
   }
-  closeModal() {
-    this.modal.close();
+  closeModal(reason) {
+    this.modal.close(reason);
   }
   onModalStateChange(onChange) {
     return this.modal.onStateChange(onChange);
@@ -10880,8 +10998,8 @@ class TonConnectUI {
       return this.singleWalletModal.open(wallet);
     });
   }
-  closeSingleWalletModal() {
-    this.singleWalletModal.close();
+  closeSingleWalletModal(closeReason) {
+    this.singleWalletModal.close(closeReason);
   }
   onSingleWalletModalStateChange(onChange) {
     return this.singleWalletModal.onStateChange(onChange);
@@ -10901,6 +11019,7 @@ class TonConnectUI {
     });
   }
   disconnect() {
+    this.tracker.trackDisconnection(this.wallet, "dapp");
     widgetController.clearAction();
     widgetController.removeSelectedWalletInfo();
     this.walletInfoStorage.removeWalletInfo();
@@ -10908,7 +11027,9 @@ class TonConnectUI {
   }
   sendTransaction(tx, options) {
     return __async(this, null, function* () {
+      this.tracker.trackTransactionSentForSignature(this.wallet, tx);
       if (!this.connected) {
+        this.tracker.trackTransactionSigningFailed(this.wallet, tx, "Wallet was not connected");
         throw new TonConnectUIError("Connect wallet to send a transaction.");
       }
       if (isInTMA()) {
@@ -10970,6 +11091,7 @@ class TonConnectUI {
           },
           onRequestSent
         );
+        this.tracker.trackTransactionSigned(this.wallet, tx, result);
         widgetController.setAction({
           name: "transaction-sent",
           showNotification: notifications2.includes("success"),
@@ -10977,6 +11099,7 @@ class TonConnectUI {
         });
         return result;
       } catch (e2) {
+        this.tracker.trackTransactionSigningFailed(this.wallet, tx, e2.message);
         widgetController.setAction({
           name: "transaction-canceled",
           showNotification: notifications2.includes("error"),
@@ -11033,23 +11156,28 @@ class TonConnectUI {
   waitForWalletConnection(options) {
     return __async(this, null, function* () {
       return new Promise((resolve, reject) => {
+        this.tracker.trackConnectionStarted();
         const { ignoreErrors = false, signal = null } = options;
         if (signal && signal.aborted) {
+          this.tracker.trackConnectionError("Connection was cancelled");
           return reject(new TonConnectUIError("Wallet was not connected"));
         }
         const onStatusChangeHandler = (wallet) => __async(this, null, function* () {
           if (!wallet) {
+            this.tracker.trackConnectionError("Connection was cancelled");
             if (ignoreErrors) {
               return;
             }
             unsubscribe();
             reject(new TonConnectUIError("Wallet was not connected"));
           } else {
+            this.tracker.trackConnectionCompleted(wallet);
             unsubscribe();
             resolve(wallet);
           }
         });
         const onErrorsHandler = (reason) => {
+          this.tracker.trackConnectionError(reason.message);
           if (ignoreErrors) {
             return;
           }