experimental-oe demo (DO NOT MERGE)

apps/address-book/arapp.json

@@ -34,6 +34,12 @@
       "wsRPC": "wss://rinkeby.eth.aragon.network/ws",
       "network": "rinkeby"
     },
+    "experimental": {
+      "registry": "0x98df287b6c145399aaa709692c8d308357bc085d",
+      "appName": "address-book-experimental.open.aragonpm.eth",
+      "wsRPC": "wss://rinkeby.eth.aragon.network/ws",
+      "network": "rinkeby"
+    },
     "rinkeby": {
       "registry": "0x98df287b6c145399aaa709692c8d308357bc085d",
       "appName": "address-book.aragonpm.eth",

apps/address-book/package.json

@@ -30,8 +30,8 @@
     "test": "cross-env TRUFFLE_TEST=true npm run ganache-cli:test"
   },
   "dependencies": {
-    "@aragon/api": "2.0.0-beta.8",
-    "@aragon/api-react": "2.0.0-beta.8",
+    "@aragon/api": "openworklabs/aragon-api",
+    "@aragon/api-react": "2.0.0-beta.6",
     "@aragon/ui": "^1.0.0-alpha.26",
     "axios": "^0.18.0",
     "ipfs-http-client": "29.1.0",

apps/allocations/arapp.json

@@ -54,6 +54,12 @@
       "wsRPC": "wss://rinkeby.eth.aragon.network/ws",
       "network": "rinkeby"
     },
