├── .changeset ├── README.md └── config.json ├── .eslintrc.json ├── .github ├── ISSUE_TEMPLATE │ ├── bug_report.md │ └── feature_request.md └── workflows │ ├── CI-gnosis.yml │ ├── CI.yml │ ├── PR.yml │ ├── deploy.yml │ └── release.yml ├── .gitignore ├── .node-version ├── .prettierrc.json ├── CODE_OF_CONDUCT.md ├── CONTRIBUTION.md ├── LICENSE ├── README.md ├── docs └── internal │ ├── architecture.drawio.svg │ └── styleguide.md ├── package.json ├── packages ├── coingecko │ ├── .eslintrc.js │ ├── .mocharc.json │ ├── CHANGELOG.md │ ├── README.md │ ├── package.json │ ├── prettier.config.js │ ├── src │ │ ├── api │ │ │ ├── simplePrice.test.ts │ │ │ ├── simplePrice.ts │ │ │ ├── simpleTokenPrice.test.ts │ │ │ └── simpleTokenPrice.ts │ │ ├── hooks │ │ │ ├── useCoingeckoPrice.tsx │ │ │ ├── useCoingeckoPrices.tsx │ │ │ └── useCoingeckoTokenPrices.test.tsx │ │ ├── index.ts │ │ └── test-setup.ts │ └── tsconfig.json ├── connectors │ ├── portis │ │ ├── CHANGELOG.md │ │ ├── README.md │ │ ├── package.json │ │ ├── src │ │ │ └── index.ts │ │ └── tsconfig.json │ ├── wallet-connect-v2 │ │ ├── .eslintrc.js │ │ ├── CHANGELOG.md │ │ ├── README.md │ │ ├── package.json │ │ ├── src │ │ │ └── index.ts │ │ └── tsconfig.json │ └── wallet-connect │ │ ├── CHANGELOG.md │ │ ├── README.md │ │ ├── package.json │ │ ├── src │ │ └── index.ts │ │ └── tsconfig.json ├── core │ ├── .eslintrc.js │ ├── .gitignore │ ├── .mocharc.json │ ├── .npmignore │ ├── .prettierignore │ ├── CHANGELOG.md │ ├── README.md │ ├── bin │ │ └── usedapp-generate-hooks.js │ ├── generate-hooks │ │ ├── generate-hooks.ts │ │ ├── generate.ts │ │ └── imports.ts │ ├── package.json │ ├── prettier.config.js │ ├── src │ │ ├── abi │ │ │ ├── benchmark.ts │ │ │ ├── common.ts │ │ │ ├── multicall │ │ │ │ ├── constants.ts │ │ │ │ ├── decoder.test.ts │ │ │ │ ├── decoder.ts │ │ │ │ ├── encoder.test.ts │ │ │ │ ├── encoder.ts │ │ │ │ └── index.ts │ │ │ └── multicall2 │ │ │ │ ├── constants.ts │ │ │ │ ├── decoder.test.ts │ │ │ │ ├── decoder.ts │ │ │ │ ├── encoder.test.ts │ │ │ │ ├── encoder.ts │ │ │ │ └── index.ts │ │ ├── constants │ │ │ ├── abi │ │ │ │ ├── BlockNumber.json │ │ │ │ ├── ERC20.json │ │ │ │ ├── ERC20Mock.json │ │ │ │ ├── MultiCall.json │ │ │ │ ├── MultiCall2.json │ │ │ │ ├── doubler.ts │ │ │ │ ├── errors.ts │ │ │ │ ├── index.ts │ │ │ │ ├── reverter.ts │ │ │ │ └── timestamp.ts │ │ │ ├── chainId.ts │ │ │ ├── currencies.ts │ │ │ ├── index.ts │ │ │ └── type │ │ │ │ ├── Chain.ts │ │ │ │ ├── Config.ts │ │ │ │ └── QueryParams.ts │ │ ├── helpers │ │ │ ├── LocalStorage.ts │ │ │ ├── address.test.ts │ │ │ ├── address.ts │ │ │ ├── calls.test.ts │ │ │ ├── calls.ts │ │ │ ├── chain.test.ts │ │ │ ├── chain.ts │ │ │ ├── chainExplorerLink.test.ts │ │ │ ├── chainExplorerLink.ts │ │ │ ├── common.test.ts │ │ │ ├── common.ts │ │ │ ├── contract.ts │ │ │ ├── eip1193.ts │ │ │ ├── event.test.ts │ │ │ ├── event.ts │ │ │ ├── fromEntries.test.ts │ │ │ ├── fromEntries.ts │ │ │ ├── getAddNetworkParams.ts │ │ │ ├── getChainMeta.ts │ │ │ ├── getSignerFromOptions.test.ts │ │ │ ├── getSignerFromOptions.ts │ │ │ ├── getUniqueAvtive.test.ts │ │ │ ├── gnosisSafeUtils.ts │ │ │ ├── index.ts │ │ │ ├── injectedProvider.ts │ │ │ ├── isWebSocketProvider.ts │ │ │ ├── logs.test.ts │ │ │ ├── logs.ts │ │ │ ├── transaction.test.ts │ │ │ ├── transaction.ts │ │ │ └── validateArgument.ts │ │ ├── hooks │ │ │ ├── estimateGasLimit.test.ts │ │ │ ├── index.ts │ │ │ ├── refreshing.test.ts │ │ │ ├── threeChains.test.tsx │ │ │ ├── useBlockMeta.test.tsx │ │ │ ├── useBlockMeta.ts │ │ │ ├── useBlockNumber.test.tsx │ │ │ ├── useBlockNumber.ts │ │ │ ├── useBlockNumbers.ts │ │ │ ├── useCall.test.tsx │ │ │ ├── useCall.ts │ │ │ ├── useCallResilency.test.tsx │ │ │ ├── useChainCall.test.tsx │ │ │ ├── useChainCalls.ts │ │ │ ├── useChainId.ts │ │ │ ├── useChainMeta.test.tsx │ │ │ ├── useChainMeta.ts │ │ │ ├── useChainState.ts │ │ │ ├── useConfig.test.tsx │ │ │ ├── useConfig.ts │ │ │ ├── useContractCall.test.tsx │ │ │ ├── useContractCall.ts │ │ │ ├── useContractFunction.test.tsx │ │ │ ├── useContractFunction.ts │ │ │ ├── useDebounce.ts │ │ │ ├── useDebouncePair.ts │ │ │ ├── useEtherBalance.test.tsx │ │ │ ├── useEtherBalance.ts │ │ │ ├── useEthers.test.tsx │ │ │ ├── useEthers.ts │ │ │ ├── useGasPrice.test.tsx │ │ │ ├── useGasPrice.ts │ │ │ ├── useGnosisSafeContract.ts │ │ │ ├── useInterval.tsx │ │ │ ├── useIsMounted.ts │ │ │ ├── useLocalStorage.test.ts │ │ │ ├── useLocalStorage.ts │ │ │ ├── useLogs.test.tsx │ │ │ ├── useLogs.ts │ │ │ ├── useLookupAddress.ts │ │ │ ├── useMulticallAddress.ts │ │ │ ├── useNotifications.ts │ │ │ ├── usePromiseTransaction.ts │ │ │ ├── useRawCall.test.ts │ │ │ ├── useRawCalls.ts │ │ │ ├── useRawLogs.test.ts │ │ │ ├── useRawLogs.ts │ │ │ ├── useReadonlyProvider.tsx │ │ │ ├── useResolveName.ts │ │ │ ├── useResolvedPromise.test.ts │ │ │ ├── useResolvedPromise.ts │ │ │ ├── useSendTransaction.test.ts │ │ │ ├── useSendTransaction.ts │ │ │ ├── useSigner.test.ts │ │ │ ├── useSigner.ts │ │ │ ├── useToken.test.tsx │ │ │ ├── useToken.ts │ │ │ ├── useTokenAllowance.test.tsx │ │ │ ├── useTokenAllowance.ts │ │ │ ├── useTokenBalance.test.tsx │ │ │ ├── useTokenBalance.ts │ │ │ ├── useTokenList.test.tsx │ │ │ ├── useTokenList.ts │ │ │ └── useTransactions.ts │ │ ├── index.ts │ │ ├── internal.ts │ │ ├── model │ │ │ ├── Currency.test.ts │ │ │ ├── Currency.ts │ │ │ ├── CurrencyValue.test.ts │ │ │ ├── CurrencyValue.ts │ │ │ ├── TokenInfo.ts │ │ │ ├── TransactionOptions.ts │ │ │ ├── TransactionStatus.ts │ │ │ ├── chain │ │ │ │ ├── arbitrum.ts │ │ │ │ ├── arbitrumReddit.ts │ │ │ │ ├── astar.ts │ │ │ │ ├── aurora.ts │ │ │ │ ├── avalanche.ts │ │ │ │ ├── base.ts │ │ │ │ ├── boba.ts │ │ │ │ ├── bsc.ts │ │ │ │ ├── canto.ts │ │ │ │ ├── celo.ts │ │ │ │ ├── cronos.ts │ │ │ │ ├── ethereum.ts │ │ │ │ ├── fantom.ts │ │ │ │ ├── flare.ts │ │ │ │ ├── harmony.ts │ │ │ │ ├── index.ts │ │ │ │ ├── klaytn.ts │ │ │ │ ├── kroma.ts │ │ │ │ ├── linea.ts │ │ │ │ ├── local.ts │ │ │ │ ├── mantle.ts │ │ │ │ ├── metis.ts │ │ │ │ ├── moonbeam.ts │ │ │ │ ├── moonriver.ts │ │ │ │ ├── oasis.ts │ │ │ │ ├── optimism.ts │ │ │ │ ├── palm.ts │ │ │ │ ├── polygon.ts │ │ │ │ ├── rootstock.ts │ │ │ │ ├── scroll.ts │ │ │ │ ├── songbird.ts │ │ │ │ ├── test-defaults.ts │ │ │ │ ├── theta.ts │ │ │ │ ├── thundercore.ts │ │ │ │ ├── velas.ts │ │ │ │ ├── xdai.ts │ │ │ │ └── zksync.ts │ │ │ ├── config │ │ │ │ └── default.ts │ │ │ ├── formatting.test.ts │ │ │ ├── formatting.ts │ │ │ ├── index.ts │ │ │ └── types.ts │ │ ├── providers │ │ │ ├── DAppProvider.tsx │ │ │ ├── LocalMulticallProvider.tsx │ │ │ ├── blockNumber │ │ │ │ ├── blockNumbers │ │ │ │ │ ├── context.ts │ │ │ │ │ ├── index.ts │ │ │ │ │ └── provider.tsx │ │ │ │ ├── common │ │ │ │ │ ├── index.ts │ │ │ │ │ ├── reducer.ts │ │ │ │ │ └── subscribeToNewBlock.ts │ │ │ │ └── index.ts │ │ │ ├── chainState │ │ │ │ ├── common │ │ │ │ │ ├── callsReducer.ts │ │ │ │ │ ├── chainStateReducer.test.ts │ │ │ │ │ ├── chainStateReducer.ts │ │ │ │ │ ├── index.ts │ │ │ │ │ ├── model.ts │ │ │ │ │ ├── multicall.test.ts │ │ │ │ │ ├── multicall.ts │ │ │ │ │ ├── multicall2.test.ts │ │ │ │ │ ├── multicall2.ts │ │ │ │ │ ├── performMulticall.ts │ │ │ │ │ └── useDevtoolsReporting.ts │ │ │ │ ├── index.ts │ │ │ │ └── multiChainStates │ │ │ │ │ ├── context.ts │ │ │ │ │ ├── index.ts │ │ │ │ │ └── provider.tsx │ │ │ ├── config │ │ │ │ ├── context.ts │ │ │ │ ├── index.ts │ │ │ │ ├── provider.tsx │ │ │ │ └── reducer.ts │ │ │ ├── devtools.ts │ │ │ ├── index.ts │ │ │ ├── network │ │ │ │ ├── connectors │ │ │ │ │ ├── connector.ts │ │ │ │ │ ├── connectorController.ts │ │ │ │ │ ├── context.tsx │ │ │ │ │ ├── implementations │ │ │ │ │ │ ├── coinbase.ts │ │ │ │ │ │ ├── index.ts │ │ │ │ │ │ ├── injected.ts │ │ │ │ │ │ └── metamask.ts │ │ │ │ │ └── index.ts │ │ │ │ ├── index.ts │ │ │ │ └── readonlyNetworks │ │ │ │ │ ├── context.ts │ │ │ │ │ ├── index.ts │ │ │ │ │ ├── model.ts │ │ │ │ │ ├── provider.tsx │ │ │ │ │ ├── readonlyNetworksProvider.test.ts │ │ │ │ │ └── reducer.ts │ │ │ ├── notifications │ │ │ │ ├── context.ts │ │ │ │ ├── model.ts │ │ │ │ ├── notificationsReducer.test.ts │ │ │ │ ├── provider.tsx │ │ │ │ └── reducer.ts │ │ │ ├── transactions │ │ │ │ ├── context.ts │ │ │ │ ├── model.ts │ │ │ │ ├── provider.tsx │ │ │ │ ├── reducer.ts │ │ │ │ └── transactionsReducer.test.ts │ │ │ └── window │ │ │ │ ├── context.ts │ │ │ │ ├── index.ts │ │ │ │ └── provider.tsx │ │ └── testing │ │ │ ├── bignumber.ts │ │ │ ├── connectContractToSigner.test.ts │ │ │ ├── index.ts │ │ │ ├── renderDAppHook.tsx │ │ │ ├── renderWeb3Hook.tsx │ │ │ ├── test-setup.ts │ │ │ ├── useAdder.test.tsx │ │ │ ├── useAdder.tsx │ │ │ └── utils │ │ │ ├── IdentityWrapper.tsx │ │ │ ├── createMockProvider.ts │ │ │ ├── deployContract.ts │ │ │ ├── deployMockToken.ts │ │ │ ├── deployMulticall.ts │ │ │ ├── getResultProperty.ts │ │ │ ├── index.ts │ │ │ ├── mineBlock.ts │ │ │ ├── sendEmptyTx.ts │ │ │ ├── setupTestingConfig.ts │ │ │ ├── waitUntil.ts │ │ │ └── waitUtils.ts │ ├── tsconfig.json │ └── tsconfig.test.json ├── docs │ ├── .eslintrc.js │ ├── .gitignore │ ├── .mocharc.json │ ├── CHANGELOG.md │ ├── README.md │ ├── babel.config.js │ ├── docs │ │ ├── 01-Getting Started │ │ │ ├── 01-Installation.mdx │ │ │ ├── 02-Reading.mdx │ │ │ ├── 03-Writing.mdx │ │ │ └── 04-Create Eth App.mdx │ │ ├── 02-Guides │ │ │ ├── 01-Connecting │ │ │ │ ├── 01-Read-only.mdx │ │ │ │ ├── 02-Browser Wallet.mdx │ │ │ │ ├── 03-Local Chain.mdx │ │ │ │ ├── 04-Custom Chains.mdx │ │ │ │ ├── 05-Wallet Connect.mdx │ │ │ │ ├── 06-Multi Chain.mdx │ │ │ │ ├── 07-Handling Errors.mdx │ │ │ │ ├── 08-Wallet Connectors.mdx │ │ │ │ └── 09-Mainnet forking.mdx │ │ │ ├── 02-Reading │ │ │ │ ├── 01-Custom Hooks.mdx │ │ │ │ ├── 02-Typechain.mdx │ │ │ │ ├── 03-Handling Falsy.mdx │ │ │ │ ├── 04-Refresh Per Blocks.mdx │ │ │ │ ├── 05-Multicall.md │ │ │ │ └── assets │ │ │ │ │ └── multicall.png │ │ │ ├── 03-Transactions │ │ │ │ ├── 01-Ether Transactions.mdx │ │ │ │ ├── 02-Contract Functions.mdx │ │ │ │ ├── 03-Transaction Status.mdx │ │ │ │ ├── 04-Replaced Transactions.mdx │ │ │ │ ├── 05-History.mdx │ │ │ │ ├── 06-Notifications.mdx │ │ │ │ ├── 07-Switching Networks.mdx │ │ │ │ └── 08-Sending Without Wallet.mdx │ │ │ ├── 04-Testing.mdx │ │ │ ├── 05-Developer Tools.mdx │ │ │ ├── 06-Troubleshooting.mdx │ │ │ ├── 07-Migration │ │ │ │ ├── 01-to-0.12.mdx │ │ │ │ ├── 02-to-1.0.0.mdx │ │ │ │ ├── 1.0.3-to-1.0.4.mdx │ │ │ │ └── 1.0.7-to-1.0.8.mdx │ │ │ └── 08-Sign in with Ethereum.mdx │ │ ├── 03-API Reference │ │ │ ├── 01-Providers.mdx │ │ │ ├── 04-Constants.mdx │ │ │ ├── 05-Helpers.mdx │ │ │ └── 06-Coingecko.mdx │ │ ├── 04-Tutorial │ │ │ ├── 01-Introduction.md │ │ │ ├── 02-DApp.md │ │ │ ├── 03-DApp Requirements.md │ │ │ ├── 04-How useDApp helps you.md │ │ │ ├── 05-Setup.md │ │ │ ├── 06-Config.md │ │ │ ├── 07-Exercise1.md │ │ │ ├── 08-Exercise2.md │ │ │ ├── 10-Summary.md │ │ │ ├── 9-Exercise3.md │ │ │ └── assets │ │ │ │ ├── infura-pricing.png │ │ │ │ └── starting-page.png │ │ └── images │ │ │ ├── developer-tools-abis.png │ │ │ ├── developer-tools-events.gif │ │ │ ├── developer-tools-names.png │ │ │ ├── developer-tools-overview.png │ │ │ ├── metamask-switch-network.png │ │ │ └── replacedTransaction.png │ ├── docusaurus.config.js │ ├── example-loader.js │ ├── generate │ │ ├── README.md │ │ ├── generate-content.ts │ │ ├── generate.sh │ │ ├── helpers.ts │ │ ├── interface.ts │ │ └── replace-links.ts │ ├── package.json │ ├── playwright │ │ ├── constants.ts │ │ ├── gnosisSafeUtils.ts │ │ ├── sleep.ts │ │ ├── test-setup.ts │ │ └── with-metamask.test.ts │ ├── plugins │ │ ├── mdx-anchor-scroll.js │ │ └── webpack-plugin.js │ ├── prettier.config.js │ ├── sidebars.js │ ├── src │ │ ├── css │ │ │ └── custom.css │ │ ├── examples │ │ │ ├── CodeWrapper.tsx │ │ │ ├── ConnectingToNetwork.tsx │ │ │ ├── Connectors.tsx │ │ │ ├── ContractFunction.tsx │ │ │ ├── EthBalance.tsx │ │ │ ├── EthPrice.tsx │ │ │ ├── ExampleContainer.tsx │ │ │ ├── GettingStarted.tsx │ │ │ ├── Multichain.tsx │ │ │ ├── Notifications.tsx │ │ │ ├── ReadingWithoutWallet.tsx │ │ │ ├── SendTransaction.tsx │ │ │ ├── Siwe.tsx │ │ │ ├── SwitchingNetworks.tsx │ │ │ ├── TokenBalance.tsx │ │ │ ├── TransactionHistory.tsx │ │ │ ├── WalletConnectExample.tsx │ │ │ ├── WethPrice.tsx │ │ │ ├── components │ │ │ │ ├── AccountIcon.tsx │ │ │ │ └── MetamaskConnect.tsx │ │ │ ├── constants │ │ │ │ └── Weth.ts │ │ │ └── styles │ │ │ │ ├── button.module.css │ │ │ │ ├── styles.module.css │ │ │ │ └── text.module.css │ │ ├── pages │ │ │ ├── index.module.css │ │ │ └── index.tsx │ │ └── types.d.ts │ ├── static │ │ ├── .nojekyll │ │ ├── img │ │ │ ├── copy-address.gif │ │ │ └── favicon.ico │ │ └── mdx-anchor-scroll.js │ ├── tsconfig.json │ └── tsconfig.node.json ├── example-next │ ├── .eslintrc.json │ ├── .mocharc.json │ ├── README.md │ ├── components │ │ ├── NavBar.tsx │ │ └── StyledLink.tsx │ ├── next-env.d.ts │ ├── next.config.js │ ├── package.json │ ├── pages │ │ ├── _app.tsx │ │ ├── _middleware.ts │ │ ├── assets.d.ts │ │ ├── balance │ │ │ └── index.tsx │ │ ├── block │ │ │ └── index.tsx │ │ ├── connectors │ │ │ └── index.tsx │ │ ├── ens │ │ │ └── index.tsx │ │ ├── multichain │ │ │ └── index.tsx │ │ ├── prices │ │ │ └── index.tsx │ │ ├── send │ │ │ └── index.tsx │ │ ├── tokens │ │ │ └── index.tsx │ │ ├── transactions │ │ │ └── index.tsx │ │ ├── web3modal │ │ │ └── index.tsx │ │ └── web3react │ │ │ └── index.tsx │ ├── playwright.setup.js │ ├── playwright │ │ ├── constants.ts │ │ └── imported.test.ts │ ├── providers │ │ ├── Layout.tsx │ │ ├── Providers.tsx │ │ └── index.tsx │ ├── public │ │ └── favicon.ico │ ├── styles │ │ └── globals.css │ ├── test-setup.ts │ └── tsconfig.json ├── example │ ├── .eslintrc.js │ ├── .gitignore │ ├── .mocharc.json │ ├── CHANGELOG.md │ ├── README.md │ ├── package.json │ ├── playwright.setup.js │ ├── playwright │ │ ├── constants.ts │ │ ├── with-metamask.test.ts │ │ ├── with-metamask.ts │ │ ├── without-metamask.test.ts │ │ └── without-metamask.ts │ ├── prettier.config.js │ ├── src │ │ ├── App.tsx │ │ ├── _redirects │ │ ├── abi │ │ │ ├── ERC20.json │ │ │ └── Weth10.json │ │ ├── assets │ │ │ ├── assets.d.ts │ │ │ ├── fonts │ │ │ │ ├── HelveticaNeue.woff2 │ │ │ │ ├── HelveticaNeueBold.woff2 │ │ │ │ └── HelveticaNeueMedium.woff2 │ │ │ └── images │ │ │ │ ├── favicon.ico │ │ │ │ └── unknown-token.png │ │ ├── components │ │ │ ├── ChainState │ │ │ │ └── index.tsx │ │ │ ├── ENS │ │ │ │ └── ENSExample.tsx │ │ │ ├── NavBar.tsx │ │ │ ├── SendEthForm │ │ │ │ └── SendEthForm.tsx │ │ │ ├── TokenList │ │ │ │ ├── TokenIcon.tsx │ │ │ │ └── TokenList.tsx │ │ │ ├── Transactions │ │ │ │ ├── Forms.tsx │ │ │ │ ├── History.tsx │ │ │ │ ├── Icons │ │ │ │ │ ├── CheckIcon.tsx │ │ │ │ │ ├── ClockIcon.tsx │ │ │ │ │ ├── ExclamationIcon.tsx │ │ │ │ │ ├── ShareIcon.tsx │ │ │ │ │ ├── SpinnerIcon.tsx │ │ │ │ │ ├── UnwrapIcon.tsx │ │ │ │ │ ├── WalletIcon.tsx │ │ │ │ │ ├── WrapIcon.tsx │ │ │ │ │ └── index.ts │ │ │ │ └── TransactionForm.tsx │ │ │ ├── account │ │ │ │ ├── AccountButton.tsx │ │ │ │ ├── AccountModal.tsx │ │ │ │ ├── Web3ModalButton.tsx │ │ │ │ └── Web3ReactConnectorButton.tsx │ │ │ ├── base │ │ │ │ ├── Button.tsx │ │ │ │ ├── Link.tsx │ │ │ │ ├── MenuIcon.tsx │ │ │ │ └── base.tsx │ │ │ └── connectors │ │ │ │ └── SingleConnector.tsx │ │ ├── entrypoint.tsx │ │ ├── global │ │ │ ├── GlobalStyle.tsx │ │ │ └── styles.ts │ │ ├── index.html │ │ ├── index.tsx │ │ ├── pages │ │ │ ├── Balance.tsx │ │ │ ├── Block.tsx │ │ │ ├── ConnectorsPage.tsx │ │ │ ├── Multichain.tsx │ │ │ ├── Prices.tsx │ │ │ ├── SendEtherPage.tsx │ │ │ ├── Tokens.tsx │ │ │ ├── Transactions.tsx │ │ │ ├── Web3Modal.tsx │ │ │ ├── Web3ReactConnector.tsx │ │ │ └── index.tsx │ │ ├── typography │ │ │ ├── Label.tsx │ │ │ ├── Text.tsx │ │ │ └── Title.tsx │ │ └── utils │ │ │ ├── index.ts │ │ │ └── toHttpPath.ts │ ├── test │ │ ├── ERC20.test.tsx │ │ └── test-setup.ts │ ├── tsconfig.json │ └── webpack.config.js ├── extension │ ├── .eslintrc.js │ ├── .gitignore │ ├── .mocharc.json │ ├── .prettierignore │ ├── .storybook │ │ ├── main.js │ │ ├── preview-head.html │ │ └── preview.js │ ├── CHANGELOG.md │ ├── README.md │ ├── package.json │ ├── prettier.config.js │ ├── screenshots │ │ ├── abis.png │ │ ├── events.png │ │ └── nameTags.png │ ├── src │ │ ├── connect.ts │ │ ├── design.ts │ │ ├── hooks │ │ │ ├── index.ts │ │ │ ├── useAbi.ts │ │ │ ├── useEvents.ts │ │ │ ├── useNameTag.ts │ │ │ └── useStorage.ts │ │ ├── index.tsx │ │ ├── providers │ │ │ ├── GlobalStyle.ts │ │ │ ├── Providers.tsx │ │ │ ├── abi │ │ │ │ ├── AbiEntry.ts │ │ │ │ ├── AbiParser.test.ts │ │ │ │ ├── AbiParser.ts │ │ │ │ ├── AbiProvider.tsx │ │ │ │ ├── ParsedValue.ts │ │ │ │ └── defaultAbis.ts │ │ │ ├── events │ │ │ │ ├── EventProvider.tsx │ │ │ │ ├── Message.ts │ │ │ │ ├── State.ts │ │ │ │ └── reducer │ │ │ │ │ ├── accountChanged.ts │ │ │ │ │ ├── blockNumberChanged.ts │ │ │ │ │ ├── callsChanged.ts │ │ │ │ │ ├── chainIdToNetwork.ts │ │ │ │ │ ├── genericError.ts │ │ │ │ │ ├── index.ts │ │ │ │ │ ├── init.ts │ │ │ │ │ ├── multicallError.ts │ │ │ │ │ ├── multicallSuccess.ts │ │ │ │ │ ├── networkChanged.ts │ │ │ │ │ ├── reducer.test.ts │ │ │ │ │ ├── reducer.ts │ │ │ │ │ └── time.ts │ │ │ └── nameTags │ │ │ │ └── NameTagsProvider.tsx │ │ ├── stories │ │ │ ├── args.ts │ │ │ ├── components │ │ │ │ ├── CallDisplay.stories.tsx │ │ │ │ ├── EventItem.stories.tsx │ │ │ │ └── EventPreview │ │ │ │ │ ├── AccountConnected.stories.tsx │ │ │ │ │ ├── AccountDisconnected.stories.tsx │ │ │ │ │ ├── BlockFound.stories.tsx │ │ │ │ │ ├── CallsUpdated.stories.tsx │ │ │ │ │ ├── Error.stories.tsx │ │ │ │ │ ├── FetchError.stories.tsx │ │ │ │ │ ├── InitializedPreview.stories.tsx │ │ │ │ │ ├── NetworkConnected.stories.tsx │ │ │ │ │ ├── NetworkDisconnected.stories.tsx │ │ │ │ │ └── StateUpdated.stories.tsx │ │ │ └── pages │ │ │ │ ├── Abis.stories.tsx │ │ │ │ ├── Events.stories.tsx │ │ │ │ └── NameTags.stories.tsx │ │ └── views │ │ │ ├── Abis │ │ │ ├── Abis.tsx │ │ │ ├── parseAbiInput.test.ts │ │ │ └── parseAbiInput.ts │ │ │ ├── App.tsx │ │ │ ├── Events │ │ │ ├── EventItem │ │ │ │ ├── Badge.tsx │ │ │ │ ├── EventItem.tsx │ │ │ │ ├── Latency.tsx │ │ │ │ ├── formatInteger.ts │ │ │ │ ├── getEventLabel.ts │ │ │ │ └── getNetworkColor.ts │ │ │ ├── EventList │ │ │ │ ├── EventList.tsx │ │ │ │ └── EventListItem.tsx │ │ │ ├── EventPreview │ │ │ │ ├── AccountConnectedPreview.tsx │ │ │ │ ├── AccountDisconnectedPreview.tsx │ │ │ │ ├── BlockFoundPreview.tsx │ │ │ │ ├── CallsUpdatedPreview.tsx │ │ │ │ ├── ErrorPreview.tsx │ │ │ │ ├── EventPreview.tsx │ │ │ │ ├── FetchErrorPreview.tsx │ │ │ │ ├── InitializedPreview.tsx │ │ │ │ ├── NetworkConnectedPreview.tsx │ │ │ │ ├── NetworkDisconnectedPreview.tsx │ │ │ │ ├── StateUpdatedPreview.tsx │ │ │ │ └── components │ │ │ │ │ ├── Address.tsx │ │ │ │ │ ├── Bytes.tsx │ │ │ │ │ ├── Call.tsx │ │ │ │ │ ├── CallDisplay.tsx │ │ │ │ │ ├── CallList.tsx │ │ │ │ │ ├── Link.tsx │ │ │ │ │ ├── Method.tsx │ │ │ │ │ ├── Property.tsx │ │ │ │ │ ├── Table.tsx │ │ │ │ │ ├── Tuple.tsx │ │ │ │ │ ├── ValueItem.tsx │ │ │ │ │ ├── ValueList.tsx │ │ │ │ │ └── index.ts │ │ │ └── Events.tsx │ │ │ ├── NameTags │ │ │ └── NameTags.tsx │ │ │ └── shared │ │ │ ├── Header.tsx │ │ │ ├── Page.tsx │ │ │ ├── SubmitButton.ts │ │ │ ├── Text.ts │ │ │ ├── Title.ts │ │ │ └── index.ts │ ├── static │ │ ├── devtools.html │ │ ├── fonts │ │ │ ├── SourceCodePro │ │ │ │ ├── OFL.txt │ │ │ │ ├── SourceCodePro-Bold.ttf │ │ │ │ ├── SourceCodePro-Italic.ttf │ │ │ │ └── SourceCodePro-Regular.ttf │ │ │ ├── SourceSansPro │ │ │ │ ├── OFL.txt │ │ │ │ ├── SourceSansPro-Bold.ttf │ │ │ │ ├── SourceSansPro-Italic.ttf │ │ │ │ └── SourceSansPro-Regular.ttf │ │ │ └── fonts.css │ │ ├── icons │ │ │ ├── icon-inactive.svg │ │ │ └── icon.svg │ │ ├── index.html │ │ ├── manifest.json │ │ ├── popup │ │ │ ├── popup-inactive.html │ │ │ └── popup.html │ │ └── scripts │ │ │ ├── background.js │ │ │ ├── content.js │ │ │ └── devtools.js │ ├── tsconfig.json │ └── webpack.config.js ├── playwright │ ├── .eslintrc.js │ ├── .gitignore │ ├── README.md │ ├── metamask-chrome-10.12.4.zip │ ├── package.json │ ├── prettier.config.js │ ├── src │ │ ├── constants.ts │ │ ├── index.ts │ │ ├── metamask │ │ │ ├── MetaMask.ts │ │ │ ├── constants.ts │ │ │ └── index.ts │ │ ├── pageDiagnostics.ts │ │ ├── utils.ts │ │ └── xpath.ts │ └── tsconfig.json ├── siwe │ ├── .eslintrc.js │ ├── .mocharc.json │ ├── .npmignore │ ├── CHANGELOG.md │ ├── README.md │ ├── package.json │ ├── prettier.config.js │ ├── src │ │ ├── constants.ts │ │ ├── index.ts │ │ ├── provider.test.tsx │ │ ├── provider.tsx │ │ ├── requests.tsx │ │ └── test-setup.ts │ └── tsconfig.json ├── testing │ ├── .eslintrc.js │ ├── .mocharc.json │ ├── CHANGELOG.md │ ├── README.md │ ├── package.json │ ├── prettier.config.js │ ├── src │ │ └── index.ts │ └── tsconfig.json ├── uniswap │ ├── .eslintrc.json │ ├── .mocharc.json │ ├── CHANGELOG.md │ ├── README.md │ ├── package.json │ ├── prettier.config.js │ ├── src │ │ ├── constants │ │ │ ├── abi │ │ │ │ ├── UniswapV2Factory.json │ │ │ │ ├── UniswapV2Pair.json │ │ │ │ └── index.ts │ │ │ ├── index.ts │ │ │ └── uniswapV2.ts │ │ ├── hooks │ │ │ ├── index.ts │ │ │ ├── useUniswapPrice.test.tsx │ │ │ └── useUniswapPrice.ts │ │ ├── index.ts │ │ ├── test-setup.ts │ │ └── utils │ │ │ └── deployMockUniswapV2Pair.tsx │ └── tsconfig.json └── website │ ├── .gitignore │ ├── README.md │ ├── gulpfile.js │ ├── package.json │ └── src │ ├── css │ └── main.css │ ├── fonts │ ├── PlusJakartaSans.eot │ ├── PlusJakartaSans.otf │ ├── PlusJakartaSans.ttf │ ├── PlusJakartaSans.woff │ └── PlusJakartaSans.woff2 │ ├── img │ ├── backgrounds │ │ ├── features__background.jpg │ │ ├── features__background@2x.jpg │ │ ├── hero__background.jpg │ │ ├── hero__background@2x.jpg │ │ ├── start__background.jpg │ │ └── start__background@2x.jpg │ ├── covers │ │ ├── browser__cover.jpg │ │ ├── connect__cover.jpg │ │ ├── read__cover.jpg │ │ └── write__cover.jpg │ ├── favicon.svg │ ├── integration │ │ ├── integration__editor.jpg │ │ └── integration__editor@2x.jpg │ ├── logo.svg │ ├── projects │ │ ├── Boba_Network.png │ │ ├── Boba_Network@2x.png │ │ ├── Developer_DAO.png │ │ ├── Developer_DAO@2x.png │ │ ├── Index_Coop.png │ │ ├── Index_Coop@2x.png │ │ ├── Nouns.png │ │ ├── Nouns@2x.png │ │ ├── Nu_Cypher.png │ │ ├── Nu_Cypher@2x.png │ │ ├── OptimismPBC.png │ │ ├── OptimismPBC@2x.png │ │ ├── Pool_Together.png │ │ ├── Pool_Together@2x.png │ │ ├── Status.png │ │ ├── Status@2x.png │ │ ├── Tally.jpeg │ │ ├── Tally@2x.jpeg │ │ ├── Tenderize.png │ │ ├── Tenderize@2x.png │ │ ├── Treasure_Marketplace.png │ │ └── Treasure_Marketplace@2x.png │ ├── resources │ │ ├── resources.jpg │ │ └── resources@2x.jpg │ ├── testimonials │ │ ├── 1.png │ │ ├── 1@2x.png │ │ ├── 2.png │ │ ├── 2@2x.png │ │ ├── 3.png │ │ ├── 3@2x.png │ │ ├── 4.png │ │ ├── 4@2x.png │ │ ├── 5.png │ │ ├── 5@2x.png │ │ ├── 6.png │ │ └── 6@2x.png │ └── welcome.jpg │ ├── index.html │ ├── js │ ├── confetti.js │ ├── fetchGitHubRepoData.js │ ├── main.js │ ├── marquee3k.js │ ├── min │ │ ├── confetti.min.js │ │ ├── confetti.min.min.js │ │ ├── fetchGitHubRepoData.min.js │ │ ├── main.min.js │ │ ├── marquee3k.min.js │ │ ├── marquee3k.min.min.js │ │ ├── sectionsObserver.min.js │ │ ├── sectionsRedirect.min.js │ │ └── typed.min.js │ ├── sectionsObserver.js │ ├── sectionsRedirect.js │ └── typed.js │ ├── sass │ ├── components │ │ ├── _badge.sass │ │ ├── _button.sass │ │ ├── _footer.sass │ │ ├── _header.sass │ │ ├── _navigation.sass │ │ ├── _slider.sass │ │ ├── _socials.sass │ │ ├── _terminal.sass │ │ └── _text.sass │ ├── helpers │ │ ├── _animations.sass │ │ ├── _breakpoints.sass │ │ ├── _colors.sass │ │ ├── _reset.sass │ │ ├── _sizes.sass │ │ └── _transitions.sass │ ├── layout │ │ ├── _base.sass │ │ ├── _container.sass │ │ └── _section.sass │ ├── main.sass │ └── sections │ │ ├── _section-about.sass │ │ ├── _section-dependents.sass │ │ ├── _section-features.sass │ │ ├── _section-hero.sass │ │ ├── _section-integration.sass │ │ ├── _section-resources.sass │ │ ├── _section-start.sass │ │ └── _section-testimonials.sass │ └── video │ ├── browser__desktop.mp4 │ ├── browser__desktop.webm │ ├── browser__desktop@2x.mp4 │ ├── browser__desktop@2x.webm │ ├── browser__mobile.mp4 │ ├── browser__mobile.webm │ ├── browser__mobile@2x.mp4 │ ├── browser__mobile@2x.webm │ ├── browser__tablet.mp4 │ ├── browser__tablet.webm │ ├── browser__tablet@2x.mp4 │ ├── browser__tablet@2x.webm │ ├── connect__desktop.mp4 │ ├── connect__desktop.webm │ ├── connect__desktop@2x.mp4 │ ├── connect__desktop@2x.webm │ ├── connect__mobile.mp4 │ ├── connect__mobile.webm │ ├── connect__mobile@2x.mp4 │ ├── connect__mobile@2x.webm │ ├── connect__tablet.mp4 │ ├── connect__tablet.webm │ ├── connect__tablet@2x.mp4 │ ├── connect__tablet@2x.webm │ ├── read__desktop.mp4 │ ├── read__desktop.webm │ ├── read__desktop@2x.mp4 │ ├── read__desktop@2x.webm │ ├── read__mobile.mp4 │ ├── read__mobile.webm │ ├── read__mobile@2x.mp4 │ ├── read__mobile@2x.webm │ ├── read__tablet.mp4 │ ├── read__tablet.webm │ ├── read__tablet@2x.mp4 │ ├── read__tablet@2x.webm │ ├── write__desktop.mp4 │ ├── write__desktop.webm │ ├── write__desktop@2x.mp4 │ ├── write__desktop@2x.webm │ ├── write__mobile.mp4 │ ├── write__mobile.webm │ ├── write__mobile@2x.mp4 │ ├── write__mobile@2x.webm │ ├── write__tablet.mp4 │ ├── write__tablet.webm │ ├── write__tablet@2x.mp4 │ └── write__tablet@2x.webm ├── pnpm-lock.yaml ├── pnpm-workspace.yaml ├── scripts └── dev-version.sh └── tsconfig.json /.changeset/README.md: -------------------------------------------------------------------------------- 1 | # Changesets 2 | 3 | Hello and welcome! This folder has been automatically generated by `@changesets/cli`, a build tool that works 4 | with multi-package repos, or single-package repos to help you version and publish your code. You can 5 | find the full documentation for it [in our repository](https://github.com/changesets/changesets) 6 | 7 | We have a quick list of common questions to get you started engaging with this project in 8 | [our documentation](https://github.com/changesets/changesets/blob/master/docs/common-questions.md) 9 | -------------------------------------------------------------------------------- /.changeset/config.json: -------------------------------------------------------------------------------- 1 | { 2 | "$schema": "https://unpkg.com/@changesets/config@1.5.0/schema.json", 3 | "changelog": "@changesets/cli/changelog", 4 | "commit": false, 5 | "linked": [], 6 | "access": "restricted", 7 | "baseBranch": "master", 8 | "updateInternalDependencies": "patch", 9 | "ignore": [ 10 | "docs", 11 | "@usedapp/example", 12 | "@usedapp/example-next" 13 | ] 14 | } 15 | -------------------------------------------------------------------------------- /.github/ISSUE_TEMPLATE/bug_report.md: -------------------------------------------------------------------------------- 1 | --- 2 | name: Bug report 3 | about: Create a report to help us improve 4 | title: '' 5 | labels: bug 6 | assignees: '' 7 | 8 | --- 9 | 10 | **Describe the bug** 11 | A clear and concise description of what the bug is. 12 | 13 | **To Reproduce** 14 | Steps to reproduce the behavior, or a link to repository if public. 15 | At a minimum, please provide your usedapp Config object. 16 | Include information about chains you are connecting to, browser wallets you are using, and anything else that might be relevant. 17 | 18 | **Software versions** 19 | - `useDapp` version (installed version of `@usedapp/core`) 20 | - Package manager (yarn, npm, or pnpm?) 21 | - Node version (`node --version`) 22 | 23 | **Additional context** 24 | 25 | - Add any other context about the problem here 26 | - Include screenshoots if applicable 27 | -------------------------------------------------------------------------------- /.github/ISSUE_TEMPLATE/feature_request.md: -------------------------------------------------------------------------------- 1 | --- 2 | name: Feature request 3 | about: Suggest an idea for this project 4 | title: "[Feature Request]" 5 | labels: enhancement 6 | assignees: '' 7 | 8 | --- 9 | 10 | **Is your feature request related to a problem? Please describe.** 11 | A clear and concise description of what the problem is. Ex. I'm always frustrated when [...] 12 | 13 | **Describe the solution you'd like** 14 | A clear and concise description of what you want to happen. 15 | 16 | **Describe alternatives you've considered** 17 | A clear and concise description of any alternative solutions or features you've considered. 18 | 19 | **Additional context** 20 | Add any other context or screenshots about the feature request here. 21 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | node_modules 2 | .DS_Store 3 | .idea 4 | .swc 5 | packages/example/gen/types 6 | dist 7 | packages/.pnpm-debug.log 8 | packages/example-next/.next 9 | -------------------------------------------------------------------------------- /.node-version: -------------------------------------------------------------------------------- 1 | 16.14.0 2 | -------------------------------------------------------------------------------- /.prettierrc.json: -------------------------------------------------------------------------------- 1 | { 2 | "semi": false, 3 | "singleQuote": true, 4 | "printWidth": 120, 5 | "bracketSpacing": true 6 | } 7 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | ./packages/core/README.md -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "usedapp", 3 | "private": true, 4 | "engines": { 5 | "node": ">=10", 6 | "yarn": "^1.17.3" 7 | }, 8 | "packageManager": "pnpm@7.1.9", 9 | "scripts": { 10 | "preinstall": "npx only-allow pnpm", 11 | "lint": "pnpm run -r lint", 12 | "lint:fix": "pnpm run -r lint:fix", 13 | "build": "pnpm run -r build", 14 | "test": "pnpm run -r test", 15 | "version": "pnpm changeset version && pnpm install", 16 | "release": "pnpm build && pnpm changeset publish" 17 | }, 18 | "dependencies": { 19 | "@changesets/cli": "^2.14.1", 20 | "ethers": "5.7.2", 21 | "prettier": "2.1.2" 22 | }, 23 | "resolutions": { 24 | "ethers": "5.7.2" 25 | }, 26 | "devDependencies": { 27 | "eslint-plugin-no-only-tests": "^2.6.0" 28 | } 29 | } 30 | -------------------------------------------------------------------------------- /packages/coingecko/.eslintrc.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | extends: [`${__dirname}/../../.eslintrc.json`], 3 | } 4 | -------------------------------------------------------------------------------- /packages/coingecko/.mocharc.json: -------------------------------------------------------------------------------- 1 | { 2 | "spec": "src/**/*.test.{ts,tsx}", 3 | "require": ["@swc-node/register"], 4 | "watchExtensions": "ts", 5 | "extension": "ts", 6 | "timeout": 3000, 7 | "file": "./src/test-setup.ts" 8 | } 9 | -------------------------------------------------------------------------------- /packages/coingecko/README.md: -------------------------------------------------------------------------------- 1 | # @useDapp/coingecko 2 | 3 | ### Ethereum 🤝 React 4 | 5 | React hook to get token price from CoinGecko 6 | 7 | ## Documentation 8 | 9 | For detailed feature walkthrough checkout [documentation](https://usedapp-docs.netlify.app/docs/API%20Reference/Coingecko). 10 | 11 | ## Contributing 12 | 13 | Contributions are always welcome, no matter how large or small. Before contributing, please read the [code of conduct](https://github.com/TrueFiEng/useDApp/blob/master/CODE_OF_CONDUCT.md) and [contribution policy](https://github.com/TrueFiEng/useDApp/blob/master/CONTRIBUTION.md). 14 | 15 | ## License 16 | 17 | useDapp is released under the [MIT License](https://opensource.org/licenses/MIT). 18 | -------------------------------------------------------------------------------- /packages/coingecko/prettier.config.js: -------------------------------------------------------------------------------- 1 | module.exports = require('../../.prettierrc.json') 2 | -------------------------------------------------------------------------------- /packages/coingecko/src/api/simplePrice.ts: -------------------------------------------------------------------------------- 1 | export const getCoingeckoSimplePriceUri = (baseId: string, quoteId: string) => 2 | `https://api.coingecko.com/api/v3/simple/price?ids=${baseId}&vs_currencies=${quoteId}` 3 | 4 | export const fetchCoingeckoPrice = (fetchFunction: any) => async (base: string, quote: string) => { 5 | try { 6 | const baseId = base.toLowerCase() 7 | const quoteId = quote.toLowerCase() 8 | const url = getCoingeckoSimplePriceUri(baseId, quoteId) 9 | const data = await fetchFunction(url, { 10 | method: 'GET', 11 | headers: { 12 | 'Content-Type': 'application/json', 13 | }, 14 | }) 15 | const result = await data.json() 16 | const price = result[baseId][quoteId] 17 | return price ? price + '' : undefined 18 | } catch (_) { 19 | return undefined 20 | } 21 | } 22 | 23 | export const getCoingeckoPrice = fetchCoingeckoPrice(typeof window !== 'undefined' && window.fetch) 24 | -------------------------------------------------------------------------------- /packages/coingecko/src/hooks/useCoingeckoTokenPrices.test.tsx: -------------------------------------------------------------------------------- 1 | import { renderHook } from '@testing-library/react-hooks' 2 | import { useCoingeckoTokenPrices } from './useCoingeckoPrices' 3 | import { expect } from 'chai' 4 | 5 | const ADDRESSES = ['0x0d8775f648430679a709e98d2b0cb6250d2887ef'] 6 | 7 | describe('useCoingeckoTokenPrices', () => { 8 | it('works', async () => { 9 | const { result, waitForNextUpdate } = renderHook(() => useCoingeckoTokenPrices(ADDRESSES)) 10 | expect(result.current).to.be.undefined 11 | await waitForNextUpdate() 12 | expect(result.error).to.be.undefined 13 | expect(result.current).to.be.an('array') 14 | expect(result.current?.length).to.eq(1) 15 | expect(result.current![0]).to.be.a('number') 16 | }) 17 | }) 18 | -------------------------------------------------------------------------------- /packages/coingecko/src/index.ts: -------------------------------------------------------------------------------- 1 | export * from './hooks/useCoingeckoPrice' 2 | export * from './hooks/useCoingeckoPrices' 3 | export * from './api/simplePrice' 4 | export * from './api/simpleTokenPrice' 5 | -------------------------------------------------------------------------------- /packages/coingecko/src/test-setup.ts: -------------------------------------------------------------------------------- 1 | let jsdomCleanup: any 2 | before(() => { 3 | // eslint-disable-next-line @typescript-eslint/no-var-requires 4 | jsdomCleanup = require('jsdom-global')(undefined, { url: 'http://localhost/' }) 5 | }) 6 | after(() => jsdomCleanup?.()) 7 | -------------------------------------------------------------------------------- /packages/coingecko/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "dist", 5 | "module": "commonjs", 6 | "composite": true, 7 | "declaration": true, 8 | "sourceMap": true, 9 | "declarationMap": true, 10 | "resolveJsonModule": true, 11 | "skipLibCheck": true, 12 | "moduleResolution": "node" 13 | }, 14 | "include": [ 15 | "src", 16 | "src/**/*.json" 17 | ], 18 | "references": [ 19 | { 20 | "path": "../core" 21 | } 22 | ] 23 | } 24 | -------------------------------------------------------------------------------- /packages/connectors/portis/README.md: -------------------------------------------------------------------------------- 1 | # PortisConnector for useDApp 2 | -------------------------------------------------------------------------------- /packages/connectors/portis/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "@usedapp/portis-connector", 3 | "version": "1.0.1", 4 | "main": "dist/cjs/src/index.js", 5 | "module": "dist/esm/src/index.js", 6 | "types": "dist/esm/src/index.d.ts", 7 | "repository": "git@github.com:TrueFiEng/useDApp.git", 8 | "author": "Ethworks", 9 | "license": "MIT", 10 | "publishConfig": { 11 | "access": "public" 12 | }, 13 | "dependencies": { 14 | "@portis/web3": "4.0.7" 15 | }, 16 | "devDependencies": { 17 | "typescript": "^4.6.2", 18 | "@usedapp/core": "workspace:*" 19 | }, 20 | "peerDependencies": { 21 | "@usedapp/core": "*" 22 | }, 23 | "scripts": { 24 | "build": "pnpm run build:esm && pnpm run build:cjs", 25 | "build:esm": "tsc --module es2020 --target es2017 --outDir dist/esm", 26 | "build:cjs": "tsc --outDir dist/cjs", 27 | "test": "true", 28 | "lint": "true", 29 | "lint:fix": "true" 30 | } 31 | } 32 | -------------------------------------------------------------------------------- /packages/connectors/portis/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "dist", 5 | "module": "commonjs", 6 | "composite": true, 7 | "declaration": true, 8 | "sourceMap": true, 9 | "declarationMap": true, 10 | "resolveJsonModule": true, 11 | "skipLibCheck": true, 12 | "isolatedModules": true, 13 | "moduleResolution": "node" 14 | }, 15 | "include": [ 16 | "src" 17 | ], 18 | "references": [ 19 | { 20 | "path": "../../core" 21 | } 22 | ] 23 | } 24 | -------------------------------------------------------------------------------- /packages/connectors/wallet-connect-v2/.eslintrc.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | extends: [`${__dirname}/../../../.eslintrc.json`], 3 | parserOptions: { 4 | sourceType: 'module', 5 | }, 6 | } 7 | -------------------------------------------------------------------------------- /packages/connectors/wallet-connect-v2/README.md: -------------------------------------------------------------------------------- 1 | # WalletConnectV2Connector for useDApp 2 | 3 | Connector for [WalletConnectV2](https://docs.walletconnect.com/) for useDApp. 4 | 5 | ## Example usage 6 | 7 | Update your `usedapp` config: 8 | 9 | ```ts 10 | connectors: { 11 | ... 12 | walletConnectV2: new WalletConnectV2Connector({ 13 | projectId: , 14 | chains: [Mainnet], 15 | rpcMap: { 16 | 1: 'https://mainnet.infura.io/v3/', 17 | }, 18 | }), 19 | ... 20 | }, 21 | ``` 22 | 23 | Now you can use the connector: 24 | 25 | ```tsx 26 | import { useEthers } from '@usedapp/core' 27 | 28 | ... 29 | 30 | const { activateBrowserWallet } = useEthers(); 31 | 32 | ... 33 | 34 | 35 | ``` 36 | -------------------------------------------------------------------------------- /packages/connectors/wallet-connect-v2/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "dist", 5 | "module": "commonjs", 6 | "lib": [ 7 | "ES2015", 8 | "DOM" 9 | ], 10 | "composite": true, 11 | "declaration": true, 12 | "sourceMap": true, 13 | "declarationMap": true, 14 | "resolveJsonModule": true, 15 | "skipLibCheck": true, 16 | "isolatedModules": true, 17 | "moduleResolution": "node" 18 | }, 19 | "include": [ 20 | "src" 21 | ], 22 | "references": [ 23 | { 24 | "path": "../../core" 25 | } 26 | ] 27 | } 28 | -------------------------------------------------------------------------------- /packages/connectors/wallet-connect/README.md: -------------------------------------------------------------------------------- 1 | # WalletConnectConnector for useDApp 2 | -------------------------------------------------------------------------------- /packages/connectors/wallet-connect/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "dist", 5 | "module": "commonjs", 6 | "composite": true, 7 | "declaration": true, 8 | "sourceMap": true, 9 | "declarationMap": true, 10 | "resolveJsonModule": true, 11 | "skipLibCheck": true, 12 | "isolatedModules": true, 13 | "moduleResolution": "node" 14 | }, 15 | "include": [ 16 | "src" 17 | ], 18 | "references": [ 19 | { 20 | "path": "../../core" 21 | } 22 | ] 23 | } 24 | -------------------------------------------------------------------------------- /packages/core/.eslintrc.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | extends: [`${__dirname}/../../.eslintrc.json`, 'plugin:react-hooks/recommended'], 3 | env: { 4 | es2020: true 5 | } 6 | } 7 | -------------------------------------------------------------------------------- /packages/core/.gitignore: -------------------------------------------------------------------------------- 1 | # Autogenerated in this package. 2 | bin 3 | -------------------------------------------------------------------------------- /packages/core/.mocharc.json: -------------------------------------------------------------------------------- 1 | { 2 | "spec": "src/**/*.test.{ts,tsx}", 3 | "require": "@swc-node/register", 4 | "watchExtensions": "ts", 5 | "extension": "ts", 6 | "timeout": 10000, 7 | "file": "./src/testing/test-setup.ts" 8 | } 9 | -------------------------------------------------------------------------------- /packages/core/.npmignore: -------------------------------------------------------------------------------- 1 | dist/**/test/ 2 | test/ 3 | dist/**/tsconfig.tsbuildinfo 4 | CHANGELOG.md 5 | .eslintrc.js 6 | -------------------------------------------------------------------------------- /packages/core/.prettierignore: -------------------------------------------------------------------------------- 1 | src/model/types.ts 2 | -------------------------------------------------------------------------------- /packages/core/bin/usedapp-generate-hooks.js: -------------------------------------------------------------------------------- 1 | #!/usr/bin/env node 2 | "use strict"; 3 | 4 | require("./generate-hooks.js") 5 | -------------------------------------------------------------------------------- /packages/core/generate-hooks/generate-hooks.ts: -------------------------------------------------------------------------------- 1 | import {generate} from './generate' 2 | 3 | // TS-Node is required because we need to be importing typechain files. 4 | require('ts-node/register/transpile-only') 5 | 6 | console.log('EXPERIMENTAL: UseDApp automatic hook generation tool') 7 | 8 | const usage = () => { 9 | console.log(` 10 | Usage: 11 | 12 | USEDAPP_OUT_DIR= \ 13 | USEDAPP_TYPES_DIR= \ 14 | usedapp-generate-hooks 15 | `) 16 | } 17 | 18 | if (!process.env.USEDAPP_OUT_DIR || !process.env.USEDAPP_TYPES_DIR) { 19 | usage() 20 | process.exit(-1) 21 | } 22 | 23 | generate() 24 | .then(() => console.log('✅ All done.')) 25 | .catch((e: any) => { 26 | console.error(e); 27 | process.exit(1); 28 | }) 29 | -------------------------------------------------------------------------------- /packages/core/generate-hooks/imports.ts: -------------------------------------------------------------------------------- 1 | import * as path from 'path' 2 | 3 | export const commonImports = ` 4 | import { Falsy, Params, QueryParams, TransactionOptions, TypedFilter, useCall, useContractFunction, useLogs } from '@usedapp/core' 5 | import { Contract, utils } from 'ethers' 6 | ` 7 | 8 | export interface ImportsOptions { 9 | typesDir: string, 10 | outDir: string, 11 | contractName: string 12 | } 13 | export const imports = ({typesDir, outDir, contractName}: ImportsOptions) => ` 14 | import { ${contractName}, ${contractName}__factory } from '${path.relative(outDir, typesDir)}' 15 | const ${contractName}Interface = new utils.Interface(${contractName}__factory.abi) 16 | 17 | ` 18 | -------------------------------------------------------------------------------- /packages/core/prettier.config.js: -------------------------------------------------------------------------------- 1 | module.exports = require('../../.prettierrc.json') 2 | -------------------------------------------------------------------------------- /packages/core/src/abi/common.ts: -------------------------------------------------------------------------------- 1 | // number of bytes in the hext string - '0x' at the start doesn't count 2 | // each two characters are one byte 3 | export const buffLength = (buf: string) => (buf.length - 2) / 2 4 | // length of the buffer padded to the nearest 32 bytes 5 | export const bufPaddedLength = (buf: string) => Math.ceil(buffLength(buf) / 32) * 32 6 | export const encodeUint = (uint: number) => uint.toString(16).padStart(64, '0') 7 | export const decodeUint = (buf: string) => parseInt(buf, 16) 8 | // word length in characters - 32 bytes = 64 characters 9 | export const wordLength = 64 10 | export const fail = () => { 11 | throw new Error('Invalid calldata') 12 | } 13 | -------------------------------------------------------------------------------- /packages/core/src/abi/multicall/constants.ts: -------------------------------------------------------------------------------- 1 | import { utils } from 'ethers' 2 | import MultiCall from '../../constants/abi/MultiCall.json' 3 | 4 | export const ethersAbi = new utils.Interface(MultiCall.abi) 5 | export const defaultMulticall1ErrorMessage = 6 | 'One of the calls reverted in Multicall v1. See https://usedapp-docs.netlify.app/docs/Guides/Troubleshooting for more details.' 7 | -------------------------------------------------------------------------------- /packages/core/src/abi/multicall/encoder.ts: -------------------------------------------------------------------------------- 1 | import { encodeUint } from '../common' 2 | import { encodeCalls } from '../multicall2/encoder' 3 | import { ethersAbi } from './constants' 4 | 5 | const selector = ethersAbi.getSighash('aggregate') 6 | 7 | export function encodeAggregate(calls: [string, string][]) { 8 | // function aggregate(tuple(address target, bytes callData)[] calls) public returns (tuple(uint256 blockNumber, bytes returnData)[]) 9 | 10 | // offset of the array is 0x20 because the only thing 11 | // that goes before the array is the offset itself 12 | const dynamicOffset = 0x20 13 | const res = selector + encodeUint(dynamicOffset) 14 | 15 | // encode dynamic array of calls 16 | return encodeCalls(res, calls) 17 | } 18 | -------------------------------------------------------------------------------- /packages/core/src/abi/multicall/index.ts: -------------------------------------------------------------------------------- 1 | export { encodeAggregate } from './encoder' 2 | export { decodeAggregate } from './decoder' 3 | -------------------------------------------------------------------------------- /packages/core/src/abi/multicall2/constants.ts: -------------------------------------------------------------------------------- 1 | import { utils } from 'ethers' 2 | import MultiCall2 from '../../constants/abi/MultiCall2.json' 3 | 4 | export const ethersAbi = new utils.Interface(MultiCall2.abi) 5 | 6 | export const trueEncoded = '0'.repeat(63) + '1' 7 | export const falseEncoded = '0'.repeat(63) + '0' 8 | -------------------------------------------------------------------------------- /packages/core/src/abi/multicall2/index.ts: -------------------------------------------------------------------------------- 1 | export { encodeTryAggregate } from './encoder' 2 | export { decodeTryAggregate } from './decoder' 3 | -------------------------------------------------------------------------------- /packages/core/src/constants/abi/BlockNumber.json: -------------------------------------------------------------------------------- 1 | { 2 | "contractName": "BlockNumber", 3 | "abi": [ 4 | { 5 | "inputs": [], 6 | "name": "getBlockNumber", 7 | "outputs": [ 8 | { 9 | "internalType": "uint256", 10 | "name": "", 11 | "type": "uint256" 12 | } 13 | ], 14 | "stateMutability": "view", 15 | "type": "function" 16 | } 17 | ], 18 | "bytecode": "0x608060405234801561001057600080fd5b5060b58061001f6000396000f3fe6080604052348015600f57600080fd5b506004361060285760003560e01c806342cbb15c14602d575b600080fd5b60336047565b604051603e9190605c565b60405180910390f35b600043905090565b6056816075565b82525050565b6000602082019050606f6000830184604f565b92915050565b600081905091905056fea26469706673582212204740e85f94e6d1887dda3a56af161b21a85b8ddb19dab72de0279a74db1a727064736f6c63430008070033" 19 | } 20 | -------------------------------------------------------------------------------- /packages/core/src/constants/abi/index.ts: -------------------------------------------------------------------------------- 1 | import { utils } from 'ethers' 2 | import MultiCall from './MultiCall.json' 3 | import MultiCall2 from './MultiCall2.json' 4 | import ERC20 from './ERC20.json' 5 | import ERC20Mock from './ERC20Mock.json' 6 | import BlockNumberContract from './BlockNumber.json' 7 | 8 | const Interface = utils.Interface 9 | 10 | const MultiCallABI = new Interface(MultiCall.abi) 11 | 12 | export { MultiCall, MultiCallABI } 13 | 14 | const MultiCall2ABI = new Interface(MultiCall2.abi) 15 | 16 | export { MultiCall2, MultiCall2ABI } 17 | 18 | const ERC20Interface = new Interface(ERC20.abi) 19 | 20 | export { ERC20, ERC20Interface } 21 | 22 | const ERC20MockInterface = new Interface(ERC20Mock.abi) 23 | 24 | export { ERC20Mock, ERC20MockInterface } 25 | 26 | export { BlockNumberContract } 27 | 28 | export * from './doubler' 29 | export * from './timestamp' 30 | export * from './reverter' 31 | -------------------------------------------------------------------------------- /packages/core/src/constants/index.ts: -------------------------------------------------------------------------------- 1 | export * from './abi' 2 | export * from './type/Chain' 3 | export * from './type/Config' 4 | export * from './type/QueryParams' 5 | export * from './chainId' 6 | export * from './currencies' 7 | -------------------------------------------------------------------------------- /packages/core/src/helpers/LocalStorage.ts: -------------------------------------------------------------------------------- 1 | export default class LocalStorage { 2 | private data: { [key: string]: string } = {} 3 | length = 0 4 | 5 | clear() { 6 | this.data = {} 7 | this.length = 0 8 | } 9 | 10 | getItem(key: string): string | null { 11 | const item: any = this.data[key] 12 | return item || null 13 | } 14 | 15 | key(index: number): string | null { 16 | const keys = Object.keys(this.data) 17 | return keys[index] || null 18 | } 19 | 20 | removeItem(key: string): void { 21 | if (this.data[key]) { 22 | delete this.data[key] 23 | this.length-- 24 | } 25 | } 26 | 27 | setItem(key: string, value: string): void { 28 | if (!this.data[key]) { 29 | this.length++ 30 | } 31 | this.data[key] = value 32 | } 33 | } 34 | -------------------------------------------------------------------------------- /packages/core/src/helpers/chainExplorerLink.test.ts: -------------------------------------------------------------------------------- 1 | import { expect } from 'chai' 2 | import { getAddressLink, getTransactionLink } from './chainExplorerLink' 3 | 4 | describe('Chain explorer links', () => { 5 | it('getAddressLink'), 6 | () => { 7 | expect(getAddressLink('https://optimistic.etherscan.io')('0x0000000000000000000000000000000000000000')).to.eq( 8 | 'https://optimistic.etherscan.io/address/0x0000000000000000000000000000000000000000' 9 | ) 10 | } 11 | 12 | it('getTransactionLink'), 13 | () => { 14 | expect( 15 | getTransactionLink('https://optimistic.etherscan.io')( 16 | '0xf0299d575e284a0457baba6107bbdbdfffffffffffffffff0000000000000000' 17 | ) 18 | ).to.eq('https://optimistic.etherscan.io/tx/0xf0299d575e284a0457baba6107bbdbdfffffffffffffffff0000000000000000') 19 | } 20 | }) 21 | -------------------------------------------------------------------------------- /packages/core/src/helpers/chainExplorerLink.ts: -------------------------------------------------------------------------------- 1 | export const getAddressLink = (explorerUrl: string) => (address: string) => `${explorerUrl}/address/${address}` 2 | 3 | export const getTransactionLink = (explorerUrl: string) => (txnId: string) => `${explorerUrl}/tx/${txnId}` 4 | -------------------------------------------------------------------------------- /packages/core/src/helpers/contract.ts: -------------------------------------------------------------------------------- 1 | import { ContractFactory, ethers } from 'ethers' 2 | 3 | interface ContractAbi { 4 | abi: ethers.ContractInterface 5 | bytecode: ethers.utils.BytesLike 6 | } 7 | 8 | export async function deployContract( 9 | contractAbi: ContractAbi, 10 | signer: ethers.providers.JsonRpcSigner 11 | ): Promise { 12 | const factory = new ContractFactory(contractAbi.abi, contractAbi.bytecode, signer) 13 | const contract = await factory.deploy() 14 | return await contract.deployTransaction.wait() 15 | } 16 | -------------------------------------------------------------------------------- /packages/core/src/helpers/fromEntries.test.ts: -------------------------------------------------------------------------------- 1 | import { expect } from 'chai' 2 | import { fromEntries } from '../../src/helpers/fromEntries' 3 | 4 | describe('fromEntries', () => { 5 | it('correctly wraps Object.fromEntries', async () => { 6 | expect( 7 | fromEntries([ 8 | ['a', 1], 9 | ['b', 2], 10 | ]) 11 | ).to.deep.equal({ a: 1, b: 2 }) 12 | }) 13 | }) 14 | -------------------------------------------------------------------------------- /packages/core/src/helpers/fromEntries.ts: -------------------------------------------------------------------------------- 1 | /** 2 | * More strictly typed version of `Object.fromEntries`. 3 | * Constructs an object from key-value pairs. 4 | */ 5 | export function fromEntries(entries: [K, V][]): { [key in K]: V } { 6 | return Object.fromEntries(entries) as { [key in K]: V } 7 | } 8 | -------------------------------------------------------------------------------- /packages/core/src/helpers/getAddNetworkParams.ts: -------------------------------------------------------------------------------- 1 | import { Chain } from '../constants' 2 | 3 | // https://docs.metamask.io/guide/rpc-api.html#wallet-addethereumchain 4 | // https://docs.metamask.io/guide/rpc-api.html#unrestricted-methods 5 | export const getAddNetworkParams = (chain: Chain) => ({ 6 | chainId: `0x${chain.chainId.toString(16)}`, 7 | chainName: chain.chainName, 8 | rpcUrls: [chain.rpcUrl], 9 | blockExplorerUrls: chain.blockExplorerUrl ? [chain.blockExplorerUrl] : undefined, 10 | nativeCurrency: chain.nativeCurrency, 11 | }) 12 | -------------------------------------------------------------------------------- /packages/core/src/helpers/getChainMeta.ts: -------------------------------------------------------------------------------- 1 | import { Chain, ChainId } from '../constants' 2 | import * as chains from '../model/chain' 3 | 4 | /** 5 | * @internal Intended for internal use - use it on your own risk 6 | */ 7 | export function getChainMeta(chainId: ChainId): Chain { 8 | const chain = Object.values(chains).find((chain) => chain.chainId === chainId) 9 | if (!chain) { 10 | throw new Error(`Chain ${chainId} does not exist`) 11 | } 12 | return chain 13 | } 14 | -------------------------------------------------------------------------------- /packages/core/src/helpers/index.ts: -------------------------------------------------------------------------------- 1 | export * from './chain' 2 | export * from './calls' 3 | export * from './address' 4 | export * from './transaction' 5 | export * from './getChainMeta' 6 | export * from './injectedProvider' 7 | export * from './eip1193' 8 | export * from './logs' 9 | export * from './isWebSocketProvider' 10 | export * from './event' 11 | export * from './common' 12 | -------------------------------------------------------------------------------- /packages/core/src/helpers/isWebSocketProvider.ts: -------------------------------------------------------------------------------- 1 | import { providers } from 'ethers' 2 | 3 | export const isWebSocketProvider = (provider: any) => { 4 | return provider instanceof providers.WebSocketProvider || !!provider._websocket // Could be a different instance of ethers. 5 | } 6 | -------------------------------------------------------------------------------- /packages/core/src/helpers/transaction.ts: -------------------------------------------------------------------------------- 1 | import { Falsy } from '../model/types' 2 | import { shortenString } from './common' 3 | 4 | /** 5 | * @public 6 | */ 7 | export function shortenTransactionHash(transactionHash: string): string { 8 | if (transactionHash.length < 10) { 9 | throw new TypeError('Invalid input, transaction hash need to have at least 10 characters') 10 | } 11 | 12 | return shortenString(transactionHash) 13 | } 14 | 15 | /** 16 | * @public 17 | */ 18 | export function shortenIfTransactionHash(transactionHash: string | Falsy): string { 19 | if (typeof transactionHash === 'string' && transactionHash.length > 0) { 20 | return shortenTransactionHash(transactionHash) 21 | } 22 | return '' 23 | } 24 | -------------------------------------------------------------------------------- /packages/core/src/helpers/validateArgument.ts: -------------------------------------------------------------------------------- 1 | export type Assertions> = { [K in keyof S]: string } 2 | 3 | export function validateArguments>(args: S, assertions: Assertions): void { 4 | for (const key of Object.getOwnPropertyNames(args) as (keyof S)[]) { 5 | if (typeof args[key] !== assertions[key]) { 6 | throw new Error(`Expected "${key}" to be of type "${assertions[key]}", got "${args[key]}" instead.`) 7 | } 8 | } 9 | } 10 | -------------------------------------------------------------------------------- /packages/core/src/hooks/useBlockNumbers.ts: -------------------------------------------------------------------------------- 1 | import { useContext } from 'react' 2 | import { BlockNumbersContext } from '../providers' 3 | 4 | /** 5 | * Get the current block numbers of all observed chains. 6 | * Will update automatically when new blocks are mined. 7 | * @internal Intended for internal use - use it on your own risk 8 | */ 9 | export function useBlockNumbers() { 10 | return useContext(BlockNumbersContext) 11 | } 12 | -------------------------------------------------------------------------------- /packages/core/src/hooks/useChainId.ts: -------------------------------------------------------------------------------- 1 | import { QueryParams } from '../constants/type/QueryParams' 2 | import { useConnector } from '../providers/network/connectors' 3 | import { useConfig } from '../hooks' 4 | 5 | export interface UseChainIdOptions { 6 | queryParams?: QueryParams 7 | } 8 | 9 | /** 10 | * Internal hook for reading current chainId for calls. 11 | * @internal Intended for internal use - use it on your own risk 12 | */ 13 | export function useChainId(opts: UseChainIdOptions = {}) { 14 | const { chainId } = useConnector() 15 | const { readOnlyChainId } = useConfig() 16 | 17 | return opts?.queryParams?.chainId ?? chainId ?? readOnlyChainId 18 | } 19 | -------------------------------------------------------------------------------- /packages/core/src/hooks/useChainMeta.test.tsx: -------------------------------------------------------------------------------- 1 | import { useChainMeta } from '../../src/hooks/useChainMeta' 2 | import { renderHook } from '@testing-library/react-hooks' 3 | import { Arbitrum, Mainnet } from '../../src' 4 | import { expect } from 'chai' 5 | 6 | describe('useChainMeta', () => { 7 | it('works for Mainnet', async () => { 8 | const { result } = renderHook(() => useChainMeta(Mainnet.chainId)) 9 | expect(result.current).to.deep.equal(Mainnet) 10 | }) 11 | 12 | it('works for Arbitrum', async () => { 13 | const { result } = renderHook(() => useChainMeta(Arbitrum.chainId)) 14 | expect(result.current).to.deep.equal(Arbitrum) 15 | }) 16 | }) 17 | -------------------------------------------------------------------------------- /packages/core/src/hooks/useChainMeta.ts: -------------------------------------------------------------------------------- 1 | import { useMemo } from 'react' 2 | import { Chain, ChainId } from '../constants' 3 | import { getChainMeta } from '../helpers/getChainMeta' 4 | 5 | /** 6 | * @public 7 | */ 8 | export function useChainMeta(chainId: ChainId): Chain { 9 | return useMemo(() => getChainMeta(chainId), [chainId]) 10 | } 11 | -------------------------------------------------------------------------------- /packages/core/src/hooks/useChainState.ts: -------------------------------------------------------------------------------- 1 | import { useContext } from 'react' 2 | import { QueryParams } from '../constants/type/QueryParams' 3 | import { Action, MultiChainStatesContext, SingleChainState } from '../providers' 4 | import { useChainId } from './useChainId' 5 | 6 | /** 7 | * @public 8 | */ 9 | export function useChainState( 10 | queryParams: QueryParams = {} 11 | ): (Partial & { dispatchCalls: (action: Action) => void }) | undefined { 12 | const multiChainState = useContext(MultiChainStatesContext) 13 | const chainId = useChainId({ queryParams }) 14 | 15 | if (chainId === undefined) { 16 | return undefined 17 | } 18 | 19 | return { 20 | ...multiChainState.chains[chainId], 21 | dispatchCalls: multiChainState.dispatchCalls, 22 | } 23 | } 24 | -------------------------------------------------------------------------------- /packages/core/src/hooks/useInterval.tsx: -------------------------------------------------------------------------------- 1 | import { useEffect, useRef } from 'react' 2 | 3 | // https://usehooks-typescript.com/react-hook/use-interval 4 | /** 5 | * @internal Intended for internal use - use it on your own risk 6 | */ 7 | export function useInterval(callback: () => void, delay: number | null) { 8 | const savedCallback = useRef(callback) 9 | 10 | useEffect(() => { 11 | savedCallback.current = callback 12 | }, [callback]) 13 | 14 | useEffect(() => { 15 | if (delay === null) { 16 | return 17 | } 18 | 19 | const id = setInterval(() => savedCallback.current(), delay) 20 | 21 | return () => clearInterval(id) 22 | }, [delay]) 23 | } 24 | -------------------------------------------------------------------------------- /packages/core/src/hooks/useIsMounted.ts: -------------------------------------------------------------------------------- 1 | import { useRef, useEffect, useCallback } from 'react' 2 | 3 | export function useIsMounted() { 4 | const isMounted = useRef(false) 5 | 6 | useEffect(() => { 7 | isMounted.current = true 8 | 9 | return () => { 10 | isMounted.current = false 11 | } 12 | }, []) 13 | 14 | return useCallback(() => isMounted.current, []) 15 | } 16 | -------------------------------------------------------------------------------- /packages/core/src/hooks/useMulticallAddress.ts: -------------------------------------------------------------------------------- 1 | import { QueryParams } from '../constants/type/QueryParams' 2 | import { useChainState } from './useChainState' 3 | 4 | /** 5 | * Returns an address of the multicall contract used on a given chain. 6 | * @public 7 | * @param queryParams see {@link QueryParams}. 8 | */ 9 | export function useMulticallAddress(queryParams: QueryParams = {}): string | undefined { 10 | return useChainState(queryParams)?.multicallAddress 11 | } 12 | -------------------------------------------------------------------------------- /packages/core/src/hooks/useSigner.ts: -------------------------------------------------------------------------------- 1 | import { useEthers } from './useEthers' 2 | import { useState, useEffect } from 'react' 3 | import { JsonRpcSigner } from '@ethersproject/providers' 4 | 5 | /** 6 | * Returns a signer if an external wallet is connected. 7 | * @public 8 | * @returns a JsonRpcSigner if one is available in the provider. `undefined` otherwise. 9 | */ 10 | export function useSigner(): JsonRpcSigner | undefined { 11 | const { library, account } = useEthers() 12 | const [signer, setSigner] = useState() 13 | 14 | useEffect(() => { 15 | if (library !== undefined && 'getSigner' in library && account !== undefined) setSigner(library.getSigner()) 16 | else setSigner(undefined) 17 | }, [library, account]) 18 | 19 | return signer 20 | } 21 | -------------------------------------------------------------------------------- /packages/core/src/model/TokenInfo.ts: -------------------------------------------------------------------------------- 1 | import { BigNumberish } from 'ethers' 2 | 3 | /** 4 | * Represents general token information. 5 | * 6 | * @public 7 | */ 8 | export interface TokenInfo { 9 | /** 10 | * token name or an empty string. 11 | */ 12 | name: string 13 | /** 14 | * token symbol or an empty string. 15 | */ 16 | symbol: string 17 | /** 18 | * optional field that contains token decimals. 19 | */ 20 | decimals?: number 21 | /** 22 | * optional field that contains total supply of the token. 23 | */ 24 | totalSupply?: BigNumberish 25 | } 26 | -------------------------------------------------------------------------------- /packages/core/src/model/chain/astar.ts: -------------------------------------------------------------------------------- 1 | import { Chain } from '../../constants' 2 | import { getAddressLink, getTransactionLink } from '../../helpers/chainExplorerLink' 3 | 4 | const astarExplorerUrl = 'https://astar.subscan.io' 5 | 6 | export const Astar: Chain = { 7 | chainId: 592, 8 | chainName: 'Astar', 9 | isTestChain: false, 10 | isLocalChain: false, 11 | multicallAddress: '0xA129F95CfFe022153a4499f475B537751cd1ceF8', 12 | multicall2Address: '0x867e9d496F67a5eD0b888120A559DC6430499A7C', 13 | rpcUrl: 'https://rpc.astar.network:8545', 14 | nativeCurrency: { 15 | name: 'ASTR', 16 | symbol: 'ASTR', 17 | decimals: 18, 18 | }, 19 | blockExplorerUrl: astarExplorerUrl, 20 | getExplorerAddressLink: getAddressLink(astarExplorerUrl), 21 | getExplorerTransactionLink: getTransactionLink(astarExplorerUrl), 22 | } 23 | -------------------------------------------------------------------------------- /packages/core/src/model/chain/harmony.ts: -------------------------------------------------------------------------------- 1 | import { Chain } from '../../constants' 2 | import { getAddressLink, getTransactionLink } from '../../helpers/chainExplorerLink' 3 | 4 | const harmonyExplorerUrl = 'https://blockscout.com/poa/xdai' 5 | 6 | export const Harmony: Chain = { 7 | chainId: 1666600000, 8 | chainName: 'Harmony', 9 | isTestChain: false, 10 | isLocalChain: false, 11 | multicallAddress: '0xFE4980f62D708c2A84D3929859Ea226340759320', 12 | rpcUrl: 'https://api.harmony.one', 13 | nativeCurrency: { 14 | name: 'ONE', 15 | symbol: 'ONE', 16 | decimals: 18, 17 | }, 18 | blockExplorerUrl: harmonyExplorerUrl, 19 | getExplorerAddressLink: getAddressLink(harmonyExplorerUrl), 20 | getExplorerTransactionLink: getTransactionLink(harmonyExplorerUrl), 21 | } 22 | 23 | export default { Harmony } 24 | -------------------------------------------------------------------------------- /packages/core/src/model/chain/local.ts: -------------------------------------------------------------------------------- 1 | import { Chain } from '../../constants' 2 | 3 | export const Localhost: Chain = { 4 | chainId: 1337, 5 | chainName: 'Localhost', 6 | isTestChain: true, 7 | isLocalChain: true, 8 | multicallAddress: '', 9 | rpcUrl: 'http://localhost:8545', 10 | getExplorerAddressLink: () => '', 11 | getExplorerTransactionLink: () => '', 12 | } 13 | 14 | export const Hardhat: Chain = { 15 | chainId: 31337, 16 | chainName: 'Hardhat', 17 | isTestChain: true, 18 | isLocalChain: true, 19 | multicallAddress: '', 20 | rpcUrl: 'http://localhost:8545', 21 | getExplorerAddressLink: () => '', 22 | getExplorerTransactionLink: () => '', 23 | } 24 | 25 | export default { 26 | Localhost, 27 | Hardhat, 28 | } 29 | -------------------------------------------------------------------------------- /packages/core/src/model/chain/mantle.ts: -------------------------------------------------------------------------------- 1 | import { Chain } from '../../constants' 2 | import { getAddressLink, getTransactionLink } from '../../helpers/chainExplorerLink' 3 | 4 | const mantleExplorerUrl = 'https://explorer.testnet.mantle.xyz' 5 | 6 | export const MantleTestnet: Chain = { 7 | chainId: 5001, 8 | chainName: 'Mantle Testnet', 9 | isTestChain: true, 10 | isLocalChain: false, 11 | multicallAddress: '0x7eeFb76E4D201Eb7157c140F39E2992D53F71da7', 12 | multicall2Address: '0xd875b6E583cba79183be68E0af7cBad053338C95', 13 | rpcUrl: 'https://rpc.testnet.mantle.xyz', 14 | nativeCurrency: { 15 | name: 'Testnet BitDAO', 16 | symbol: 'BIT', 17 | decimals: 18, 18 | }, 19 | blockExplorerUrl: mantleExplorerUrl, 20 | getExplorerAddressLink: getAddressLink(mantleExplorerUrl), 21 | getExplorerTransactionLink: getTransactionLink(mantleExplorerUrl), 22 | } 23 | 24 | export default { MantleTestnet } 25 | -------------------------------------------------------------------------------- /packages/core/src/model/chain/moonbeam.ts: -------------------------------------------------------------------------------- 1 | import { Chain } from '../../constants' 2 | import { getAddressLink, getTransactionLink } from '../../helpers/chainExplorerLink' 3 | 4 | const moonbeamExplorerUrl = 'https://moonscan.io' 5 | 6 | export const Moonbeam: Chain = { 7 | chainId: 1284, 8 | chainName: 'Moonbeam', 9 | isTestChain: false, 10 | isLocalChain: false, 11 | multicallAddress: '0x47152C4dCE75C77Bc9E52F5AAa2a20117971C365', 12 | rpcUrl: 'https://rpc.api.moonbeam.network', 13 | nativeCurrency: { 14 | name: 'GLMR', 15 | symbol: 'GLMR', 16 | decimals: 18, 17 | }, 18 | blockExplorerUrl: moonbeamExplorerUrl, 19 | getExplorerAddressLink: getAddressLink(moonbeamExplorerUrl), 20 | getExplorerTransactionLink: getTransactionLink(moonbeamExplorerUrl), 21 | } 22 | 23 | export default { Moonbeam } 24 | -------------------------------------------------------------------------------- /packages/core/src/model/chain/songbird.ts: -------------------------------------------------------------------------------- 1 | import { Chain } from '../../constants' 2 | import { getAddressLink, getTransactionLink } from '../../helpers/chainExplorerLink' 3 | 4 | const songbirdExplorerUrl = 'https://songbird-explorer.flare.network' 5 | 6 | export const Songbird: Chain = { 7 | chainId: 19, 8 | chainName: 'Songbird', 9 | isTestChain: false, 10 | isLocalChain: false, 11 | multicallAddress: '0x60351436cf80A31EA6C3B261C784d3C127dBD6f1', 12 | rpcUrl: 'https://songbird.towolabs.com/rpc', 13 | nativeCurrency: { 14 | name: 'SGB', 15 | symbol: 'SGB', 16 | decimals: 18, 17 | }, 18 | blockExplorerUrl: songbirdExplorerUrl, 19 | getExplorerAddressLink: getAddressLink(songbirdExplorerUrl), 20 | getExplorerTransactionLink: getTransactionLink(songbirdExplorerUrl), 21 | } 22 | -------------------------------------------------------------------------------- /packages/core/src/model/chain/test-defaults.ts: -------------------------------------------------------------------------------- 1 | export const TEST_ADDRESS = '0xC7095A52C403ee3625Ce8B9ae8e2e46083b81987' 2 | export const TEST_TX = '0x5d53558791c9346d644d077354420f9a93600acf54eb6a279f12b43025392c3a' 3 | -------------------------------------------------------------------------------- /packages/core/src/model/chain/xdai.ts: -------------------------------------------------------------------------------- 1 | import { Chain } from '../../constants' 2 | import { getAddressLink, getTransactionLink } from '../../helpers/chainExplorerLink' 3 | 4 | const xDaiExplorerUrl = 'https://blockscout.com/poa/xdai' 5 | 6 | export const xDai: Chain = { 7 | chainId: 100, 8 | chainName: 'xDai', 9 | isTestChain: false, 10 | isLocalChain: false, 11 | rpcUrl: 'https://rpc.gnosischain.com', 12 | multicallAddress: '0xb5b692a88bdfc81ca69dcb1d924f59f0413a602a', 13 | nativeCurrency: { 14 | name: 'xDAI', 15 | symbol: 'xDAI', 16 | decimals: 18, 17 | }, 18 | blockExplorerUrl: xDaiExplorerUrl, 19 | getExplorerAddressLink: getAddressLink(xDaiExplorerUrl), 20 | getExplorerTransactionLink: getTransactionLink(xDaiExplorerUrl), 21 | } 22 | 23 | // xdai alias 24 | export const Gnosis = { 25 | ...xDai, 26 | chainName: 'Gnosis', 27 | } 28 | 29 | export default { xDai, Gnosis } 30 | -------------------------------------------------------------------------------- /packages/core/src/model/config/default.ts: -------------------------------------------------------------------------------- 1 | import { DEFAULT_SUPPORTED_CHAINS, FullConfig } from '../../constants' 2 | import { MetamaskConnector } from '../../providers/network/connectors/implementations' 3 | 4 | export const DEFAULT_CONFIG: FullConfig = { 5 | pollingInterval: 15000, 6 | supportedChains: undefined, 7 | networks: DEFAULT_SUPPORTED_CHAINS, 8 | notifications: { 9 | checkInterval: 500, 10 | expirationPeriod: 5000, 11 | }, 12 | localStorage: { 13 | transactionPath: 'transactions', 14 | }, 15 | autoConnect: true, 16 | multicallVersion: 1, 17 | connectors: { 18 | metamask: new MetamaskConnector(), 19 | }, 20 | } 21 | -------------------------------------------------------------------------------- /packages/core/src/model/index.ts: -------------------------------------------------------------------------------- 1 | export * from './chain' 2 | export * from './formatting' 3 | export * from './Currency' 4 | export * from './CurrencyValue' 5 | export * from './TransactionStatus' 6 | export * from './TransactionOptions' 7 | export * from './types' 8 | -------------------------------------------------------------------------------- /packages/core/src/providers/blockNumber/blockNumbers/context.ts: -------------------------------------------------------------------------------- 1 | import { createContext } from 'react' 2 | import { ChainId } from '../../../constants' 3 | 4 | export const BlockNumbersContext = createContext< 5 | { 6 | [chainId in ChainId]?: number 7 | } 8 | >({}) 9 | -------------------------------------------------------------------------------- /packages/core/src/providers/blockNumber/blockNumbers/index.ts: -------------------------------------------------------------------------------- 1 | export * from './context' 2 | export * from './provider' 3 | -------------------------------------------------------------------------------- /packages/core/src/providers/blockNumber/common/index.ts: -------------------------------------------------------------------------------- 1 | export * from './reducer' 2 | export * from './subscribeToNewBlock' 3 | -------------------------------------------------------------------------------- /packages/core/src/providers/blockNumber/common/reducer.ts: -------------------------------------------------------------------------------- 1 | interface BlockNumberState { 2 | [chainId: number]: number | undefined 3 | } 4 | 5 | /** 6 | * @internal Intended for internal use - use it on your own risk 7 | */ 8 | export interface BlockNumberChanged { 9 | chainId: number 10 | blockNumber: number 11 | } 12 | 13 | /** 14 | * @internal Intended for internal use - use it on your own risk 15 | */ 16 | export function blockNumberReducer(state: BlockNumberState = {}, action: BlockNumberChanged) { 17 | const current = state[action.chainId] 18 | if (!current || action.blockNumber > current) { 19 | return { 20 | ...state, 21 | [action.chainId]: action.blockNumber, 22 | } 23 | } 24 | return state 25 | } 26 | -------------------------------------------------------------------------------- /packages/core/src/providers/blockNumber/common/subscribeToNewBlock.ts: -------------------------------------------------------------------------------- 1 | import { providers } from 'ethers' 2 | import { ChainId } from '../../../constants' 3 | import { Dispatch } from 'react' 4 | import { BlockNumberChanged } from './reducer' 5 | 6 | export function subscribeToNewBlock( 7 | provider: providers.BaseProvider | undefined, 8 | chainId: ChainId | undefined, 9 | dispatch: Dispatch, 10 | isActive: boolean 11 | ) { 12 | if (provider && chainId !== undefined && isActive) { 13 | const update = (blockNumber: number) => dispatch({ chainId, blockNumber }) 14 | provider.on('block', update) 15 | 16 | provider.getBlockNumber().then( 17 | (blockNumber) => update(blockNumber), 18 | (err) => { 19 | console.error(err) 20 | } 21 | ) 22 | 23 | return () => { 24 | provider.off('block', update) 25 | } 26 | } 27 | 28 | return () => undefined 29 | } 30 | -------------------------------------------------------------------------------- /packages/core/src/providers/blockNumber/index.ts: -------------------------------------------------------------------------------- 1 | export * from './blockNumbers' 2 | export * from './common' 3 | -------------------------------------------------------------------------------- /packages/core/src/providers/chainState/common/index.ts: -------------------------------------------------------------------------------- 1 | export * from './callsReducer' 2 | export * from './chainStateReducer' 3 | export * from './model' 4 | export * from './multicall' 5 | export * from './multicall2' 6 | -------------------------------------------------------------------------------- /packages/core/src/providers/chainState/common/model.ts: -------------------------------------------------------------------------------- 1 | /** 2 | * Result of a {@link useRawCall} query. 3 | * 4 | * It is `undefined` when call didn't return yet or object `{ success: boolean, value: string }` if it did. 5 | * 6 | * - `success` - boolean indicating whether call was successful or not, 7 | * - `value` - encoded result when success is `true` or encoded error message when success is `false`. 8 | * 9 | * @public 10 | */ 11 | export type RawCallResult = 12 | | { 13 | value: string 14 | success: boolean 15 | } 16 | | undefined 17 | 18 | export type ChainState = { 19 | [address: string]: 20 | | { 21 | [data: string]: RawCallResult 22 | } 23 | | undefined 24 | } 25 | -------------------------------------------------------------------------------- /packages/core/src/providers/chainState/index.ts: -------------------------------------------------------------------------------- 1 | export * from './multiChainStates' 2 | export * from './common' 3 | -------------------------------------------------------------------------------- /packages/core/src/providers/chainState/multiChainStates/index.ts: -------------------------------------------------------------------------------- 1 | export * from './context' 2 | export * from './provider' 3 | -------------------------------------------------------------------------------- /packages/core/src/providers/config/context.ts: -------------------------------------------------------------------------------- 1 | import { createContext } from 'react' 2 | import { FullConfig, Config } from '../../constants' 3 | import { DEFAULT_CONFIG } from '../../model/config/default' 4 | 5 | /** 6 | * @internal Intended for internal use - use it on your own risk 7 | */ 8 | export const ConfigContext = createContext<{ config: FullConfig; updateConfig: (config: Config) => void }>({ 9 | config: DEFAULT_CONFIG, 10 | updateConfig: () => undefined, 11 | }) 12 | -------------------------------------------------------------------------------- /packages/core/src/providers/config/index.ts: -------------------------------------------------------------------------------- 1 | export * from './context' 2 | export * from './provider' 3 | -------------------------------------------------------------------------------- /packages/core/src/providers/config/reducer.ts: -------------------------------------------------------------------------------- 1 | import { FullConfig, Config } from '../..' 2 | import merge from 'lodash.merge' 3 | 4 | export function configReducer(state: FullConfig, action: Config): FullConfig { 5 | return merge({}, state, action) 6 | } 7 | -------------------------------------------------------------------------------- /packages/core/src/providers/index.ts: -------------------------------------------------------------------------------- 1 | export * from './DAppProvider' 2 | export * from './blockNumber' 3 | export * from './chainState' 4 | export * from './config' 5 | export { useTransactionsContext } from './transactions/context' 6 | export { useNotificationsContext } from './notifications/context' 7 | export * from './transactions/model' 8 | export * from './notifications/model' 9 | export * from './network/readonlyNetworks' 10 | export * from './window' 11 | export * from './network/connectors' 12 | -------------------------------------------------------------------------------- /packages/core/src/providers/network/connectors/connector.ts: -------------------------------------------------------------------------------- 1 | import { providers } from 'ethers' 2 | import { ReadOnlyEvent } from '../../../helpers/event' 3 | 4 | export interface ConnectorUpdateData { 5 | chainId: number 6 | accounts: string[] 7 | } 8 | 9 | export interface Connector { 10 | provider?: providers.Web3Provider | providers.JsonRpcProvider 11 | 12 | name: string 13 | 14 | update: ReadOnlyEvent 15 | 16 | connectEagerly(): Promise 17 | 18 | activate(): Promise 19 | 20 | deactivate(): Promise 21 | } 22 | -------------------------------------------------------------------------------- /packages/core/src/providers/network/connectors/implementations/index.ts: -------------------------------------------------------------------------------- 1 | export { MetamaskConnector } from './metamask' 2 | export { InjectedConnector } from './injected' 3 | export { CoinbaseWalletConnector } from './coinbase' 4 | -------------------------------------------------------------------------------- /packages/core/src/providers/network/connectors/index.ts: -------------------------------------------------------------------------------- 1 | export * from './connector' 2 | export * from './connectorController' 3 | export * from './context' 4 | -------------------------------------------------------------------------------- /packages/core/src/providers/network/index.ts: -------------------------------------------------------------------------------- 1 | export * from './connectors' 2 | export * from './readonlyNetworks' 3 | -------------------------------------------------------------------------------- /packages/core/src/providers/network/readonlyNetworks/context.ts: -------------------------------------------------------------------------------- 1 | import { createContext, useContext } from 'react' 2 | import { ReadonlyNetworksModel } from './model' 3 | 4 | export const ReadonlyNetworksContext = createContext({ 5 | providers: {}, 6 | updateNetworkState: () => undefined, 7 | networkStates: {}, 8 | }) 9 | 10 | export function useReadonlyNetworks() { 11 | return useContext(ReadonlyNetworksContext).providers 12 | } 13 | 14 | export function useUpdateNetworksState() { 15 | return useContext(ReadonlyNetworksContext).updateNetworkState 16 | } 17 | 18 | export function useReadonlyNetworkStates() { 19 | return useContext(ReadonlyNetworksContext).networkStates 20 | } 21 | -------------------------------------------------------------------------------- /packages/core/src/providers/network/readonlyNetworks/index.ts: -------------------------------------------------------------------------------- 1 | export { useReadonlyNetworks } from './context' 2 | export { ReadonlyNetworksProvider } from './provider' 3 | -------------------------------------------------------------------------------- /packages/core/src/providers/network/readonlyNetworks/model.ts: -------------------------------------------------------------------------------- 1 | import { ChainId } from '../../../constants' 2 | import type { providers } from 'ethers' 3 | 4 | export interface NetworkState { 5 | errors: Error[] 6 | } 7 | 8 | export type Providers = { 9 | [chainId in ChainId]?: providers.BaseProvider 10 | } 11 | 12 | export type NetworkStates = { 13 | [chainId in ChainId]?: NetworkState 14 | } 15 | 16 | export interface ReadonlyNetworksModel { 17 | providers: Providers 18 | updateNetworkState: (payload: Actions) => void 19 | networkStates: NetworkStates 20 | } 21 | 22 | export interface PropagateChainError { 23 | type: 'ADD_ERROR' 24 | chainId: ChainId 25 | error: Error 26 | } 27 | 28 | export type Actions = PropagateChainError 29 | -------------------------------------------------------------------------------- /packages/core/src/providers/network/readonlyNetworks/reducer.ts: -------------------------------------------------------------------------------- 1 | import { Actions, NetworkStates } from './model' 2 | 3 | export function networkStatesReducer(prevState: NetworkStates, actions: Actions): NetworkStates { 4 | switch (actions.type) { 5 | case 'ADD_ERROR': { 6 | const newState = { ...prevState } 7 | newState[actions.chainId] = { 8 | ...newState[actions.chainId], 9 | errors: [...(newState[actions.chainId]?.errors ?? []), actions.error], 10 | } 11 | return newState 12 | } 13 | default: 14 | return prevState 15 | } 16 | } 17 | -------------------------------------------------------------------------------- /packages/core/src/providers/notifications/context.ts: -------------------------------------------------------------------------------- 1 | import { createContext, useContext } from 'react' 2 | import { Notifications, DEFAULT_NOTIFICATIONS, AddNotificationPayload, RemoveNotificationPayload } from './model' 3 | 4 | export const NotificationsContext = createContext<{ 5 | notifications: Notifications 6 | addNotification: (payload: AddNotificationPayload) => void 7 | removeNotification: (payload: RemoveNotificationPayload) => void 8 | }>({ 9 | notifications: DEFAULT_NOTIFICATIONS, 10 | addNotification: () => undefined, 11 | removeNotification: () => undefined, 12 | }) 13 | 14 | /** 15 | * @internal Intended for internal use - use it on your own risk 16 | */ 17 | export function useNotificationsContext() { 18 | return useContext(NotificationsContext) 19 | } 20 | -------------------------------------------------------------------------------- /packages/core/src/providers/transactions/context.ts: -------------------------------------------------------------------------------- 1 | import { createContext, useContext } from 'react' 2 | import { DEFAULT_STORED_TRANSACTIONS, StoredTransaction, StoredTransactions, UpdatedTransaction } from './model' 3 | 4 | export const TransactionsContext = createContext<{ 5 | transactions: StoredTransactions 6 | addTransaction: (payload: StoredTransaction) => void 7 | updateTransaction: (payload: UpdatedTransaction) => void 8 | }>({ 9 | transactions: DEFAULT_STORED_TRANSACTIONS, 10 | addTransaction: () => undefined, 11 | updateTransaction: () => undefined, 12 | }) 13 | 14 | /** 15 | * @internal Intended for internal use - use it on your own risk 16 | */ 17 | export function useTransactionsContext() { 18 | return useContext(TransactionsContext) 19 | } 20 | -------------------------------------------------------------------------------- /packages/core/src/providers/window/context.ts: -------------------------------------------------------------------------------- 1 | import { createContext, useContext } from 'react' 2 | 3 | /** 4 | * @internal Intended for internal use - use it on your own risk 5 | */ 6 | export const WindowContext = createContext(true) 7 | 8 | /** 9 | * @internal 10 | */ 11 | export function useWindow() { 12 | return useContext(WindowContext) 13 | } 14 | -------------------------------------------------------------------------------- /packages/core/src/providers/window/index.ts: -------------------------------------------------------------------------------- 1 | export * from './context' 2 | export * from './provider' 3 | -------------------------------------------------------------------------------- /packages/core/src/testing/index.ts: -------------------------------------------------------------------------------- 1 | import 'mock-local-storage' 2 | 3 | export * from './utils' 4 | export * from './renderDAppHook' 5 | export * from './renderWeb3Hook' 6 | export * from './bignumber' 7 | -------------------------------------------------------------------------------- /packages/core/src/testing/test-setup.ts: -------------------------------------------------------------------------------- 1 | import 'mock-local-storage' 2 | import chai from 'chai' 3 | import chaiAsPromised from 'chai-as-promised' 4 | import { supportBigNumber } from './bignumber' 5 | 6 | let jsdomCleanup: any 7 | before(() => { 8 | // eslint-disable-next-line @typescript-eslint/no-var-requires 9 | jsdomCleanup = require('jsdom-global')(undefined, { url: 'http://localhost/' }) 10 | }) 11 | after(() => jsdomCleanup?.()) 12 | 13 | chai.use(chaiAsPromised) 14 | chai.use((chai, utils) => { 15 | supportBigNumber(chai.Assertion, utils) 16 | }) 17 | -------------------------------------------------------------------------------- /packages/core/src/testing/useAdder.tsx: -------------------------------------------------------------------------------- 1 | /* 2 | An example hook that: 3 | - can take optional arguments 4 | - Optionally uses a context with a provider wrapper 5 | */ 6 | 7 | import { createContext, useContext } from 'react' 8 | 9 | const AdderContext = createContext<{ prov1?: number; prov2?: number } | undefined>(undefined) 10 | 11 | export const AdderProvider = AdderContext.Provider 12 | 13 | export const useAdder = (arg1?: number, arg2?: number) => { 14 | const context = useContext(AdderContext) 15 | 16 | return { 17 | sum: (arg1 ?? 0) + (arg2 ?? 0) + (context?.prov1 ?? 0) + (context?.prov2 ?? 0), 18 | } 19 | } 20 | -------------------------------------------------------------------------------- /packages/core/src/testing/utils/IdentityWrapper.tsx: -------------------------------------------------------------------------------- 1 | import React, { ReactNode } from 'react' 2 | 3 | export type ChildrenProps = { children?: ReactNode } 4 | 5 | export const IdentityWrapper = ({ children }: ChildrenProps) => <>{children} 6 | -------------------------------------------------------------------------------- /packages/core/src/testing/utils/deployContract.ts: -------------------------------------------------------------------------------- 1 | import { ContractFactory, Signer } from 'ethers' 2 | 3 | export interface ContractDeclaration { 4 | abi: any 5 | bytecode: string 6 | } 7 | 8 | export const deployContract = async (deployer: Signer, { abi, bytecode }: ContractDeclaration, args: any[] = []) => { 9 | const contractFactory = new ContractFactory(abi, bytecode, deployer) 10 | const contract = await contractFactory.deploy(...args) 11 | await contract.deployed() 12 | return contract 13 | } 14 | -------------------------------------------------------------------------------- /packages/core/src/testing/utils/deployMockToken.ts: -------------------------------------------------------------------------------- 1 | import { BigNumber, utils, Wallet } from 'ethers' 2 | import { ERC20Mock } from '../../constants' 3 | import { deployContract } from './deployContract' 4 | 5 | export const MOCK_TOKEN_INITIAL_BALANCE = utils.parseEther('10') 6 | export const SECOND_TEST_CHAIN_ID = 31337 7 | export const SECOND_MOCK_TOKEN_INITIAL_BALANCE = BigNumber.from(2000) 8 | 9 | export async function deployMockToken(deployer: Wallet, initialBalance?: BigNumber) { 10 | const args = ['MOCKToken', 'MOCK', deployer.address, initialBalance ?? MOCK_TOKEN_INITIAL_BALANCE] 11 | return await deployContract(deployer, ERC20Mock, args) 12 | } 13 | -------------------------------------------------------------------------------- /packages/core/src/testing/utils/deployMulticall.ts: -------------------------------------------------------------------------------- 1 | import { MultiCall, MultiCall2 } from '../../constants' 2 | import { deployContract } from './deployContract' 3 | import { Signer } from 'ethers' 4 | 5 | export const deployMulticall = async (chainId: number, deployer: Signer) => { 6 | return deployMulticallBase(MultiCall, chainId, deployer) 7 | } 8 | 9 | export const deployMulticall2 = async (chainId: number, deployer: Signer) => { 10 | return deployMulticallBase(MultiCall2, chainId, deployer) 11 | } 12 | 13 | const deployMulticallBase = async (contract: any, chainId: number, deployer: Signer) => { 14 | const multicall = await deployContract(deployer, { 15 | bytecode: contract.bytecode, 16 | abi: contract.abi, 17 | }) 18 | const multicallAddresses = { [chainId]: multicall.address } 19 | 20 | return multicallAddresses 21 | } 22 | -------------------------------------------------------------------------------- /packages/core/src/testing/utils/getResultProperty.ts: -------------------------------------------------------------------------------- 1 | import { RenderResult } from '@testing-library/react-hooks' 2 | import { Contract } from 'ethers' 3 | import { CallResult } from '../../helpers' 4 | 5 | export type HookResult = { 6 | [key: string]: CallResult 7 | } 8 | 9 | export const getResultProperty = (result: RenderResult, property: keyof T) => { 10 | return result.current?.[property]?.value?.[0] 11 | } 12 | 13 | export const getResultPropertyError = (result: RenderResult, property: keyof T) => { 14 | return result.current?.[property]?.error 15 | } 16 | -------------------------------------------------------------------------------- /packages/core/src/testing/utils/index.ts: -------------------------------------------------------------------------------- 1 | export * from './createMockProvider' 2 | export * from './deployMulticall' 3 | export * from './IdentityWrapper' 4 | export * from './mineBlock' 5 | export * from './waitUntil' 6 | export * from './waitUtils' 7 | export * from './deployMockToken' 8 | export * from './setupTestingConfig' 9 | export * from './getResultProperty' 10 | -------------------------------------------------------------------------------- /packages/core/src/testing/utils/mineBlock.ts: -------------------------------------------------------------------------------- 1 | import { Signer, constants } from 'ethers' 2 | 3 | export const mineBlock = async (wallet: Signer) => { 4 | const tx = await wallet.sendTransaction({ to: constants.AddressZero, value: 0 }) 5 | await tx.wait() 6 | } 7 | -------------------------------------------------------------------------------- /packages/core/src/testing/utils/sendEmptyTx.ts: -------------------------------------------------------------------------------- 1 | import { Wallet } from 'ethers' 2 | import { constants } from 'ethers' 3 | 4 | export async function sendEmptyTx(wallet: Wallet) { 5 | return wallet.sendTransaction({ to: constants.AddressZero }) 6 | } 7 | -------------------------------------------------------------------------------- /packages/core/src/testing/utils/waitUntil.ts: -------------------------------------------------------------------------------- 1 | export const sleep = (ms: number) => new Promise((resolve) => setTimeout(resolve, ms)) 2 | 3 | export const waitUntil = async (predicate: () => boolean, step = 100, timeout = 10000) => { 4 | const stopTime = Date.now() + timeout 5 | while (Date.now() <= stopTime) { 6 | const result = await predicate() 7 | if (result) { 8 | return result 9 | } 10 | await sleep(step) 11 | } 12 | throw new Error(`waitUntil timed out after ${timeout} ms`) 13 | } 14 | -------------------------------------------------------------------------------- /packages/core/src/testing/utils/waitUtils.ts: -------------------------------------------------------------------------------- 1 | import { RenderResult } from '@testing-library/react-hooks' 2 | import { waitUntil } from './waitUntil' 3 | 4 | export const getWaitUtils = (hookResult: RenderResult) => { 5 | const waitForCurrent = async (predicate: (value: TResult) => boolean, step?: number, timeout?: number) => { 6 | await waitUntil(() => predicate(hookResult.current), step, timeout) 7 | } 8 | 9 | const waitForCurrentEqual = async (value: TResult, step?: number, timeout?: number) => { 10 | await waitForCurrent((val) => val === value, step, timeout) 11 | } 12 | 13 | return { 14 | waitForCurrent, 15 | waitForCurrentEqual, 16 | } 17 | } 18 | -------------------------------------------------------------------------------- /packages/core/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../tsconfig.json", 3 | "compilerOptions": { 4 | "types": [ 5 | "mocha", 6 | "node" 7 | ], 8 | "target": "ES2018", 9 | "outDir": "dist", 10 | "module": "commonjs", 11 | "composite": true, 12 | "declaration": true, 13 | "sourceMap": true, 14 | "declarationMap": true, 15 | "resolveJsonModule": true, 16 | "skipLibCheck": true, 17 | "moduleResolution": "node", 18 | "isolatedModules": true 19 | }, 20 | "include": [ 21 | "src", 22 | "src/**/*.json", 23 | "internal", 24 | "generate-hooks", 25 | ] 26 | } 27 | -------------------------------------------------------------------------------- /packages/core/tsconfig.test.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "./tsconfig.json", 3 | "compilerOptions": { 4 | "sourceMap": false, 5 | "inlineSourceMap": true 6 | } 7 | } 8 | -------------------------------------------------------------------------------- /packages/docs/.eslintrc.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | extends: [`${__dirname}/../../.eslintrc.json`, 'plugin:react-hooks/recommended'], 3 | } 4 | -------------------------------------------------------------------------------- /packages/docs/.gitignore: -------------------------------------------------------------------------------- 1 | # Dependencies 2 | /node_modules 3 | 4 | # Production 5 | /build 6 | 7 | # Generated files 8 | .docusaurus 9 | .cache-loader 10 | 11 | # Misc 12 | .DS_Store 13 | .env.local 14 | .env.development.local 15 | .env.test.local 16 | .env.production.local 17 | 18 | npm-debug.log* 19 | yarn-debug.log* 20 | yarn-error.log* 21 | 22 | # Auto generated docs 23 | 02-Hooks.mdx 24 | 03-Models.mdx 25 | generate/*.gen.json 26 | 27 | # dotenv files 28 | .env 29 | 30 | # recordings 31 | recordings 32 | -------------------------------------------------------------------------------- /packages/docs/.mocharc.json: -------------------------------------------------------------------------------- 1 | { 2 | "watchExtensions": "ts", 3 | "extension": "ts", 4 | "timeout": 180000, 5 | "file": "./playwright/test-setup.ts" 6 | } 7 | -------------------------------------------------------------------------------- /packages/docs/babel.config.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | presets: [require.resolve('@docusaurus/core/lib/babel/preset')], 3 | }; 4 | -------------------------------------------------------------------------------- /packages/docs/docs/01-Getting Started/03-Writing.mdx: -------------------------------------------------------------------------------- 1 | # Writing 2 | 3 | To write a state-changing transaction to the blockchain, use the [useSendTransaction](/docs/API%20Reference/Hooks#usesendtransaction) hook. 4 | 5 | Simply call a hook in a component: 6 | 7 | ```tsx 8 | const { sendTransaction } = useSendTransaction() 9 | ``` 10 | 11 | Typically you would use the `sendTransaction` in a click button handler: 12 | 13 | ```tsx 14 | const handleClick = () => { 15 | setDisabled(true) 16 | sendTransaction({ to: address, value: utils.parseEther(amount) }) 17 | } 18 | ``` 19 | 20 | See the [Ether Transactions](/docs/Guides/Transactions/Ether%20Transactions) guide for a more in-depth explanation, or take a look at [Contract Functions](/docs/Guides/Transactions/Contract%20Functions) if you are interested in writing transactions to contracts. 21 | -------------------------------------------------------------------------------- /packages/docs/docs/02-Guides/01-Connecting/01-Read-only.mdx: -------------------------------------------------------------------------------- 1 | # Read-only 2 | 3 | To connect to the network in read-only mode, provide ``readOnlyChainId`` and ``readOnlyUrls`` fields in application configuration. 4 | 5 | See example configuration below: 6 | 7 | ```tsx 8 | import { Mainnet } from '@usedapp/core' 9 | 10 | const config = { 11 | readOnlyChainId: Mainnet.chainId, 12 | readOnlyUrls: { 13 | [Mainnet.chainId]: 'https://mainnet.infura.io/v3/62687d1a985d4508b2b7a24827551934', 14 | }, 15 | } 16 | ``` 17 | -------------------------------------------------------------------------------- /packages/docs/docs/02-Guides/02-Reading/03-Handling Falsy.mdx: -------------------------------------------------------------------------------- 1 | # Handling Falsy types 2 | 3 | Hooks in `useDapp` support handling "falsy" values in most parameters. 4 | 5 | ```tsx 6 | export type Falsy = false | 0 | '' | null | undefined 7 | ``` 8 | 9 | If you pass one of these types to a call, it will return `undefined` without making blockchain query. This allows us to conditionally make a call if a parameter is not known ahead of time, without breaking the [Rules of Hooks](https://reactjs.org/docs/hooks-rules.html). 10 | 11 | ## Example 12 | 13 | ```tsx 14 | const {account} = useEthers() // account is of type "string | undefined" 15 | const balance = useEtherBalance(account) // Will start making queries once account is defined 16 | ``` 17 | -------------------------------------------------------------------------------- /packages/docs/docs/02-Guides/02-Reading/assets/multicall.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/docs/docs/02-Guides/02-Reading/assets/multicall.png -------------------------------------------------------------------------------- /packages/docs/docs/02-Guides/03-Transactions/03-Transaction Status.mdx: -------------------------------------------------------------------------------- 1 | # Transaction Status 2 | 3 | After [sending a transaction](./01-Ether%20Transactions.mdx), you can use `state` to check the state of your transaction. 4 | State is of type [TransactionStatus](/docs/API%20Reference/Hooks#transactionstatus). 5 | Example below clears inputs and enables all disabled components back: 6 | 7 | ```tsx 8 | const { sendTransaction, state } = useSendTransaction() 9 | 10 | const handleClick = () => { 11 | setDisabled(true) 12 | sendTransaction({ to: address, value: utils.parseEther(amount) }) 13 | } 14 | 15 | useEffect(() => { 16 | if (state.status != 'Mining') { 17 | setDisabled(false) 18 | setAmount('0') 19 | setAddress('') 20 | } 21 | }, [state]) 22 | ``` 23 | -------------------------------------------------------------------------------- /packages/docs/docs/02-Guides/03-Transactions/04-Replaced Transactions.mdx: -------------------------------------------------------------------------------- 1 | # Replaced Transactions 2 | 3 | If the status is pending you can replace a transaction with increased gas limit to have it mined quicker. To do it just send another transaction with the same nonce as the previous one. The new transaction replaces the previous one. 4 | After replacing a transaction on a wallet, Usedapp will detect this and track the new, replaced transaction. 5 | 6 | ![replacedTransaction](../../images/replacedTransaction.png) 7 | 8 | ## UseDapp behaviour 9 | 10 | UseDapp supports replaced transactions. It detects replacement and shows `Success` when new transaction will be mined. 11 | -------------------------------------------------------------------------------- /packages/docs/docs/02-Guides/07-Migration/01-to-0.12.mdx: -------------------------------------------------------------------------------- 1 | # Migrating to 0.12.* 2 | 3 | ## `useContractCall` is getting replaced by `useCall` 4 | 5 | It is being replaced with `useCall` that supports typed contracts from type-chain. 6 | 7 | Before: 8 | 9 | ```typescript 10 | const [tokenBalance] = 11 | useContractCall({ 12 | abi: ERC20Interface, 13 | address: tokenAddress, 14 | method: 'balanceOf', 15 | args: [address], 16 | }) ?? [] 17 | ``` 18 | 19 | After: 20 | 21 | ```typescript 22 | const { value: tokenBalance } = 23 | useCall({ 24 | contract: new Contract(tokenAddress, ERC20Interface), 25 | method: 'balanceOf', 26 | args: [address], 27 | }) ?? {} 28 | ``` 29 | 30 | ## `useChainCall` is getting replaced by `useRawCall` 31 | 32 | `useRawCall` returns an object in the form of `{ value, error }` for each calls. 33 | This allows to get individual errors for each failing call. 34 | -------------------------------------------------------------------------------- /packages/docs/docs/02-Guides/07-Migration/1.0.7-to-1.0.8.mdx: -------------------------------------------------------------------------------- 1 | # Migrating to 1.0.8 2 | 3 | ## Moved ethers to peer dependencies 4 | 5 | `ethers` is now a peer dependency of `@usedapp/core`, `@usedapp/coingecko` and `@usedapp/siwe`. The packages will use version of the `ethers` package that is installed in your project. If you haven't installed `ethers` yet, you can install it with: 6 | ```bash npm2yarn 7 | npm install ethers 8 | ``` 9 | -------------------------------------------------------------------------------- /packages/docs/docs/03-API Reference/04-Constants.mdx: -------------------------------------------------------------------------------- 1 | # Constants 2 | 3 | ## ChainId 4 | 5 | Enum that represents chain ids. See [ChainList](https://chainlist.org/) for a list of known chains and their IDs. 6 | The list of built-in chain IDs in useDapp can be found [here](https://github.com/TrueFiEng/useDApp/blob/master/packages/core/src/constants/chainId.ts). 7 | 8 | **Values:** 9 | 10 | `Mainnet, Goerli, Kovan, Rinkeby, Ropsten, BSC, Cronos, xDai, Polygon, Moonriver, Moonbeam, Mumbai, OasisEmerald, Harmony, Theta, Palm, Fantom, Avalanche, Songbird, Velas` 11 | -------------------------------------------------------------------------------- /packages/docs/docs/04-Tutorial/01-Introduction.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: Building dApps like a pro! 3 | sidebar_label: Introduction 4 | slug: /Tutorial/ 5 | --- 6 | 7 | Tutorial for both __web2__ and __web3__ developers. 8 | 9 | Create your first dApp today! 🚀 10 | 11 | ## Introduction 12 | 13 | This tutorial will explain the concepts of DApps, connecting and interacting with the blockchain. 14 | 15 | We will go through the common problems of building dApps and through the steps of creating a DApp using the useDApp framework. 16 | 17 | The end effect will be a functioning DApp connecting to a local blockchain node or a testnet, effortlessly reading state from the blockchain and allowing the user to send transactions through a connected Wallet. 18 | 19 | __Ready?__ Let's start by going over the basics of what a DApp is: [What is a DApp](./DApp) 20 | -------------------------------------------------------------------------------- /packages/docs/docs/04-Tutorial/03-DApp Requirements.md: -------------------------------------------------------------------------------- 1 | # DApp Requirements 2 | 3 | We've learned what a DApp is, but let's follow through by defining some universal characteristics of a well functioning DApp. 4 | 5 | A good DApp should: 6 | 7 | - **Be up-to-date** - It should automatically refresh state for each new block (~ every 15 seconds) 8 | - **Have consistent state** - The state we display should be consistently taken from a single block - we should not present information taken from different blocks, in order to avoid inconsistencies or conflicting data 9 | - **Be efficient** - We should not spam the blockchain API provider. Not only would that spike up our bill, but also slow down the app for the user. 10 | 11 | Sounds like work? Not necessarily - [useDApp does it all](./how%20usedapp%20helps%20you) - automatically! 12 | -------------------------------------------------------------------------------- /packages/docs/docs/04-Tutorial/10-Summary.md: -------------------------------------------------------------------------------- 1 | # Summary 2 | 3 | In this tutorial, we have covered the topic of DApp development with the help of the useDApp framework. 4 | 5 | We explained what exactly is a [DApp](./DApp), how it connects to the blockchain and what a requirements of a well functioning DApp might [look like](./Dapp%20Requirements). 6 | 7 | Next, we have went over [setup](./Setup) and [configuration](./Config) of a useDapp-powered DApp. 8 | 9 | Having that, we went on to develop a DApp that connects, reads, and writes state to the blockchain. 10 | 11 | ## Additional help 12 | 13 | We hope that this tutorial has helped you to get started. 14 | 15 | If you have any feature requests or bug reports, you can [create an issue on GitHub](https://github.com/TrueFiEng/useDApp/issues/new/choose). 16 | 17 | You can also ask questions or share insights on [Discord](https://discord.com/invite/cSSmtdq7jr). 18 | 19 | Good luck! 🙂 20 | -------------------------------------------------------------------------------- /packages/docs/docs/04-Tutorial/assets/infura-pricing.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/docs/docs/04-Tutorial/assets/infura-pricing.png -------------------------------------------------------------------------------- /packages/docs/docs/04-Tutorial/assets/starting-page.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/docs/docs/04-Tutorial/assets/starting-page.png -------------------------------------------------------------------------------- /packages/docs/docs/images/developer-tools-abis.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/docs/docs/images/developer-tools-abis.png -------------------------------------------------------------------------------- /packages/docs/docs/images/developer-tools-events.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/docs/docs/images/developer-tools-events.gif -------------------------------------------------------------------------------- /packages/docs/docs/images/developer-tools-names.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/docs/docs/images/developer-tools-names.png -------------------------------------------------------------------------------- /packages/docs/docs/images/developer-tools-overview.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/docs/docs/images/developer-tools-overview.png -------------------------------------------------------------------------------- /packages/docs/docs/images/metamask-switch-network.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/docs/docs/images/metamask-switch-network.png -------------------------------------------------------------------------------- /packages/docs/docs/images/replacedTransaction.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/docs/docs/images/replacedTransaction.png -------------------------------------------------------------------------------- /packages/docs/generate/generate.sh: -------------------------------------------------------------------------------- 1 | #!/usr/bin/env bash 2 | set -euo pipefail 3 | 4 | # Go to root of docs package 5 | cd $(dirname "$0")/.. 6 | 7 | ts-node \ 8 | --project ./tsconfig.node.json \ 9 | ./generate/generate-content.ts 10 | -------------------------------------------------------------------------------- /packages/docs/playwright/constants.ts: -------------------------------------------------------------------------------- 1 | export const baseUrl = 'http://localhost:3000/docs/' 2 | -------------------------------------------------------------------------------- /packages/docs/playwright/sleep.ts: -------------------------------------------------------------------------------- 1 | export const sleep = (ms: number) => new Promise((resolve) => setTimeout(resolve, ms)) 2 | -------------------------------------------------------------------------------- /packages/docs/playwright/test-setup.ts: -------------------------------------------------------------------------------- 1 | import waitForExpect from 'wait-for-expect' 2 | 3 | waitForExpect.defaults.timeout = 90000 4 | -------------------------------------------------------------------------------- /packages/docs/plugins/mdx-anchor-scroll.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Links with hashtags to sections (e.g. https://usedapp-docs.netlify.app/docs/api%20reference/hooks/#useetherbalance) 3 | * Do not properly scroll to linked section, when the page is a MDX. 4 | * 5 | * It only works properly in MD. 6 | * This is a simple workaround to scroll to a linked section on page load. 7 | */ 8 | 9 | module.exports = function (context, options) { 10 | return { 11 | name: 'mdx-anchor-scroll', 12 | injectHtmlTags({content}) { 13 | return { 14 | preBodyTags: [ 15 | { 16 | tagName: 'script', 17 | attributes: { 18 | charset: 'utf-8', 19 | src: '/mdx-anchor-scroll.js', 20 | }, 21 | }, 22 | ] 23 | }; 24 | }, 25 | }; 26 | }; 27 | -------------------------------------------------------------------------------- /packages/docs/prettier.config.js: -------------------------------------------------------------------------------- 1 | module.exports = require('../../.prettierrc.json') 2 | -------------------------------------------------------------------------------- /packages/docs/sidebars.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Creating a sidebar enables you to: 3 | - create an ordered group of docs 4 | - render a sidebar for each doc of that group 5 | - provide next/previous navigation 6 | 7 | The sidebars can be generated from the filesystem, or explicitly defined here. 8 | 9 | Create as many sidebars as you want. 10 | */ 11 | 12 | // @ts-check 13 | 14 | /** @type {import('@docusaurus/plugin-content-docs').SidebarsConfig} */ 15 | const sidebars = { 16 | // By default, Docusaurus generates a sidebar from the docs folder structure 17 | tutorialSidebar: [{type: 'autogenerated', dirName: '.'}], 18 | 19 | // But you can create a sidebar manually 20 | /* 21 | tutorialSidebar: [ 22 | { 23 | type: 'category', 24 | label: 'Tutorial', 25 | items: ['hello'], 26 | }, 27 | ], 28 | */ 29 | }; 30 | 31 | module.exports = sidebars; 32 | -------------------------------------------------------------------------------- /packages/docs/src/examples/CodeWrapper.tsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import CodeBlock from '@theme/CodeBlock' 3 | import './styles/button.module.css' 4 | import './styles/text.module.css' 5 | import './styles/styles.module.css' 6 | 7 | export interface CodeWrapperProps { 8 | title: string 9 | children?: string 10 | } 11 | 12 | export const CodeWrapper = ({ title, children }: CodeWrapperProps) => { 13 | return ( 14 | 15 | {children} 16 | 17 | ) 18 | } 19 | 20 | export default CodeWrapper 21 | -------------------------------------------------------------------------------- /packages/docs/src/examples/EthPrice.tsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import ReactDOM from 'react-dom' 3 | import { useCoingeckoPrice } from '@usedapp/coingecko' 4 | 5 | ReactDOM.render(, document.getElementById('root')) 6 | 7 | export function App() { 8 | const etherPrice = useCoingeckoPrice('ethereum', 'usd') 9 | 10 | return ( 11 |
12 | Ether price: 13 |

