# Ton SDK Integration Guide For Partners

This document provides step-by-step instructions for integrating Ton Connect SDK of Coin98 Telegram Wallet into your application.

***

### 1. Create the Manifest

Create a manifest.json - **Manifest URL** as described in

<https://docs.ton.org/v3/guidelines/ton-connect/guidelines/creating-manifest>

***

### 2. Install the Ton Connect SDK

* Install the Ton Connect UI React package from GitHub:

<https://github.com/ton-connect/sdk/tree/main/packages/ui-react>

* Attach to provider at the outermost part of app

```
<TonConnectUIProvider
   manifestUrl={MANIFEST_URL}
   uiPreferences={{ theme: THEME.DARK }}
   walletsListConfiguration={{
       includeWallets: [
         {
           appName: "coin98-telegram-wallet-bot",
           name: "Coin98 Telegram Bot",
           imageUrl: "https://coin98.s3.ap-southeast-1.amazonaws.com/SocialLogo/ninetyeight.png",
           aboutUrl: "https://docs.coin98.com",
           bridgeUrl: "https://ton-bridge.coin98.tech/bridge",
           platforms: ["ios", "android", "macos", "windows", "linux"],
           universalLink: "https://t.me/Coin98_bot?attach=wallet"
         }
       ]
   }}
>
<div id=”app”>
   //CODE APP HERE
   {children}
</div>

</TonConnectUIProvider>
```

***

### 3. Ton Connect Core Functions

Currently, we support three main functions:

#### 3.1. Connect with a Specific Wallet

Two distinct connection methods depend on whether you want to set Coin98 Wallet as the default.

#### 3.1.1. Set Coin98 Wallet as default

* Clicking "Connect Wallet" via TON SDK automatically opens the Coin98 app without any wallet selection, forcing exclusive use of Coin98 Telegram Wallet;
* If you agree, proceed with integration. To open a modal window for a specific wallet, use the openSingleWalletModal() method with the wallet's appName as a parameter (refer to wallets-list.json file)

```
import { useTonConnectUI } from '@tonconnect/ui-react';

const MyComponent = () => {
  const [tonConnectUI] = useTonConnectUI();

  const handleConnect = async () => {
    // Connect using the specific wallet "coin98-telegram-wallet-bot" 
    // Set Coin98 Telegram Wallet as default
    return tonConnectUI.openSingleWalletModal('coin98-telegram-wallet-bot');
  };

  return (
    <div>
      <button onClick={handleConnect}>Connect Wallet</button>
    </div>
  );
};

export default MyComponent;
```

#### 3.1.2. Do not set Coin98 Wallet as default

* Calling connect method opens TON's modal, allowing users to choose from multiple wallets; to use Coin98 Telegram, select the Coin98 Telegram Wallet option.
* To open a modal window for a specific wallet, use the openSingleWalletModal() method with the wallet's appName as a parameter (refer to wallets-list.json file)

```
import { useTonConnectUI } from '@tonconnect/ui-react';

const MyComponent = () => {
  const [tonConnectUI] = useTonConnectUI();

//Not set Coin98 Telegram Wallet as default
  const handleConnect = async () => {
    return tonConnectUI.openModal();
  };

  return (
    <div>
      <button onClick={handleConnect}>Connect Wallet</button>
    </div>
  );
};

export default MyComponent;
```

#### 3.2. Sending Transactions

To send TON coins (in nanotons) to a specific address, define your transaction details and call the sendTransaction() method.

```
import { useTonConnectUI } from '@tonconnect/ui-react';

const transaction = {
  validUntil: Date.now() + 5 * 60 * 1000, // Valid for 5 minutes
  messages: [
    {
      address: "0QD-SuoCHsCL2pIZfE8IAKsjc0aDpDUQAoo-ALHl2mje04A-", // Destination address (user-friendly format)
      amount: "20000000", // Amount in nanotons (20,000,000 nanotons)
    },
  ],
};

const SendTransactionComponent = () => {
  const [tonConnectUI] = useTonConnectUI();

  const handleSignSendTransaction = async () => {
    await tonConnectUI.sendTransaction(transaction);
  };

  return (
    <div>
      <button onClick={handleSignSendTransaction}>Send Transaction</button>
    </div>
  );
};

export default SendTransactionComponent;
```

#### 3.3. Wallet Disconnection

To disconnect the wallet, simply call the disconnect() method.

```
import { useTonConnectUI } from '@tonconnect/ui-react';

const DisconnectComponent = () => {
  const [tonConnectUI] = useTonConnectUI();

  const handleDisconnect = async () => {
    await tonConnectUI.disconnect();
  };

  return (
    <div>
      <button onClick={handleDisconnect}>Disconnect Wallet</button>
    </div>
  );
};

export default DisconnectComponent;
```

***

### Reference

For further questions or issues, please refer to <https://docs.ton.org/>


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.coin98.com/ton-sdk-integration-guide-for-partners.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.