{"id":18417425,"url":"https://github.com/stellar/soroban-react-atomic-swap","last_synced_at":"2025-04-07T12:32:33.445Z","repository":{"id":177360758,"uuid":"660254498","full_name":"stellar/soroban-react-atomic-swap","owner":"stellar","description":"A react demo dapp for making an atomic swap on Soroban","archived":false,"fork":false,"pushed_at":"2024-03-28T19:57:57.000Z","size":1901,"stargazers_count":4,"open_issues_count":5,"forks_count":2,"subscribers_count":18,"default_branch":"main","last_synced_at":"2024-03-29T19:57:54.649Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/stellar.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2023-06-29T15:29:53.000Z","updated_at":"2024-05-30T00:32:50.223Z","dependencies_parsed_at":"2024-03-28T19:52:58.241Z","dependency_job_id":"2b712489-6a7d-4fbf-9958-25c18db9d53c","html_url":"https://github.com/stellar/soroban-react-atomic-swap","commit_stats":null,"previous_names":["stellar/soroban-react-atomic-swap"],"tags_count":2,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/stellar%2Fsoroban-react-atomic-swap","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/stellar%2Fsoroban-react-atomic-swap/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/stellar%2Fsoroban-react-atomic-swap/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/stellar%2Fsoroban-react-atomic-swap/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/stellar","download_url":"https://codeload.github.com/stellar/soroban-react-atomic-swap/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":247653248,"owners_count":20973789,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-11-06T04:09:24.616Z","updated_at":"2025-04-07T12:32:28.437Z","avatar_url":"https://github.com/stellar.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Soroban React Atomic Swap\n\nThe Atomic Swap DApp is a simplified demo of a dapp that performs an atomic\noperation to swap 2 potentially different amounts of 2 tokens between 2 separate\nparties, optionally signed and submitted by a third party.\n\n## Prerequisites\n\nThe Atomic Swap DApp relies on the following dependencies:\n\n- Node (\u003e=16.14.0 \u003c=18.0.0): https://nodejs.org/en/download/\n\n- Yarn (v1.22.5 or newer): https://classic.yarnpkg.com/en/docs/install\n\n- Freighter wallet(v5.0 or newer): https://www.freighter.app/\n\nYou need access to/funds from the following contracts:\n\nAtomic Swap: https://github.com/stellar/soroban-examples/tree/main/atomic_swap\nToken: https://github.com/stellar/soroban-examples/tree/main/token\n\nThis demo involves a minimum of 2 parties and 2 different tokens to swap between\nthe parties.\n\n## Features\n\nThe Atomic Swap DApp offers the following features:\n\n1. **Freighter Wallet Integration**: The Atomic Swap DApp seamlessly integrates\n   with Freighter/Albedo/XBull, allowing users to connect their wallet to access\n   Soroban token balances and utilize their signing capabilities for secure and\n   integrity-checked transactions.\n\n2. **Transaction Construction**: Leveraging the Soroban atomic swap contract\n   interface, the DApp constructs transactions that invoke the `swap` method of\n   the\n   [swap interface](https://github.com/stellar/soroban-examples/blob/main/atomic_swap/src/lib.rs#L16).\n   This method facilitates an atomic swap operation on the Soroban network.\n\n## Getting Started\n\nTo use the Atomic Swap DApp, follow these steps:\n\n1. Install and set up one of the supported wallets.\n\n- [Freighter wallet](https://www.freighter.app/)\n- [Albedo wallet](https://albedo.link/install-extension)\n- [XBull wallet](https://xbull.app/)\n\n2. Clone and navigate into the\n   [Atomic Swap DApp repository](https://github.com/stellar/soroban-react-atomic-swap/tree/main)\n   by running the following:\n\n   ```\n   git clone https://github.com/stellar/soroban-react-atomic-swap.git\n   cd soroban-react-atomic-swap\n   ```\n\n3. Install the dependencies by running the following:\n\n   ```\n   yarn\n   ```\n\n4. Deploy the Atomic Swap smart contracts.\n\nFor this step you will need to clone and deploy the\n[Atomic Swap smart contract](https://github.com/stellar/soroban-examples/blob/main/atomic_swap/src/lib.rs).\nThe Atomic Swap smart contract is a custom contract that will be used to\nfacilitate swaps in the Atomic Swap Dapp.\n\nIn a new terminal window, follow the steps below to build and deploy the smart\ncontracts:\n\n```bash\ngit clone https://github.com/stellar/soroban-examples.git\ncd soroban-examples/atomic_swap\nmake\n```\n\nThis will build the smart contracts and put them in the\n`atomic_swap/target/wasm32-unknown-unknown/release` directory.\n\nNext, you will need to deploy the smart contracts to Futurenet. To do this, open\na terminal in the `soroban-examples/atomic_swap` directory and follow the steps\nbelow:\n\n```bash\nsoroban contract deploy \\\n    --wasm target/wasm32-unknown-unknown/release/soroban_atomic_swap_contract.wasm \\\n    --source \u003cADMIN_ACCOUNT_SECRET_KEY\u003e \\\n    --rpc-url https://soroban-testnet.stellar.org \\\n    --network-passphrase 'Test SDF Network ; September 2015'\n```\n\nThis will return a contract id that we will need to use later on.\n\n```bash\n# Example output used for ATOMIC_SWAP_CONTRACT_ID\nCCWXGZ6PCOORP7UKO2GVYS5PFYR4BND4XDYTQMO2B32SKXVX4DUKUUZ6\n```\n\n## Token Setup\n\nThere are two options for setting up tokens for the Atomic Swap Dapp:\n\n#### 1. Use the Token Minter Dapp\n\nThe Token Minter Dapp provides an easy-to-use interface for minting tokens on\nSoroban. For step-by-step guidance on how to use the dapp, you can watch the\nvideo tutorial available in the release notes for the Token Minter Dapp,\n[here](https://github.com/stellar/soroban-react-mint-token/releases/tag/v1.0.0).\n\n#### 2. Use the Soroban CLI.\n\nYou can also use the Soroban CLI to deploy and mint tokens. To do this, follow\nthe steps below:\n\nFor this step you will need to clone and deploy the\n[Soroban token smart contracts](https://github.com/stellar/soroban-examples/blob/main/token/src/contract.rs).\nThe Soroban tokens are custom tokens that will be swapped in the Atomic Swap\nDapp.\n\nOpen a new terminal window in the `soroban-examples` directory and follow the\nsteps below to build and deploy the smart contracts:\n\n```bash\ncd token\nmake\n```\n\nThis will build the smart contracts and put them in the\n`token/target/wasm32-unknown-unknown/release` directory.\n\nNext, you will need to deploy the smart contracts to Futurenet. To do this,\nfollow the steps below:\n\n```bash\nsoroban contract deploy \\\n    --wasm target/wasm32-unknown-unknown/release/soroban_token_contract.wasm \\\n    --source \u003cADMIN_ACCOUNT_SECRET_KEY\u003e \\\n    --rpc-url https://soroban-testnet.stellar.org \\\n    --network-passphrase 'Test SDF Network ; September 2015'\n```\n\nThis will return a contract id that we will need to use later on.\n\n```bash\n# Example output used for TOKEN_A_CONTRACT_ID\nCCZZ763JDLSHEXUFUIHIKOVAAKYU2CUXSUH5MP4MH2HDZYGOYMM3RDD5\n```\n\n```bash\nsoroban contract invoke \\\n    --id \u003cTOKEN_A_CONTRACT_ID\u003e \\\n    --source-account \u003cADMIN_ACCOUNT_SECRET_KEY\u003e \\\n    --rpc-url https://soroban-testnet.stellar.org \\\n    --network-passphrase 'Test SDF Network ; September 2015' \\\n    -- initialize \\\n    --admin \u003cADMIN_PUBLIC_KEY\u003e \\\n    --decimal 7 \\\n    --name \"Demo Token A\" \\\n    --symbol \"DTA\"\n```\n\nNext we will need to mint some tokens to two user account. To do this, run the\nfollowing command:\n\n```bash\nsoroban contract invoke \\\n    --id \u003cTOKEN_A_CONTRACT_ID\u003e \\\n    --source-account \u003cADMIN_ACCOUNT_SECRET_KEY\u003e \\\n    --rpc-url https://soroban-testnet.stellar.org \\\n    --network-passphrase 'Test SDF Network ; September 2015' \\\n    -- mint \\\n    --to \u003cUSER_A_OR_B_PUBLIC_KEY\u003e \\\n    --amount 1000000000\n```\n\nRemember: You'll be deploying, initializing token contract twice, once for each\ntoken involved in the swap so make sure to store both Contract Ids. You will\nmint tokens to both users' accounts for each token contract.\n\nAfter deploying and minting the first token contract using the steps outlined\nabove, simply repeat the process for the second token.\n\n_See the example below for initializing and minting the second token contract_\n\n**_Initialize_**\n\n```bash\nsoroban contract invoke \\\n    --id \u003cTOKEN_B_CONTRACT_ID\u003e \\\n    --source-account \u003cADMIN_ACCOUNT_SECRET_KEY\u003e \\\n    --rpc-url https://soroban-testnet.stellar.org \\\n    --network-passphrase 'Test SDF Network ; September 2015' \\\n    -- initialize \\\n    --admin \u003cADMIN_PUBLIC_KEY\u003e \\\n    --decimal 7 \\\n    --name \"Demo Token B\" \\\n    --symbol \"DTB\"\n```\n\n**_Mint_**\n\n```bash\nsoroban contract invoke \\\n    --id \u003cTOKEN_B_CONTRACT_ID\u003e \\\n    --source-account \u003cADMIN_ACCOUNT_SECRET_KEY\u003e \\\n    --rpc-url https://soroban-testnet.stellar.org \\\n    --network-passphrase 'Test SDF Network ; September 2015' \\\n    -- mint \\\n    --to \u003cUSER_A_OR_B_PUBLIC_KEY\u003e \\\n    --amount 1000000000\n```\n\n## Run the Dapp\n\nOnce you have deployed the Atomic Swap and Token contracts, you can run the dapp\nlocally by following the steps below:\n\n1. [Enable and add Soroban Tokens](https://soroban.stellar.org/docs/reference/freighter#enable-soroban-tokens)\n   in Freighter.\n\n2. In the `soroban-react-atomic-swap` directory run the front end with\n   `yarn start` and navigate to http://localhost:9000/ in your browser.\n\n## Make a Swap\n\nNow that you have the Atomic Swap Dapp running locally, you can make a swap!\n\n1. Connect your wallet to the Atomic Swap Dapp by clicking the \"Connect Wallet\"\n   button. This will open a Freighter/Albedo/XBull window where you can select\n   your account to connect to the Dapp.\n\n\u003cimg src = \"public/img/1-connect-wallet-a.png\" width=\"40%\" height=\"40%\"/\u003e\n\nYou should see your account address in the top right corner of the screen.\n\n\u003cimg src = \"public/img/2-show-address.png\" width=\"85%\" height=\"85%\"/\u003e\n\n2. Enter the contract id for the Atomic Swap.\n\n\u003cimg src = \"public/img/3-swap-contract-id.png\" width=\"40%\" height=\"40%\"/\u003e\n\n3. Enter the contract id and amount for Token A you want to swap.\n\n\u003cimg src = \"public/img/4-token-a.png\" width=\"40%\" height=\"40%\"/\u003e\n\nIn this example we will swap 1 of Token A for 5 of Token B.\n\n4. Enter Swapper B's public key and the contract id and amount for Token B you\n   want to swap.\n\n\u003cimg src = \"public/img/5-token-b.png\" width=\"40%\" height=\"40%\"/\u003e\n\nIn this example we will swap 5 of Token B for 1 of Token A.\n\n5. Click the \"Build Swap\" button to initiate the swap.\n\n\u003cimg src = \"public/img/6-build-swap.png\" width=\"40%\" height=\"40%\"/\u003e\n\nThis will open a another window in your browser where you will be prompted to\nsign the transaction with user A's and user B's accounts.\n\n\u003cimg src = \"public/img/7-windows.png\" width=\"85%\" height=\"85%\"/\u003e\n\n6. Click the \"Connect Wallet\" button in the new window to connect user A's\n   account to the Dapp.\n\n7. Click the \"Sign with Wallet\" button to sign the transaction with user A's\n   account.\n\n\u003cimg src = \"public/img/8-sign-with-a.png\" width=\"40%\" height=\"40%\"/\u003e\n\n\u003e **Note:** When using the address of the account that initiated the swap, you\n\u003e may not see a window for signing the transaction. This is due to two options\n\u003e for satisfying contract authentication when required by the contract:\n\u003e\n\u003e 1. The user can sign the authentication entry, or\n\u003e 2. The user can use \"invoker auth\" by also being the user who signs the\n\u003e    transaction itself.\n\u003e\n\u003e If the address required for signing contract authentication is also the source\n\u003e account of the transaction in question, it implicitly allows the user to\n\u003e bypass signing the authentication entry. In this case, the signature from the\n\u003e transaction itself is used instead of the signature on the authentication\n\u003e entry.\n\n8. Switch to user B's account in Freighter/Albedo/XBull and click the \"Connect\n   Wallet\" button in the new window to connect user B's account to the Dapp.\n\n9. Click the \"Sign with Wallet\" button to sign the transaction with user B's\n   account. This will authorize the swap and display a success message.\n\n\u003cimg src = \"public/img/11-authorized.png\" width=\"40%\" height=\"40%\"/\u003e\n\n10. Switch back to previous tab and click the \"Sign with Wallet \u0026 Sumbit\" button\n    to submit the swap to the network.\n\n\u003cimg src = \"public/img/12-submit-tx.png\" width=\"40%\" height=\"40%\"/\u003e\n\n11. You should see a \"Transaction Result\" message and the swap should be\n    complete!\n\n\u003cimg src = \"public/img/13-tx-result.png\" width=\"40%\" height=\"40%\"/\u003e\n\nCongratulations! You have successfully completed an Atomic Swap using Soroban!\n🎉\n\nIf you have any questions or issues, please reach out to us on\n[discord](https://discord.com/channels/897514728459468821/1037073682599780494)\nor file an issue on github.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fstellar%2Fsoroban-react-atomic-swap","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fstellar%2Fsoroban-react-atomic-swap","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fstellar%2Fsoroban-react-atomic-swap/lists"}