Merge pull request #1663 from daostack/release-0.10.6

release 0.10.6

.eslintrc

@@ -44,6 +44,7 @@
         "key-spacing": ["error", { "mode": "minimum" }],
         "semi-spacing": "error",
         "comma-spacing": "error",
+        "no-multi-spaces": "error",
         "no-trailing-spaces": "error",
         "no-useless-escape": "error",
         "react/prop-types": "off",

CHANGELOG.md

@@ -1,3 +1,11 @@
+## 0.10.6
+  - Features Added
+    - new DAO landing page
+    - added help text in the Plugin Editor popup
+
+    - Bugs Fixed
+      - Make sure proposer name doesn't overlap avatar on proposal history rows
+
 ## 0.10.5
   - Features Added
     - change home page to show DAOs again instead of feed. Show separate "Your DAOs" section containing DAOs the user follows or is a member of, then the list of other DAOs below.

docs/development.md

@@ -77,3 +77,10 @@ npm run build:watch
     docker rm $(docker ps -a -q)
     docker rmi $(docker images -a -q)
     ```
+# Environment Variables
+
+Heroku uses app.json to supply default values to the Heroku app environment variable configuration GUI.
+
+Webpack-dev-server, for local builds in absence of Heroku, uses the webpack.*.config.js `EnvironmentPlugin` to supply default values to the npm command line commands in package.json.  Without these default values, which may be no more that an empty string if you are sure the correct value will be supplied in package.json, the values in package.json will not work at all.
+
+To supply different network-specific values the final values will have to come from package.json for local builds, and Heroku app configurations for Heroku builds.

package.json

@@ -1,6 +1,6 @@
 {
   "name": "alchemy-client",
-  "version": "0.10.5",
+  "version": "0.10.6",
   "description": "An app for collaborative networks (DAOs), based on the DAO stack.",
   "author": "DAOstack",
   "license": "GPL-3.0",

src/App.tsx

@@ -48,7 +48,7 @@ export class App extends React.Component<{}, {
     const totalNumberOfAttempts = 3; /// we will try 3 times to init arc before actually throwing an error
     let numberOfAttempts = 0;
     let success = false;
-    const initArc = async ()  => {
+    const initArc = async () => {
       success = await initializeArc();
       if (!success) {
         throw Error("Initialize arc failed for an unknown reason (see the console)...");
@@ -111,7 +111,7 @@ export class App extends React.Component<{}, {
           <Loading/>
         </div>
       );
-    } else  {
+    } else {
       return (
         <Provider store={store}>
           <ThroughProvider>

src/actions/arcActions.ts

@@ -155,7 +155,7 @@ export function redeemReputationFromToken(scheme: Scheme, addressToRedeem: strin
       const reputationFromTokenScheme = scheme.ReputationFromToken as ReputationFromTokenScheme;
       const agreementHash = await reputationFromTokenScheme.getAgreementHash();
       const state = await reputationFromTokenScheme.scheme.fetchStaticState();
-      const contract =  arc.getContract(state.address);
+      const contract = arc.getContract(state.address);
       const block = await arc.web3.eth.getBlock("latest");
       const gas = block.gasLimit - 100000;
       const redeemMethod = contract.methods.redeem(addressToRedeem, agreementHash);

src/arc.ts

@@ -48,6 +48,28 @@ async function _getCurrentAccountFromProvider(web3?: any): Promise<string> {
   return accounts[0] ? accounts[0].toLowerCase() : null;
 }
 
+/**
+ * Return the most recently synced block from web3, or null with no web3 or error
+ */
+export async function getCurrentBlock(web3?: any): Promise<any> {
+  web3 = web3 || getWeb3();
+  if (!web3) {
+    return null;
+  }
+  try {
+    // need the `await` so exceptions will be caught here
+    return await web3.eth.getBlock("latest");
+  } catch (ex) {
+    /**
+     * This often happens with the error:  "connection not open on send()".
+     * See: https://github.com/ethereum/web3.js/issues/1354
+     */
+    // eslint-disable-next-line no-console
+    console.log(`getCurrentBlock: web3.eth.getBlock failed: ${ex.message}`);
+    return null;
+  }
+}
+
 /**
  * Returns the Arc instance
  * Throws an exception when Arc hasn't yet been initialized!
@@ -114,7 +136,7 @@ export async function initializeArc(provider?: any): Promise<boolean> {
     const retryLink = new RetryLink({
       attempts: {
         max: 5,
-        retryIf: (error, _operation) =>  {
+        retryIf: (error, _operation) => {
         // eslint-disable-next-line no-console
           console.error("error occurred fetching data, retrying...");
           // eslint-disable-next-line no-console
@@ -206,7 +228,7 @@ async function ensureCorrectNetwork(provider: any): Promise<void> {
   // TODO: we should not use the network NAME but the network ID to identify the network...
   const networkName = await getProviderNetworkName(provider);
 
-  if (networkName !== expectedNetworkName)  {
+  if (networkName !== expectedNetworkName) {
     if (expectedNetworkName === "xdai") {
       // TODO: xdai is reporting network 'unknown (100)` , it seems
       if (networkName === "unknown (100)") {
@@ -416,7 +438,7 @@ export async function logout(showNotification?: any): Promise<boolean> {
     success = await initializeArc();
 
     if (!success) {
-      const msg =  `Unable to disconnect from : ${networkName}`;
+      const msg = `Unable to disconnect from : ${networkName}`;
       if (showNotification) {
         showNotification(NotificationStatus.Failure, msg);
       } else {
@@ -517,7 +539,7 @@ export async function enableWalletProvider(options: IEnableWalletProviderParams)
 export function pollForAccountChanges(currentAccountAddress: Address | null, interval = 2000): Observable<Address> {
   // eslint-disable-next-line no-console
   console.log(`start polling for account changes from: ${currentAccountAddress}`);
-  return Observable.create((observer: any): () => void  => {
+  return Observable.create((observer: any): () => void => {
     let prevAccount = currentAccountAddress;
     let running = false;
 

src/components/Account/AccountBalance.tsx

@@ -9,7 +9,7 @@ interface IProps {
   tokenSymbol: string;
 }
 
-export default class Balance extends React.Component<IProps, null>  {
+export default class Balance extends React.Component<IProps, null> {
 
   constructor(props: IProps) {
     super(props);

src/components/Account/AccountBalances.tsx

@@ -16,7 +16,7 @@ interface IExternalProps {
 
 type IProps = IExternalProps & ISubscriptionProps<[IMemberState, BN|null, BN|null]>
 
-class AccountBalances extends React.Component<IProps, null>  {
+class AccountBalances extends React.Component<IProps, null> {
 
   public render(): RenderOutput {
     const { dao, data } = this.props;

src/components/Account/AccountPopup.tsx

@@ -6,7 +6,7 @@ import AccountProfileName from "components/Account/AccountProfileName";
 import Reputation from "components/Account/Reputation";
 import FollowButton from "components/Shared/FollowButton";
 import withSubscription, { ISubscriptionProps } from "components/Shared/withSubscription";
-import { copyToClipboard  } from "lib/util";
+import { copyToClipboard } from "lib/util";
 import * as React from "react";
 import { connect } from "react-redux";
 import { IRootState } from "reducers";

src/components/Account/AccountProfilePage.tsx

@@ -127,7 +127,7 @@ class AccountProfilePage extends React.Component<IProps, IState> {
     if (this.props.threeBox || parseInt(localStorage.getItem("dontShowThreeboxModal"))) {
       await updateProfile(currentAccountAddress, values.name, values.description);
     } else {
-      this.setState({ showThreeBoxModal: true,  description: values.description, name: values.name });
+      this.setState({ showThreeBoxModal: true, description: values.description, name: values.name });
     }
 
     setSubmitting(false);

src/components/Dao/DaoContainer.tsx

@@ -18,15 +18,15 @@ import { showNotification } from "reducers/notifications";
 import { IProfileState } from "reducers/profilesReducer";
 import DetailsPageRouter from "components/Scheme/ContributionRewardExtRewarders/DetailsPageRouter";
 import { combineLatest, Subscription } from "rxjs";
-import DaoDiscussionPage from "./DaoDiscussionPage";
 import DaoSchemesPage from "./DaoSchemesPage";
 import DaoHistoryPage from "./DaoHistoryPage";
 import DaoMembersPage from "./DaoMembersPage";
 import * as css from "./Dao.scss";
+import DaoLandingPage from "components/Dao/DaoLandingPage";
 
 type IExternalProps = RouteComponentProps<any>;
 
-interface IStateProps  {
+interface IStateProps {
   currentAccountAddress: string;
   currentAccountProfile: IProfileState;
   daoAvatarAddress: string;
@@ -64,7 +64,6 @@ class DaoContainer extends React.Component<IProps, null> {
 
   private daoHistoryRoute = (routeProps: any) => <DaoHistoryPage {...routeProps} daoState={this.props.data[0]} currentAccountAddress={this.props.currentAccountAddress} />;
   private daoMembersRoute = (routeProps: any) => <DaoMembersPage {...routeProps} daoState={this.props.data[0]} />;
-  private daoDiscussionRoute = (routeProps: any) => <DaoDiscussionPage {...routeProps} dao={this.props.data[0]} />;
   private daoProposalRoute = (routeProps: any) =>
     <ProposalDetailsPage {...routeProps}
       currentAccountAddress={this.props.currentAccountAddress}
@@ -80,6 +79,7 @@ class DaoContainer extends React.Component<IProps, null> {
 
   private schemeRoute = (routeProps: any) => <SchemeContainer {...routeProps} daoState={this.props.data[0]} currentAccountAddress={this.props.currentAccountAddress} />;
   private daoSchemesRoute = (routeProps: any) => <DaoSchemesPage {...routeProps} daoState={this.props.data[0]} />;
+  private daoLandingRoute = (_routeProps: any) => <DaoLandingPage daoState={this.props.data[0]} />;
   private modalRoute = (route: any) => `/dao/${route.params.daoAvatarAddress}/scheme/${route.params.schemeId}/`;
 
   public render(): RenderOutput {
@@ -106,12 +106,12 @@ class DaoContainer extends React.Component<IProps, null> {
             </div>
           </div>
           <Switch>
+            <Route exact path="/dao/:daoAvatarAddress"
+              render={this.daoLandingRoute} />
             <Route exact path="/dao/:daoAvatarAddress/history"
               render={this.daoHistoryRoute} />
             <Route exact path="/dao/:daoAvatarAddress/members"
               render={this.daoMembersRoute} />
-            <Route exact path="/dao/:daoAvatarAddress/discussion"
-              render={this.daoDiscussionRoute} />
 
             <Route exact path="/dao/:daoAvatarAddress/proposal/:proposalId"
               render={this.daoProposalRoute}
@@ -123,8 +123,10 @@ class DaoContainer extends React.Component<IProps, null> {
             <Route path="/dao/:daoAvatarAddress/scheme/:schemeId"
               render={this.schemeRoute} />
 
-            <Route path="/dao/:daoAvatarAddress" render={this.daoSchemesRoute} />
+            <Route exact path="/dao/:daoAvatarAddress/schemes"
+              render={this.daoSchemesRoute} />
 
+            <Route path="/dao/:daoAvatarAddress" render={this.daoLandingRoute} />
           </Switch>
 
           <ModalRoute

src/components/Dao/DaoLandingPage.scss

@@ -0,0 +1,78 @@
+.landingPage {
+  padding-top: 18px;
+
+  .infoContainer {
+    margin-bottom: 40px;
+  }
+
+  .infoContainer .titleContainer,
+  .wallContainer .headerText {
+    border-bottom: 1px solid rgba(45, 109, 181, 0.2);
+    margin-bottom: 30px;
+    padding-bottom: 5px;
+  }
+
+  .headerText {
+    font-size: 28px;
+    font-weight: bold;
+    color: rgba(104, 155, 214, 1);
+  }
+
+  .infoContainer .titleContainer .row {
+    display: flex;
+    align-items: center;
+
+    .headerText {
+      flex-grow: 2;
+    }
+    div.editButton {
+      padding-right: 8px;
+      button {
+        height: 30px;
+        border-radius: 30px;
+        border-width: 1px;
+        background-color: #0071ff;
+        padding: 0 15px;
+        border-color: #0376ff;
+        color: white;
+        font-weight: bold;
+        font-size: 11px;
+        text-align: center;
+        cursor: pointer;
+        outline: none;
+        white-space: nowrap;
+      }
+    }
+  }
+
+  .welcome,
+  .visitProposals {
+    margin-bottom: 16px;
+  }
+
+  .wallContainer {
+    padding-bottom: 5px;
+  }
+}
+
+.modalHeader {
+  display: flex;
+
+  .title {
+    flex-grow: 2;
+  }
+
+  .closeButton {
+    img {
+      position: relative;
+      width: 13px;
+      height: 13px;
+    }
+  }
+}
+
+.modalBody {
+  div {
+    margin-bottom: 1rem;
+  }
+}