diff --git a/package-lock.json b/package-lock.json index 3205882..8930998 100644 --- a/package-lock.json +++ b/package-lock.json @@ -114,6 +114,61 @@ } } }, + "node_modules/@ashswap/ash-sdk-js": { + "version": "2.0.11", + "resolved": "https://registry.npmjs.org/@ashswap/ash-sdk-js/-/ash-sdk-js-2.0.11.tgz", + "integrity": "sha512-yPz529n1ewZJCuC6i94zKUM1Oa82zgVcJYhEslHXQeabPq0l/C3I4b0huXjneBxOt40cV0GEMqohT+mab1NR/Q==", + "dependencies": { + "@multiversx/sdk-core": "12.19.2", + "@multiversx/sdk-network-providers": "2.4.3", + "lodash.chunk": "^4.2.0" + } + }, + "node_modules/@ashswap/ash-sdk-js/node_modules/@multiversx/sdk-core": { + "version": "12.19.2", + "resolved": "https://registry.npmjs.org/@multiversx/sdk-core/-/sdk-core-12.19.2.tgz", + "integrity": "sha512-WFV0kxx0i0dDUTiwZCsPy6GRWzkzY8ADMq98vy9GOH4CIcB5Ak/sgyBncM9trWdH52A4/Hv6O6yPR+RG4Mi+1A==", + "dependencies": { + "@multiversx/sdk-transaction-decoder": "1.0.2", + "bech32": "1.1.4", + "blake2b": "2.1.3", + "buffer": "6.0.3", + "json-duplicate-key-handle": "1.0.0", + "keccak": "3.0.2", + "protobufjs": "7.2.4" + }, + "peerDependencies": { + "bignumber.js": "^9.0.1" + } + }, + "node_modules/@ashswap/ash-sdk-js/node_modules/bech32": { + "version": "1.1.4", + "resolved": "https://registry.npmjs.org/bech32/-/bech32-1.1.4.tgz", + "integrity": "sha512-s0IrSOzLlbvX7yp4WBfPITzpAU8sqQcpsmwXDiKwrG4r491vwCO/XpejasRNl0piBMe/DvP4Tz0mIS/X1DPJBQ==" + }, + "node_modules/@ashswap/ash-sdk-js/node_modules/protobufjs": { + "version": "7.2.4", + "resolved": "https://registry.npmjs.org/protobufjs/-/protobufjs-7.2.4.tgz", + "integrity": "sha512-AT+RJgD2sH8phPmCf7OUZR8xGdcJRga4+1cOaXJ64hvcSkVhNcRHOwIxUatPH15+nj59WAGTDv3LSGZPEQbJaQ==", + "hasInstallScript": true, + "dependencies": { + "@protobufjs/aspromise": "^1.1.2", + "@protobufjs/base64": "^1.1.2", + "@protobufjs/codegen": "^2.0.4", + "@protobufjs/eventemitter": "^1.1.0", + "@protobufjs/fetch": "^1.1.0", + "@protobufjs/float": "^1.0.2", + "@protobufjs/inquire": "^1.1.0", + "@protobufjs/path": "^1.1.2", + "@protobufjs/pool": "^1.1.0", + "@protobufjs/utf8": "^1.1.0", + "@types/node": ">=13.7.0", + "long": "^5.0.0" + }, + "engines": { + "node": ">=12.0.0" + } + }, "node_modules/@babel/code-frame": { "version": "7.24.7", "resolved": "https://registry.npmjs.org/@babel/code-frame/-/code-frame-7.24.7.tgz", @@ -687,7 +742,6 @@ "version": "6.5.2", "resolved": "https://registry.npmjs.org/@fortawesome/fontawesome-common-types/-/fontawesome-common-types-6.5.2.tgz", "integrity": "sha512-gBxPg3aVO6J0kpfHNILc+NMhXnqHumFxOmjYCFfOiLZfwhnnfhtsdA2hfJlDnj+8PjAs6kKQPenOTKj3Rf7zHw==", - "dev": true, "hasInstallScript": true, "engines": { "node": ">=6" @@ -697,7 +751,6 @@ "version": "6.5.2", "resolved": "https://registry.npmjs.org/@fortawesome/fontawesome-svg-core/-/fontawesome-svg-core-6.5.2.tgz", "integrity": "sha512-5CdaCBGl8Rh9ohNdxeeTMxIj8oc3KNBgIeLMvJosBMdslK/UnEB8rzyDRrbKdL1kDweqBPo4GT9wvnakHWucZw==", - "dev": true, "hasInstallScript": true, "dependencies": { "@fortawesome/fontawesome-common-types": "6.5.2" @@ -710,7 +763,6 @@ "version": "6.5.2", "resolved": "https://registry.npmjs.org/@fortawesome/free-solid-svg-icons/-/free-solid-svg-icons-6.5.2.tgz", "integrity": "sha512-QWFZYXFE7O1Gr1dTIp+D6UcFUF0qElOnZptpi7PBUMylJh+vFmIedVe1Ir6RM1t2tEQLLSV1k7bR4o92M+uqlw==", - "dev": true, "hasInstallScript": true, "dependencies": { "@fortawesome/fontawesome-common-types": "6.5.2" @@ -723,7 +775,6 @@ "version": "0.2.2", "resolved": "https://registry.npmjs.org/@fortawesome/react-fontawesome/-/react-fontawesome-0.2.2.tgz", "integrity": "sha512-EnkrprPNqI6SXJl//m29hpaNzOp1bruISWaOiRtkMi/xSvHJlzc2j2JAYS7egxt/EbjSNV/k6Xy0AQI6vB2+1g==", - "dev": true, "dependencies": { "prop-types": "^15.8.1" }, @@ -1061,7 +1112,6 @@ "version": "0.18.1", "resolved": "https://registry.npmjs.org/@meilisearch/instant-meilisearch/-/instant-meilisearch-0.18.1.tgz", "integrity": "sha512-KxBoEaI1+CQQaSbSZZEllIUwsNofALH0RG+/bFMkNhavuzJn982zOTC7xYtYmXC6nsj32MmAe+rDBtazycDJQQ==", - "dev": true, "dependencies": { "meilisearch": "^0.40.0" } @@ -1430,7 +1480,6 @@ "version": "2.4.3", "resolved": "https://registry.npmjs.org/@multiversx/sdk-network-providers/-/sdk-network-providers-2.4.3.tgz", "integrity": "sha512-tJmJuxU+BjtC2q29PuzQOM4Qr6aiXujKwQXgIAPHTiuNbMc3Yi6Q4B0DC1PfI3iG+M4DONwfXknvM1uwqnY2zA==", - "dev": true, "dependencies": { "axios": "1.6.8", "bech32": "1.1.4", @@ -1443,7 +1492,6 @@ "version": "1.6.8", "resolved": "https://registry.npmjs.org/axios/-/axios-1.6.8.tgz", "integrity": "sha512-v/ZHtJDU39mDpyBoFVkETcd/uNdxrWRrg3bKpOKzXFA6Bvqopts6ALSMU3y6ijYxbw2B+wPrIv46egTzJXCLGQ==", - "dev": true, "dependencies": { "follow-redirects": "^1.15.6", "form-data": "^4.0.0", @@ -1453,14 +1501,12 @@ "node_modules/@multiversx/sdk-network-providers/node_modules/bech32": { "version": "1.1.4", "resolved": "https://registry.npmjs.org/bech32/-/bech32-1.1.4.tgz", - "integrity": "sha512-s0IrSOzLlbvX7yp4WBfPITzpAU8sqQcpsmwXDiKwrG4r491vwCO/XpejasRNl0piBMe/DvP4Tz0mIS/X1DPJBQ==", - "dev": true + "integrity": "sha512-s0IrSOzLlbvX7yp4WBfPITzpAU8sqQcpsmwXDiKwrG4r491vwCO/XpejasRNl0piBMe/DvP4Tz0mIS/X1DPJBQ==" }, "node_modules/@multiversx/sdk-network-providers/node_modules/bignumber.js": { "version": "9.0.1", "resolved": "https://registry.npmjs.org/bignumber.js/-/bignumber.js-9.0.1.tgz", "integrity": "sha512-IdZR9mh6ahOBv/hYGiXyVuyCetmGJhtYkqLBpTStdhEGjegpPlUawydyaF3pbIOFynJTpllEs+NP+CS9jKFLjA==", - "dev": true, "engines": { "node": "*" } @@ -2181,7 +2227,6 @@ "version": "1.27.0", "resolved": "https://registry.npmjs.org/@peerme/core-ts/-/core-ts-1.27.0.tgz", "integrity": "sha512-56ZQRYY//lP+JlUoIPWi+ir5d8zM4ufrc8M8PdmlFIkOMOoQEHgxz3hRR8pVysdYKD1ib+b4HNye5jnMWRnuCQ==", - "dev": true, "dependencies": { "@meilisearch/instant-meilisearch": "^0.18.1", "encoding": "^0.1.13", @@ -3501,7 +3546,6 @@ "version": "18.3.0", "resolved": "https://registry.npmjs.org/@types/react-dom/-/react-dom-18.3.0.tgz", "integrity": "sha512-EhwApuTmMBmXuFOikhQLIBUn6uFg81SwLMOAUgodJF14SOBOCMdU04gDoYi0WOJJHD144TL32z4yDqCW3dnkQg==", - "dev": true, "dependencies": { "@types/react": "*" } @@ -5179,7 +5223,6 @@ "version": "3.1.8", "resolved": "https://registry.npmjs.org/cross-fetch/-/cross-fetch-3.1.8.tgz", "integrity": "sha512-cvA+JwZoU0Xq+h6WkMvAUqPEYy92Obet6UdKLfW60qn99ftItKjB5T+BkyWOFWe2pUyfQ+IJHmpOTznqk1M6Kg==", - "dev": true, "dependencies": { "node-fetch": "^2.6.12" } @@ -5747,7 +5790,6 @@ "version": "0.1.13", "resolved": "https://registry.npmjs.org/encoding/-/encoding-0.1.13.tgz", "integrity": "sha512-ETBauow1T35Y/WZMkio9jiM0Z5xjHHmJ4XmjZOq1l/dXz3lr2sRn87nJy20RupqSh1F2m3HHPSp8ShIPQJrJ3A==", - "dev": true, "dependencies": { "iconv-lite": "^0.6.2" } @@ -7198,7 +7240,6 @@ "version": "0.6.3", "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.6.3.tgz", "integrity": "sha512-4fCk79wshMdzMp2rH06qWrJE4iolqLhCUH+OiuIgU++RB0+94NlDL81atO7GX55uUKueo0txHNtvEyI6D7WdMw==", - "dev": true, "dependencies": { "safer-buffer": ">= 2.1.2 < 3.0.0" }, @@ -8482,6 +8523,11 @@ "integrity": "sha512-TwuEnCnxbc3rAvhf/LbG7tJUDzhqXyFnv3dtzLOPgCG/hODL7WFnsbwktkD7yUV0RrreP/l1PALq/YSg6VvjlA==", "dev": true }, + "node_modules/lodash.chunk": { + "version": "4.2.0", + "resolved": "https://registry.npmjs.org/lodash.chunk/-/lodash.chunk-4.2.0.tgz", + "integrity": "sha512-ZzydJKfUHJwHa+hF5X66zLFCBrWn5GeF28OHEr4WVWtNDXlQ/IjWKPBiikqKo2ne0+v6JgCgJ0GzJp8k8bHC7w==" + }, "node_modules/lodash.debounce": { "version": "4.0.8", "resolved": "https://registry.npmjs.org/lodash.debounce/-/lodash.debounce-4.0.8.tgz", @@ -8621,7 +8667,6 @@ "version": "0.40.0", "resolved": "https://registry.npmjs.org/meilisearch/-/meilisearch-0.40.0.tgz", "integrity": "sha512-BoRhQMr2mBFLEeCfsvPluksGb01IaOiWvV3Deu3iEY+yYJ4jdGTu+IQi5FCjKlNQ7/TMWSN2XUToSgvH1tj0BQ==", - "dev": true, "dependencies": { "cross-fetch": "^3.1.6" } @@ -9591,7 +9636,6 @@ "version": "8.0.0", "resolved": "https://registry.npmjs.org/pluralize/-/pluralize-8.0.0.tgz", "integrity": "sha512-Nc3IT5yHzflTfbjgqWcCPpo7DaKy4FnpB0l/zCAW0Tc7jxAiuqSxHasntB3D7887LSrA93kDJ9IXovxJYxyLCA==", - "dev": true, "engines": { "node": ">=4" } @@ -11337,8 +11381,7 @@ "node_modules/safer-buffer": { "version": "2.1.2", "resolved": "https://registry.npmjs.org/safer-buffer/-/safer-buffer-2.1.2.tgz", - "integrity": "sha512-YZo3K82SD7Riyi0E1EQPojLz7kpepnSQI9IyPbHHg1XXXevb5dJI7tpyN2ADxGcQbHG7vcyRHk0cbwqcQriUtg==", - "dev": true + "integrity": "sha512-YZo3K82SD7Riyi0E1EQPojLz7kpepnSQI9IyPbHHg1XXXevb5dJI7tpyN2ADxGcQbHG7vcyRHk0cbwqcQriUtg==" }, "node_modules/scheduler": { "version": "0.23.2", @@ -13197,7 +13240,11 @@ } }, "src": { + "name": "@peerme/extensions", "version": "1.13.2", + "dependencies": { + "@ashswap/ash-sdk-js": "^2.0.11" + }, "devDependencies": { "@apollo/client": "^3.10.4", "@babel/core": "^7.24.7", diff --git a/src/extensions/ashswap/src/App.tsx b/src/extensions/ashswap/src/App.tsx index 712f4fe..c4af0fd 100644 --- a/src/extensions/ashswap/src/App.tsx +++ b/src/extensions/ashswap/src/App.tsx @@ -1,19 +1,25 @@ import React from 'react' +import { SwapTab } from './swap/SwapTab' import { useApp } from '../../../shared/hooks/useApp' -import { AppSection } from '../../../shared/ui/elements' +import { TabButton } from '../../../shared/ui/elements' +import { faSyncAlt } from '@fortawesome/free-solid-svg-icons' +import { TabGroup, TabList, TabPanel, TabPanels } from '@headlessui/react' export const App = () => { const app = useApp() - // The app hook provides access to the extension configuration - // and useful methods for interacting with DAOs. console.log(app) return ( -
- -

Example paragraph

- -
+ + + General + + + + + + + ) } diff --git a/src/extensions/ashswap/src/helpers.ts b/src/extensions/ashswap/src/helpers.ts new file mode 100644 index 0000000..e51171c --- /dev/null +++ b/src/extensions/ashswap/src/helpers.ts @@ -0,0 +1,7 @@ +import { Network } from '../../../shared/types' +import { ChainId } from '@ashswap/ash-sdk-js/out' + +export const getAshswapChainId = (network: Network): ChainId.Devnet | ChainId.Mainnet => { + if (network === 'devnet') return ChainId.Devnet + return ChainId.Mainnet +} diff --git a/src/extensions/ashswap/src/swap/SwapTab.tsx b/src/extensions/ashswap/src/swap/SwapTab.tsx new file mode 100644 index 0000000..f32767a --- /dev/null +++ b/src/extensions/ashswap/src/swap/SwapTab.tsx @@ -0,0 +1,99 @@ +import { AshswapToken } from '../types' +import { getAshswapChainId } from '../helpers' +import { Aggregator } from '@ashswap/ash-sdk-js/out' +import { useApp } from '../../../../shared/hooks/useApp' +import { AppSection } from '../../../../shared/ui/elements' +import { Address, TokenTransfer } from '@multiversx/sdk-core/out' +import { Button, EntityTransferSelector, Select } from '@peerme/web-ui' +import { Constants, ProposalAction, createAction } from '@peerme/core-ts' +import React, { SyntheticEvent, useEffect, useMemo, useState } from 'react' + +const DefaultSlippage = 100 // 1% = 1_000 + +export function SwapTab() { + const app = useApp() + const aggregator = useMemo( + () => new Aggregator({ chainId: getAshswapChainId(app.config.network) }), + [app.config.network] + ) + const [payment, setPayment] = useState(null) + const [availableTokens, setAvailableTokens] = useState([]) + const availableTokensSorted = useMemo( + () => availableTokens.sort((a, b) => a.id.localeCompare(b.id)), + [availableTokens] + ) + const [seletedToken, setSelectedToken] = useState(Constants.EgldTokenIdentifier) + const [computedAction, setComputedAction] = useState(null) + + useEffect(() => { + aggregator.getTokens().then((tokens) => setAvailableTokens(tokens)) + }, []) + + useEffect(() => { + if (!payment) return + computeSwap() + }, [payment?.tokenIdentifier, payment?.amountAsBigInteger.toString()]) + + const computeSwap = async () => { + if (!payment || !seletedToken) return + const { getInteraction, sorResponse } = await aggregator.aggregate( + payment.tokenIdentifier, + seletedToken, + payment.amountAsBigInteger.toNumber(), + DefaultSlippage + ) + const tx = await getInteraction(async (warning) => { + console.log('aggregator swap warning', warning) + return true + }).catch(() => null) + console.log('aggregator response', sorResponse, tx) + if (!tx) return + tx.withSender(new Address(app.config.entity.address)).buildTransaction() + const contract = tx.getContractAddress().bech32() + if (!contract) return + const tokenTransfers = payment.isEgld() ? [] : [payment] + setComputedAction( + createAction(contract, tx.getFunction().toString(), tx.getValue().toString(), tx.getArguments() as any, tokenTransfers) + ) + } + + const handleSubmit = (e: SyntheticEvent) => { + e.preventDefault() + if (!seletedToken) { + app.showToast('Please select a target token', 'error') + return + } + if (seletedToken === payment?.tokenIdentifier) { + app.showToast('Source and target token must be different', 'error') + return + } + if (!computedAction) return + app.requestDirectProposalAction(computedAction) + } + + return ( + +
+ + + + +
+ ) +} diff --git a/src/extensions/ashswap/src/types.ts b/src/extensions/ashswap/src/types.ts new file mode 100644 index 0000000..3c77247 --- /dev/null +++ b/src/extensions/ashswap/src/types.ts @@ -0,0 +1,5 @@ +export type AshswapToken = { + id: string + decimal?: number + coingeckoId?: string +} diff --git a/src/package.json b/src/package.json index d480058..28ca625 100644 --- a/src/package.json +++ b/src/package.json @@ -35,7 +35,6 @@ "preversion": "npm run lint && npm run build" }, "peerDependencies": { - "dayjs": "^1.11.10", "@apollo/client": ">=3.7.7", "@elrondnetwork/transaction-decoder": ">=1.0.0", "@fortawesome/fontawesome-svg-core": ">=6.1.1", @@ -49,6 +48,7 @@ "axios": "^1.3.4", "clsx": "^2.0.0", "collect.js": "^4.36.1", + "dayjs": "^1.11.10", "next": ">=13.0.0", "pluralize": "^8.0.0", "react": ">=18.2.0", @@ -87,5 +87,8 @@ "rollup-plugin-terser": "^7.0.2", "rollup-plugin-typescript2": "^0.36.0", "typescript": "^5.4.5" + }, + "dependencies": { + "@ashswap/ash-sdk-js": "^2.0.11" } }