[TON_CONNECT_SDK_ERROR] TonConnectUIError Failed to send transaction

[mano7onamm]

Your Question

I'm trying to send transaction in react telegram mini app and have:

ton-connect-ui.ts:581 Uncaught (in promise) Error: [TON_CONNECT_SDK_ERROR] TonConnectUIError
Failed to send transaction
    at AbortSignal.<anonymous> (ton-connect-ui.ts:581:1)
    at ton-connect-ui.ts:393:1
    at transaction-modal-manager.ts:41:1
    at Array.forEach (<anonymous>)
    at Object.fn (transaction-modal-manager.ts:41:1)
    at runComputation (solid.js:640:1)
    at updateComputation (solid.js:623:1)
    at runTop (solid.js:725:1)
    at runUserEffects (solid.js:823:1)
    at solid.js:792:1

What is the reason?

If I connect telegram Wallet I have a message "Failed to send transaction" (but don't really know the reason because there are no js logs in web view.

If I connect Tonkeeper (and open my app in browser) I have the above error. But in Tonkeeper finally transaction is sending.

Manifest is ok because I see the icon and app url when connecting the wallet. Connection is ok also.

Context

I'm trying to do like this: (May I miss something important?)

export function PaymentComponent({balance, payText, updateUserInfo}) {
    const [tonConnectUI, setOptions] = useTonConnectUI();

    const doPayment = async () => {
        let unsubscribeOnModalStateChange = tonConnectUI.onModalStateChange((state: WalletsModalState) => {
            console.log("Modal state is: ", state);
            if (state.status === 'closed') {
                unsubscribeOnModalStateChange();
                executeAfterModalClosed(state.closeReason);
            }
        });

        if (tonConnectUI.connected) {
            alert("Connected");
            await tonConnectUI.disconnect();
        }
        else {
            alert("Not connected");
            await tonConnectUI.openModal();
        }

        async function executeAfterModalClosed(closeReason) {
            console.log(closeReason);
            if (closeReason === 'action-cancelled') {
                return;
            }

            const transaction = {
                messages: [
                    {
                        address: "0:A7FEDA2EA079D4EB3EBEE8200E76AD90E4FBD9D24671A2A92990C741CD08B485",
                        amount: "10000000" // Toncoin in nanotons
                    }
                ]
            };
            const response = await tonConnectUI.sendTransaction(transaction);
        }
    }

    return (
        <div className="balance-and-pay">
            <div className="payment" onClick={doPayment}>
                <img src={theImg} alt="Pay" className="pay-image"/>
                <span className="pay-btn">{payText}</span>
            </div>
        </div>
    );
}

What have you tried so far?

Tried to change TON address, amount in message. Tried Tonkeeper (works despite the error in console). But in telegram transaction is failed to send.

Relevant Code or Commands

No response

Documentation Check

• [X] Yes, I have checked the documentation.

[mano7onamm]

UPD: If I add just a simple button:

           <div className="balance" onClick={() => tonConnectUI.sendTransaction(transaction42)}>
                <img src={fireImg} alt="Coin" className="coin-image"/>
                <span className="coin-count">{balance}</span>
            </div>

in Tonkeeper works well (no problems) but in telegram wallet "Failed to send transaction"