Initial creation from create-aragon-app

.eslintignore

@@ -0,0 +1,6 @@
+node_modules
+app/node_modules
+build
+.cache
+dist
+coverage

.eslintrc.json

@@ -0,0 +1,36 @@
+{
+  "env": {
+    "browser": true,
+    "es6": true
+  },
+  "extends": [
+    "standard",
+    "standard-react",
+    "prettier",
+    "prettier/react"
+  ],
+  "parser": "babel-eslint",
+  "parserOptions": {
+    "ecmaVersion": 6,
+    "ecmaFeatures": {
+      "jsx": true
+    },
+    "sourceType": "module"
+  },
+  "plugins": ["prettier", "react"],
+  "rules": {
+    "valid-jsdoc": "error",
+    "react/prop-types": 0,
+    "prettier/prettier": [
+      "error",
+      {
+        "singleQuote": true,
+        "semi": false,
+        "trailingComma": "es5",
+        "bracketSpacing": true,
+        "jsxBracketSameLine": false
+      }
+    ],
+    "linebreak-style": ["error", "unix"]
+  }
+}

.gitignore

@@ -0,0 +1,8 @@
+node_modules
+build
+.cache
+dist
+ipfs.cmd
+package-lock.json
+coverage.json
+coverage

.ipfsignore

@@ -0,0 +1,15 @@
+# Git files
+.gitignore
+
+# Build files
+.cache
+node_modules
+build
+coverage
+
+# Lock files
+package-lock.json
+yarn.lock
+
+# Others
+test

.solcover.js

@@ -0,0 +1,7 @@
+module.exports = {
+    norpc: true,
+    copyPackages: [],
+    skipFiles: [
+        'test',
+    ]
+}

.soliumignore

@@ -0,0 +1,2 @@
+node_modules
+contracts/Migrations.sol

.soliumrc.json

@@ -0,0 +1,35 @@
+{
+  "extends": "solium:all",
+  "plugins": [
+    "security"
+  ],
+  "rules": {
+    "imports-on-top": ["error"],
+    "variable-declarations": ["error"],
+    "array-declarations": ["error"],
+    "operator-whitespace": ["error"],
+    "lbrace": ["error"],
+    "mixedcase": ["warning"],
+    "camelcase": ["error"],
+    "uppercase": ["warning"],
+    "no-empty-blocks": ["error"],
+    "no-unused-vars": ["error"],
+    "quotes": ["error"],
+    "indentation": ["error"],
+    "whitespace": ["error"],
+    "deprecated-suicide": ["error"],
+    "arg-overflow": ["error", 8],
+    "pragma-on-top": ["error"],
+    "security/enforce-explicit-visibility": ["error"],
+    "consequent": 0,
+    "error-reason": ["warning"],
+    "function-order": [
+      "error",
+      {
+        "ignore": {
+          "functions": ["initialize"]
+        }
+      }
+    ]
+  }
+}

README.md

