{"id":18738055,"url":"https://github.com/blocknative/assist","last_synced_at":"2026-03-13T14:31:29.021Z","repository":{"id":34070016,"uuid":"166121522","full_name":"blocknative/assist","owner":"blocknative","description":"Blocknative Assist widget for blockchain usability","archived":false,"fork":false,"pushed_at":"2022-12-10T17:05:10.000Z","size":2867,"stargazers_count":54,"open_issues_count":35,"forks_count":14,"subscribers_count":20,"default_branch":"master","last_synced_at":"2025-08-09T02:38:02.393Z","etag":null,"topics":["dapp","onboard","widget"],"latest_commit_sha":null,"homepage":null,"language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/blocknative.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2019-01-16T22:26:08.000Z","updated_at":"2025-08-07T03:01:44.000Z","dependencies_parsed_at":"2023-01-15T04:24:03.972Z","dependency_job_id":null,"html_url":"https://github.com/blocknative/assist","commit_stats":null,"previous_names":[],"tags_count":42,"template":false,"template_full_name":null,"purl":"pkg:github/blocknative/assist","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/blocknative%2Fassist","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/blocknative%2Fassist/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/blocknative%2Fassist/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/blocknative%2Fassist/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/blocknative","download_url":"https://codeload.github.com/blocknative/assist/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/blocknative%2Fassist/sbom","scorecard":{"id":243778,"data":{"date":"2025-08-11","repo":{"name":"github.com/blocknative/assist","commit":"3fb619e3994752eacbddba4078d2bf0cbc7e2c9c"},"scorecard":{"version":"v5.2.1-40-gf6ed084d","commit":"f6ed084d17c9236477efd66e5b258b9d4cc7b389"},"score":2.1,"checks":[{"name":"Packaging","score":-1,"reason":"packaging workflow not detected","details":["Warn: no GitHub/GitLab publishing workflow detected."],"documentation":{"short":"Determines if the project is published as a package that others can easily download, install, easily update, and uninstall.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#packaging"}},{"name":"Dangerous-Workflow","score":-1,"reason":"no workflows found","details":null,"documentation":{"short":"Determines if the project's GitHub Action workflows avoid dangerous patterns.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#dangerous-workflow"}},{"name":"Token-Permissions","score":-1,"reason":"No tokens found","details":null,"documentation":{"short":"Determines if the project's workflows follow the principle of least privilege.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#token-permissions"}},{"name":"Maintained","score":0,"reason":"0 commit(s) and 0 issue activity found in the last 90 days -- score normalized to 0","details":null,"documentation":{"short":"Determines if the project is \"actively maintained\".","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#maintained"}},{"name":"Code-Review","score":1,"reason":"Found 2/19 approved changesets -- score normalized to 1","details":null,"documentation":{"short":"Determines if the project requires human code review before pull requests (aka merge requests) are merged.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#code-review"}},{"name":"Binary-Artifacts","score":10,"reason":"no binaries found in the repo","details":null,"documentation":{"short":"Determines if the project has generated executable (binary) artifacts in the source repository.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#binary-artifacts"}},{"name":"CII-Best-Practices","score":0,"reason":"no effort to earn an OpenSSF best practices badge detected","details":null,"documentation":{"short":"Determines if the project has an OpenSSF (formerly CII) Best Practices Badge.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#cii-best-practices"}},{"name":"Pinned-Dependencies","score":-1,"reason":"no dependencies found","details":null,"documentation":{"short":"Determines if the project has declared and pinned the dependencies of its build process.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#pinned-dependencies"}},{"name":"Security-Policy","score":0,"reason":"security policy file not detected","details":["Warn: no security policy file detected","Warn: no security file to analyze","Warn: no security file to analyze","Warn: no security file to analyze"],"documentation":{"short":"Determines if the project has published a security policy.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#security-policy"}},{"name":"Fuzzing","score":0,"reason":"project is not fuzzed","details":["Warn: no fuzzer integrations found"],"documentation":{"short":"Determines if the project uses fuzzing.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#fuzzing"}},{"name":"License","score":10,"reason":"license file detected","details":["Info: project has a license file: LICENSE:0","Info: FSF or OSI recognized license: MIT License: LICENSE:0"],"documentation":{"short":"Determines if the project has defined a license.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#license"}},{"name":"Signed-Releases","score":-1,"reason":"no releases found","details":null,"documentation":{"short":"Determines if the project cryptographically signs release artifacts.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#signed-releases"}},{"name":"Branch-Protection","score":-1,"reason":"internal error: error during GetBranch(develop): error during branchesHandler.query: internal error: githubv4.Query: Resource not accessible by integration","details":null,"documentation":{"short":"Determines if the default and release branches are protected with GitHub's branch protection settings.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#branch-protection"}},{"name":"SAST","score":0,"reason":"SAST tool is not run on all commits -- score normalized to 0","details":["Warn: 0 commits out of 30 are checked with a SAST tool"],"documentation":{"short":"Determines if the project uses static code analysis.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#sast"}},{"name":"Vulnerabilities","score":0,"reason":"104 existing vulnerabilities detected","details":["Warn: Project is vulnerable to: GHSA-968p-4wvh-cqc8","Warn: Project is vulnerable to: GHSA-67hx-6x53-jw92","Warn: Project is vulnerable to: GHSA-6chw-6frg-f759","Warn: Project is vulnerable to: GHSA-v88g-cgmw-v5xw","Warn: Project is vulnerable to: GHSA-93q8-gq69-wqmw","Warn: Project is vulnerable to: GHSA-fwr7-v2mv-hh25","Warn: Project is vulnerable to: GHSA-wrw9-m778-g6mc","Warn: Project is vulnerable to: GHSA-pp7h-53gx-mx7r","Warn: Project is vulnerable to: GHSA-qwcr-r2fm-qrc7","Warn: Project is vulnerable to: GHSA-v6h2-p8h4-qcjw","Warn: Project is vulnerable to: GHSA-cwfw-4gq5-mrqx","Warn: Project is vulnerable to: GHSA-g95f-p29q-9xw4","Warn: Project is vulnerable to: GHSA-grv7-fg5c-xmjg","Warn: Project is vulnerable to: GHSA-x9w5-v3q2-3rhw","Warn: Project is vulnerable to: GHSA-w8qv-6jwh-64r5","Warn: Project is vulnerable to: GHSA-pxg6-pf52-xh8x","Warn: Project is vulnerable to: GHSA-h452-7996-h45h","Warn: Project is vulnerable to: GHSA-3xgq-45jj-v275","Warn: Project is vulnerable to: GHSA-3w3w-pxmm-2w2j","Warn: Project is vulnerable to: GHSA-xwcq-pm8m-c4vf","Warn: Project is vulnerable to: GHSA-gxpj-cx7g-858c","Warn: Project is vulnerable to: GHSA-w573-4hg7-7wgq","Warn: Project is vulnerable to: GHSA-qgfr-5hqp-vrw9","Warn: Project is vulnerable to: GHSA-vh7m-p724-62c2","Warn: Project is vulnerable to: GHSA-r9p9-mrjm-926w","Warn: Project is vulnerable to: GHSA-434g-2637-qmqr","Warn: Project is vulnerable to: GHSA-49q7-c7j4-3p7m","Warn: Project is vulnerable to: GHSA-977x-g7h5-7qgw","Warn: Project is vulnerable to: GHSA-f7q4-pwc6-w24p","Warn: Project is vulnerable to: GHSA-fc9h-whq2-v747","Warn: Project is vulnerable to: GHSA-vjh7-7g9h-fjfh","Warn: Project is vulnerable to: GHSA-rv95-896h-c2vc","Warn: Project is vulnerable to: GHSA-qw6h-vgh9-j6wx","Warn: Project is vulnerable to: GHSA-fjxv-7rqg-78g4","Warn: Project is vulnerable to: GHSA-8r6j-v8pm-fqw3","Warn: Project is vulnerable to: MAL-2023-462","Warn: Project is vulnerable to: GHSA-pfrx-2q88-qq97","Warn: Project is vulnerable to: GHSA-w457-6q6x-cgp9","Warn: Project is vulnerable to: GHSA-62gr-4qp9-h98f","Warn: Project is vulnerable to: GHSA-f52g-6jhx-586p","Warn: Project is vulnerable to: GHSA-2cf5-4w76-r9qv","Warn: Project is vulnerable to: GHSA-3cqr-58rm-57f8","Warn: Project is vulnerable to: GHSA-g9r4-xpmj-mj65","Warn: Project is vulnerable to: GHSA-q2c6-c6pm-g3gh","Warn: Project is vulnerable to: GHSA-765h-qjxv-5f44","Warn: Project is vulnerable to: GHSA-f2jv-r9rf-7988","Warn: Project is vulnerable to: GHSA-43f8-2h32-f4cj","Warn: Project is vulnerable to: GHSA-qqgx-2p2h-9c37","Warn: Project is vulnerable to: GHSA-896r-f27r-55mw","Warn: Project is vulnerable to: GHSA-9c47-m6qq-7p4h","Warn: Project is vulnerable to: GHSA-6c8f-qphg-qjgp","Warn: Project is vulnerable to: GHSA-p6mc-m468-83gw","Warn: Project is vulnerable to: GHSA-29mw-wpgm-hmr9","Warn: Project is vulnerable to: GHSA-35jh-r3h4-6jhm","Warn: Project is vulnerable to: GHSA-4xcv-9jjx-gfj3","Warn: Project is vulnerable to: GHSA-7wpw-2hjm-89gp","Warn: Project is vulnerable to: GHSA-952p-6rrq-rcjv","Warn: Project is vulnerable to: GHSA-f8q6-p94x-37v3","Warn: Project is vulnerable to: GHSA-vh95-rmgr-6w4m","Warn: Project is vulnerable to: GHSA-xvch-5gv4-984h","Warn: Project is vulnerable to: GHSA-pc58-wgmc-hfjr","Warn: Project is vulnerable to: GHSA-vvv8-xw5f-3f88","Warn: Project is vulnerable to: GHSA-5fw9-fq32-wv5p","Warn: Project is vulnerable to: GHSA-hj48-42vr-x3v9","Warn: Project is vulnerable to: GHSA-9wv6-86v2-598j","Warn: Project is vulnerable to: GHSA-rhx6-c78j-4q9w","Warn: Project is vulnerable to: GHSA-h7cp-r72f-jxh6","Warn: Project is vulnerable to: GHSA-v62p-rq8g-8h59","Warn: Project is vulnerable to: GHSA-hrpp-h998-j3pp","Warn: Project is vulnerable to: GHSA-p8p7-x288-28g6","Warn: Project is vulnerable to: GHSA-gcx4-mw62-g8wm","Warn: Project is vulnerable to: GHSA-584q-6j8j-r5pm","Warn: Project is vulnerable to: GHSA-x6fg-f45m-jf5q","Warn: Project is vulnerable to: GHSA-c2qf-rxjj-qqgw","Warn: Project is vulnerable to: GHSA-m6fv-jmcg-4jfg","Warn: Project is vulnerable to: GHSA-h9rv-jmmf-4pgx","Warn: Project is vulnerable to: GHSA-hxcc-f52p-wc94","Warn: Project is vulnerable to: GHSA-cm22-4g7w-348p","Warn: Project is vulnerable to: GHSA-4g88-fppr-53pp","Warn: Project is vulnerable to: GHSA-4jqc-8m5r-9rpr","Warn: Project is vulnerable to: GHSA-wpg7-2c88-r8xv","Warn: Project is vulnerable to: GHSA-3jfq-g458-7qm9","Warn: Project is vulnerable to: GHSA-5955-9wpr-37jh","Warn: Project is vulnerable to: GHSA-f5x3-32g6-xq36","Warn: Project is vulnerable to: GHSA-r628-mhmh-qjhw","Warn: Project is vulnerable to: GHSA-9r2w-394v-53qc","Warn: Project is vulnerable to: GHSA-qq89-hq3f-393p","Warn: Project is vulnerable to: GHSA-29xr-v42j-r956","Warn: Project is vulnerable to: GHSA-52f5-9888-hmc6","Warn: Project is vulnerable to: GHSA-jgrx-mgxx-jf9v","Warn: Project is vulnerable to: GHSA-72xf-g2v4-qvf3","Warn: Project is vulnerable to: GHSA-cf4h-3jhx-xvhq","Warn: Project is vulnerable to: GHSA-46c4-8wrp-j99v","Warn: Project is vulnerable to: GHSA-9m6j-fcg5-2442","Warn: Project is vulnerable to: GHSA-hh27-ffr2-f2jc","Warn: Project is vulnerable to: GHSA-rqff-837h-mm52","Warn: Project is vulnerable to: GHSA-8v38-pw62-9cw2","Warn: Project is vulnerable to: GHSA-hgjh-723h-mx2j","Warn: Project is vulnerable to: GHSA-jf5r-8hm2-f872","Warn: Project is vulnerable to: GHSA-27v7-qhfv-rqq8","Warn: Project is vulnerable to: GHSA-3h5v-q93c-6h6q","Warn: Project is vulnerable to: GHSA-6fc8-4gx4-v693","Warn: Project is vulnerable to: GHSA-c4w7-xm78-47vh","Warn: Project is vulnerable to: GHSA-p9pc-299p-vxgp"],"documentation":{"short":"Determines if the project has open, known unfixed vulnerabilities.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#vulnerabilities"}}]},"last_synced_at":"2025-08-17T07:08:17.899Z","repository_id":34070016,"created_at":"2025-08-17T07:08:17.899Z","updated_at":"2025-08-17T07:08:17.899Z"},"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":30468276,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-03-13T11:00:43.441Z","status":"ssl_error","status_checked_at":"2026-03-13T11:00:23.173Z","response_time":60,"last_error":"SSL_connect returned=1 errno=0 peeraddr=140.82.121.6:443 state=error: unexpected eof while reading","robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":false,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["dapp","onboard","widget"],"created_at":"2024-11-07T15:28:01.188Z","updated_at":"2026-03-13T14:31:28.976Z","avatar_url":"https://github.com/blocknative.png","language":"JavaScript","readme":"# Assist.js\n\nTakes care of onboarding your users, keeping them informed about\ntransaction status and comprehensive usage analytics with minimal\nsetup. Supports `web3.js` versions `0.20`, `1.0.0-beta`, `1.2.0`, `ethers.js` versions `^4.0.20` and `^5.0-beta-137`\n\n_note: `web3.js` 1.0.0-beta versions 38, 39, 40, 41, 42, 43, 44, 45 have bugs when interacting with MetaMask, we recommend you avoid these versions of `web3.js`_\n\n## Preview\n\n![Assist's UI elements](https://i.imgur.com/UlJ8F7m.jpg)\n\n☝️ A collection of Assist's UI elements.\n\n👇 Assist's transaction notifications in action.\n\n![Assist's transaction notifications](https://media.giphy.com/media/ZgSzBEev0pEym34rb1/giphy.gif)\n\n## Getting Started\n\nTo integrate Assist.js into your Dapp, you'll need to do 5 things:\n\n1. Create a free account and get an API key from [account.blocknative.com](https://account.blocknative.com)\n2. Install the widget\n3. Initialize the library\n4. Call `onboard`\n5. Decorate your contracts\n\n### Install the widget\n\n#### npm\n\n```bash\nnpm i bnc-assist\n```\n\n#### Yarn\n\n```bash\nyarn add bnc-assist\n```\n\n#### Script Tag\n\nThe library uses [semantic versioning](https://semver.org/spec/v2.0.0.html).\nThe current version is 0.10.3.\nThere are minified and non-minified versions.\nPut this script at the top of your `\u003chead\u003e`\n\n```html\n\u003cscript src=\"https://assist.blocknative.com/0-10-3/assist.js\"\u003e\u003c/script\u003e\n\n\u003c!-- OR... --\u003e\n\n\u003cscript src=\"https://assist.blocknative.com/0-10-3/assist.min.js\"\u003e\u003c/script\u003e\n```\n\n### Initialize the Library\n\nFull documentation of the `config` object is below, but the minimum required `config`\nis as follows:\n\n```javascript\nvar bncAssistConfig = {\n  dappId: apiKey, // [String] The API key created on https://account.blocknative.com\n\n  networkId: networkId // [Integer] The network ID of the Ethereum network your dapp is deployed on.\n  //           See below for instructions on how to setup for local blockchains.\n}\n\nvar assistInstance = assist.init(bncAssistConfig)\n```\n\n### Call `onboard`\n\nAt some point in your Dapp's workflow, you'll want to ensure users are within an environment which\nwill allow them to make transactions, such as a browser with MetaMask, unlocked wallet, etc.\nThis is done by calling `onboard`. Some Dapps might want to call `onboard` immediately upon any page\nload. Others may wait until loading certain pages or until a certain button is clicked.\nIn any event, it is as simple as calling:\n\n```javascript\nassistInstance\n  .onboard()\n  .then(function(state) {\n    // User has been successfully onboarded and is ready to transact\n    // Will resolve with the current state of the user\n    // This means we can be sure of the following user properties:\n    //  - They are using a compatible browser\n    //  - They have a web3-enabled wallet installed\n    //  - The wallet is connected to the config-specified networkId\n    //  - The wallet is unlocked and contains at least `minimumBalance` in wei\n    //  - They have connected their wallet to the dapp, congruent with EIP1102\n  })\n  .catch(function(state) {\n    // The user exited onboarding before completion\n    // Will let you know what stage of onboarding the user was up to when they exited via the state object\n  })\n```\n\n### Decorate Your Contracts\n\nThe first three steps in the getting started flow will get your users onboarded. This step adds\ntransaction support in order to help guide your users through a series of issues that can arise\nwhen signing transactions.\n\nUsing our decorated contracts will also enable some anonymized transaction-level metrics to give\nyou insights into things including but not limited to:\n\n- How many transactions fail because a user doesn't have enough Ether\n- How many transactions are started but rejected by the user\n- How many users come to your Dapp without a Web3 wallet\n\nDecorating your contracts is simple:\n\n```javascript\nvar myContract = new web3.eth.Contract(abi, address)\n// Assist can decorate ethers instantiated contracts as well\nvar myDecoratedContract = assistInstance.Contract(myContract)\n\n// and then replace `myContract` with `myDecoratedContract`\n// throughout your app\n// ...\n```\n\nYou can then use `myDecoratedContract` instead of `myContract`.\n\nTo speed things up, you can decorate the contract inline:\n\n```javascript\nvar myContract = assistInstance.Contract(new web3.eth.Contract(abi, address))\n```\n\n### Ethers Contracts\n\nIf you are using `ethers.js` you will need to pass in the `address` and the `abi` to Assist's `Contract` function so that Assist can instantiate it with the `UncheckedJsonRpcSigner`. This is critical for Assist's transaction notifications to work correctly. An example of how to create an ethers contract:\n\n```javascript\nvar myContract = assistInstance.Contract(address, abi)\n```\n\n### Initializing `web3` and including it in the `config`\n\n`web3` isn't a required parameter as you might not have access to a provider to instantiate Web3 with until after the user has been onboarded and has a wallet installed. We recommend instantiating `web3` at the top level of your Dapp once the window object is available like this:\n\n```javascript\nlet web3Instance\n\nif (window.ethereum) {\n  web3Instance = new Web3(window.ethereum)\n}\n\nif (window.web3) {\n  web3Instance = new Web3(window.web3.currentProvider)\n}\n```\n\nPass this instance in to the config (even if it is undefined). If the user didn't have a wallet when first arriving to your Dapp, they will go through onboarding which will refresh the page once they have a wallet. On the refresh, the above Web3 instantiation code will now get initialized with the provider.\n\nIf you _don't_ include your instantiated Web3 instance in the config, Assist will grab `web3` from the window object if it is available. However this can cause issues as `web3` isn't always added to the window object (ie on some mobile wallets) and the version of `web3` that is usually attached to the window object is `0.20`. So if you happen to be using `1.0` but didn't pass it in, then your contracts won't be decorated correctly.\n\n### Truffle Contracts and minification\n\nFor assist.js to work correctly with Truffle contracts, you must not minify function names (fnames) in your build.\n\nInstructions on how to disable minification of fnames:\n\n- [Terser](https://github.com/terser-js/terser#minify-options)\n- [Uglify](https://github.com/mishoo/UglifyJS2#minify-options)\n- [Webpack terser plugin](https://github.com/webpack-contrib/terser-webpack-plugin#terseroptions)\n- [Webpack uglify plugin](https://github.com/webpack-contrib/uglifyjs-webpack-plugin#uglifyoptions)\n- [Rollup terser plugin](https://github.com/TrySound/rollup-plugin-terser#options)\n- [Rollup uglify plugin](https://github.com/TrySound/rollup-plugin-uglify#options)\n\n## API Reference\n\n### Config\n\nA JavaScript Object that is passed to the `init` function. Default values are in [square brackets] where they are set by Assist.js.\n\n```javascript\nvar config = {\n  networkId: Number, // The network id of the Ethereum network your Dapp is working with (REQUIRED)\n  dappId: String, // The API key supplied to you by Blocknative (REQUIRED)\n  web3: Object, // The instantiated version of web3 that the Dapp is using\n  ethers: Object, // Pass in ethers if using instead of web3 (this is required if you are using ethers)\n  mobileBlocked: Boolean, // Defines if the Dapp works on mobile [false]\n  minimumBalance: String, // Defines the minimum balance in Wei that a user needs to have to use the Dapp [0]\n  headlessMode: Boolean, // Turn off Assist UI, but still retain analytics collection [false]\n  browserCheck: Boolean, // Check if the user is on a browser that supports extension wallets during onboarding [true]\n  messages: {\n    // See custom transaction messages section below for more details\n    txRequest: Function, // Transaction request has been initiated and is awaiting user approval\n    txSent: Function, // Transaction has been sent to the network\n    txPending: Function, // Transaction is pending and has been detected in the mempool\n    txSendFail: Function, // Transaction failed to be sent to the network\n    txUnderpriced: Function, // Transaction gas limit was set too low\n    txError: Function, // An unknown MetaMask / JSON RPC error occurred when trying to send the transaction\n    txStallPending: Function, // Transaction was sent to the network but has not been detected in the txPool\n    txStallConfirmed: Function, // Transaction has been detected in the mempool but hasn't been confirmed\n    txFailed: Function, // Transaction failed\n    nsfFail: Function, // User doesn't have enough funds to complete transaction\n    txRepeat: Function, // Warning to user that they might be repeating a transaction\n    txAwaitingApproval: Function, // Warning to the user that they have a previous transaction awaiting approval\n    txConfirmReminder: Function, // A warning to the user that their current transaction is still awaiting approval\n    txConfirmed: Function, // Transaction is confirmed\n    txSpeedUp: Function // The user has re-submitted a transaction with a higher gas price\n  },\n  images: {\n    welcome: {\n      src: String, // Image URL for welcome onboard modal\n      srcset: String // Image URL(s) for welcome onboard modal\n    },\n    complete: {\n      src: String, // Image URL for complete onboard modal\n      srcset: String // Image URL(s) for complete onboard modal\n    }\n  },\n  style: {\n    darkMode: Boolean, // Set Assist UI to dark mode\n    notificationsPosition: Object || String, // Defines where in the viewport notifications will be positioned. See below: 'Notification Positioning'\n    css: String // Custom css string to overide Assist default styles\n  },\n  handleNotificationEvent: Function // Called on every tx notification event with a transaction event object\n  timeouts: {\n    txStallPending: Number // The number of milliseconds after a transaction has been sent before showing a stall notification detected in the mempool\n    txStallConfirmed: Number // The number of milliseconds after a transaction has been detected in the mempool before showing a stall notification if not confirmed\n  },\n  recommendedWallets: {\n    desktop: Array, // Array of Objects that define wallets this dapp supports on desktop to users that don't have a wallet\n    mobile: Array // Array of Objects that define wallets this dapp supports on mobile to users that don't have a wallet\n  }\n}\n```\n\n### Notification Positioning\n\nThe position that notifications appear in the viewport can be configured by defining `style.notificationsPosition` in your config when initializing assist.\n\n`notificationsPosition` can be either a `String` which will set only the desktop position, or an `Object` containing params `desktop` and/or `mobile` which set the notification position on desktop and mobile respectively.\n\nOptions for setting `desktop` positions: `['topLeft', 'topRight', 'bottomLeft', 'bottomRight']`\n\nOptions for setting `mobile` positions: `['top', 'bottom']`\n\nBy default, `Assist` positions notifications at the `top` of the viewport on mobile, and the `bottomRight` of the viewport on desktop.\n\n#### Examples\n\n```javascript\n// Set notifications to bottom on mobile and top right on desktop\nvar config = {\n  style: {\n    notificationsPosition: {\n      desktop: 'topLeft',\n      mobile: 'bottom'\n    }\n  }\n}\n```\n\n```javascript\n// Sets only the desktop position\nvar config = {\n  style: {\n    notificationsPosition: 'bottomRight'\n  }\n}\n```\n\n### Handling Notifications\n\nIf you want more fine grained control over whether Assist's notifications are displayed or you just want to be informed of every event, you can define a function that will be called every time there is a notification event.\n\nThe function that is defined on the `handleNotificationEvent` property of the config will be called with the following object:\n\n```javascript\n{\n  categoryCode: String, // event category - List detailed below\n  eventCode: String, // event type - List detailed below\n  contract: { // if not a contract method transaction, then this is undefined\n    methodName: String, // name of the method that was called\n    parameters: Array, // the parameters the method was called with\n  },\n  inlineCustomMsgs: Object | Boolean, // the inline custom messages passed to the transaction\n  reason: String, // reason for error type notifications\n  transaction: {\n    id: String, // internal unique id for the transaction (remains constant even if transaction hash changes due to speedup or cancel)\n    from: String, // the address the transaction was sent from\n    gas: String, // the gas limit of the transaction\n    gasPrice: String, // the gas price of the transaction\n    to: String, // the address the transaction was sent to\n    value: String // the value of the transaction\n    hash: String // the transaction hash (updated to a new hash if transaction is sped up or cancelled)\n    originalHash: String, // if transaction was sped up or cancelled, the original transaction hash\n    receipt: Object || undefined // Will be an object on a txConfirmedClient event. Is the receipt object that is received from web3 or ethers\n  },\n  wallet: {\n    address: String, // the account address of the wallet in use\n    balance: String, // the balance in wei of the wallet in use\n    minimum: Boolean, // whether the wallet has the minimum balance required (specified in config)\n    provider: String // the name of the wallet provider\n  }\n}\n```\n\nYou can then decide whether you would like a notification to be shown for this event or not. Return `true` to show the notification or `false` to not show the notification.\n\n#### `eventCode`\n\nThe list of event codes that are included in the object that `handleNotificationEvent` is called with are the same as the list included in the `messages` object that is passed to the config with one addition:\n\n```javascript\ntxConfirmedClient: String // called when a client confirmation is received from the provider\n```\n\nThis additional event is used to notify transaction confirmation if a `txConfirmed` was not already received. Whichever of `txConfirmed` and `txConfirmedClient` is received first should be used for notification.\n\nFor documentation on the rest of the event codes see the documentation for the messages parameter of the config object.\n\n#### `categoryCode`\n\nThe following list of category codes can be included in the object that `handleNotificationEvent` is called with:\n\n```javascript\n  activePreflight: String, // called during preflight transaction checks\n  activeTransaction: String, // called during an active non-contract transaction\n  activeContract: String // called during an active contract transaction\n```\n\n#### Selectively display Notification UI\n\nIf you would like Assist to display a notification for the current event, then return a \"truthy\" value from the `handleNotificationEvent` function. If you don't want a notification to be displayed then just return a \"falsy\" value.\n\n### Custom Transaction Messages\n\nCustom transaction messages can be set to override the default messages `Assist` provides. To do this you provide callback functions for each `eventCode` that you want to override. The callback functions must return a `String` and will be called with the following object to provide context information about the transaction:\n\n```javascript\n{\n  transaction: {\n    to: String, // The address the transaction is going to\n    gas: String, // Gas (wei)\n    gasPrice: String, // Gas price (wei)\n    hash: String, // The transaction hash\n    nonce: Number, // The transaction nonce\n    value: String, // The value of the transaction (wei)\n    receipt: Object || undefined // Will be an object on txConfirmedClient event\n  },\n  contract: {\n    // This object will be undefined if it is not a contract transaction\n    methodName: String, // The name of the method that was called\n    parameters: Array // The parameters that the method was called with\n  }\n}\n```\n\nYou can provide a `messages` object to the `config` to set global message overrides. Each callback can parse the context object that is passed to it and decide what to return or just return a standard message for each `eventCode`:\n\n```javascript\nvar config = {\n  //...\n  messages: {\n    txSent: function(data) {\n      return 'Your transaction has been sent to the network'\n    },\n    txConfirmed: function(data) {\n      if (data.contract.methodName === 'contribute') {\n        return 'Congratulations! You are now a contributor to the campaign'\n      }\n    }\n    // ....\n  }\n}\n```\n\nSometimes you want more granular control over the transaction messages and you have all the relevant information you need to create a custom transaction message at the time of calling the method. In that case, you can also add custom transactions messages inline with your transaction calls which take precedent over the messages set globally in the config.\n\n#### Example\n\n```javascript\n// 0.2 style send\nmyContract.vote(param1, param2, options, callback, {\n  messages: { txPending: () =\u003e `Voting for ${param1} in progress` }\n})\n\n// 1.0 style send\nmyContract.vote(param1, param2).send(options, {\n  messages: { txPending: () =\u003e `Voting for ${param1} in progress` }\n})\n\n// Transaction\nTransaction(txObject, callback, {\n  messages: { txPending: () =\u003e 'Sending ETH...' }\n})\n```\n\nThe `messages` object _must_ always be the _last_ argument provided to the send method for it to be recognized.\n\n### Click handlers for transaction notifications\n\nYou can also add click handler functions to a transaction that will be executed when the user clicks on the notification.\n\n```javascript\nmyContract.vote(param1, param2, options, callback, {\n  messages: { txPending: () =\u003e `Voting for ${param1} in progress` },\n  clickHandlers: {\n    txPending: () =\u003e route('./votes'), // can specify a click handler for specific event codes which takes precedence\n    onclick: () =\u003e console.log('this is the global click handler') // or you can specify a onclick function which will run for every event for this transaction that doesn't have a click handler specified\n  }\n})\n```\n\n### Transaction Events\n\nBy defining a function and including it in the config on the `handleNotificationEvent` property you can hook in to all of the transaction events within Assist. The function will be called with a transaction event object which has the following properties:\n\n```javascript\n{\n  categoryCode: \"activeTransaction\"\n  contract: Object { methodName: \"highFive\", parameters: (1) […] }\n  eventCode: \"txPending\"\n  inlineCustomMsgs: false\n  transaction: Object { id: \"f64a4c67-f349-4da7-8d6b-55e92525e60b\", gas: \"24268\", gasPrice: \"1000000000\", … }\n}\n```\n\nIf you want Assist to still go ahead and show the notification, return `true` from the function. If you don't want the notification to display, then return `false`.\n\n### Ethereum Network Ids\n\nThe available ids for the `networkId` property of the config object:\n\n- `1`: mainnet\n- `3`: ropsten testnet\n- `4`: rinkeby testnet\n- `5`: goerli testnet\n\n_The kovan testnet is not supported._\n\n#### Local Networks\n\nWhen you are running locally (e.g. using ganache), set `networkId` in the config to the network id that the local network is set to. Any number that is not `1`, `3`, `4` and `42` is valid and will be recognized as a local network. If using the Ganache CLI you can set the network id via the `--networkId` option.\n\n### State\n\n`Assist` keeps track of the current state of the user environment as a JavaScript Object\n\n```javascript\nstate = {\n  mobileDevice: Boolean, // User is on a mobile device\n  validBrowser: Boolean, // User is on a valid web3 browser\n  currentProvider: String, // Current provider being used to connect to the network\n  web3Wallet: Boolean, // User has a web3Wallet installed\n  accessToAccounts: Boolean, // Dapp has access to accounts\n  walletLoggedIn: Boolean, // User is logged in to wallet\n  walletEnabled: Boolean, // User has enabled EIP 1102 compliant wallet\n  accountAddress: String, // Address of the user's selected account\n  accountBalance: String, // User account balance\n  minimumBalance: String, // User has the minimum balance specified in the config\n  userCurrentNetworkId: Number, // Network id of the network the user is currently on\n  correctNetwork: Boolean // User is on the network specified in the config\n}\n```\n\nThe promises that are returned from calls to `getState` and `onboard` resolve and reject with this `state` object.\n\n### Errors\n\nAll errors are called with `eventCode` and `message` properties.\n\n#### Example\n\n```javascript\n{\n  eventCode: 'initFail',\n  message: 'An API key is required to run Assist'\n}\n```\n\n#### Error Codes\n\nThe following are the possible error codes from Assist.js.\n\n```\ninitFail          - initialization of the library failed\nmobileBlocked     - mobile browsers are blocked from accessing this dapp\nbrowserFail       - browser is not compatible with web3.js wallets\nwalletFail        - user does not have a web3-enabled wallet installed\nwalletEnableFail  - user has not logged into their wallet\nnetworkFail       - user's web3 wallet is not connected to the correct network\nnsfFail           - user does not have enough funds in their wallet\n```\n\n### Headless Mode\n\nBy default, Assist will create UI elements in your application at certain times to guide users. You can disable this feature and run Assist in \"headless mode\" by setting `headlessMode: true` in the config. This still enables you to collect analytics, but won't change the underlying behaviour of your application at all.\n\n### Mobile Dapps\n\nIf your Dapp _doesn't_ support mobile browsers, setting `mobileBlocked: true` in the config will detect mobile user agents and show UI that will direct them to use a desktop browser instead.\n\nAssist supports mobile onboarding and transaction support. The onboarding UI has a modal for making sure that the user:\n\n- Is on a mobile Dapp browser/wallet\n- Is on the correct network\n- Has enabled connection to their wallet (if the wallet is using a modern Ethereum provider)\n- Has the minimum balance (if set in the config)\n\n### Minimum Balance\n\nBy supplying an amount of wei to the `minimumBalance` option of the config, developers can limit access to their Dapp to users who have at least this much Ether in their wallet.\n\n### Repeat Transactions\n\nAssist will detect transactions which look to be repeated. We notify users of repeat transactions when we see sequential transactions with the same `to` address and the same `value`.\n\n### Recommended Wallets\n\nIf you would like to define which wallets your dapp works with and recommends to users that don't currently have a wallet installed, you can define it in the config for desktop and mobile devices:\n\n```javascript\n{\n  recommendedWallets: {\n    desktop: [\n      {\n        name: 'MetaMask',\n        link: 'https://metamask.io/',\n        icon: 'https://metamask.io/img/metamask.png'\n      }\n      // other desktop wallets your dapp supports here\n    ],\n    mobile: [\n      {\n        name: 'Coinbase',\n        link: 'https://wallet.coinbase.com/',\n        icon: 'https://cdn-images-1.medium.com/max/1200/1*7ywNS48PnonfsvvMu1tTsA.png'\n      }\n      // other mobile wallets your dapp supports here\n    ]\n  }\n}\n```\n\n#### Assist currently only supports the following wallets:\n\n##### Desktop\n\n- MetaMask\n  - link: https://metamask.io/img/metamask.png\n  - icon: https://metamask.io/img/metamask.png\n- Opera\n  - link: https://www.opera.com/\n  - icon: https://images-na.ssl-images-amazon.com/images/I/71Y2mhDkBNL.png\n\n##### Mobile\n\n- Opera Touch\n  - link: https://www.opera.com/mobile/touch\n  - icon: https://apps.goodereader.com/wp-content/uploads/icons/1525044654.png\n- Coinbase\n  - link: https://wallet.coinbase.com/\n  - icon: https://cdn-images-1.medium.com/max/1200/1*7ywNS48PnonfsvvMu1tTsA.png\n- Trust\n  - link: https://trustwallet.com/\n  - icon: https://uploads-ssl.webflow.com/5a88babea6e0f90001b39b0d/5a8cf5a81df25e0001d5c78d_logo_solid_square_blue%20(2).png\n- Status\n  - link: https://dev.status.im/get/\n  - icon: https://cdn.investinblockchain.com/wp-content/uploads/2017/12/status-2-300x300.png?x88891\n\nNOTE: above links available at time of writing, but may change.\n\n## API\n\n### `init(config)`\n\n#### Parameters\n\n`config` - `Object`: Config object to configure and setup Assist (**Required**)\n\n#### Returns\n\nThe initialized version of the Assist library\n\n#### Example\n\n```javascript\nvar assistInstance = assist.init(assistConfig)\n```\n\n### `onboard()`\n\n#### Returns\n\n`Promise`\n\n- resolves with `state` object\n- rejects with `state` object\n\n#### Example\n\n```javascript\nassistInstance\n  .onboard()\n  .then(function(state) {\n    // User has been successfully onboarded and is ready to transact\n  })\n  .catch(function(state) {\n    // The user exited onboarding before completion\n  })\n```\n\n### `Contract(contractInstanceOrAddress [, abi])`\n\n#### Parameters\n\n`contractInstanceOrAddress` - `Object` | `String`: Instantiated web3 `contract` object (**Required**) or an address if you are using `ethers` instead if `web3`\n\n`abi` - `Array`: Abi array if you are using `ethers`\n\n#### Returns\n\nA decorated `contract` to be used instead of the original instance\n\n#### Example\n\n```javascript\n// web3\nvar myContract = new web3.eth.Contract(abi, address)\nvar myDecoratedContract = assistInstance.Contract(myContract)\nmydecoratedContract.methods.myMethod(params).call()\n\n// OR\n\n// ethers\nvar myContract = assistInstance.Contract(address, abi)\nmyContract.myMethod().call()\n```\n\n### `Transaction(txObjectOrHash [, callback] [, notificationOptions])`\n\n#### Parameters\n\n`txObjectOrHash` - `Object` || `String`: Transaction object or transaction hash (**Required**)\n\n`callback` - `Function`: Optional error first style callback if you don't want to use promises\n\n`notificationOptions` - `Object`: Optional notification custom options\n\n```javascript\nconst notificationOptions = {\n  messages: {\n    txPending: () =\u003e 'your bid is pending...\n  },\n  clickHandlers: {\n    txPending: () =\u003e route('./open-bids')\n  }\n}\n```\n\n#### Returns\n\n`Promise` or `PromiEvent` (`web3.js 1.0`) if passed a transaction object or `true` if passed a valid transaction hash or `false` if hash is invalid\n\n- resolves with transaction hash\n- rejects with an error message\n\n#### Example\n\n```javascript\nassistInstance\n  .Transaction(txObject)\n  .then(txHash =\u003e {\n    // Transaction has been sent to the network\n  })\n  .catch(error =\u003e {\n    console.log(error.message) // =\u003e 'User has insufficient funds'\n  })\n\n// you can alternatively pass in a transaction hash to get Assist's notifications for a transaction that has already been sent to the network\nassistInstance.Transaction(hash)\n```\n\n### `getState()`\n\n#### Returns\n\n`Promise`\n\n- resolves with the `state` object that represents the current user environment\n\n#### Example\n\n```javascript\nassistInstance.getState().then(function(state) {\n  if (state.validBrowser) {\n    console.log('valid browser')\n  }\n})\n```\n\n### `updateStyle(style)`\n\n#### Parameters\n\n`style` - `Object`: Object containing new style information (**Required**)\n\n```javascript\nvar style = {\n  darkMode: Boolean, // Set Assist UI to dark mode\n  css: String, // Custom css string to overide Assist default styles\n  notificationsPosition: String || Object // Defines which corner transaction notifications will be positioned. See 'Notification Positioning'\n}\n```\n\n#### Examples\n\n```javascript\n// Enable dark mode and position notifications at the bottom left on desktop\nvar style = {\n  darkMode: true,\n  notificationsPosition: 'bottomLeft'\n}\nassistInstance.updateStyle(style)\n\n// Position notifications at the bottom of the viewport on mobile and set their background to black\nvar style = {\n  css: `.bn-notification { background: black }`,\n  notificationsPosition: { mobile: 'bottom' }\n}\nassistInstance.updateStyle(style)\n```\n\n### `notify(type, message [, options])`\n\nTrigger a custom UI notification\n\n#### Parameters\n\n`type` - `String`: One of: ['success', 'pending', 'error'](**Required**)\n\n`message` - `String`: The message to display in the notification. HTML can be embedded in the string. (**Required**)\n\n`options` - `Object`: Optionally further customize the notification\n\n```javascript\noptions = {\n  customTimeout: Number, // Specify how many ms the notification should exist. Set to -1 for no timeout.\n  customCode: String, // An identifier for this notify call\n  onclick: Function // Function to run when user clicks notification\n}\n```\n\noptions.customTimeout defaults: { success: 2000, pending: 5000, error: 5000 }\n\n#### Returns\n\n`Function`\n\n- a function that when called will dismiss the notification\n\n#### Examples\n\n```javascript\n// Display a success notification with an embedded link for 5000ms\nassistInstance.notify(\n  'success',\n  'Operation was a success! Click \u003ca href=\"https://example.com\" target=\"_blank\"\u003ehere\u003c/a\u003e to view more',\n  { customTimeout: 5000 }\n)\n\n// Display a pending notification, load data from an imaginary backend\n// and dismiss the pending notification only when the data is loaded\nvar dismiss = assistInstance.notify('pending', 'Loading data...', {\n  customTimeout: -1\n})\nmyEventEmitter.emit('fetch-data-from-backend')\nmyEventEmitter.on('data-from-backend-loaded', () =\u003e {\n  dismiss()\n})\n```\n\n## Contribute\n\n### Installing Dependencies\n\n#### npm\n\n`npm i`\n\n#### Yarn\n\n`yarn`\n\n### Tests\n\n#### npm\n\n`npm test`\n\n#### Yarn\n\n`yarn test`\n\n### Building\n\n#### npm\n\n`npm run build`\n\n#### Yarn\n\n`yarn build`\n","funding_links":[],"categories":[],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fblocknative%2Fassist","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fblocknative%2Fassist","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fblocknative%2Fassist/lists"}