Forked from bch-wallet-starter

.eslintrc.json

@@ -0,0 +1,13 @@
+{
+  "extends": "standard",
+  "env": {
+    "node": true,
+    "mocha": true
+  },
+  "parserOptions": {
+    "ecmaVersion": 10
+  },
+  "rules": {
+    "no-unused-vars": "off"
+  }
+}

.gitignore

@@ -0,0 +1,69 @@
+# Logs
+logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+
+# Runtime data
+pids
+*.pid
+*.seed
+*.pid.lock
+
+# Directory for instrumented libs generated by jscoverage/JSCover
+lib-cov
+
+# Coverage directory used by tools like istanbul
+coverage
+
+# nyc test coverage
+.nyc_output
+
+# Grunt intermediate storage (http://gruntjs.com/creating-plugins#storing-task-files)
+.grunt
+
+# Bower dependency directory (https://bower.io/)
+bower_components
+
+# node-waf configuration
+.lock-wscript
+
+# Compiled binary addons (http://nodejs.org/api/addons.html)
+build/Release
+
+# Dependency directories
+node_modules/
+jspm_packages/
+
+# Typescript v1 declaration files
+typings/
+
+# Optional npm cache directory
+.npm
+
+# Optional eslint cache
+.eslintcache
+
+# Optional REPL history
+.node_repl_history
+
+# Output of 'npm pack'
+*.tgz
+
+# dotenv environment variable files
+.env*
+
+# gatsby files
+.cache/
+public
+
+# Mac files
+.DS_Store
+
+# Yarn
+yarn-error.log
+.pnp/
+.pnp.js
+# Yarn Integrity file
+.yarn-integrity

.prettierignore

@@ -0,0 +1,4 @@
+.cache
+package.json
+package-lock.json
+public

.prettierrc

@@ -0,0 +1,5 @@
+{
+  "arrowParens": "avoid",
+  "semi": false,
+  "no-unused-vars": false
+}

.travis.yml

@@ -0,0 +1,33 @@
+# This is a node.js v8+ JavaScript project
+language: node_js
+node_js:
+  - "10"
+
+# Build on Ubuntu Trusty (14.04)
+# https://docs.travis-ci.com/user/reference/trusty/#javascript-and-nodejs-images
+dist: xenial
+sudo: required
+
+# Use Docker
+services:
+  - docker
+
+before_install:
+  #- npm install -g mocha
+
+# https://github.com/greenkeeperio/greenkeeper-lockfile/issues/156
+#install: case $TRAVIS_BRANCH in greenkeeper*) npm i;; *) npm ci;; esac;
+install:
+  - npm install
+
+script: "npm run test"
+
+# Send coverage data to Coveralls
+after_success:
+  - npm run coverage
+
+deploy:
+  provider: script
+  skip_cleanup: true
+  script:
+    - npx semantic-release

LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2020 Permissionless Software Foundation
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

README.md