+    "experimental": {
+      "registry": "0x98df287b6c145399aaa709692c8d308357bc085d",
+      "appName": "alllocations-experimental.open.aragonpm.eth",
+      "wsRPC": "wss://rinkeby.eth.aragon.network/ws",
+      "network": "rinkeby"
+    },
     "rinkeby": {
       "registry": "0x98df287b6c145399aaa709692c8d308357bc085d",
       "appName": "allocations.aragonpm.eth",

apps/allocations/package.json

@@ -30,8 +30,8 @@
     "test": "cross-env TRUFFLE_TEST=true npm run ganache-cli:test"
   },
   "dependencies": {
-    "@aragon/api": "2.0.0-beta.8",
-    "@aragon/api-react": "2.0.0-beta.8",
+    "@aragon/api": "openworklabs/aragon-api",
+    "@aragon/api-react": "2.0.0-beta.6",
     "@aragon/apps-vault": "4.1.0",
     "@aragon/os": "4.2.0",
     "@aragon/ui": "1.0.0",

apps/discussions/app/modules/Comment.js

@@ -1,4 +1,4 @@
-import React, { useState } from 'react'
+import React, { useState, useEffect, Fragment } from 'react'
 import PropTypes from 'prop-types'
 import styled from 'styled-components'
 import { format, formatDistance } from 'date-fns'
@@ -10,6 +10,7 @@ const Header = styled.header`
   display: flex;
   justify-content: space-between;
   margin-bottom: 10px;
+  width: 100%;
 `
 
 const TimeAgo = styled.time.attrs(props => ({
@@ -23,11 +24,15 @@ TimeAgo.propTypes = {
   date: PropTypes.instanceOf(Date).isRequired,
 }
 
-const Top = ({ author, createdAt }) => {
+const Top = ({ author, createdAt, identity }) => {
   const created = new Date(Number(createdAt) * 1000)
   return (
     <Header>
-      <IdentityBadge entity={author} />
+      {identity && identity.name ? (
+        <IdentityBadge entity={author} customLabel={identity.name} />
+      ) : (
+        <IdentityBadge entity={author} />
+      )}
       <TimeAgo date={created} />
     </Header>
   )
@@ -112,18 +117,32 @@ const Bottom = ({ onDelete, onEdit }) => {
 }
 
 const Comment = ({
+  app,
   currentUser,
   comment: { author, id, text, createdAt, revisions, postCid },
   onDelete,
   onSave,
 }) => {
   const [editing, setEditing] = useState(false)
+  const [identity, setIdentity] = useState(null)
 
   const update = async updated => {
     await onSave({ id, text: updated.text, revisions, postCid })
     setEditing(false)
   }
 
+  useEffect(() => {
+    const resolveIdentity = async () => {
+      const addressIdentity = await app
+        .resolveAddressIdentity(author)
+        .toPromise()
+      if (addressIdentity) {
+        setIdentity(addressIdentity)
+      }
+    }
+    resolveIdentity()
+  }, [author])
+
   return (
     <CommentCard>
       {editing ? (
@@ -133,13 +152,13 @@ const Comment = ({
           onSave={update}
         />
       ) : (
-        <React.Fragment>
-          <Top author={author} createdAt={createdAt} />
+        <Fragment>
+          <Top author={author} identity={identity} createdAt={createdAt} />
           <Markdown content={text} />
           {author === currentUser && (
             <Bottom onDelete={onDelete} onEdit={() => setEditing(true)} />
           )}
-        </React.Fragment>
+        </Fragment>
       )}
     </CommentCard>
   )

apps/discussions/app/modules/Discussion.js

@@ -5,7 +5,7 @@ import Comment from './Comment'
 import CommentForm from './CommentForm'
 
 const Discussion = ({ discussionId, ethereumAddress }) => {
-  const { discussion, discussionApi } = useDiscussion(discussionId)
+  const { discussion, discussionApi, app } = useDiscussion(discussionId)
 
   const save = ({ text, id, revisions, postCid }) =>
     id
@@ -29,6 +29,7 @@ const Discussion = ({ discussionId, ethereumAddress }) => {
     <div css="margin-bottom: 40px">
       {discussion.map(comment => (
         <Comment
+          app={app}
           comment={comment}
           currentUser={ethereumAddress}
           key={comment.id}

apps/discussions/app/modules/Discussions.js

@@ -22,13 +22,12 @@ const Discussions = ({ children, app }) => {
 
       api.listenForUpdates(setDiscussions)
     }
-
     if (!hasInit && handshakeOccured) {
       initDiscussions()
     }
-  }, [handshakeOccured])
+  }, [hasInit, handshakeOccured])
   return (
-    <DiscussionsContext.Provider value={{ discussions, discussionApi }}>
+    <DiscussionsContext.Provider value={{ discussions, discussionApi, app }}>
       {children}
     </DiscussionsContext.Provider>
   )

apps/discussions/app/modules/DiscussionsApi.js

@@ -38,8 +38,11 @@ class Discussions {
   _pastEvents = () =>
     new Promise(resolve =>
       this.contract.pastEvents().subscribe(events => {
-        this.lastEventBlock = events[events.length - 1].blockNumber
-        resolve(events)
+        if (events.length > 0) {
+          this.lastEventBlock = events[events.length - 1].blockNumber
+          return resolve(events)
+        }
+        resolve([])
       })
     )
 
@@ -257,10 +260,14 @@ class Discussions {
   }
 
   listenForUpdates = callback =>
-    this.contract.events(this.lastEventBlock + 1).subscribe(async event => {
-      this.discussions = await this._buildState(this.discussions, [event])
-      callback(this.discussions)
-    })
+    this.contract
+      .events({
+        fromBlock: this.lastEventBlock + 1,
+      })
+      .subscribe(async event => {
+        this.discussions = await this._buildState(this.discussions, [event])
+        callback(this.discussions)
+      })
 
   post = async (text, discussionThreadId, ethereumAddress) => {
     const discussionPost = {

apps/discussions/app/modules/getDiscussion.js

@@ -6,7 +6,7 @@
 const getDiscussion = (relativeDiscussionId, discussions) => {
   const absoluteDiscussionId = Object.keys(discussions)
     .map(discussionId => Number(discussionId))
-    .sort()[relativeDiscussionId]
+    .sort((a, b) => a - b)[relativeDiscussionId];
 
   return discussions[absoluteDiscussionId] || {}
 }

apps/discussions/app/modules/useDiscussion.js

@@ -2,12 +2,12 @@ import { useContext } from 'react'
 import { getDiscussion, DiscussionsContext } from './'
 
 const useDiscussion = id => {
-  const { discussions, discussionApi } = useContext(DiscussionsContext)
+  const { discussions, discussionApi, app } = useContext(DiscussionsContext)
   const discussionObj = getDiscussion(id, discussions)
   const discussionArr = Object.keys(discussionObj)
     .sort((a, b) => discussionObj[a].createdAt - discussionObj[b].createdAt)
     .map(postId => ({ ...discussionObj[postId], id: postId }))
-  return { discussion: discussionArr, discussionApi }
+  return { discussion: discussionArr, discussionApi, app }
 }
 
 export default useDiscussion

apps/discussions/app/modules/useHandshake.js

@@ -2,18 +2,8 @@ import { useEffect, useState } from 'react'
 
 export default () => {
   const [handshakeOccured, setHandshakeOccured] = useState(false)
-  const sendMessageToWrapper = (name, value) => {
-    window.parent.postMessage({ from: 'app', name, value }, '*')
-  }
-  const handleWrapperMessage = ({ data }) => {
-    if (data.from !== 'wrapper') {
-      return
-    }
-    if (data.name === 'ready') {
-      sendMessageToWrapper('ready', true)
-      setHandshakeOccured(true)
-    }
-  }
+
+  const handleWrapperMessage = () => setHandshakeOccured(true)
   useEffect(() => {
     return window.addEventListener('message', handleWrapperMessage)
   }, [])

apps/discussions/arapp.json

@@ -18,6 +18,18 @@
       "wsRPC": "wss://rinkeby.eth.aragon.network/ws",
       "network": "rinkeby"
     },
+    "experimental": {
+      "registry": "0x98df287b6c145399aaa709692c8d308357bc085d",
+      "appName": "discussions-experimental.open.aragonpm.eth",
+      "wsRPC": "wss://rinkeby.eth.aragon.network/ws",
+      "network": "rinkeby"
+    },
+    "staging": {
+      "registry": "0x98Df287B6C145399Aaa709692c8D308357bC085D",
+      "appName": "discussions-staging.open.aragonpm.eth",
+      "wsRPC": "wss://rinkeby.eth.aragon.network/ws",
+      "network": "rinkeby"
+    },
     "rinkeby": {
       "registry": "0x98df287b6c145399aaa709692c8d308357bc085d",
       "appName": "discussions.open.aragonpm.eth",

apps/discussions/package.json

@@ -3,17 +3,19 @@
   "version": "1.0.0",
   "description": "",
   "dependencies": {
-    "@aragon/api": "2.0.0-beta.8",
-    "@aragon/api-react": "2.0.0-beta.8",
-    "@aragon/ui": "1.0.0-alpha.11",
     "@babel/polyfill": "^7.2.5",
-    "prop-types": "^15.7.2",
+    "ipfs-http-client": "^32.0.1",
+    "lodash.clonedeep": "^4.5.0",
+    "react-markdown": "^4.1.0"
+  },
+  "peerDependencies": {
+    "@aragon/api": "openworklabs/aragon-api",
+    "@aragon/api-react": "2.0.0-beta.6",
+    "@aragon/ui": "^1.0.0",
     "react": "^16.8.6",
     "react-dom": "^16.8.6",
-    "react-markdown": "^4.1.0",
-    "styled-components": "4.1.3",
-    "ipfs-http-client": "^32.0.1",
-    "lodash.clonedeep": "^4.5.0"
+    "prop-types": "^15.7.2",
+    "styled-components": "4.1.3"
   },
   "devDependencies": {
     "@babel/core": "^7.4.5",
@@ -62,7 +64,8 @@
     "lint": "solium --dir ./contracts",
     "lint:fix": "eslint . --fix && solium --dir ./contracts --fix",
     "coverage": "cross-env SOLIDITY_COVERAGE=true npm run ganache-cli:test",
-    "ganache-cli:test": "sh ./node_modules/@aragon/test-helpers/ganache-cli.sh"
+    "ganache-cli:test": "sh ./node_modules/@aragon/test-helpers/ganache-cli.sh",
+    "frontend": "npm run sync-assets && parcel app/index.html --port 9999"
   },
   "browserslist": [
     "last 2 Chrome versions"

apps/dot-voting/app/App.js

@@ -6,6 +6,7 @@ import { IdentityProvider } from './components/LocalIdentityBadge/IdentityManage
 import { AppLogicProvider, useAppLogic } from './app-logic'
 import Decisions from './Decisions'
 import emptyStatePng from './assets/voting-empty-state.png'
+import Discussions from '../../discussions/app/modules/Discussions'
 
 const ASSETS_URL = './aragon-ui'
 
@@ -94,13 +95,15 @@ const App = () => {
   if (!votes.length) return <Empty isSyncing={isSyncing}/>
 
   return (
-    <IdentityProvider
-      onResolve={handleResolveLocalIdentity}
-      onShowLocalIdentityModal={handleShowLocalIdentityModal}>
-      <Header primary="Dot Voting" />
-      <Decisions />
-      <SyncIndicator visible={isSyncing} />
-    </IdentityProvider>
+    <Discussions app={api}>
+      <IdentityProvider
+        onResolve={handleResolveLocalIdentity}
+        onShowLocalIdentityModal={handleShowLocalIdentityModal}>
+        <Header primary="Dot Voting" />
+        <Decisions/>
+        <SyncIndicator visible={isSyncing} />
+      </IdentityProvider>
+    </Discussions>
   )
 }