{etherPrice} $

14 |
15 | ) 16 | } 17 | -------------------------------------------------------------------------------- /packages/docs/src/examples/WethPrice.tsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import ReactDOM from 'react-dom' 3 | import { useCoingeckoTokenPrice } from '@usedapp/coingecko' 4 | 5 | ReactDOM.render(, document.getElementById('root')) 6 | 7 | export function App() { 8 | const WETH_CONTRACT = '0xc02aaa39b223fe8d0a0e5c4f27ead9083c756cc2' 9 | const wethPrice = useCoingeckoTokenPrice(WETH_CONTRACT, 'usd') 10 | 11 | return ( 12 |
13 | Wrapped ether price: 14 |

{wethPrice} $

15 |
16 | ) 17 | } 18 | -------------------------------------------------------------------------------- /packages/docs/src/examples/components/AccountIcon.tsx: -------------------------------------------------------------------------------- 1 | import Jazzicon from '@metamask/jazzicon' 2 | import { useEthers } from '@usedapp/core' 3 | import React, { useEffect, useRef } from 'react' 4 | 5 | export interface AccountIconProps { 6 | account?: string 7 | } 8 | 9 | export function AccountIcon({ account }: AccountIconProps) { 10 | const size = 20 11 | const borderRadius = '50%' 12 | 13 | const { account: walletAccount } = useEthers() 14 | const address = account ?? walletAccount 15 | 16 | const accountIconRef = useRef(null) 17 | 18 | useEffect(() => { 19 | if (address && accountIconRef.current) { 20 | accountIconRef.current.innerHTML = '' 21 | accountIconRef.current.appendChild(Jazzicon(size, parseInt(address.slice(2, 10), 16))) 22 | } 23 | }, [address, accountIconRef, size]) 24 | 25 | return
26 | } 27 | -------------------------------------------------------------------------------- /packages/docs/src/examples/components/MetamaskConnect.tsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import { useEthers } from '@usedapp/core' 3 | import { AccountIcon } from './AccountIcon' 4 | 5 | export const MetamaskConnect = () => { 6 | const { account, activateBrowserWallet } = useEthers() 7 | 8 | const ConnectButton = () => ( 9 |
10 | 11 |

Connect to wallet to interact with the example.

12 |
13 | ) 14 | 15 | return ( 16 |
17 | {account && ( 18 |
19 |
20 | 21 |   22 |
{account}
23 |
24 |
25 |
26 | )} 27 | {!account && } 28 |
29 | ) 30 | } 31 | -------------------------------------------------------------------------------- /packages/docs/src/examples/styles/styles.module.css: -------------------------------------------------------------------------------- 1 | :global(.account) { 2 | margin-left: 5px; 3 | font-weight: 450; 4 | } 5 | 6 | :global(.balance) { 7 | font-size: 16px; 8 | color: grey; 9 | display: inline-flexbox; 10 | } 11 | 12 | :global(.bold) { 13 | color: black; 14 | font-size: 20px; 15 | } 16 | 17 | :global(.inline) { 18 | display: flex; 19 | } 20 | -------------------------------------------------------------------------------- /packages/docs/src/examples/styles/text.module.css: -------------------------------------------------------------------------------- 1 | p.normal { 2 | padding: 20; 3 | font-weight: bold; 4 | font-family: Helvetica, sans-serif; 5 | font-size: 16px; 6 | font-weight: 400; 7 | } 8 | -------------------------------------------------------------------------------- /packages/docs/src/pages/index.module.css: -------------------------------------------------------------------------------- 1 | /** 2 | * CSS files with the .module.css suffix will be treated as CSS modules 3 | * and scoped locally. 4 | */ 5 | 6 | .heroBanner { 7 | padding: 4rem 0; 8 | text-align: center; 9 | position: relative; 10 | overflow: hidden; 11 | } 12 | 13 | @media screen and (max-width: 996px) { 14 | .heroBanner { 15 | padding: 2rem; 16 | } 17 | } 18 | 19 | .buttons { 20 | display: flex; 21 | align-items: center; 22 | justify-content: center; 23 | } 24 | -------------------------------------------------------------------------------- /packages/docs/src/pages/index.tsx: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import {Redirect} from '@docusaurus/router'; 3 | 4 | export default function Home(): JSX.Element { 5 | return ( 6 | 7 | ); 8 | } 9 | -------------------------------------------------------------------------------- /packages/docs/src/types.d.ts: -------------------------------------------------------------------------------- 1 | /// 2 | /// 3 | 4 | // Copied from @docusaurus/theme-classic/src/theme-classic.d.ts 5 | // For some reason TSC could not pick it up automatically. 6 | declare module '@theme/CodeBlock' { 7 | import type {ReactElement} from 'react'; 8 | 9 | export interface Props { 10 | readonly children: string | ReactElement; 11 | readonly className?: string; 12 | readonly metastring?: string; 13 | readonly title?: string; 14 | readonly language?: string; 15 | } 16 | 17 | export default function CodeBlock(props: Props): JSX.Element; 18 | } 19 | -------------------------------------------------------------------------------- /packages/docs/static/.nojekyll: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/docs/static/.nojekyll -------------------------------------------------------------------------------- /packages/docs/static/img/copy-address.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/docs/static/img/copy-address.gif -------------------------------------------------------------------------------- /packages/docs/static/img/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/docs/static/img/favicon.ico -------------------------------------------------------------------------------- /packages/docs/static/mdx-anchor-scroll.js: -------------------------------------------------------------------------------- 1 | window.addEventListener('load', () => { 2 | if (!window.location.hash) return 3 | const destination = document.querySelector(window.location.hash) 4 | if (destination) { 5 | destination.scrollIntoView() 6 | } 7 | }) 8 | -------------------------------------------------------------------------------- /packages/docs/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | // This file is not used in compilation. It is here just for a nice editor experience. 3 | "extends": "@tsconfig/docusaurus/tsconfig.json", 4 | "compilerOptions": { 5 | "types": [ 6 | "mocha" 7 | ], 8 | "baseUrl": ".", 9 | "skipLibCheck": true 10 | }, 11 | "include": [ 12 | "src", 13 | "playwright" 14 | ], 15 | "references": [ 16 | { 17 | "path": "../coingecko" 18 | }, 19 | { 20 | "path": "../core" 21 | } 22 | ] 23 | } 24 | -------------------------------------------------------------------------------- /packages/docs/tsconfig.node.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "@tsconfig/docusaurus/tsconfig.json", 3 | "compilerOptions": { 4 | "types": [ 5 | "node" 6 | ], 7 | "lib": [ 8 | "es2021" 9 | ], 10 | "baseUrl": "." 11 | } 12 | } 13 | -------------------------------------------------------------------------------- /packages/example-next/.eslintrc.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "next/core-web-vitals" 3 | } 4 | -------------------------------------------------------------------------------- /packages/example-next/.mocharc.json: -------------------------------------------------------------------------------- 1 | { 2 | "require": "@swc-node/register", 3 | "watchExtensions": "ts", 4 | "extension": "ts", 5 | "timeout": 60000, 6 | "file": "./test-setup.ts" 7 | } 8 | -------------------------------------------------------------------------------- /packages/example-next/next-env.d.ts: -------------------------------------------------------------------------------- 1 | /// 2 | /// 3 | 4 | // NOTE: This file should not be edited 5 | // see https://nextjs.org/docs/basic-features/typescript for more information. 6 | -------------------------------------------------------------------------------- /packages/example-next/next.config.js: -------------------------------------------------------------------------------- 1 | /** @type {import('next').NextConfig['webpack']} */ 2 | const webpack = (config, options) => { 3 | config.module.rules.push({ 4 | test: /\.(png|gif|woff|woff2|eot|ttf|svg)$/, 5 | loader: 'url-loader', 6 | }) 7 | 8 | return config 9 | } 10 | 11 | /** @type {import('next').NextConfig} */ 12 | const nextConfig = { 13 | reactStrictMode: true, 14 | webpack, 15 | compiler: { 16 | styledComponents: true, 17 | }, 18 | } 19 | 20 | module.exports = nextConfig 21 | -------------------------------------------------------------------------------- /packages/example-next/pages/_app.tsx: -------------------------------------------------------------------------------- 1 | import '../styles/globals.css' 2 | import type { AppProps } from 'next/app' 3 | import { Providers } from '../providers' 4 | 5 | function MyApp({ Component, pageProps }: AppProps) { 6 | return ( 7 | 8 | 9 | 10 | ) 11 | } 12 | 13 | export default MyApp 14 | -------------------------------------------------------------------------------- /packages/example-next/pages/_middleware.ts: -------------------------------------------------------------------------------- 1 | import { NextRequest, NextResponse } from 'next/server' 2 | 3 | export async function middleware(req: NextRequest) { 4 | const { pathname, origin } = req.nextUrl 5 | 6 | if (pathname == '/') { 7 | return NextResponse.redirect(`${origin}/balance`) 8 | } 9 | 10 | return NextResponse.next() 11 | } 12 | -------------------------------------------------------------------------------- /packages/example-next/pages/assets.d.ts: -------------------------------------------------------------------------------- 1 | declare module '*.svg' { 2 | const url: string 3 | export default url 4 | } 5 | 6 | declare module '*.jpg' { 7 | const url: string 8 | export default url 9 | } 10 | 11 | declare module '*.png' { 12 | const url: string 13 | export default url 14 | } 15 | 16 | declare module '*.ttf' { 17 | const url: string 18 | export default url 19 | } 20 | 21 | declare module '*.woff' { 22 | const url: string 23 | export default url 24 | } 25 | 26 | declare module '*.woff2' { 27 | const url: string 28 | export default url 29 | } 30 | 31 | declare module '*.eot' { 32 | const url: string 33 | export default url 34 | } 35 | -------------------------------------------------------------------------------- /packages/example-next/pages/balance/index.tsx: -------------------------------------------------------------------------------- 1 | import { Balance } from '@usedapp/example' 2 | 3 | export default function Index() { 4 | return 5 | } 6 | -------------------------------------------------------------------------------- /packages/example-next/pages/block/index.tsx: -------------------------------------------------------------------------------- 1 | import { Block } from '@usedapp/example' 2 | 3 | export default function Index() { 4 | return 5 | } 6 | -------------------------------------------------------------------------------- /packages/example-next/pages/connectors/index.tsx: -------------------------------------------------------------------------------- 1 | import { ConnectorPage } from '@usedapp/example' 2 | 3 | export default function Index() { 4 | return 5 | } 6 | -------------------------------------------------------------------------------- /packages/example-next/pages/ens/index.tsx: -------------------------------------------------------------------------------- 1 | import { ENSExample } from '@usedapp/example' 2 | import React from 'react' 3 | 4 | export default function Index() { 5 | return 6 | } 7 | -------------------------------------------------------------------------------- /packages/example-next/pages/multichain/index.tsx: -------------------------------------------------------------------------------- 1 | import { Multichain } from '@usedapp/example' 2 | 3 | export default function Index() { 4 | return 5 | } 6 | -------------------------------------------------------------------------------- /packages/example-next/pages/prices/index.tsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import { Prices } from '@usedapp/example' 3 | 4 | export default function Index() { 5 | return 6 | } 7 | -------------------------------------------------------------------------------- /packages/example-next/pages/send/index.tsx: -------------------------------------------------------------------------------- 1 | import { SendEtherPage } from '@usedapp/example' 2 | 3 | export default function Index() { 4 | return 5 | } 6 | -------------------------------------------------------------------------------- /packages/example-next/pages/tokens/index.tsx: -------------------------------------------------------------------------------- 1 | import { Tokens } from '@usedapp/example' 2 | 3 | export default function Index() { 4 | return 5 | } 6 | -------------------------------------------------------------------------------- /packages/example-next/pages/transactions/index.tsx: -------------------------------------------------------------------------------- 1 | import { Transactions } from '@usedapp/example' 2 | 3 | export default function Index() { 4 | return 5 | } 6 | -------------------------------------------------------------------------------- /packages/example-next/pages/web3modal/index.tsx: -------------------------------------------------------------------------------- 1 | import { Web3Modal } from '@usedapp/example' 2 | 3 | export default function Index() { 4 | return 5 | } 6 | -------------------------------------------------------------------------------- /packages/example-next/pages/web3react/index.tsx: -------------------------------------------------------------------------------- 1 | import { Web3ReactConnector } from '@usedapp/example' 2 | 3 | export default function Index() { 4 | return 5 | } 6 | -------------------------------------------------------------------------------- /packages/example-next/playwright.setup.js: -------------------------------------------------------------------------------- 1 | const chai = require('chai') 2 | const { supportBigNumber } = require('@usedapp/testing') 3 | 4 | chai.use((chai, utils) => { 5 | supportBigNumber(chai.Assertion, utils) 6 | }) 7 | -------------------------------------------------------------------------------- /packages/example-next/playwright/constants.ts: -------------------------------------------------------------------------------- 1 | export const baseUrl = 'http://localhost:3000/' 2 | -------------------------------------------------------------------------------- /packages/example-next/playwright/imported.test.ts: -------------------------------------------------------------------------------- 1 | import { withMetamaskTest } from '@usedapp/example/playwright/with-metamask' 2 | import { withoutMetamaskTest } from '@usedapp/example/playwright/without-metamask' 3 | import { baseUrl } from './constants' 4 | 5 | withMetamaskTest(baseUrl) 6 | withoutMetamaskTest(baseUrl) 7 | -------------------------------------------------------------------------------- /packages/example-next/providers/Layout.tsx: -------------------------------------------------------------------------------- 1 | import { GlobalStyle, NotificationsList, Page } from '@usedapp/example' 2 | import { ReactNode } from 'react' 3 | import { NavBar } from '../components/NavBar' 4 | 5 | export function Layout({ children }: { children: ReactNode }) { 6 | return ( 7 | 8 | 9 | 10 | {children} 11 | 12 | 13 | ) 14 | } 15 | -------------------------------------------------------------------------------- /packages/example-next/providers/index.tsx: -------------------------------------------------------------------------------- 1 | export { Providers } from './Providers' 2 | -------------------------------------------------------------------------------- /packages/example-next/public/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/example-next/public/favicon.ico -------------------------------------------------------------------------------- /packages/example-next/styles/globals.css: -------------------------------------------------------------------------------- 1 | html, 2 | body { 3 | padding: 0; 4 | margin: 0; 5 | font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Oxygen, 6 | Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue, sans-serif; 7 | } 8 | 9 | a { 10 | color: inherit; 11 | text-decoration: none; 12 | } 13 | 14 | * { 15 | box-sizing: border-box; 16 | } 17 | -------------------------------------------------------------------------------- /packages/example-next/test-setup.ts: -------------------------------------------------------------------------------- 1 | import chai from 'chai' 2 | import chaiAsPromised from 'chai-as-promised' 3 | 4 | chai.use(chaiAsPromised) 5 | 6 | let jsdomCleanup: any 7 | before(() => { 8 | // eslint-disable-next-line @typescript-eslint/no-var-requires 9 | jsdomCleanup = require('jsdom-global')(undefined, { url: 'http://localhost/' }) 10 | }) 11 | after(() => jsdomCleanup?.()) 12 | -------------------------------------------------------------------------------- /packages/example-next/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "lib": ["dom", "dom.iterable", "esnext"], 4 | "types": [ 5 | "mocha" 6 | ], 7 | "module": "commonjs", 8 | "target": "ES2018", 9 | "allowJs": true, 10 | "skipLibCheck": true, 11 | "strict": true, 12 | "forceConsistentCasingInFileNames": true, 13 | "noEmit": true, 14 | "esModuleInterop": true, 15 | "moduleResolution": "node", 16 | "resolveJsonModule": true, 17 | "isolatedModules": true, 18 | "jsx": "preserve", 19 | "incremental": true 20 | }, 21 | "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx"], 22 | "exclude": ["node_modules", "playwright"] 23 | } 24 | -------------------------------------------------------------------------------- /packages/example/.eslintrc.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | extends: [`${__dirname}/../../.eslintrc.json`], 3 | parserOptions: { 4 | sourceType: 'module', 5 | }, 6 | } 7 | -------------------------------------------------------------------------------- /packages/example/.gitignore: -------------------------------------------------------------------------------- 1 | .build 2 | .pnpm-debug.log 3 | build 4 | web_modules 5 | node_modules 6 | gen 7 | -------------------------------------------------------------------------------- /packages/example/.mocharc.json: -------------------------------------------------------------------------------- 1 | { 2 | "require": "@swc-node/register", 3 | "watchExtensions": "ts", 4 | "extension": "ts", 5 | "timeout": 60000, 6 | "file": "./test/test-setup.ts" 7 | } 8 | -------------------------------------------------------------------------------- /packages/example/playwright.setup.js: -------------------------------------------------------------------------------- 1 | const chai = require('chai') 2 | const { supportBigNumber } = require('@usedapp/testing') 3 | 4 | chai.use((chai, utils) => { 5 | supportBigNumber(chai.Assertion, utils) 6 | }) 7 | -------------------------------------------------------------------------------- /packages/example/playwright/with-metamask.test.ts: -------------------------------------------------------------------------------- 1 | import { withMetamaskTest } from './with-metamask' 2 | import { baseUrl } from './constants' 3 | 4 | withMetamaskTest(baseUrl) 5 | -------------------------------------------------------------------------------- /packages/example/playwright/without-metamask.test.ts: -------------------------------------------------------------------------------- 1 | import { baseUrl } from './constants' 2 | import { withoutMetamaskTest } from './without-metamask' 3 | 4 | withoutMetamaskTest(baseUrl) 5 | -------------------------------------------------------------------------------- /packages/example/prettier.config.js: -------------------------------------------------------------------------------- 1 | module.exports = require('../../.prettierrc.json') 2 | -------------------------------------------------------------------------------- /packages/example/src/_redirects: -------------------------------------------------------------------------------- 1 | /* /index.html 200 2 | -------------------------------------------------------------------------------- /packages/example/src/assets/assets.d.ts: -------------------------------------------------------------------------------- 1 | declare module '*.svg' { 2 | const url: string 3 | export default url 4 | } 5 | 6 | declare module '*.jpg' { 7 | const url: string 8 | export default url 9 | } 10 | 11 | declare module '*.png' { 12 | const url: string 13 | export default url 14 | } 15 | 16 | declare module '*.ttf' { 17 | const url: string 18 | export default url 19 | } 20 | 21 | declare module '*.woff' { 22 | const url: string 23 | export default url 24 | } 25 | 26 | declare module '*.woff2' { 27 | const url: string 28 | export default url 29 | } 30 | 31 | declare module '*.eot' { 32 | const url: string 33 | export default url 34 | } 35 | -------------------------------------------------------------------------------- /packages/example/src/assets/fonts/HelveticaNeue.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/example/src/assets/fonts/HelveticaNeue.woff2 -------------------------------------------------------------------------------- /packages/example/src/assets/fonts/HelveticaNeueBold.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/example/src/assets/fonts/HelveticaNeueBold.woff2 -------------------------------------------------------------------------------- /packages/example/src/assets/fonts/HelveticaNeueMedium.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/example/src/assets/fonts/HelveticaNeueMedium.woff2 -------------------------------------------------------------------------------- /packages/example/src/assets/images/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/example/src/assets/images/favicon.ico -------------------------------------------------------------------------------- /packages/example/src/assets/images/unknown-token.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/example/src/assets/images/unknown-token.png -------------------------------------------------------------------------------- /packages/example/src/components/TokenList/TokenIcon.tsx: -------------------------------------------------------------------------------- 1 | import React, { useState } from 'react' 2 | import styled from 'styled-components' 3 | import { toHttpPath } from '../../utils' 4 | import { BorderRad } from '../../global/styles' 5 | 6 | export function TokenIcon({ src, alt }: { src: string; alt: string }) { 7 | const [isIconError, setIconError] = useState(false) 8 | 9 | return ( 10 | <> 11 | {isIconError ? ( 12 | '🤷‍♂️' 13 | ) : ( 14 | { 18 | setIconError(true) 19 | }} 20 | /> 21 | )} 22 | 23 | ) 24 | } 25 | 26 | const Icon = styled.img` 27 | width: 100%; 28 | height: 100%; 29 | object-fit: contain; 30 | border-radius: ${BorderRad.round}; 31 | overflow: hidden; 32 | ` 33 | -------------------------------------------------------------------------------- /packages/example/src/components/Transactions/Icons/SpinnerIcon.tsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import styled from 'styled-components' 3 | 4 | export const SpinnerIcon = () => ( 5 | 6 | 7 | 8 | ) 9 | 10 | const Svg = styled.svg` 11 | animation: 1s linear infinite svg-animation; 12 | 13 | @keyframes svg-animation { 14 | 0% { 15 | transform: rotateZ(0deg); 16 | } 17 | 100% { 18 | transform: rotateZ(360deg); 19 | } 20 | } 21 | ` 22 | 23 | const Circle = styled.circle` 24 | fill: transparent; 25 | stroke: currentColor; 26 | stroke-linecap: round; 27 | stroke-dasharray: 280; 28 | stroke-dashoffset: 100; 29 | stroke-width: 8px; 30 | ` 31 | -------------------------------------------------------------------------------- /packages/example/src/components/Transactions/Icons/UnwrapIcon.tsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | 3 | export const UnwrapIcon = () => ( 4 | 5 | 11 | 12 | ) 13 | -------------------------------------------------------------------------------- /packages/example/src/components/Transactions/Icons/index.ts: -------------------------------------------------------------------------------- 1 | export { CheckIcon } from './CheckIcon' 2 | export { ClockIcon } from './ClockIcon' 3 | export { ExclamationIcon } from './ExclamationIcon' 4 | export { ShareIcon } from './ShareIcon' 5 | export { SpinnerIcon } from './SpinnerIcon' 6 | export { UnwrapIcon } from './UnwrapIcon' 7 | export { WalletIcon } from './WalletIcon' 8 | export { WrapIcon } from './WrapIcon' 9 | -------------------------------------------------------------------------------- /packages/example/src/components/base/Button.tsx: -------------------------------------------------------------------------------- 1 | import styled from 'styled-components' 2 | import { BorderRad, Colors, Fonts, Transitions } from '../../global/styles' 3 | 4 | export const Button = styled.button` 5 | display: grid; 6 | grid-auto-flow: column; 7 | grid-column-gap: 8px; 8 | align-items: center; 9 | width: fit-content; 10 | min-width: 160px; 11 | height: 40px; 12 | font-family: ${Fonts.Helvetica}; 13 | font-size: 14px; 14 | line-height: 24px; 15 | font-weight: 700; 16 | text-transform: uppercase; 17 | letter-spacing: 0.1em; 18 | color: ${Colors.Black[900]}; 19 | border: 1px solid ${Colors.Black[900]}; 20 | border-radius: ${BorderRad.m}; 21 | background-color: transparent; 22 | cursor: pointer; 23 | transition: ${Transitions.all}; 24 | 25 | &:hover, 26 | &:focus { 27 | background-color: ${Colors.Black[900]}; 28 | color: ${Colors.Yellow[100]}; 29 | } 30 | ` 31 | -------------------------------------------------------------------------------- /packages/example/src/components/base/Link.tsx: -------------------------------------------------------------------------------- 1 | import styled from 'styled-components' 2 | import { Colors, Transitions } from '../../global/styles' 3 | 4 | export const Link = styled.a` 5 | display: flex; 6 | align-items: center; 7 | gap: 4px; 8 | font-size: 12px; 9 | text-decoration: underline; 10 | color: ${Colors.Gray['600']}; 11 | cursor: pointer; 12 | transition: ${Transitions.all}; 13 | 14 | &:hover, 15 | &:focus-within { 16 | color: ${Colors.Yellow[500]}; 17 | } 18 | ` 19 | -------------------------------------------------------------------------------- /packages/example/src/components/base/MenuIcon.tsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | 3 | export const MenuIcon = () => ( 4 | 5 | 6 | 7 | 8 | 9 | ) 10 | -------------------------------------------------------------------------------- /packages/example/src/index.tsx: -------------------------------------------------------------------------------- 1 | export { App } from './App' 2 | export * from './pages' 3 | export { 4 | Sidebar, 5 | SidebarLinkDescription, 6 | SidebarNav, 7 | SidebarNavLinks, 8 | ToMain, 9 | ToMainBottom, 10 | Handshaking, 11 | Page, 12 | SidebarContainer, 13 | MenuIconContainer, 14 | SidebarMenuIconContainer, 15 | } from './components/base/base' 16 | export { MenuIcon } from './components/base/MenuIcon' 17 | export { ENSExample } from './components/ENS/ENSExample' 18 | export { GlobalStyle } from './global/GlobalStyle' 19 | export * from './global/styles' 20 | export { NotificationsList } from './components/Transactions/History' 21 | -------------------------------------------------------------------------------- /packages/example/src/pages/ConnectorsPage.tsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import { Container, MainContent, Section } from '../components/base/base' 3 | import { SingleConnector } from '../components/connectors/SingleConnector' 4 | import { useConfig } from '@usedapp/core' 5 | 6 | export const ConnectorPage = () => { 7 | const { connectors } = useConfig() 8 | 9 | return ( 10 | <> 11 | 12 | 13 |
14 | {Object.entries(connectors).map(([name, connector]) => ( 15 | 16 | ))} 17 |
18 | 19 | 20 | 21 | ) 22 | } 23 | -------------------------------------------------------------------------------- /packages/example/src/pages/SendEtherPage.tsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import { AccountButton } from '../components/account/AccountButton' 3 | import { Container, MainContent, Section, SectionRow } from '../components/base/base' 4 | import { SendEthForm } from '../components/SendEthForm/SendEthForm' 5 | import { Title } from '../typography/Title' 6 | 7 | export const SendEtherPage = () => { 8 | return ( 9 | 10 | 11 |
12 | 13 | Send Ether 14 | 15 | 16 | 17 |
18 | 19 | 20 | ) 21 | } 22 | -------------------------------------------------------------------------------- /packages/example/src/pages/Tokens.tsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import styled from 'styled-components' 3 | import { Container, ContentBlock, MainContent, Section, SectionRow } from '../components/base/base' 4 | import { TokenList } from '../components/TokenList/TokenList' 5 | import { Title } from '../typography/Title' 6 | 7 | import { AccountButton } from '../components/account/AccountButton' 8 | 9 | export function Tokens() { 10 | return ( 11 | 12 | 13 |
14 | 15 | Tokens 16 | 17 | 18 | 19 | 20 | 21 |
22 | 23 | 24 | ) 25 | } 26 | 27 | const TokensContentBlock = styled(ContentBlock)` 28 | padding: 16px 32px; 29 | ` 30 | -------------------------------------------------------------------------------- /packages/example/src/pages/index.tsx: -------------------------------------------------------------------------------- 1 | export * from './Balance' 2 | export * from './Block' 3 | export * from './Multichain' 4 | export * from './Prices' 5 | export * from './SendEtherPage' 6 | export * from './Tokens' 7 | export * from './Transactions' 8 | export * from './Web3Modal' 9 | export * from './Web3ReactConnector' 10 | export * from './ConnectorsPage' 11 | -------------------------------------------------------------------------------- /packages/example/src/typography/Label.tsx: -------------------------------------------------------------------------------- 1 | import styled from 'styled-components' 2 | 3 | export const Label = styled.span` 4 | font-size: 14px; 5 | line-height: 20px; 6 | font-weight: 700; 7 | ` 8 | -------------------------------------------------------------------------------- /packages/example/src/typography/Text.tsx: -------------------------------------------------------------------------------- 1 | import styled from 'styled-components' 2 | 3 | export const Text = styled.p` 4 | font-size: 14px; 5 | line-height: 20px; 6 | font-weight: 400; 7 | ` 8 | 9 | export const TextInline = styled.span` 10 | font-size: 14px; 11 | line-height: 20px; 12 | font-weight: 400; 13 | ` 14 | 15 | export const TextBold = styled(Text)` 16 | font-weight: 700; 17 | ` 18 | -------------------------------------------------------------------------------- /packages/example/src/typography/Title.tsx: -------------------------------------------------------------------------------- 1 | import styled from 'styled-components' 2 | 3 | export const Title = styled.h1` 4 | font-weight: 700; 5 | margin-bottom: 24px; 6 | ` 7 | -------------------------------------------------------------------------------- /packages/example/src/utils/index.ts: -------------------------------------------------------------------------------- 1 | export * from './toHttpPath' 2 | -------------------------------------------------------------------------------- /packages/example/src/utils/toHttpPath.ts: -------------------------------------------------------------------------------- 1 | export function toHttpPath(src: string) { 2 | return src.startsWith('ipfs') ? src.replace('ipfs://', 'https://ipfs.io/ipfs/') : src 3 | } 4 | -------------------------------------------------------------------------------- /packages/example/test/test-setup.ts: -------------------------------------------------------------------------------- 1 | import chai from 'chai' 2 | import chaiAsPromised from 'chai-as-promised' 3 | 4 | chai.use(chaiAsPromised) 5 | 6 | let jsdomCleanup: any 7 | before(() => { 8 | // eslint-disable-next-line @typescript-eslint/no-var-requires 9 | jsdomCleanup = require('jsdom-global')(undefined, { url: 'http://localhost/' }) 10 | }) 11 | after(() => jsdomCleanup?.()) 12 | -------------------------------------------------------------------------------- /packages/example/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "include": [ 3 | "src", 4 | "types", 5 | "playwright", 6 | "test" 7 | ], 8 | "compilerOptions": { 9 | "outDir": "dist", 10 | "types": [ 11 | "mocha" 12 | ], 13 | "module": "commonjs", 14 | "target": "ES2018", 15 | "moduleResolution": "node", 16 | "esModuleInterop": true, 17 | "jsx": "react-jsx", 18 | "declaration": true, 19 | "baseUrl": "./", 20 | "strict": true, 21 | "skipLibCheck": true, 22 | "forceConsistentCasingInFileNames": true, 23 | "resolveJsonModule": true, 24 | "allowSyntheticDefaultImports": true 25 | }, 26 | "references": [ 27 | { 28 | "path": "../core" 29 | }, 30 | { 31 | "path": "../coingecko" 32 | } 33 | ] 34 | } 35 | -------------------------------------------------------------------------------- /packages/extension/.eslintrc.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | extends: [`${__dirname}/../../.eslintrc.json`], 3 | } 4 | -------------------------------------------------------------------------------- /packages/extension/.gitignore: -------------------------------------------------------------------------------- 1 | .build 2 | build 3 | web_modules 4 | node_modules -------------------------------------------------------------------------------- /packages/extension/.mocharc.json: -------------------------------------------------------------------------------- 1 | { 2 | "spec": "src/**/*.test.{ts,tsx}", 3 | "require": "@swc-node/register", 4 | "watchExtensions": "ts", 5 | "extension": "ts", 6 | "timeout": 3000 7 | } 8 | -------------------------------------------------------------------------------- /packages/extension/.prettierignore: -------------------------------------------------------------------------------- 1 | build 2 | -------------------------------------------------------------------------------- /packages/extension/.storybook/main.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | stories: ['../src/**/*.stories.mdx', '../src/**/*.stories.@(js|jsx|ts|tsx)'], 3 | addons: ['@storybook/addon-links', '@storybook/addon-essentials'], 4 | } 5 | -------------------------------------------------------------------------------- /packages/extension/.storybook/preview-head.html: -------------------------------------------------------------------------------- 1 | 2 | -------------------------------------------------------------------------------- /packages/extension/.storybook/preview.js: -------------------------------------------------------------------------------- 1 | export const parameters = { 2 | actions: { argTypesRegex: '^on[A-Z].*' }, 3 | controls: { 4 | matchers: { 5 | color: /(background|color)$/i, 6 | date: /Date$/, 7 | }, 8 | }, 9 | } 10 | -------------------------------------------------------------------------------- /packages/extension/CHANGELOG.md: -------------------------------------------------------------------------------- 1 | # @usedapp/extension 2 | 3 | ## 1.0.0 4 | 5 | ### Major Changes 6 | 7 | - 0d2368a: 1.0.0 release 8 | 9 | ### Patch Changes 10 | 11 | - 28287db: 🔝 Update ethers to 5.6.2 12 | 13 | ## 0.3.1 14 | 15 | ### Patch Changes 16 | 17 | - 378177c: Fetching state from multiple chains simultaneously 18 | - ad021b0: Use pnpm instead of yarn 19 | 20 | ## 0.3.0 21 | 22 | ### Minor Changes 23 | 24 | - fd8e924: Remove @web3-react dependency, introduce own way of provider management 25 | 26 | ## 0.2.0 27 | 28 | ### Minor Changes 29 | 30 | - ece010c: Support Node LTS v14 and v16, abandon v10 and v12 31 | 32 | ## 0.1.1 33 | 34 | ### Patch Changes 35 | 36 | - b0114b5: Bump ethers version 37 | -------------------------------------------------------------------------------- /packages/extension/prettier.config.js: -------------------------------------------------------------------------------- 1 | module.exports = require('../../.prettierrc.json') 2 | -------------------------------------------------------------------------------- /packages/extension/screenshots/abis.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/extension/screenshots/abis.png -------------------------------------------------------------------------------- /packages/extension/screenshots/events.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/extension/screenshots/events.png -------------------------------------------------------------------------------- /packages/extension/screenshots/nameTags.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/extension/screenshots/nameTags.png -------------------------------------------------------------------------------- /packages/extension/src/connect.ts: -------------------------------------------------------------------------------- 1 | /* global chrome */ 2 | 3 | const NO_OP = () => { 4 | // do nothing 5 | } 6 | 7 | export function connect() { 8 | if (!window.chrome) { 9 | return { 10 | init: NO_OP, 11 | listen: () => NO_OP, 12 | send: NO_OP, 13 | } 14 | } 15 | const port = chrome.runtime.connect({ 16 | name: 'usedapp-panel-' + chrome.devtools.inspectedWindow.tabId, 17 | }) 18 | return { 19 | init() { 20 | this.send('replay') 21 | }, 22 | listen(fn: (message: any) => void) { 23 | port.onMessage.addListener(fn) 24 | return () => { 25 | port.onMessage.removeListener(fn) 26 | } 27 | }, 28 | send(message: any) { 29 | port.postMessage({ source: 'usedapp-panel', payload: message }) 30 | }, 31 | } 32 | } 33 | -------------------------------------------------------------------------------- /packages/extension/src/design.ts: -------------------------------------------------------------------------------- 1 | export const Font = { 2 | Body: "'Source Sans Pro', sans-serif", 3 | Code: "'Source Code Pro', monospace", 4 | } 5 | 6 | export const Colors = { 7 | Background: 'white', 8 | Background2: '#efefef', 9 | Border: '#efefef', 10 | Border2: '#d9d9d9', 11 | Hover: '#f7f7f7', 12 | Selected: '#eaf3ff', 13 | SelectedBorder: '#1d16ff', 14 | Link: '#1d16ff', 15 | Added: '#12c112', 16 | Removed: '#d72626', 17 | Error: '#d72626', 18 | Text: 'black', 19 | TextInverted: 'white', 20 | Text2: '#555', 21 | Network: { 22 | Mainnet: '#29b6af', 23 | Ropsten: '#ff4a8d', 24 | Rinkeby: '#f6c343', 25 | Goerli: '#3099f2', 26 | Kovan: '#9064ff', 27 | xDai: '#16304f', 28 | Localhost: '#d6d9dc', 29 | Hardhat: '#fff100', 30 | Other: '#752d7b', 31 | }, 32 | } 33 | -------------------------------------------------------------------------------- /packages/extension/src/hooks/index.ts: -------------------------------------------------------------------------------- 1 | export * from './useEvents' 2 | export * from './useAbi' 3 | export * from './useNameTag' 4 | export * from './useStorage' 5 | -------------------------------------------------------------------------------- /packages/extension/src/hooks/useAbi.ts: -------------------------------------------------------------------------------- 1 | import { useContext } from 'react' 2 | import { AbiContext } from '../providers/abi/AbiProvider' 3 | 4 | export function useUserAbis() { 5 | const { userAbis, setUserAbis } = useContext(AbiContext) 6 | return [userAbis, setUserAbis] as const 7 | } 8 | 9 | export function useAbiParser(selector: string) { 10 | return useContext(AbiContext).parser.get(selector) 11 | } 12 | -------------------------------------------------------------------------------- /packages/extension/src/hooks/useEvents.ts: -------------------------------------------------------------------------------- 1 | import { useContext } from 'react' 2 | import { EventContext } from '../providers/events/EventProvider' 3 | 4 | export function useEvents() { 5 | return useContext(EventContext) 6 | } 7 | -------------------------------------------------------------------------------- /packages/extension/src/hooks/useNameTag.ts: -------------------------------------------------------------------------------- 1 | import { useContext } from 'react' 2 | import { NameTagsContext } from '../providers/nameTags/NameTagsProvider' 3 | 4 | export function useNameTags() { 5 | const { nameTags, setNameTags } = useContext(NameTagsContext) 6 | return [nameTags, setNameTags] as const 7 | } 8 | 9 | export function useNameTag(address: string) { 10 | return useContext(NameTagsContext).getNameTag(address) 11 | } 12 | -------------------------------------------------------------------------------- /packages/extension/src/index.tsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import ReactDOM from 'react-dom' 3 | import { Providers } from './providers/Providers' 4 | import { App } from './views/App' 5 | 6 | ReactDOM.render( 7 | 8 | 9 | 10 | 11 | , 12 | document.getElementById('root') 13 | ) 14 | -------------------------------------------------------------------------------- /packages/extension/src/providers/GlobalStyle.ts: -------------------------------------------------------------------------------- 1 | import { createGlobalStyle } from 'styled-components' 2 | import { Colors, Font } from '../design' 3 | 4 | export const GlobalStyle = createGlobalStyle` 5 | * { 6 | box-sizing: border-box; 7 | } 8 | 9 | html, 10 | body, 11 | #root { 12 | margin: 0; 13 | width: 100%; 14 | height: 100%; 15 | font-family: ${Font.Body}; 16 | background-color: ${Colors.Background}; 17 | color: ${Colors.Text}; 18 | font-size: 16px; 19 | line-height: 1; 20 | } 21 | ` 22 | -------------------------------------------------------------------------------- /packages/extension/src/providers/Providers.tsx: -------------------------------------------------------------------------------- 1 | import React, { ReactNode } from 'react' 2 | import { EventProvider } from './events/EventProvider' 3 | import { AbiProvider } from './abi/AbiProvider' 4 | import { GlobalStyle } from './GlobalStyle' 5 | import { NameTagsProvider } from './nameTags/NameTagsProvider' 6 | 7 | interface Props { 8 | children: ReactNode 9 | } 10 | 11 | export function Providers({ children }: Props) { 12 | return ( 13 | 14 | 15 | 16 | 17 | {children} 18 | 19 | 20 | 21 | ) 22 | } 23 | -------------------------------------------------------------------------------- /packages/extension/src/providers/events/reducer/blockNumberChanged.ts: -------------------------------------------------------------------------------- 1 | import type { BlockNumberChangedPayload, HookMessage } from '../Message' 2 | import type { State } from '../State' 3 | import { chainIdToNetwork } from './chainIdToNetwork' 4 | import { offsetToTime } from './time' 5 | 6 | export function blockNumberChanged(state: State, message: HookMessage): State { 7 | return { 8 | ...state, 9 | events: [ 10 | ...state.events, 11 | { 12 | type: 'BLOCK_FOUND', 13 | network: chainIdToNetwork(message.payload.chainId), 14 | time: offsetToTime(state.initTimestamp, message.timestamp), 15 | blockNumber: message.payload.blockNumber, 16 | }, 17 | ], 18 | } 19 | } 20 | -------------------------------------------------------------------------------- /packages/extension/src/providers/events/reducer/chainIdToNetwork.ts: -------------------------------------------------------------------------------- 1 | export function chainIdToNetwork(chainId: number) { 2 | switch (chainId) { 3 | case 1: 4 | return 'Mainnet' 5 | case 3: 6 | return 'Ropsten' 7 | case 4: 8 | return 'Rinkeby' 9 | case 5: 10 | return 'Goerli' 11 | case 42: 12 | return 'Kovan' 13 | case 100: 14 | return 'xDai' 15 | case 1337: 16 | return 'Localhost' 17 | case 31337: 18 | return 'Hardhat' 19 | default: 20 | return chainId.toString() 21 | } 22 | } 23 | -------------------------------------------------------------------------------- /packages/extension/src/providers/events/reducer/genericError.ts: -------------------------------------------------------------------------------- 1 | import type { GenericErrorPayload, HookMessage } from '../Message' 2 | import type { State } from '../State' 3 | import { offsetToTime } from './time' 4 | 5 | export function genericError(state: State, message: HookMessage): State { 6 | return { 7 | ...state, 8 | events: [ 9 | ...state.events, 10 | { 11 | type: 'ERROR', 12 | time: offsetToTime(state.initTimestamp, message.timestamp), 13 | error: message.payload.error, 14 | }, 15 | ], 16 | } 17 | } 18 | -------------------------------------------------------------------------------- /packages/extension/src/providers/events/reducer/index.ts: -------------------------------------------------------------------------------- 1 | export * from './reducer' 2 | -------------------------------------------------------------------------------- /packages/extension/src/providers/events/reducer/init.ts: -------------------------------------------------------------------------------- 1 | import type { HookMessage, InitPayload } from '../Message' 2 | import type { State } from '../State' 3 | import { INITIAL_STATE } from './reducer' 4 | import { timestampToTime } from './time' 5 | 6 | export function init(state: State, message: HookMessage): State { 7 | return { 8 | ...INITIAL_STATE, 9 | initTimestamp: message.timestamp, 10 | events: [ 11 | { 12 | type: 'INIT', 13 | time: timestampToTime(message.timestamp), 14 | }, 15 | ], 16 | } 17 | } 18 | -------------------------------------------------------------------------------- /packages/extension/src/providers/events/reducer/multicallError.ts: -------------------------------------------------------------------------------- 1 | import type { HookMessage, MulticallErrorPayload } from '../Message' 2 | import type { State } from '../State' 3 | import { chainIdToNetwork } from './chainIdToNetwork' 4 | import { offsetToTime } from './time' 5 | 6 | export function multicallError(state: State, message: HookMessage): State { 7 | return { 8 | ...state, 9 | events: [ 10 | ...state.events, 11 | { 12 | type: 'FETCH_ERROR', 13 | time: offsetToTime(state.initTimestamp, message.timestamp), 14 | blockNumber: message.payload.blockNumber, 15 | duration: message.payload.duration, 16 | multicallAddress: message.payload.multicallAddress, 17 | network: chainIdToNetwork(message.payload.chainId), 18 | calls: message.payload.calls, 19 | error: message.payload.error, 20 | }, 21 | ], 22 | } 23 | } 24 | -------------------------------------------------------------------------------- /packages/extension/src/stories/args.ts: -------------------------------------------------------------------------------- 1 | export const NETWORK_ARGTYPE = { 2 | options: ['Mainnet', 'Ropsten', 'Rinkeby', 'Goerli', 'Kovan', 'xDai', 'Localhost', 'Hardhat', 'Other'], 3 | control: { 4 | type: 'select', 5 | }, 6 | } 7 | -------------------------------------------------------------------------------- /packages/extension/src/stories/components/EventPreview/AccountConnected.stories.tsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import type { Story, Meta } from '@storybook/react' 3 | 4 | import { GlobalStyle } from '../../../providers/GlobalStyle' 5 | import { AccountConnectedPreview } from '../../../views/Events/EventPreview/AccountConnectedPreview' 6 | 7 | export default { 8 | title: 'Components/EventPreview/Account Connected', 9 | } as Meta 10 | 11 | export const AccountConnected: Story = () => ( 12 | <> 13 | 14 | 21 | 22 | ) 23 | AccountConnected.parameters = { 24 | controls: { hideNoControlsWarning: true }, 25 | } 26 | -------------------------------------------------------------------------------- /packages/extension/src/stories/components/EventPreview/AccountDisconnected.stories.tsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import type { Story, Meta } from '@storybook/react' 3 | 4 | import { GlobalStyle } from '../../../providers/GlobalStyle' 5 | import { AccountDisconnectedPreview } from '../../../views/Events/EventPreview/AccountDisconnectedPreview' 6 | 7 | export default { 8 | title: 'Components/EventPreview/Account Disconnected', 9 | component: AccountDisconnectedPreview, 10 | } as Meta 11 | 12 | export const AccountDisconnected: Story = () => ( 13 | <> 14 | 15 | 16 | 17 | ) 18 | AccountDisconnected.parameters = { 19 | controls: { hideNoControlsWarning: true }, 20 | } 21 | -------------------------------------------------------------------------------- /packages/extension/src/stories/components/EventPreview/Error.stories.tsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import type { Meta, Story } from '@storybook/react' 3 | 4 | import { GlobalStyle } from '../../../providers/GlobalStyle' 5 | import { ErrorPreview } from '../../../views/Events/EventPreview/ErrorPreview' 6 | import { AbiProvider } from '../../../providers/abi/AbiProvider' 7 | 8 | export default { 9 | title: 'Components/EventPreview/Error', 10 | } as Meta 11 | 12 | export const Error: Story = () => ( 13 | 14 | 15 | 22 | 23 | ) 24 | Error.parameters = { 25 | controls: { hideNoControlsWarning: true }, 26 | } 27 | -------------------------------------------------------------------------------- /packages/extension/src/stories/components/EventPreview/InitializedPreview.stories.tsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import type { Story, Meta } from '@storybook/react' 3 | 4 | import { GlobalStyle } from '../../../providers/GlobalStyle' 5 | import { InitializedPreview } from '../../../views/Events/EventPreview/InitializedPreview' 6 | 7 | export default { 8 | title: 'Components/EventPreview/Initialized', 9 | component: InitializedPreview, 10 | } as Meta 11 | 12 | export const Initialized: Story = () => ( 13 | <> 14 | 15 | 16 | 17 | ) 18 | Initialized.parameters = { 19 | controls: { hideNoControlsWarning: true }, 20 | } 21 | -------------------------------------------------------------------------------- /packages/extension/src/stories/components/EventPreview/NetworkDisconnected.stories.tsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import type { Story, Meta } from '@storybook/react' 3 | 4 | import { GlobalStyle } from '../../../providers/GlobalStyle' 5 | import { NetworkDisconnectedPreview } from '../../../views/Events/EventPreview/NetworkDisconnectedPreview' 6 | 7 | export default { 8 | title: 'Components/EventPreview/Network Disconnected', 9 | component: NetworkDisconnectedPreview, 10 | } as Meta 11 | 12 | export const NetworkDisconnected: Story = () => ( 13 | <> 14 | 15 | 16 | 17 | ) 18 | NetworkDisconnected.parameters = { 19 | controls: { hideNoControlsWarning: true }, 20 | } 21 | -------------------------------------------------------------------------------- /packages/extension/src/stories/pages/Abis.stories.tsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import type { Story, Meta } from '@storybook/react' 3 | 4 | import { GlobalStyle } from '../../providers/GlobalStyle' 5 | import { Abis as AbisComponent } from '../../views/Abis/Abis' 6 | import { AbiProvider } from '../../providers/abi/AbiProvider' 7 | 8 | export default { 9 | title: 'Pages/Abis', 10 | parameters: { 11 | layout: 'fullscreen', 12 | }, 13 | } as Meta 14 | 15 | export const Abis: Story = () => ( 16 | 17 | 18 | undefined} /> 19 | 20 | ) 21 | Abis.parameters = { 22 | controls: { hideNoControlsWarning: true }, 23 | } 24 | -------------------------------------------------------------------------------- /packages/extension/src/stories/pages/NameTags.stories.tsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import type { Story, Meta } from '@storybook/react' 3 | 4 | import { GlobalStyle } from '../../providers/GlobalStyle' 5 | import { NameTags as NameTagsComponent } from '../../views/NameTags/NameTags' 6 | import { NameTagsProvider } from '../../providers/nameTags/NameTagsProvider' 7 | 8 | export default { 9 | title: 'Pages/Name Tags', 10 | parameters: { 11 | layout: 'fullscreen', 12 | }, 13 | } as Meta 14 | 15 | export const NameTags: Story = () => ( 16 | 17 | 18 | undefined} /> 19 | 20 | ) 21 | NameTags.parameters = { 22 | controls: { hideNoControlsWarning: true }, 23 | } 24 | -------------------------------------------------------------------------------- /packages/extension/src/views/Abis/parseAbiInput.ts: -------------------------------------------------------------------------------- 1 | import { toAbiEntries } from '../../providers/abi/AbiEntry' 2 | 3 | export function parseAbiInput(input: string) { 4 | let parsed 5 | try { 6 | parsed = JSON.parse(input) 7 | } catch { 8 | parsed = input 9 | .split('\n') 10 | .map((x) => x.trim()) 11 | .filter((x) => x !== '') 12 | } 13 | return toAbiEntries(parsed) 14 | } 15 | -------------------------------------------------------------------------------- /packages/extension/src/views/App.tsx: -------------------------------------------------------------------------------- 1 | import React, { useState } from 'react' 2 | import { Abis } from './Abis/Abis' 3 | import { Events } from './Events/Events' 4 | import { NameTags } from './NameTags/NameTags' 5 | 6 | export function App() { 7 | const [page, setPage] = useState('events') 8 | if (page === 'events') { 9 | return 10 | } else if (page === 'abis') { 11 | return 12 | } else if (page === 'nameTags') { 13 | return 14 | } 15 | return null 16 | } 17 | -------------------------------------------------------------------------------- /packages/extension/src/views/Events/EventItem/Latency.tsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import styled from 'styled-components' 3 | import { Colors } from '../../../design' 4 | import type { Event } from '../../../providers/events/State' 5 | import { formatInteger } from './formatInteger' 6 | 7 | interface Props { 8 | event: Event 9 | } 10 | 11 | export function Latency({ event }: Props) { 12 | if (event.type === 'STATE_UPDATED' || event.type === 'FETCH_ERROR') { 13 | return ({formatInteger(event.duration)}ms) 14 | } 15 | return null 16 | } 17 | 18 | const Element = styled.div` 19 | margin-left: 8px; 20 | font-size: 14px; 21 | color: ${Colors.Text2}; 22 | ` 23 | -------------------------------------------------------------------------------- /packages/extension/src/views/Events/EventItem/formatInteger.ts: -------------------------------------------------------------------------------- 1 | export function formatInteger(integer: number | string): string { 2 | const value = integer.toString() 3 | if (value.startsWith('-')) { 4 | return '-' + formatInteger(value.substring(1)) 5 | } 6 | const count = value.length / 3 7 | const resultValue = value.split('') 8 | for (let i = 1; i < count; i++) { 9 | resultValue.splice(-4 * i + 1, 0, ',') 10 | } 11 | return resultValue.join('') 12 | } 13 | -------------------------------------------------------------------------------- /packages/extension/src/views/Events/EventItem/getEventLabel.ts: -------------------------------------------------------------------------------- 1 | import type { Event } from '../../../providers/events/State' 2 | 3 | export function getEventLabel(event: Event) { 4 | switch (event.type) { 5 | case 'INIT': 6 | return 'Initialized' 7 | case 'BLOCK_FOUND': 8 | return 'Block found' 9 | case 'NETWORK_CONNECTED': 10 | return 'Network connected' 11 | case 'NETWORK_DISCONNECTED': 12 | return 'Network disconnected' 13 | case 'CALLS_UPDATED': 14 | return 'Calls updated' 15 | case 'STATE_UPDATED': 16 | return event.updated.length === 1 ? 'State update' : 'State updates' 17 | case 'ACCOUNT_CONNECTED': 18 | return 'Account connected' 19 | case 'ACCOUNT_DISCONNECTED': 20 | return 'Account disconnected' 21 | case 'ERROR': 22 | return event.error 23 | case 'FETCH_ERROR': 24 | return 'Fetch error' 25 | } 26 | } 27 | -------------------------------------------------------------------------------- /packages/extension/src/views/Events/EventItem/getNetworkColor.ts: -------------------------------------------------------------------------------- 1 | import { Colors } from '../../../design' 2 | import type { Event } from '../../../providers/events/State' 3 | 4 | export function getNetworkColor(event: Event): string | undefined { 5 | if ( 6 | event.type === 'INIT' || 7 | event.type === 'NETWORK_DISCONNECTED' || 8 | event.type === 'ACCOUNT_CONNECTED' || 9 | event.type === 'ACCOUNT_DISCONNECTED' || 10 | event.type === 'ERROR' || 11 | !event.network 12 | ) { 13 | return undefined 14 | } 15 | return (Colors.Network as any)[event.network] ?? Colors.Network.Other 16 | } 17 | -------------------------------------------------------------------------------- /packages/extension/src/views/Events/EventPreview/AccountConnectedPreview.tsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import type { AccountConnectedEvent } from '../../../providers/events/State' 3 | import { Text } from '../../shared' 4 | import { Property, Table } from './components' 5 | import { Address } from './components/Address' 6 | 7 | interface Props { 8 | event: AccountConnectedEvent 9 | } 10 | 11 | export function AccountConnectedPreview({ event }: Props) { 12 | return ( 13 | <> 14 | An account has been connected to the application. It can now be used to sign transactions. 15 | 16 | 17 |
18 | 19 |
20 | 21 | ) 22 | } 23 | -------------------------------------------------------------------------------- /packages/extension/src/views/Events/EventPreview/AccountDisconnectedPreview.tsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import { Text } from '../../shared' 3 | 4 | export function AccountDisconnectedPreview() { 5 | return Account disconnected. Transactions won't be signed with that account. 6 | } 7 | -------------------------------------------------------------------------------- /packages/extension/src/views/Events/EventPreview/ErrorPreview.tsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import type { ErrorEvent } from '../../../providers/events/State' 3 | import { Text, Title } from '../../shared' 4 | 5 | interface Props { 6 | event: ErrorEvent 7 | } 8 | 9 | export function ErrorPreview({ event }: Props) { 10 | return ( 11 | <> 12 | Error message: 13 | {event.error} 14 | 15 | ) 16 | } 17 | -------------------------------------------------------------------------------- /packages/extension/src/views/Events/EventPreview/FetchErrorPreview.tsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import type { FetchErrorEvent } from '../../../providers/events/State' 3 | import { Text, Title } from '../../shared' 4 | import { CallList } from './components/CallList' 5 | 6 | interface Props { 7 | event: FetchErrorEvent 8 | } 9 | 10 | export function FetchErrorPreview({ event }: Props) { 11 | return ( 12 | <> 13 | 14 | An error happened when trying to update the state. This might happen because one of the requested calls 15 | reverted. 16 | 17 | Error message: 18 | {event.error} 19 | Calls: 20 | 21 | 22 | ) 23 | } 24 | -------------------------------------------------------------------------------- /packages/extension/src/views/Events/EventPreview/InitializedPreview.tsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import { Text } from '../../shared' 3 | import { Link } from './components' 4 | 5 | export function InitializedPreview() { 6 | return ( 7 | <> 8 | useDApp was detected on the page and the DevTools extension was initialized. 9 | 10 | Read the official documentation 11 | 12 | 13 | Browse issues on Github 14 | 15 | 16 | ) 17 | } 18 | -------------------------------------------------------------------------------- /packages/extension/src/views/Events/EventPreview/NetworkDisconnectedPreview.tsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import { Text } from '../../shared' 3 | 4 | export function NetworkDisconnectedPreview() { 5 | return Network disconnected. useDApp will not make network calls. 6 | } 7 | -------------------------------------------------------------------------------- /packages/extension/src/views/Events/EventPreview/components/CallList.tsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import styled from 'styled-components' 3 | import { Colors } from '../../../../design' 4 | import { Call, GeneralizedCall } from './Call' 5 | 6 | interface Props { 7 | calls: GeneralizedCall[] 8 | network: string | undefined 9 | } 10 | 11 | export function CallList({ calls, network }: Props) { 12 | return ( 13 | 14 | {calls.map((call, i) => ( 15 | 16 | 17 | 18 | ))} 19 | 20 | ) 21 | } 22 | 23 | const List = styled.ul` 24 | list-style-type: none; 25 | margin: 0 0 15px 0; 26 | padding: 0; 27 | ` 28 | 29 | const Item = styled.li` 30 | margin: 0 0 15px 0; 31 | 32 | &:not(:last-child) { 33 | padding-bottom: 15px; 34 | border-bottom: 1px solid ${Colors.Border}; 35 | } 36 | ` 37 | -------------------------------------------------------------------------------- /packages/extension/src/views/Events/EventPreview/components/Link.tsx: -------------------------------------------------------------------------------- 1 | import React, { ReactNode } from 'react' 2 | import styled from 'styled-components' 3 | import { Colors } from '../../../../design' 4 | 5 | interface Props { 6 | href: string 7 | children?: ReactNode 8 | block?: boolean 9 | } 10 | 11 | export function Link({ href, block, children }: Props) { 12 | return ( 13 | 14 | {children ?? href} 15 | 16 | ) 17 | } 18 | 19 | const Anchor = styled.a` 20 | color: ${Colors.Link}; 21 | text-decoration: none; 22 | 23 | &.block { 24 | display: block; 25 | &::after { 26 | content: ' »'; 27 | } 28 | } 29 | ` 30 | -------------------------------------------------------------------------------- /packages/extension/src/views/Events/EventPreview/components/Method.tsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import styled from 'styled-components' 3 | import { Font } from '../../../../design' 4 | import type { ParsedValue } from '../../../../providers/abi/ParsedValue' 5 | import { ValueList } from './ValueList' 6 | 7 | interface Props { 8 | name: string 9 | network: string | undefined 10 | args: ParsedValue[] 11 | } 12 | 13 | export function Method({ name, args, network }: Props) { 14 | if (args.length === 0) { 15 | return {name}() 16 | } 17 | return ( 18 | <> 19 | {name}( 20 | 21 | ) 22 | 23 | ) 24 | } 25 | 26 | const Code = styled.span` 27 | font-family: ${Font.Code}; 28 | ` 29 | -------------------------------------------------------------------------------- /packages/extension/src/views/Events/EventPreview/components/Property.tsx: -------------------------------------------------------------------------------- 1 | import React, { ReactNode } from 'react' 2 | import styled from 'styled-components' 3 | 4 | interface PropertyProps { 5 | name: string 6 | children?: ReactNode 7 | } 8 | 9 | export function Property({ name, children }: PropertyProps) { 10 | return ( 11 | 12 | {name} 13 | {children} 14 | 15 | ) 16 | } 17 | 18 | const PropertyComponent = styled.td` 19 | text-align: right; 20 | font-size: 14px; 21 | padding-right: 8px; 22 | padding-top: 2px; 23 | vertical-align: baseline; 24 | font-style: italic; 25 | ` 26 | -------------------------------------------------------------------------------- /packages/extension/src/views/Events/EventPreview/components/Table.tsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import type { ReactNode } from 'react' 3 | import styled from 'styled-components' 4 | 5 | interface TableProps { 6 | className?: string 7 | children: ReactNode 8 | } 9 | 10 | export function Table({ className, children }: TableProps) { 11 | return ( 12 | 13 | {children} 14 | 15 | ) 16 | } 17 | 18 | const TableComponent = styled.table` 19 | display: block; 20 | border-collapse: collapse; 21 | ` 22 | -------------------------------------------------------------------------------- /packages/extension/src/views/Events/EventPreview/components/index.ts: -------------------------------------------------------------------------------- 1 | export * from './Call' 2 | export * from './Link' 3 | export * from './Property' 4 | export * from './Table' 5 | export * from './ValueList' 6 | -------------------------------------------------------------------------------- /packages/extension/src/views/Events/Events.tsx: -------------------------------------------------------------------------------- 1 | import React, { useState } from 'react' 2 | import { useEvents } from '../../hooks' 3 | import type { Event } from '../../providers/events/State' 4 | import { Page } from '../shared' 5 | import { EventList } from './EventList/EventList' 6 | import { EventPreview } from './EventPreview/EventPreview' 7 | 8 | interface Props { 9 | onNavigate: (page: string) => void 10 | } 11 | 12 | export function Events({ onNavigate }: Props) { 13 | const [event, setEvent] = useState(undefined) 14 | const events = useEvents() 15 | 16 | return ( 17 | 18 | 19 | 20 | 21 | ) 22 | } 23 | -------------------------------------------------------------------------------- /packages/extension/src/views/shared/Page.tsx: -------------------------------------------------------------------------------- 1 | import React, { ReactNode } from 'react' 2 | import styled from 'styled-components' 3 | import { Header } from './Header' 4 | 5 | interface Props { 6 | name: string 7 | onNavigate: (page: string) => void 8 | children: ReactNode 9 | } 10 | 11 | export function Page({ name, onNavigate, children }: Props) { 12 | return ( 13 | 14 |
15 | {children} 16 | 17 | ) 18 | } 19 | 20 | const Wrapper = styled.div` 21 | position: relative; 22 | width: 100%; 23 | height: 100%; 24 | ` 25 | 26 | const Container = styled.div` 27 | position: absolute; 28 | width: 100%; 29 | left: 0; 30 | top: 28px; 31 | height: calc(100% - 28px); 32 | overflow: auto; 33 | ` 34 | -------------------------------------------------------------------------------- /packages/extension/src/views/shared/SubmitButton.ts: -------------------------------------------------------------------------------- 1 | import styled from 'styled-components' 2 | import { Colors } from '../../design' 3 | 4 | export const SubmitButton = styled.input` 5 | display: inline-block; 6 | position: relative; 7 | top: 0; 8 | border: 1px solid ${Colors.Border2}; 9 | border-radius: 4px; 10 | box-shadow: 0 4px 0 0 ${Colors.Border2}; 11 | margin-bottom: 4px; 12 | background-color: ${Colors.Background2}; 13 | cursor: pointer; 14 | padding: 4px 8px; 15 | font-family: inherit; 16 | font-size: inherit; 17 | transition: box-shadow 0.1s ease-out, top 0.1s ease-out; 18 | 19 | &:hover { 20 | background-color: ${Colors.Background}; 21 | } 22 | 23 | &:active { 24 | top: 3px; 25 | box-shadow: 0 1px 0 0 ${Colors.Border2}; 26 | } 27 | ` 28 | -------------------------------------------------------------------------------- /packages/extension/src/views/shared/Text.ts: -------------------------------------------------------------------------------- 1 | import styled from 'styled-components' 2 | 3 | export const Text = styled.p` 4 | margin: 0 0 15px 0; 5 | ` 6 | -------------------------------------------------------------------------------- /packages/extension/src/views/shared/Title.ts: -------------------------------------------------------------------------------- 1 | import styled from 'styled-components' 2 | 3 | export const Title = styled.p` 4 | margin: 0 0 15px 0; 5 | font-size: 18px; 6 | font-weight: bold; 7 | ` 8 | -------------------------------------------------------------------------------- /packages/extension/src/views/shared/index.ts: -------------------------------------------------------------------------------- 1 | export * from './Header' 2 | export * from './Page' 3 | export * from './Title' 4 | export * from './Text' 5 | -------------------------------------------------------------------------------- /packages/extension/static/devtools.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | -------------------------------------------------------------------------------- /packages/extension/static/fonts/SourceCodePro/SourceCodePro-Bold.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/extension/static/fonts/SourceCodePro/SourceCodePro-Bold.ttf -------------------------------------------------------------------------------- /packages/extension/static/fonts/SourceCodePro/SourceCodePro-Italic.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/extension/static/fonts/SourceCodePro/SourceCodePro-Italic.ttf -------------------------------------------------------------------------------- /packages/extension/static/fonts/SourceCodePro/SourceCodePro-Regular.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/extension/static/fonts/SourceCodePro/SourceCodePro-Regular.ttf -------------------------------------------------------------------------------- /packages/extension/static/fonts/SourceSansPro/SourceSansPro-Bold.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/extension/static/fonts/SourceSansPro/SourceSansPro-Bold.ttf -------------------------------------------------------------------------------- /packages/extension/static/fonts/SourceSansPro/SourceSansPro-Italic.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/extension/static/fonts/SourceSansPro/SourceSansPro-Italic.ttf -------------------------------------------------------------------------------- /packages/extension/static/fonts/SourceSansPro/SourceSansPro-Regular.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/extension/static/fonts/SourceSansPro/SourceSansPro-Regular.ttf -------------------------------------------------------------------------------- /packages/extension/static/icons/icon-inactive.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | -------------------------------------------------------------------------------- /packages/extension/static/icons/icon.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | -------------------------------------------------------------------------------- /packages/extension/static/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | useDApp DevTools 7 | 8 | 9 | 10 |
11 | 12 | 13 | 14 | -------------------------------------------------------------------------------- /packages/extension/static/scripts/devtools.js: -------------------------------------------------------------------------------- 1 | let created = false 2 | let checkCount = 0 3 | 4 | chrome.devtools.network.onNavigated.addListener(detectAndCreate) 5 | const checkInterval = setInterval(detectAndCreate, 1000) 6 | detectAndCreate() 7 | 8 | function detectAndCreate() { 9 | if (created || checkCount++ > 10) { 10 | clearInterval(checkInterval) 11 | return 12 | } 13 | const code = '!!(window.__USEDAPP_DEVTOOLS_HOOK__.useDApp)' 14 | chrome.devtools.inspectedWindow.eval(code, function (detected) { 15 | if (!detected || created) { 16 | return 17 | } 18 | clearInterval(checkInterval) 19 | created = true 20 | chrome.devtools.panels.create('useDApp', 'icons/icon.svg', 'index.html') 21 | }) 22 | } 23 | -------------------------------------------------------------------------------- /packages/extension/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "include": ["src", "types", "test"], 3 | "compilerOptions": { 4 | "module": "commonjs", 5 | "target": "ES2018", 6 | "moduleResolution": "node", 7 | "esModuleInterop": true, 8 | "jsx": "react", 9 | "strict": true, 10 | "skipLibCheck": true, 11 | "forceConsistentCasingInFileNames": true, 12 | "resolveJsonModule": true, 13 | "allowSyntheticDefaultImports": true, 14 | "importsNotUsedAsValues": "error" 15 | } 16 | } 17 | -------------------------------------------------------------------------------- /packages/playwright/.eslintrc.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | extends: [`${__dirname}/../../.eslintrc.json`], 3 | } 4 | -------------------------------------------------------------------------------- /packages/playwright/.gitignore: -------------------------------------------------------------------------------- 1 | # Ignore unpacked metamask extensions 2 | metamask-* 3 | -------------------------------------------------------------------------------- /packages/playwright/README.md: -------------------------------------------------------------------------------- 1 | # Playwright 2 | 3 | Internal package for sharing code related to playwright testing. 4 | 5 | Includes Metamask extension. 6 | -------------------------------------------------------------------------------- /packages/playwright/metamask-chrome-10.12.4.zip: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/playwright/metamask-chrome-10.12.4.zip -------------------------------------------------------------------------------- /packages/playwright/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "@usedapp/playwright", 3 | "version": "0.0.1", 4 | "private": true, 5 | "main": "dist/src/index.js", 6 | "types": "dist/src/index.d.ts", 7 | "scripts": { 8 | "build": "rimraf dist && tsc", 9 | "lint": "pnpm lint:prettier --check && pnpm lint:eslint", 10 | "lint:fix": "prettier --write ./src && pnpm lint:eslint --fix", 11 | "lint:eslint": "eslint './{src,test}/**/*.{ts,tsx}'", 12 | "lint:prettier": "prettier --check ./src", 13 | "postinstall": "unzip -n metamask-chrome-10.12.4.zip -d ./metamask-chrome-10.12.4" 14 | }, 15 | "dependencies": { 16 | "debug": "^4.3.4" 17 | }, 18 | "devDependencies": { 19 | "@types/debug": "^4.1.7", 20 | "@types/node": "^17.0.10", 21 | "eslint": "7.22.0", 22 | "playwright": "^1.20.2", 23 | "prettier": "^2.0.5", 24 | "rimraf": "^3.0.2", 25 | "typescript": "^4.6.2" 26 | } 27 | } 28 | -------------------------------------------------------------------------------- /packages/playwright/prettier.config.js: -------------------------------------------------------------------------------- 1 | module.exports = require('../../.prettierrc.json') 2 | -------------------------------------------------------------------------------- /packages/playwright/src/constants.ts: -------------------------------------------------------------------------------- 1 | export const headless = !!process.env.CI // use false for debugging/developing 2 | 3 | export const slowMo = process.env.CI ? 0 : 500 4 | 5 | export const waitUntil = 'load' 6 | -------------------------------------------------------------------------------- /packages/playwright/src/index.ts: -------------------------------------------------------------------------------- 1 | export * from './metamask' 2 | export * from './constants' 3 | export * from './pageDiagnostics' 4 | export * from './utils' 5 | export * from './xpath' 6 | -------------------------------------------------------------------------------- /packages/playwright/src/metamask/constants.ts: -------------------------------------------------------------------------------- 1 | import path from 'path' 2 | 3 | const pathToExtension = path.join(__dirname, '../../../', 'metamask-chrome-10.12.4') 4 | 5 | export const metamaskChromeArgs = [ 6 | `--disable-extensions-except=${pathToExtension}`, 7 | `--load-extension=${pathToExtension}`, 8 | '--disable-gpu', 9 | '--no-sandbox', 10 | '--disable-setuid-sandbox', 11 | ] 12 | -------------------------------------------------------------------------------- /packages/playwright/src/metamask/index.ts: -------------------------------------------------------------------------------- 1 | export * from './constants' 2 | export * from './MetaMask' 3 | -------------------------------------------------------------------------------- /packages/playwright/src/xpath.ts: -------------------------------------------------------------------------------- 1 | export class XPath { 2 | static text(element: keyof HTMLElementTagNameMap | '*', text: string, occurrence = 1) { 3 | return `(//${element}[contains(text(), "${text}")])[${occurrence}]` 4 | } 5 | 6 | static id(element: keyof HTMLElementTagNameMap | '*', text: string) { 7 | return `//${element}[contains(@id, "${text}")]` 8 | } 9 | 10 | static class(element: keyof HTMLElementTagNameMap | '*', text: string) { 11 | return `//${element}[contains(@class, ${text})]` 12 | } 13 | 14 | static svgWithClass(text: string) { 15 | return `//*[local-name()="svg" and contains(@class, "${text}")]` 16 | } 17 | } 18 | -------------------------------------------------------------------------------- /packages/playwright/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "dist", 5 | "module": "commonjs", 6 | "composite": true, 7 | "declaration": true, 8 | "sourceMap": true, 9 | "declarationMap": true, 10 | "resolveJsonModule": true, 11 | "skipLibCheck": true, 12 | "moduleResolution": "node" 13 | }, 14 | "include": ["src"] 15 | } 16 | -------------------------------------------------------------------------------- /packages/siwe/.eslintrc.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | extends: [`${__dirname}/../../.eslintrc.json`, 'plugin:react-hooks/recommended'], 3 | } 4 | -------------------------------------------------------------------------------- /packages/siwe/.mocharc.json: -------------------------------------------------------------------------------- 1 | { 2 | "spec": "src/*.test.{ts,tsx}", 3 | "require": ["@swc-node/register"], 4 | "watchExtensions": "ts", 5 | "extension": "ts", 6 | "timeout": 100000, 7 | "file": "./src/test-setup.ts" 8 | } 9 | -------------------------------------------------------------------------------- /packages/siwe/.npmignore: -------------------------------------------------------------------------------- 1 | CHANGELOG.md 2 | .eslintrc.js 3 | -------------------------------------------------------------------------------- /packages/siwe/prettier.config.js: -------------------------------------------------------------------------------- 1 | module.exports = require('../../.prettierrc.json') 2 | -------------------------------------------------------------------------------- /packages/siwe/src/constants.ts: -------------------------------------------------------------------------------- 1 | export const GNOSIS_SAFE_ABI = [ 2 | 'event SignMsg(bytes32 indexed msgHash)', 3 | 'function getMessageHash(bytes memory message) public view returns (bytes32)', 4 | ] 5 | -------------------------------------------------------------------------------- /packages/siwe/src/index.ts: -------------------------------------------------------------------------------- 1 | export * from './provider' 2 | export * from './requests' 3 | -------------------------------------------------------------------------------- /packages/siwe/src/test-setup.ts: -------------------------------------------------------------------------------- 1 | import 'mock-local-storage' 2 | 3 | let jsdomCleanup: any 4 | before(() => { 5 | // eslint-disable-next-line @typescript-eslint/no-var-requires 6 | jsdomCleanup = require('jsdom-global')(undefined, { url: 'http://localhost/' }) 7 | }) 8 | after(() => jsdomCleanup?.()) 9 | -------------------------------------------------------------------------------- /packages/siwe/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "dist", 5 | "module": "commonjs", 6 | "composite": true, 7 | "declaration": true, 8 | "sourceMap": true, 9 | "resolveJsonModule": true, 10 | "skipLibCheck": true, 11 | "moduleResolution": "node" 12 | }, 13 | "include": [ 14 | "src", 15 | "src/**/*.json", 16 | ] 17 | } 18 | -------------------------------------------------------------------------------- /packages/testing/.eslintrc.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | extends: [`${__dirname}/../../.eslintrc.json`], 3 | } 4 | -------------------------------------------------------------------------------- /packages/testing/.mocharc.json: -------------------------------------------------------------------------------- 1 | { 2 | "spec": "examples/**/*.test.{ts,tsx}", 3 | "require": ["@swc-node/register"], 4 | "watchExtensions": "ts", 5 | "extension": "ts", 6 | "timeout": 5000 7 | } 8 | -------------------------------------------------------------------------------- /packages/testing/README.md: -------------------------------------------------------------------------------- 1 | # useDapp testing 2 | -------------------------------------------------------------------------------- /packages/testing/prettier.config.js: -------------------------------------------------------------------------------- 1 | module.exports = require('../../.prettierrc.json') 2 | -------------------------------------------------------------------------------- /packages/testing/src/index.ts: -------------------------------------------------------------------------------- 1 | // Workaround before support for conditional exports lands in typescript. 2 | // https://devblogs.microsoft.com/typescript/announcing-typescript-4-5-beta/#packagejson-exports-imports-and-self-referencing 3 | 4 | export * from '@usedapp/core/dist/cjs/src/testing' 5 | -------------------------------------------------------------------------------- /packages/testing/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "dist", 5 | "module": "commonjs", 6 | "composite": true, 7 | "declaration": true, 8 | "sourceMap": true, 9 | "declarationMap": true, 10 | "resolveJsonModule": true, 11 | "skipLibCheck": true 12 | }, 13 | "include": [ 14 | "src", 15 | "examples" 16 | ], 17 | "references": [ 18 | { 19 | "path": "../core" 20 | } 21 | ] 22 | } 23 | -------------------------------------------------------------------------------- /packages/uniswap/.eslintrc.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": [ 3 | "../../.eslintrc.json" 4 | ] 5 | } 6 | -------------------------------------------------------------------------------- /packages/uniswap/.mocharc.json: -------------------------------------------------------------------------------- 1 | { 2 | "spec": "src/**/*.test.{ts,tsx}", 3 | "require": "ts-node/register", 4 | "timeout": 40000, 5 | "file": "./src/test-setup.ts" 6 | } 7 | -------------------------------------------------------------------------------- /packages/uniswap/CHANGELOG.md: -------------------------------------------------------------------------------- 1 | # @usedapp/uniswap 2 | 3 | ## 0.3.24 4 | 5 | ### Patch Changes 6 | 7 | - 4acf8b6: Allow only ethers v5 8 | - Updated dependencies [4acf8b6] 9 | - @usedapp/core@1.2.4 10 | -------------------------------------------------------------------------------- /packages/uniswap/README.md: -------------------------------------------------------------------------------- 1 | # @useDapp/uniswap -------------------------------------------------------------------------------- /packages/uniswap/prettier.config.js: -------------------------------------------------------------------------------- 1 | module.exports = require('../../.prettierrc.json') 2 | -------------------------------------------------------------------------------- /packages/uniswap/src/constants/abi/index.ts: -------------------------------------------------------------------------------- 1 | import { utils } from 'ethers' 2 | import UniswapV2Factory from './UniswapV2Factory.json' 3 | import UniswapV2Pair from './UniswapV2Pair.json' 4 | 5 | const UniswapFactoryInterface = new utils.Interface(UniswapV2Factory.abi) 6 | 7 | export { UniswapV2Factory, UniswapFactoryInterface } 8 | 9 | const UniswapPairInterface = new utils.Interface(UniswapV2Pair.abi) 10 | 11 | export { UniswapV2Pair, UniswapPairInterface } 12 | -------------------------------------------------------------------------------- /packages/uniswap/src/constants/index.ts: -------------------------------------------------------------------------------- 1 | export * from './abi' 2 | export * from './uniswapV2' 3 | -------------------------------------------------------------------------------- /packages/uniswap/src/constants/uniswapV2.ts: -------------------------------------------------------------------------------- 1 | import { ChainId } from '@usedapp/core' 2 | 3 | export const UNISWAP_V2_FACTORY_ADDRESS = { 4 | [ChainId.Mainnet]: '0x5C69bEe701ef814a2B6a3EDD4B1652CB9cc5aA6f', 5 | } 6 | 7 | export const INIT_CODE_HASH = '0x96e8ac4277198ff8b6f785478aa9a39f403cb768dd02cbee326c3e7da348845f' 8 | -------------------------------------------------------------------------------- /packages/uniswap/src/hooks/index.ts: -------------------------------------------------------------------------------- 1 | export * from './useUniswapPrice' 2 | -------------------------------------------------------------------------------- /packages/uniswap/src/index.ts: -------------------------------------------------------------------------------- 1 | export * from './constants' 2 | export * from './hooks' 3 | -------------------------------------------------------------------------------- /packages/uniswap/src/test-setup.ts: -------------------------------------------------------------------------------- 1 | import chai from 'chai' 2 | import chaiAsPromised from 'chai-as-promised' 3 | 4 | let jsdomCleanup: any 5 | before(() => { 6 | // eslint-disable-next-line @typescript-eslint/no-var-requires 7 | jsdomCleanup = require('jsdom-global')(undefined, { url: 'http://localhost/' }) 8 | }) 9 | after(() => jsdomCleanup?.()) 10 | 11 | chai.use(chaiAsPromised) 12 | -------------------------------------------------------------------------------- /packages/uniswap/src/utils/deployMockUniswapV2Pair.tsx: -------------------------------------------------------------------------------- 1 | import { ContractFactory, Wallet } from 'ethers' 2 | import { Contract } from 'ethers' 3 | import { UniswapV2Pair, UniswapV2Factory } from '../constants' 4 | 5 | export async function deployUniswapV2Pair(deployer: Wallet, token0: Contract, token1: Contract) { 6 | const uniswapFactoryFactory = new ContractFactory(UniswapV2Factory.abi, UniswapV2Factory.bytecode, deployer) 7 | const factory = await uniswapFactoryFactory.deploy(deployer.address) 8 | await factory.deployed() 9 | await factory.createPair(token0.address, token1.address) 10 | 11 | const pairAddress = await factory.getPair(token0.address, token1.address) 12 | const pair = new Contract(pairAddress, JSON.stringify(UniswapV2Pair.abi)).connect(deployer) 13 | 14 | return { factory, pair } 15 | } 16 | -------------------------------------------------------------------------------- /packages/uniswap/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "dist", 5 | "module": "commonjs", 6 | "composite": true, 7 | "declaration": true, 8 | "sourceMap": true, 9 | "declarationMap": true, 10 | "resolveJsonModule": true, 11 | "skipLibCheck": true, 12 | "moduleResolution": "node" 13 | }, 14 | "types": [ 15 | "mocha", 16 | "node" 17 | ], 18 | "include": [ 19 | "src", 20 | "src/**/*.json" 21 | ], 22 | "exclude": [ 23 | "/node_modules/" 24 | ] 25 | } 26 | -------------------------------------------------------------------------------- /packages/website/.gitignore: -------------------------------------------------------------------------------- 1 | .DS_Store 2 | node_modules 3 | /dist 4 | .idea/ 5 | -------------------------------------------------------------------------------- /packages/website/README.md: -------------------------------------------------------------------------------- 1 | # useDapp website 2 | ``` 3 | 4 | ## Running the project 5 | 6 | To run the project run: 7 | 8 | ``` 9 | yarn gulp 10 | ``` 11 | 12 | To build the project run: 13 | 14 | ``` 15 | yarn build 16 | ``` 17 | -------------------------------------------------------------------------------- /packages/website/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "@usedapp/website", 3 | "version": "1.0.0", 4 | "description": "", 5 | "main": "gulpfile.js", 6 | "scripts": { 7 | "build": "rm -rf dist && gulp build", 8 | "lint": "true", 9 | "lint:fix": "true", 10 | "test": "true", 11 | "compile:sass": "node-sass sass/main.scss css/main.css -w", 12 | "gulp": "gulp" 13 | }, 14 | "devDependencies": { 15 | "browser-sync": "^2.26.3", 16 | "del": "^3.0.0", 17 | "gulp": "^4.0.0", 18 | "gulp-autoprefixer": "^4.0.0", 19 | "gulp-minify": "^3.1.0", 20 | "gulp-sass": "^5.0.0", 21 | "sass": "^1.43.4" 22 | }, 23 | "private": true 24 | } 25 | -------------------------------------------------------------------------------- /packages/website/src/fonts/PlusJakartaSans.eot: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/website/src/fonts/PlusJakartaSans.eot -------------------------------------------------------------------------------- /packages/website/src/fonts/PlusJakartaSans.otf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/website/src/fonts/PlusJakartaSans.otf -------------------------------------------------------------------------------- /packages/website/src/fonts/PlusJakartaSans.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/website/src/fonts/PlusJakartaSans.ttf -------------------------------------------------------------------------------- /packages/website/src/fonts/PlusJakartaSans.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/website/src/fonts/PlusJakartaSans.woff -------------------------------------------------------------------------------- /packages/website/src/fonts/PlusJakartaSans.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/website/src/fonts/PlusJakartaSans.woff2 -------------------------------------------------------------------------------- /packages/website/src/img/backgrounds/features__background.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/website/src/img/backgrounds/features__background.jpg -------------------------------------------------------------------------------- /packages/website/src/img/backgrounds/features__background@2x.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/website/src/img/backgrounds/features__background@2x.jpg -------------------------------------------------------------------------------- /packages/website/src/img/backgrounds/hero__background.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/website/src/img/backgrounds/hero__background.jpg -------------------------------------------------------------------------------- /packages/website/src/img/backgrounds/hero__background@2x.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/website/src/img/backgrounds/hero__background@2x.jpg -------------------------------------------------------------------------------- /packages/website/src/img/backgrounds/start__background.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/website/src/img/backgrounds/start__background.jpg -------------------------------------------------------------------------------- /packages/website/src/img/backgrounds/start__background@2x.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/website/src/img/backgrounds/start__background@2x.jpg -------------------------------------------------------------------------------- /packages/website/src/img/covers/browser__cover.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/website/src/img/covers/browser__cover.jpg -------------------------------------------------------------------------------- /packages/website/src/img/covers/connect__cover.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/website/src/img/covers/connect__cover.jpg -------------------------------------------------------------------------------- /packages/website/src/img/covers/read__cover.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/website/src/img/covers/read__cover.jpg -------------------------------------------------------------------------------- /packages/website/src/img/covers/write__cover.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/website/src/img/covers/write__cover.jpg -------------------------------------------------------------------------------- /packages/website/src/img/favicon.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | -------------------------------------------------------------------------------- /packages/website/src/img/integration/integration__editor.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/website/src/img/integration/integration__editor.jpg -------------------------------------------------------------------------------- /packages/website/src/img/integration/integration__editor@2x.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/website/src/img/integration/integration__editor@2x.jpg -------------------------------------------------------------------------------- /packages/website/src/img/logo.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | -------------------------------------------------------------------------------- /packages/website/src/img/projects/Boba_Network.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/website/src/img/projects/Boba_Network.png -------------------------------------------------------------------------------- /packages/website/src/img/projects/Boba_Network@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/website/src/img/projects/Boba_Network@2x.png -------------------------------------------------------------------------------- /packages/website/src/img/projects/Developer_DAO.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/website/src/img/projects/Developer_DAO.png -------------------------------------------------------------------------------- /packages/website/src/img/projects/Developer_DAO@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/website/src/img/projects/Developer_DAO@2x.png -------------------------------------------------------------------------------- /packages/website/src/img/projects/Index_Coop.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/website/src/img/projects/Index_Coop.png -------------------------------------------------------------------------------- /packages/website/src/img/projects/Index_Coop@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/website/src/img/projects/Index_Coop@2x.png -------------------------------------------------------------------------------- /packages/website/src/img/projects/Nouns.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/website/src/img/projects/Nouns.png -------------------------------------------------------------------------------- /packages/website/src/img/projects/Nouns@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/website/src/img/projects/Nouns@2x.png -------------------------------------------------------------------------------- /packages/website/src/img/projects/Nu_Cypher.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/website/src/img/projects/Nu_Cypher.png -------------------------------------------------------------------------------- /packages/website/src/img/projects/Nu_Cypher@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/website/src/img/projects/Nu_Cypher@2x.png -------------------------------------------------------------------------------- /packages/website/src/img/projects/OptimismPBC.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/website/src/img/projects/OptimismPBC.png -------------------------------------------------------------------------------- /packages/website/src/img/projects/OptimismPBC@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/website/src/img/projects/OptimismPBC@2x.png -------------------------------------------------------------------------------- /packages/website/src/img/projects/Pool_Together.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/website/src/img/projects/Pool_Together.png -------------------------------------------------------------------------------- /packages/website/src/img/projects/Pool_Together@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/website/src/img/projects/Pool_Together@2x.png -------------------------------------------------------------------------------- /packages/website/src/img/projects/Status.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/website/src/img/projects/Status.png -------------------------------------------------------------------------------- /packages/website/src/img/projects/Status@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/website/src/img/projects/Status@2x.png -------------------------------------------------------------------------------- /packages/website/src/img/projects/Tally.jpeg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/website/src/img/projects/Tally.jpeg -------------------------------------------------------------------------------- /packages/website/src/img/projects/Tally@2x.jpeg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/website/src/img/projects/Tally@2x.jpeg -------------------------------------------------------------------------------- /packages/website/src/img/projects/Tenderize.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/website/src/img/projects/Tenderize.png -------------------------------------------------------------------------------- /packages/website/src/img/projects/Tenderize@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/website/src/img/projects/Tenderize@2x.png -------------------------------------------------------------------------------- /packages/website/src/img/projects/Treasure_Marketplace.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/website/src/img/projects/Treasure_Marketplace.png -------------------------------------------------------------------------------- /packages/website/src/img/projects/Treasure_Marketplace@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/website/src/img/projects/Treasure_Marketplace@2x.png -------------------------------------------------------------------------------- /packages/website/src/img/resources/resources.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/website/src/img/resources/resources.jpg -------------------------------------------------------------------------------- /packages/website/src/img/resources/resources@2x.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/website/src/img/resources/resources@2x.jpg -------------------------------------------------------------------------------- /packages/website/src/img/testimonials/1.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/website/src/img/testimonials/1.png -------------------------------------------------------------------------------- /packages/website/src/img/testimonials/1@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/website/src/img/testimonials/1@2x.png -------------------------------------------------------------------------------- /packages/website/src/img/testimonials/2.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/website/src/img/testimonials/2.png -------------------------------------------------------------------------------- /packages/website/src/img/testimonials/2@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/website/src/img/testimonials/2@2x.png -------------------------------------------------------------------------------- /packages/website/src/img/testimonials/3.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/website/src/img/testimonials/3.png -------------------------------------------------------------------------------- /packages/website/src/img/testimonials/3@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/website/src/img/testimonials/3@2x.png -------------------------------------------------------------------------------- /packages/website/src/img/testimonials/4.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/website/src/img/testimonials/4.png -------------------------------------------------------------------------------- /packages/website/src/img/testimonials/4@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/website/src/img/testimonials/4@2x.png -------------------------------------------------------------------------------- /packages/website/src/img/testimonials/5.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/website/src/img/testimonials/5.png -------------------------------------------------------------------------------- /packages/website/src/img/testimonials/5@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/website/src/img/testimonials/5@2x.png -------------------------------------------------------------------------------- /packages/website/src/img/testimonials/6.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/website/src/img/testimonials/6.png -------------------------------------------------------------------------------- /packages/website/src/img/testimonials/6@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/website/src/img/testimonials/6@2x.png -------------------------------------------------------------------------------- /packages/website/src/img/welcome.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/website/src/img/welcome.jpg -------------------------------------------------------------------------------- /packages/website/src/js/min/sectionsObserver.min.js: -------------------------------------------------------------------------------- 1 | const sections=body.querySelectorAll("section.section"),navigationLinks=document.querySelectorAll(".navigation__link"),pageObserverOptions={root:null,rootMargin:"0px",threshold:.2};function pageScrollEvents(e,n){e.forEach(e=>{e.intersectionRatio>0&&e.isIntersecting&&navigationLinks.forEach(n=>{n.classList.contains("navigation__link--external")||(n.classList.remove("navigation__link--active"),n.href.substring(n.href.indexOf("#")+1)==e.target.id&&n.classList.add("navigation__link--active"))})})}const pageScrollObserver=new IntersectionObserver(pageScrollEvents,pageObserverOptions);sections.forEach(e=>pageScrollObserver.observe(e)); -------------------------------------------------------------------------------- /packages/website/src/js/min/sectionsRedirect.min.js: -------------------------------------------------------------------------------- 1 | const sectionTestimonials=body.querySelector("#testimonials"),sectionExample=body.querySelector("#example"),sectionFeatures=body.querySelector("#features"),sectionResources=body.querySelector("#resources"),sectionAboutUs=body.querySelector("#about-us"),blurOffset=8;body.addEventListener("click",e=>{if(e.target.classList.contains("navigation__link")&&!e.target.classList.contains("navigation__link--external")){e.preventDefault();const t=e.target,o=body.querySelector(t.href.substring(t.href.indexOf("#")));window.scrollTo({top:o.offsetTop-header.offsetHeight+8,behavior:"smooth"})}}); -------------------------------------------------------------------------------- /packages/website/src/js/sectionsRedirect.js: -------------------------------------------------------------------------------- 1 | const sectionTestimonials = body.querySelector('#testimonials') 2 | const sectionExample = body.querySelector('#example') 3 | const sectionFeatures = body.querySelector('#features') 4 | const sectionResources = body.querySelector('#resources') 5 | const sectionAboutUs = body.querySelector('#about-us') 6 | 7 | const blurOffset = 8 8 | 9 | body.addEventListener('click', (event) => { 10 | if (event.target.classList.contains('navigation__link') && !event.target.classList.contains('navigation__link--external')) { 11 | event.preventDefault() 12 | const eventLink = event.target 13 | const eventSection = body.querySelector(eventLink.href.substring(eventLink.href.indexOf('#'))) 14 | window.scrollTo({ 15 | top: eventSection.offsetTop - header.offsetHeight + blurOffset, 16 | behavior: 'smooth' 17 | }) 18 | } 19 | }) 20 | -------------------------------------------------------------------------------- /packages/website/src/sass/helpers/_breakpoints.sass: -------------------------------------------------------------------------------- 1 | $media-xs: 340px 2 | $media-s: 740px 3 | $media-m: 900px 4 | $media-l: 1200px 5 | $media-xl: 1600px 6 | 7 | =media($size, $diff: 0, $feature: max-width) 8 | 9 | @if $size == xs 10 | $size: $media-xs 11 | 12 | @else if $size == s 13 | $size: $media-s 14 | 15 | @else if $size == m 16 | $size: $media-m 17 | 18 | @else if $size == l 19 | $size: $media-l 20 | 21 | @else if $size == xl 22 | $size: $media-xl 23 | 24 | @media ($feature: $size + $diff) 25 | @content 26 | -------------------------------------------------------------------------------- /packages/website/src/sass/helpers/_colors.sass: -------------------------------------------------------------------------------- 1 | // base 2 | $black: #23242A 3 | $total-black: #000000 4 | $white: #FFFFFF 5 | $gray: #A4A4A4 6 | $dark: #767676 7 | $light: #F0F0F0 8 | $purple: #4D43FF 9 | 10 | // badge 11 | $badge-background: #FFF2D1 12 | $badge-text: #D09600 13 | $badge-decoration: #FFC123 14 | 15 | // decorators 16 | $decoration-gradient-orange: #FF8000 17 | $decoration-gradient-yellow: #FFC107 18 | $decoration-gradient-red: #FA6069 19 | $decoration-gradient-pink: #FF4880 20 | $decoration-gradient-tomato: #FB606A 21 | $decoration-gradient-blue: #0038FF 22 | $decoration-gradient-purple: #6058F2 23 | $decoration-gradient-violet: #7F30FF 24 | $decorator-line-gray: #D5DAE1 25 | $decorator-line-red: #FA6069 26 | 27 | // gradients 28 | 29 | $gradient-red-to-purple: linear-gradient(96.79deg, $decoration-gradient-red 32.86%, $decoration-gradient-purple 91.29%) 30 | 31 | // footer 32 | $footer-background: #151515 33 | -------------------------------------------------------------------------------- /packages/website/src/sass/helpers/_sizes.sass: -------------------------------------------------------------------------------- 1 | $container-default: 1120px 2 | $container-large: 1260px 3 | $container-full: 100% 4 | 5 | $container-padding-desktop: 48px 6 | $container-padding-mobile: 24px 7 | -------------------------------------------------------------------------------- /packages/website/src/sass/helpers/_transitions.sass: -------------------------------------------------------------------------------- 1 | $transition-duration: 0.25s 2 | $transition-xl-duration: 0.5s 3 | $all: all $transition-duration ease 4 | $all-xl: all $transition-xl-duration ease 5 | -------------------------------------------------------------------------------- /packages/website/src/sass/layout/_container.sass: -------------------------------------------------------------------------------- 1 | .container 2 | width: 100% 3 | max-width: calc($container-default + $container-padding-desktop + $container-padding-desktop) 4 | margin: 0 auto 5 | padding: 0 $container-padding-desktop 6 | 7 | +media(s) 8 | max-width: 100% 9 | padding: 0 $container-padding-mobile 10 | 11 | .container--large 12 | max-width: calc($container-large + $container-padding-desktop + $container-padding-desktop) 13 | 14 | +media(s) 15 | max-width: 100% 16 | 17 | .container--full 18 | max-width: 100% 19 | padding: 0 20 | overflow: hidden 21 | -------------------------------------------------------------------------------- /packages/website/src/sass/layout/_section.sass: -------------------------------------------------------------------------------- 1 | .section 2 | position: relative 3 | overflow: hidden 4 | 5 | &::before, 6 | &::after 7 | pointer-events: none 8 | user-select: none 9 | z-index: 1 10 | transition: $all 11 | 12 | .section .container 13 | z-index: 2 14 | position: relative 15 | -------------------------------------------------------------------------------- /packages/website/src/sass/main.sass: -------------------------------------------------------------------------------- 1 | @import helpers/reset 2 | @import helpers/transitions 3 | @import helpers/breakpoints 4 | @import helpers/sizes 5 | @import helpers/colors 6 | @import helpers/animations 7 | 8 | @import layout/base 9 | @import layout/container 10 | @import layout/section 11 | 12 | @import components/text 13 | @import components/badge 14 | @import components/button 15 | @import components/terminal 16 | @import components/slider 17 | @import components/navigation 18 | @import components/socials 19 | 20 | @import components/header 21 | @import components/footer 22 | 23 | @import sections/section-hero 24 | @import sections/section-dependents 25 | @import sections/section-testimonials 26 | @import sections/section-start 27 | @import sections/section-integration 28 | @import sections/section-features 29 | @import sections/section-resources 30 | @import sections/section-about 31 | -------------------------------------------------------------------------------- /packages/website/src/video/browser__desktop.mp4: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/website/src/video/browser__desktop.mp4 -------------------------------------------------------------------------------- /packages/website/src/video/browser__desktop.webm: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/website/src/video/browser__desktop.webm -------------------------------------------------------------------------------- /packages/website/src/video/browser__desktop@2x.mp4: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/website/src/video/browser__desktop@2x.mp4 -------------------------------------------------------------------------------- /packages/website/src/video/browser__desktop@2x.webm: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/website/src/video/browser__desktop@2x.webm -------------------------------------------------------------------------------- /packages/website/src/video/browser__mobile.mp4: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/website/src/video/browser__mobile.mp4 -------------------------------------------------------------------------------- /packages/website/src/video/browser__mobile.webm: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/website/src/video/browser__mobile.webm -------------------------------------------------------------------------------- /packages/website/src/video/browser__mobile@2x.mp4: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/website/src/video/browser__mobile@2x.mp4 -------------------------------------------------------------------------------- /packages/website/src/video/browser__mobile@2x.webm: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/website/src/video/browser__mobile@2x.webm -------------------------------------------------------------------------------- /packages/website/src/video/browser__tablet.mp4: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/website/src/video/browser__tablet.mp4 -------------------------------------------------------------------------------- /packages/website/src/video/browser__tablet.webm: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/website/src/video/browser__tablet.webm -------------------------------------------------------------------------------- /packages/website/src/video/browser__tablet@2x.mp4: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/website/src/video/browser__tablet@2x.mp4 -------------------------------------------------------------------------------- /packages/website/src/video/browser__tablet@2x.webm: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/website/src/video/browser__tablet@2x.webm -------------------------------------------------------------------------------- /packages/website/src/video/connect__desktop.mp4: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/website/src/video/connect__desktop.mp4 -------------------------------------------------------------------------------- /packages/website/src/video/connect__desktop.webm: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/website/src/video/connect__desktop.webm -------------------------------------------------------------------------------- /packages/website/src/video/connect__desktop@2x.mp4: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/website/src/video/connect__desktop@2x.mp4 -------------------------------------------------------------------------------- /packages/website/src/video/connect__desktop@2x.webm: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/website/src/video/connect__desktop@2x.webm -------------------------------------------------------------------------------- /packages/website/src/video/connect__mobile.mp4: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/website/src/video/connect__mobile.mp4 -------------------------------------------------------------------------------- /packages/website/src/video/connect__mobile.webm: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/website/src/video/connect__mobile.webm -------------------------------------------------------------------------------- /packages/website/src/video/connect__mobile@2x.mp4: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/website/src/video/connect__mobile@2x.mp4 -------------------------------------------------------------------------------- /packages/website/src/video/connect__mobile@2x.webm: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/website/src/video/connect__mobile@2x.webm -------------------------------------------------------------------------------- /packages/website/src/video/connect__tablet.mp4: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/website/src/video/connect__tablet.mp4 -------------------------------------------------------------------------------- /packages/website/src/video/connect__tablet.webm: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/website/src/video/connect__tablet.webm -------------------------------------------------------------------------------- /packages/website/src/video/connect__tablet@2x.mp4: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/website/src/video/connect__tablet@2x.mp4 -------------------------------------------------------------------------------- /packages/website/src/video/connect__tablet@2x.webm: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/website/src/video/connect__tablet@2x.webm -------------------------------------------------------------------------------- /packages/website/src/video/read__desktop.mp4: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/website/src/video/read__desktop.mp4 -------------------------------------------------------------------------------- /packages/website/src/video/read__desktop.webm: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/website/src/video/read__desktop.webm -------------------------------------------------------------------------------- /packages/website/src/video/read__desktop@2x.mp4: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/website/src/video/read__desktop@2x.mp4 -------------------------------------------------------------------------------- /packages/website/src/video/read__desktop@2x.webm: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/website/src/video/read__desktop@2x.webm -------------------------------------------------------------------------------- /packages/website/src/video/read__mobile.mp4: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/website/src/video/read__mobile.mp4 -------------------------------------------------------------------------------- /packages/website/src/video/read__mobile.webm: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/website/src/video/read__mobile.webm -------------------------------------------------------------------------------- /packages/website/src/video/read__mobile@2x.mp4: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/website/src/video/read__mobile@2x.mp4 -------------------------------------------------------------------------------- /packages/website/src/video/read__mobile@2x.webm: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/website/src/video/read__mobile@2x.webm -------------------------------------------------------------------------------- /packages/website/src/video/read__tablet.mp4: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/website/src/video/read__tablet.mp4 -------------------------------------------------------------------------------- /packages/website/src/video/read__tablet.webm: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/website/src/video/read__tablet.webm -------------------------------------------------------------------------------- /packages/website/src/video/read__tablet@2x.mp4: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/website/src/video/read__tablet@2x.mp4 -------------------------------------------------------------------------------- /packages/website/src/video/read__tablet@2x.webm: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/website/src/video/read__tablet@2x.webm -------------------------------------------------------------------------------- /packages/website/src/video/write__desktop.mp4: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/website/src/video/write__desktop.mp4 -------------------------------------------------------------------------------- /packages/website/src/video/write__desktop.webm: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/website/src/video/write__desktop.webm -------------------------------------------------------------------------------- /packages/website/src/video/write__desktop@2x.mp4: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/website/src/video/write__desktop@2x.mp4 -------------------------------------------------------------------------------- /packages/website/src/video/write__desktop@2x.webm: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/website/src/video/write__desktop@2x.webm -------------------------------------------------------------------------------- /packages/website/src/video/write__mobile.mp4: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/website/src/video/write__mobile.mp4 -------------------------------------------------------------------------------- /packages/website/src/video/write__mobile.webm: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/website/src/video/write__mobile.webm -------------------------------------------------------------------------------- /packages/website/src/video/write__mobile@2x.mp4: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/website/src/video/write__mobile@2x.mp4 -------------------------------------------------------------------------------- /packages/website/src/video/write__mobile@2x.webm: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/website/src/video/write__mobile@2x.webm -------------------------------------------------------------------------------- /packages/website/src/video/write__tablet.mp4: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/website/src/video/write__tablet.mp4 -------------------------------------------------------------------------------- /packages/website/src/video/write__tablet.webm: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/website/src/video/write__tablet.webm -------------------------------------------------------------------------------- /packages/website/src/video/write__tablet@2x.mp4: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/website/src/video/write__tablet@2x.mp4 -------------------------------------------------------------------------------- /packages/website/src/video/write__tablet@2x.webm: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/TrueFiEng/useDApp/e0c8437b0726ff2c6b1b4772cf031d46941530e8/packages/website/src/video/write__tablet@2x.webm -------------------------------------------------------------------------------- /pnpm-workspace.yaml: -------------------------------------------------------------------------------- 1 | packages: 2 | - 'packages/**' 3 | -------------------------------------------------------------------------------- /scripts/dev-version.sh: -------------------------------------------------------------------------------- 1 | #!/usr/bin/env bash 2 | 3 | set -e 4 | DEV=$(jq -r ".version" package.json | awk -F "-" '{print $1}')-dev.$(git rev-parse --short HEAD) 5 | cat <<< "$(jq --arg DEV "$DEV" ".version = \"$DEV\"" package.json)" > package.json 6 | cat <<< "$(jq ".publishConfig.tag = \"dev\"" package.json)" > package.json 7 | -------------------------------------------------------------------------------- /tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "strict": true, 4 | "jsx": "react-jsx", 5 | "esModuleInterop": true, 6 | "forceConsistentCasingInFileNames": true 7 | } 8 | } 9 | --------------------------------------------------------------------------------