@@ -0,0 +1,112 @@
+<!-- AUTO-GENERATED-CONTENT:START (STARTER) -->
+<p align="center">
+  <a href="https://www.gatsbyjs.org">
+    <img alt="Gatsby" src="https://www.gatsbyjs.org/monogram.svg" width="60" />
+  </a>
+</p>
+<h1 align="center">
+  A BCH Web Wallet Gatsby Starter
+</h1>
+
+Create your own Bitcoin Cash web wallet app with this Gatsby Starter. This Starter leverages the [gatsby-ipfs-web-wallet Gatsby Theme](https://github.com/Permissionless-Software-Foundation/gatsby-ipfs-web-wallet) by [FullStack.cash](https://fullstack.cash). Additional plugins can be developed with the [bch-wallet-plugin-boilerplate](https://github.com/Permissionless-Software-Foundation/bch-wallet-plugin-boilerplate).
+
+- Live demo of this starter: [demo-wallet.fullstack.cash](https://demo-wallet.fullstack.cash)
+
+There are several customized versions of this web wallet starter. Here are a few:
+- [wallet.fullstack.cash](https://wallet.fullstack.cash)
+- [message.fullstack.cash](https://message.fullstack.cash)
+- [torlist.cash](https://torlist.cash)
+
+## 🚀 Quick start
+
+1.  **Create a Gatsby site.**
+
+    Use the Gatsby CLI to create a new site, specifying this starter.
+
+    ```shell
+    # create a new Gatsby site using this starter
+    gatsby new my-bch-wallet-app https://github.com/Permissionless-Software-Foundation/bch-wallet-starter
+    ```
+
+1.  **Start developing.**
+
+    Navigate into your new site’s directory and start it up.
+
+    ```shell
+    cd my-bch-wallet-app/
+    gatsby develop
+    ```
+
+1.  **Open the source code and start editing!**
+
+    Your site is now running at `http://localhost:8000`!
+
+    _Note: You'll also see a second link: _`http://localhost:8000/___graphql`_. This is a tool you can use to experiment with querying your data. Learn more about using this tool in the [Gatsby tutorial](https://www.gatsbyjs.org/tutorial/part-five/#introducing-graphiql)._
+
+    Open the `my-bch-wallet-app` directory in your code editor of choice and edit `src/pages/index.js`. Save your changes and the browser will update in real time!
+
+## 🧐 What's inside?
+
+A quick look at the top-level files and directories you'll see in a Gatsby project.
+
+    .
+    ├── node_modules
+    ├── src
+      └── gatsby-ipfs-web-wallet
+        └── components
+          └── menu-components.js
+    ├── .gitignore
+    ├── .prettierrc
+    ├── gatsby-browser.js
+    ├── gatsby-config.js
+    ├── gatsby-node.js
+    ├── gatsby-ssr.js
+    ├── LICENSE
+    ├── package-lock.json
+    ├── package.json
+    └── README.md
+
+1.  **`/node_modules`**: This directory contains all of the modules of code that your project depends on (npm packages) are automatically installed.
+
+2.  **`/src`**: This directory will contain all of the code related to what you will see on the front-end of your site (what you see in the browser) such as your site header or a page template. `src` is a convention for “source code”.
+
+3.  **`.gitignore`**: This file tells git which files it should not track / not maintain a version history for.
+
+4.  **`.prettierrc`**: This is a configuration file for [Prettier](https://prettier.io/). Prettier is a tool to help keep the formatting of your code consistent.
+
+5.  **`gatsby-browser.js`**: This file is where Gatsby expects to find any usage of the [Gatsby browser APIs](https://www.gatsbyjs.org/docs/browser-apis/) (if any). These allow customization/extension of default Gatsby settings affecting the browser.
+
+6.  **`gatsby-config.js`**: This is the main configuration file for a Gatsby site. This is where you can specify information about your site (metadata) like the site title and description, which Gatsby plugins you’d like to include, etc. (Check out the [config docs](https://www.gatsbyjs.org/docs/gatsby-config/) for more detail).
+
+7.  **`gatsby-node.js`**: This file is where Gatsby expects to find any usage of the [Gatsby Node APIs](https://www.gatsbyjs.org/docs/node-apis/) (if any). These allow customization/extension of default Gatsby settings affecting pieces of the site build process.
+
+8.  **`gatsby-ssr.js`**: This file is where Gatsby expects to find any usage of the [Gatsby server-side rendering APIs](https://www.gatsbyjs.org/docs/ssr-apis/) (if any). These allow customization of default Gatsby settings affecting server-side rendering.
+
+9.  **`LICENSE`**: Gatsby is licensed under the MIT license.
+
+10. **`package-lock.json`** (See `package.json` below, first). This is an automatically generated file based on the exact versions of your npm dependencies that were installed for your project. **(You won’t change this file directly).**
+
+11. **`package.json`**: A manifest file for Node.js projects, which includes things like metadata (the project’s name, author, etc). This manifest is how npm knows which packages to install for your project.
+
+12. **`README.md`**: A text file containing useful reference information about your project.
+
+12. **`menu-components.js`**: Allows you to add new menu items and Views to the app.
+
+## 🎓 Learning Bitcoin Cash
+If you are new to the world of Bitcoin Cash development, head on over to [FullStack.cash](https://fullstack.cash). Our [quick-start example code](https://fullstack.cash/examples) and video tutorials will get you started quickly. The [Documentation page](https://fullstack.cash/documentation) has all the educational material you'll need.
+
+## 🎓 Learning Gatsby
+
+Looking for more guidance? Full documentation for Gatsby lives [on the website](https://www.gatsbyjs.org/). Here are some places to start:
+
+- **For most developers, we recommend starting with our [in-depth tutorial for creating a site with Gatsby](https://www.gatsbyjs.org/tutorial/).** It starts with zero assumptions about your level of ability and walks through every step of the process.
+
+- **To dive straight into code samples, head [to our documentation](https://www.gatsbyjs.org/docs/).** In particular, check out the _Guides_, _API Reference_, and _Advanced Tutorials_ sections in the sidebar.
+
+## 💫 Deploy
+
+[![Deploy to Netlify](https://www.netlify.com/img/deploy/button.svg)](https://app.netlify.com/start/deploy?repository=https://github.com/gatsbyjs/gatsby-starter-hello-world)
+
+[![Deploy with Vercel](https://vercel.com/button)](https://vercel.com/import/project?template=https://github.com/gatsbyjs/gatsby-starter-hello-world)
+
+<!-- AUTO-GENERATED-CONTENT:END -->

gatsby-config.js

@@ -0,0 +1,13 @@
+/**
+ * Configure your Gatsby site with this file.
+ *
+ * See: https://www.gatsbyjs.org/docs/gatsby-config/
+ */
+
+module.exports = {
+  /* Your site config here */
+  plugins: [
+    'gatsby-ipfs-web-wallet',
+    'gatsby-plugin-bch-tx-history'
+  ]
+}

package.json

@@ -0,0 +1,45 @@
+{
+  "name": "bch-wallet-starter",
+  "description": "A BCH web wallet starter for Gatsby.",
+  "version": "1.0.0",
+  "license": "MIT",
+  "author": "Chris Troutner <chris.troutner@gmail.com>",
+  "contributors": [
+    "Daniel Gonzalez <danielhumgon@gmail.com>",
+    "Andre Cabrera <andrecabrera@protonmail.ch>"
+  ],
+  "scripts": {
+    "build": "gatsby build",
+    "build:ipfs": "gatsby build --prefix-paths",
+    "develop": "gatsby develop",
+    "lint": "standard --env mocha --fix",
+    "start": "npm run develop",
+    "serve": "gatsby serve",
+    "clean": "gatsby clean",
+    "test": "npm run lint"
+  },
+  "dependencies": {
+    "gatsby": "^3.7.2",
+    "gatsby-ipfs-web-wallet": "1.25.3",
+    "gatsby-plugin-bch-tx-history": "^1.1.4"
+  },
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/Permissionless-Software-Foundation/bch-wallet-starter"
+  },
+  "bugs": {
+    "url": "https://github.com/Permissionless-Software-Foundation/bch-wallet-starter/issues"
+  },
+  "devDependencies": {
+    "semantic-release": "^17.4.3",
+    "standard": "^16.0.3"
+  },
+  "release": {
+    "publish": [
+      {
+        "path": "@semantic-release/npm",
+        "npmPublish": false
+      }
+    ]
+  }
+}

src/demo-component/index.js

@@ -0,0 +1,151 @@
+/*
+  This is a demonstration component. It helps to show how you can create new
+  menu items and Views in your own BCH web wallet dashboard app.
+
+  This file controls the View (the part on the right side of the dashboard) of
+  the component. The menu item is controlled by the menu-components.js file.
+*/
+
+import React from 'react'
+import { Row, Col, Content, Box, Button } from 'adminlte-2-react'
+import { getWalletInfo } from 'gatsby-ipfs-web-wallet/src/components/localWallet'
+
+const BchWallet =
+  typeof window !== 'undefined'
+    ? window.SlpWallet
+    : null
+
+let _this
+class DemoComponent extends React.Component {
+  constructor (props) {
+    super(props)
+    _this = this
+    this.state = {
+      unconfirmedBalance: 0,
+      confirmedBalance: 0,
+      totalBalance: 0,
+      inFetch: false,
+      bchWallet: '',
+      isChecked: ''
+
+    }
+  }
+
+  render () {
+    const {
+      unconfirmedBalance,
+      confirmedBalance,
+      totalBalance,
+      inFetch,
+      isChecked
+    } = _this.state
+    return (
+      <Content
+        title='Demo Component'
+        subTitle='Check the BCH balance of an address'
+        browserTitle='Demo Component'
+      >
+        <Row>
+          <Col xs={12}>
+            <Box
+              title='BCH Balance'
+              type='primary'
+              closable
+              collapsable
+              loaded={!inFetch}
+              footer={
+                <Button
+                  type='primary'
+                  text='Check Balance'
+                  onClick={_this.handleGetBalance}
+                />
+              }
+            >
+
+              {
+                isChecked &&
+                  <div>
+                    <p>Confirmed: {confirmedBalance}</p>
+                    <p>Unconfirmed: {unconfirmedBalance}</p>
+                    <p>Total : <strong>{totalBalance}</strong></p>
+                  </div>
+
+              }
+
+            </Box>
+          </Col>
+        </Row>
+      </Content>
+    )
+  }
+
+  componentDidMount () {
+    _this.instanceWallet() // Creates a web wallet instance
+  }
+
+  // Get wallet balance
+  async handleGetBalance () {
+    try {
+      _this.setState({
+        inFetch: true
+      })
+
+      const addr = 'bitcoincash:qr69kyzha07dcecrsvjwsj4s6slnlq4r8c30lxnur3'
+
+      const bchWallet = _this.state.bchWallet
+      const bchjs = bchWallet.bchjs
+
+      // Get the Balance
+      const balances = await bchjs.Electrumx.balance(addr)
+
+      const totalBalance = balances.balance.confirmed + balances.balance.unconfirmed
+
+      _this.setState({
+        inFetch: false,
+        unconfirmedBalance: balances.balance.unconfirmed,
+        confirmedBalance: balances.balance.confirmed,
+        totalBalance: totalBalance,
+        isChecked: true
+      })
+    } catch (error) {
+      console.error(error)
+      _this.setState({
+        inFetch: false
+      })
+    }
+  }
+
+  // Creates an instance  of minimal-slp-wallet, with
+  // the local storage information if it exists
+  instanceWallet () {
+    try {
+      const localStorageInfo = getWalletInfo()
+      if (!localStorageInfo.mnemonic) return null
+
+      const jwtToken = localStorageInfo.JWT
+      const restURL = localStorageInfo.selectedServer
+      const bchjsOptions = {}
+
+      if (jwtToken) {
+        bchjsOptions.apiToken = jwtToken
+      }
+      if (restURL) {
+        bchjsOptions.restURL = restURL
+      }
+      const bchWalletLib = new BchWallet(localStorageInfo.mnemonic, bchjsOptions)
+
+      // Update bchjs instances  of minimal-slp-wallet libraries
+      bchWalletLib.tokens.sendBch.bchjs = new bchWalletLib.BCHJS(bchjsOptions)
+      bchWalletLib.tokens.utxos.bchjs = new bchWalletLib.BCHJS(bchjsOptions)
+
+      _this.setState({
+        bchWallet: bchWalletLib
+      })
+      return bchWalletLib
+    } catch (error) {
+      console.warn(error)
+    }
+  }
+}
+
+export default DemoComponent

src/gatsby-ipfs-web-wallet/components/admin-lte/wallet/index.js

@@ -0,0 +1,43 @@
+/*
+  This is an example of using Gatsby 'Component Shadowing' to overwrite the
+  default Wallet View. It injects the same TX History component at the bottom
+  of the Wallet View.
+*/
+
+import React from 'react'
+
+import Wallet from 'gatsby-ipfs-web-wallet/src/components/admin-lte/wallet/index'
+
+// import TXHistory from 'gatsby-plugin-bch-tx-history/src/components/txhistory'
+import TXHistory from 'gatsby-plugin-bch-tx-history'
+
+class Wallet2 extends Wallet {
+  // class Wallet2 extends React.Component {
+  constructor (props) {
+    super(props)
+    console.log('Loading new example view.')
+
+    // console.log('Wallet info: ', props.walletInfo)
+  }
+
+  render () {
+    return (
+      <>
+        <Wallet {...this.props} importComponents={this.addCards()} />
+      </>
+    )
+  }
+
+  addCards () {
+    return (
+      <>
+        <TXHistory
+          walletInfo={this.props.walletInfo}
+          bchWallet={this.props.bchWallet}
+        />
+      </>
+    )
+  }
+}
+
+export default Wallet2

src/gatsby-ipfs-web-wallet/components/menu-components.js

@@ -0,0 +1,75 @@
+/*
+  This file is how you add new menu items to your site. It uses the Gatsby
+  concept of Component Shadowing:
+  https://www.gatsbyjs.org/blog/2019-04-29-component-shadowing/
+
+  It over-rides he default file in the gatsby-ipfs-web-wallet Theme.
+*/
+
+import React from 'react'
+import { Sidebar } from 'adminlte-2-react'
+
+// Example/Demo component. This is how you would build a component internal to
+// your wallet app/site.
+import DemoComponent from '../../demo-component'
+
+// TX History Plugin.
+// This is an example of an external plugin for the wallet. It's a modular
+// approach to sharing 'lego blocks' between wallet apps.
+// import TXHistory from 'gatsby-plugin-bch-tx-history/src/components/txhistory'
+import TXHistory from 'gatsby-plugin-bch-tx-history'
+
+// Default components from gatsby-ipfs-web-wallet.
+import Wallet from 'gatsby-ipfs-web-wallet/src/components/admin-lte/wallet'
+import Tokens from 'gatsby-ipfs-web-wallet/src/components/admin-lte/tokens'
+import Configure from 'gatsby-ipfs-web-wallet/src/components/admin-lte/configure'
+import SendReceive from 'gatsby-ipfs-web-wallet/src/components/admin-lte/send-receive'
+
+const { Item } = Sidebar
+
+const MenuComponents = props => {
+  return [
+    {
+      key: 'Tokens',
+      component: <Tokens key='Tokens' {...props} />,
+      menuItem: <Item icon='fas-coins' key='Tokens' text='Tokens' />
+    },
+    {
+      key: 'Send/Receive BCH',
+      component: <SendReceive key='Send/Receive BCH' {...props} />,
+      menuItem: (
+        <Item
+          icon='fa-exchange-alt'
+          key='Send/Receive BCH'
+          text='Send/Receive BCH'
+        />
+      )
+    },
+    {
+      key: 'Wallet',
+      component: <Wallet key='Wallet' {...props} />,
+      menuItem: <Item icon='fa-wallet' key='Wallet' text='Wallet' />
+    },
+    {
+      key: 'Configure',
+      component: <Configure key='Configure' {...props} />,
+      menuItem: <Item icon='fas-cog' key='Configure' text='Configure' />
+    },
+    {
+      key: 'TX History',
+      component: <TXHistory key='TX History' {...props} />,
+      menuItem: (
+        <Item icon='fas-cog' key='TX History' text='TX History' />
+      )
+    },
+    {
+      key: 'Demo Component',
+      component: <DemoComponent key='Demo Component' {...props} />,
+      menuItem: (
+        <Item icon='fas-cog' key='Demo Component' text='Demo Component' />
+      )
+    }
+  ]
+}
+
+export default MenuComponents

src/gatsby-ipfs-web-wallet/components/site-config.js

@@ -0,0 +1,24 @@
+/*
+  This file is intended to be overwritten. It provides a common place to store
+  site configuration data.
+*/
+
+const config = {
+  title: 'Wallet Demo',
+  titleShort: 'Demo',
+  balanceText: 'BCH Balance',
+  balanceIcon: 'fab-bitcoin',
+
+  // The BCH address used in a memo.cash account. Used for tracking the IPFS
+  // hash of the mirror of this site.
+  memoAddr: 'bitcoincash:qzr4s6fwk55zvl7xqsjpr4k7zkqfmvcz7qapxys8t5',
+
+  // Footer Information
+  hostText: 'FullStack.cash',
+  hostUrl: 'https://fullstack.cash/',
+  sourceCode: 'https://github.com/Permissionless-Software-Foundation/bch-wallet-starter',
+  torUrl: 'tozqhxcrknbv5l3wshwgj6vp3bj5ezw7qp4jdn4bjrhcpetpcq74j7ad.onion',
+  clearWebUrl: 'https://demo-wallet.fullstack.cash'
+}
+
+module.exports = config

src/html.js

@@ -0,0 +1,46 @@
+import React from 'react'
+import PropTypes from 'prop-types'
+// import { withPrefix, Link } from 'gatsby'
+
+// window && typeof window !== 'undefined' && window.test = 'testing'
+
+export default function HTML (props) {
+  return (
+    <html {...props.htmlAttributes}>
+      <head>
+        <meta charSet='utf-8' />
+        <meta httpEquiv='x-ua-compatible' content='ie=edge' />
+        <meta
+          name='viewport'
+          content='width=device-width, initial-scale=1, shrink-to-fit=no'
+        />
+
+        {/* minimal-slp-wallet-web */}
+        <script src='https://unpkg.com/minimal-slp-wallet' />
+
+        {/* bch-message-lib */}
+        <script src='https://unpkg.com/bch-message-lib' />
+
+        {props.headComponents}
+      </head>
+      <body {...props.bodyAttributes}>
+        {props.preBodyComponents}
+        <div
+          key='body'
+          id='___gatsby'
+          dangerouslySetInnerHTML={{ __html: props.body }}
+        />
+        {props.postBodyComponents}
+      </body>
+    </html>
+  )
+}
+
+HTML.propTypes = {
+  htmlAttributes: PropTypes.object,
+  headComponents: PropTypes.array,
+  bodyAttributes: PropTypes.object,
+  preBodyComponents: PropTypes.array,
+  body: PropTypes.string,
+  postBodyComponents: PropTypes.array
+}