@@ -0,0 +1,92 @@
+# Aragon React Boilerplate
+
+> 🕵️ [Find more boilerplates using GitHub](https://github.com/search?q=topic:aragon-boilerplate) |
+> ✨ [Official boilerplates](https://github.com/search?q=topic:aragon-boilerplate+org:aragon)
+
+React boilerplate for Aragon applications.
+
+This boilerplate includes a fully working example app, complete with a background worker and a front-end in React (with Aragon UI). Also comes with a DAO Template which will allow for using your app to interact with other Aragon apps like the Voting app. You can read more about DAO Template [here](https://hack.aragon.org/docs/templates-intro).
+
+## Usage
+
+To setup use the command `create-aragon-app`:
+
+```sh
+npx create-aragon-app <app-name> react
+```
+
+## Make the template work with your app
+
+- Edit the roles defined in the template to configure your DAO as you want!
+
+## Run the template
+
+```sh
+npx aragon run --template Template --template-init @ARAGON_ENS
+```
+
+## Running your app
+
+### Using HTTP
+
+Running your app using HTTP will allow for a faster development process of your app's front-end, as it can be hot-reloaded without the need to execute `aragon run` every time a change is made.
+
+- First start your app's development server running `npm run start:app`, and keep that process running. By default it will rebuild the app and reload the server when changes to the source are made.
+
+- After that, you can run `npm run start:http` or `npm run start:http:template` which will compile your app's contracts, publish the app locally and create a DAO. You will need to stop it and run it again after making changes to your smart contracts.
+
+Changes to the app's background script (`app/script.js`) cannot be hot-reloaded, after making changes to the script, you will need to either restart the development server (`npm run start:app`) or rebuild the script `npm run build:script`.
+
+### Using IPFS
+
+Running your app using IPFS will mimic the production environment that will be used for running your app. `npm run start:ipfs` will run your app using IPFS. Whenever a change is made to any file in your front-end, a new version of the app needs to be published, so the command needs to be restarted.
+
+## What's in this boilerplate?
+
+### npm Scripts
+
+- **start** or **start:ipfs**: Runs your app inside a DAO served from IPFS
+- **start:http**: Runs your app inside a DAO served with HTTP (hot reloading)
+- **start:ipfs:template**: Creates a DAO with the [Template](https://github.com/aragon/aragon-react-boilerplate/blob/master/contracts/Template.sol) and serves the app from IPFS
+- **start:http:template**: Creates a DAO with the [Template](https://github.com/aragon/aragon-react-boilerplate/blob/master/contracts/Template.sol) and serves the app with HTTP (hot reloading)
+- **prepare**: Installs dependencies of the front-end
+- **start:app**: Starts a development server for your app
+- **compile**: Compiles the smart contracts
+- **build**: Builds the front-end and background script
+- **test**: Runs tests for the contracts
+- **publish:patch**: Releases a patch version to aragonPM (only frontend/content changes allowed)
+- **publish:minor**: Releases a minor version to aragonPM (only frontend/content changes allowed)
+- **publish:major**: Releases a major version to aragonPM (frontend **and** contract changes)
+- **versions**: Checks the currently installed versions of the app
+- **lint**: Checks the app and the contracts for linting errors
+- **lint:fix**: Fixes the lint errors that can be resolved automatically
+- **coverage**: Runs the tests for the contracts and creates a report
+
+### Libraries
+
+- [**@aragon/os**](https://github.com/aragon/aragonos): Aragon interfaces
+- [**@aragon/api**](https://github.com/aragon/aragon.js/tree/master/packages/aragon-api): Wrapper for Aragon application RPC
+- [**@aragon/ui**](https://github.com/aragon/aragon-ui): Aragon UI components (in React)
+
+## What you can do with this boilerplate?
+
+### Publish
+
+You can publish you app on [aragonPM](https://hack.aragon.org/docs/apm). See how in our [publish guide](https://hack.aragon.org/docs/guides-publish).
+
+> **Note**<br>
+> The [Template](https://github.com/aragon/aragon-react-boilerplate/blob/master/contracts/Template.sol) will not be published.
+
+### Using a different Ethereum account
+
+You can use a different account to interact with you app. [Check the documentation](https://hack.aragon.org/docs/guides-faq#set-a-private-key).
+
+### Propagate content
+
+You can propagate the content of your app on IPFS. Learn more in our [troubleshooting guide](https://hack.aragon.org/docs/guides-faq#propagating-your-content-hash-through-ipfs) or use the `aragon ipfs propagate` command:
+
+```
+npx aragon ipfs propagate <cid>
+```
+
+Where `cid` is your content id hash (this will be displayed after publishing).

app/.babelrc

@@ -0,0 +1,29 @@
+{
+  "presets": [
+    [
+      "@babel/preset-env",
+      {
+        "modules": false,
+        "targets": {
+          "browsers": [
+            "> 1%",
+            "last 3 versions",
+            "ie >= 9",
+            "ios >= 8",
+            "android >= 4.2"
+          ]
+        },
+        "useBuiltIns": false
+      }
+    ]
+  ],
+  "plugins": [
+    "@babel/plugin-proposal-class-properties",
+    [
+      "styled-components",
+      {
+        "displayName": true
+      }
+    ]
+  ]
+}

app/index.html

@@ -0,0 +1,10 @@
+<!DOCTYPE html>
+<html>
+    <head>
+        <title>Aragon App</title>
+    </head>
+    <body>
+        <div id="root"></div>
+        <script src="src/index.js"></script>
+    </body>
+</html>

app/package.json

@@ -0,0 +1,30 @@
+{
+  "name": "home-frontend",
+  "version": "1.0.0",
+  "main": "src/index.js",
+  "dependencies": {
+    "@aragon/api": "^1.0.0-beta.1",
+    "@aragon/api-react": "^1.0.0-beta.1",
+    "@aragon/ui": "^0.32.0",
+    "@babel/polyfill": "^7.2.5",
+    "react": "^16.8.4",
+    "react-dom": "^16.8.4",
+    "rxjs": "^6.2.1",
+    "styled-components": "^4.1.3"
+  },
+  "devDependencies": {
+    "@babel/core": "^7.3.4",
+    "@babel/plugin-proposal-class-properties": "^7.3.4",
+    "@babel/preset-env": "^7.3.4",
+    "parcel-bundler": "^1.12.3"
+  },
+  "scripts": {
+    "build": "npm run sync-assets && npm run build:app && npm run build:script",
+    "build:app": "parcel build index.html -d ../dist/ --public-url \".\" --no-cache",
+    "build:script": "parcel build src/script.js --out-dir ../dist/ --no-cache",
+    "watch:script": "parcel watch src/script.js --out-dir ../dist/ --no-hmr",
+    "devserver": "parcel serve index.html -p 8001 --out-dir ../dist/ --no-cache",
+    "start": "npm run sync-assets && npm run build:script -- --no-minify && npm run devserver",
+    "sync-assets": "copy-aragon-ui-assets ../dist"
+  }
+}

app/src/App.js

@@ -0,0 +1,52 @@
+import React from 'react'
+import { useAragonApi } from '@aragon/api-react'
+import { Main, Button } from '@aragon/ui'
+import styled from 'styled-components'
+
+function App() {
+  const { api, appState } = useAragonApi()
+  const { count, syncing } = appState
+  return (
+    <Main>
+      <BaseLayout>
+        {syncing && <Syncing />}
+        <Count>Count: {count}</Count>
+        <Buttons>
+          <Button mode="secondary" onClick={() => api.decrement(1)}>
+            Decrement
+          </Button>
+          <Button mode="secondary" onClick={() => api.increment(1)}>
+            Increment
+          </Button>
+        </Buttons>
+      </BaseLayout>
+    </Main>
+  )
+}
+
+const BaseLayout = styled.div`
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  height: 100vh;
+  flex-direction: column;
+`
+
+const Count = styled.h1`
+  font-size: 30px;
+`
+
+const Buttons = styled.div`
+  display: grid;
+  grid-auto-flow: column;
+  grid-gap: 40px;
+  margin-top: 20px;
+`
+
+const Syncing = styled.div.attrs({ children: 'Syncing…' })`
+  position: absolute;
+  top: 15px;
+  right: 20px;
+`
+
+export default App

app/src/index.js

@@ -0,0 +1,18 @@
+import React from 'react'
+import ReactDOM from 'react-dom'
+import { AragonApi } from '@aragon/api-react'
+import App from './App'
+
+const reducer = state => {
+  if (state === null) {
+    return { count: 0, syncing: true }
+  }
+  return state
+}
+
+ReactDOM.render(
+  <AragonApi reducer={reducer}>
+    <App />
+  </AragonApi>,
+  document.getElementById('root')
+)

app/src/script.js

@@ -0,0 +1,37 @@
+import '@babel/polyfill'
+import { of } from 'rxjs'
+import AragonApi from '@aragon/api'
+
+const INITIALIZATION_TRIGGER = Symbol('INITIALIZATION_TRIGGER')
+
+const api = new AragonApi()
+
+api.store(
+  async (state, event) => {
+    let newState
+
+    switch (event.event) {
+      case INITIALIZATION_TRIGGER:
+        newState = { count: await getValue() }
+        break
+      case 'Increment':
+        newState = { count: await getValue() }
+        break
+      case 'Decrement':
+        newState = { count: await getValue() }
+        break
+      default:
+        newState = state
+    }
+
+    return newState
+  },
+  [
+    // Always initialize the store with our own home-made event
+    of({ event: INITIALIZATION_TRIGGER }),
+  ]
+)
+
+async function getValue() {
+  return parseInt(await api.call('value').toPromise(), 10)
+}