Contracts & Contract develop as dapp

js/src/config/dappsViews.json

@@ -21,6 +21,28 @@
     "visible": true,
     "secure": true
   },
+  {
+    "id": "contracts",
+    "url": "contracts",
+    "src": "Contracts",
+    "name": "Contracts",
+    "description": "Display the contracts added to the addressbook",
+    "author": "Parity Team <admin@ethcore.io>",
+    "version": "2.0.0",
+    "visible": true,
+    "secure": true
+  },
+  {
+    "id": "develop",
+    "url": "develop",
+    "src": "ContractDevelop",
+    "name": "Contract Development",
+    "description": "Create new contracts",
+    "author": "Parity Team <admin@ethcore.io>",
+    "version": "2.0.0",
+    "visible": true,
+    "secure": true
+  },
   {
     "id": "home",
     "url": "home",
@@ -32,6 +54,28 @@
     "visible": true,
     "secure": true
   },
+  {
+    "id": "home",
+    "url": "home",
+    "src": "Home",
+    "name": "Home",
+    "description": "Display the status of the node, recently accessed applications, accounts and news",
+    "author": "Parity Team <admin@ethcore.io>",
+    "version": "2.0.0",
+    "visible": true,
+    "secure": true
+  },
+  {
+    "id": "settings",
+    "url": "settings",
+    "src": "Settings",
+    "name": "Settings",
+    "description": "Allows the configuraion of all Parity & Parity-UI related options",
+    "author": "Parity Team <admin@ethcore.io>",
+    "version": "2.0.0",
+    "visible": true,
+    "secure": true
+  },
   {
     "id": "status",
     "url": "status",
@@ -53,16 +97,5 @@
     "version": "2.0.0",
     "visible": true,
     "secure": true
-  },
-  {
-    "id": "settings",
-    "url": "settings",
-    "src": "Settings",
-    "name": "Settings",
-    "description": "Allows the configuraion of all Parity & Parity-UI related options",
-    "author": "Parity Team <admin@ethcore.io>",
-    "version": "2.0.0",
-    "visible": true,
-    "secure": true
   }
 ]

js/src/index.js

@@ -74,9 +74,7 @@ window.secureApi = api;
 ReactDOM.render(
   <AppContainer>
     <ContextProvider api={ api } muiTheme={ muiTheme } store={ store }>
-      <MainApplication
-        routerHistory={ hashHistory }
-      />
+      <MainApplication routerHistory={ hashHistory } />
     </ContextProvider>
   </AppContainer>,
   document.querySelector('#container')
@@ -89,9 +87,7 @@ if (module.hot) {
     ReactDOM.render(
       <AppContainer>
         <ContextProvider api={ api } muiTheme={ muiTheme } store={ store }>
-          <MainApplication
-            routerHistory={ hashHistory }
-          />
+          <MainApplication routerHistory={ hashHistory } />
         </ContextProvider>
       </AppContainer>,
       document.querySelector('#container')

js/src/routes.js

@@ -15,7 +15,7 @@
 // along with Parity.  If not, see <http://www.gnu.org/licenses/>.
 
 import HistoryStore from '~/mobx/historyStore';
-import { Application, Contract, Contracts, Dapp, Dapps, Signer, Web, WriteContract } from '~/views';
+import { Application, Dapp, Dapps, Signer, Web } from '~/views';
 import builtinDapps from '~/config/dappsBuiltin.json';
 import viewsDapps from '~/config/dappsViews.json';
 
@@ -24,23 +24,6 @@ const dapps = [].concat(viewsDapps, builtinDapps);
 // const accountsHistory = HistoryStore.get('accounts');
 const dappsHistory = HistoryStore.get('dapps');
 
-function handleDeprecatedRoute (nextState, replace) {
-  const { address } = nextState.params;
-  const redirectMap = {
-    account: 'accounts',
-    address: 'addresses',
-    contract: 'contracts'
-  };
-
-  const oldRoute = nextState.routes[0].path;
-  const newRoute = Object.keys(redirectMap).reduce((newRoute, key) => {
-    return newRoute.replace(new RegExp(`^/${key}`), '/' + redirectMap[key]);
-  }, oldRoute);
-
-  console.warn(`Route "${oldRoute}" is deprecated. Please use "${newRoute}"`);
-  replace(newRoute.replace(':address', address));
-}
-
 function redirectTo (path) {
   return (nextState, replace) => {
     replace(path);
@@ -64,26 +47,16 @@ function redirectTo (path) {
 //   }
 // ];
 
-const contractsRoutes = [
-  { path: 'develop', component: WriteContract },
-  { path: ':address', component: Contract }
-];
+// const contractsRoutes = [
+//   { path: ':address', component: Contract }
+// ];
 
 const routes = [
-  // Backward Compatible routes
-  { path: '/contract/:address', onEnter: handleDeprecatedRoute },
-
   { path: '/', onEnter: redirectTo('/apps') },
-  { path: '/auth', onEnter: redirectTo('/apps') },
-  { path: '/settings', onEnter: redirectTo('/settings/views') }
+  { path: '/auth', onEnter: redirectTo('/apps') }
 ];
 
 const childRoutes = [
-  {
-    path: 'contracts',
-    indexRoute: { component: Contracts },
-    childRoutes: contractsRoutes
-  },
   {
     path: 'app/:id',
     component: Dapp,

js/src/views/ContractDevelop/contractDevelop.js

@@ -28,18 +28,18 @@ import { CancelIcon, ListIcon, SaveIcon, SendIcon, SettingsIcon } from '~/ui/Ico
 import Editor from '~/ui/Editor';
 import { DeployContract, SaveContract, LoadContract } from '~/modals';
 
-import WriteContractStore from './writeContractStore';
-import styles from './writeContract.css';
+import ContractDevelopStore from './store';
+import styles from './contractDevelop.css';
 
 @observer
-class WriteContract extends Component {
+class ContractDevelop extends Component {
   static propTypes = {
     accounts: PropTypes.object.isRequired,
     worker: PropTypes.object,
     workerError: PropTypes.any
   };
 
-  store = WriteContractStore.get();
+  store = ContractDevelopStore.get();
 
   state = {
     resizing: false,
@@ -733,4 +733,4 @@ function mapStateToProps (state) {
 export default connect(
   mapStateToProps,
   null
-)(WriteContract);
+)(ContractDevelop);

js/src/views/ContractDevelop/index.js

@@ -0,0 +1,44 @@
+// Copyright 2015-2017 Parity Technologies (UK) Ltd.
+// This file is part of Parity.
+
+// Parity is free software: you can redistribute it and/or modify
+// it under the terms of the GNU General Public License as published by
+// the Free Software Foundation, either version 3 of the License, or
+// (at your option) any later version.
+
+// Parity is distributed in the hope that it will be useful,
+// but WITHOUT ANY WARRANTY; without even the implied warranty of
+// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+// GNU General Public License for more details.
+
+// You should have received a copy of the GNU General Public License
+// along with Parity.  If not, see <http://www.gnu.org/licenses/>.
+
+import ReactDOM from 'react-dom';
+import React from 'react';
+import { hashHistory } from 'react-router';
+
+import injectTapEventPlugin from 'react-tap-event-plugin';
+injectTapEventPlugin();
+
+import { api } from './parity';
+
+import { initStore } from '~/redux';
+import ContextProvider from '~/ui/ContextProvider';
+import muiTheme from '~/ui/Theme';
+
+import ContractDevelop from './contractDevelop';
+
+import '~/../assets/fonts/Roboto/font.css';
+import '~/../assets/fonts/RobotoMono/font.css';
+
+import './contractDevelop.css';
+
+const store = initStore(api, hashHistory);
+
+ReactDOM.render(
+  <ContextProvider api={ api } muiTheme={ muiTheme } store={ store }>
+    <ContractDevelop />
+  </ContextProvider>,
+  document.querySelector('#container')
+);

js/src/views/ContractDevelop/package.json

@@ -0,0 +1,19 @@
+{
+  "name": "@parity/view-contract-develop",
+  "description": "Parity contract development interface",
+  "version": "0.0.0",
+  "main": "index.js",
+  "author": "Parity Team <admin@parity.io>",
+  "maintainers": [],
+  "contributors": [],
+  "license": "GPL-3.0",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/paritytech/parity.git"
+  },
+  "keywords": [],
+  "scripts": {},
+  "devDependencies": {},
+  "dependencies": {},
+  "peerDependencies": {}
+}

js/src/views/ContractDevelop/parity.js

@@ -14,4 +14,8 @@
 // You should have received a copy of the GNU General Public License
 // along with Parity.  If not, see <http://www.gnu.org/licenses/>.
 
-export default from './writeContract';
+const api = window.parent.secureApi;
+
+export {
+  api
+};

js/src/views/ContractDevelop/store.js

@@ -25,7 +25,7 @@ import { sha3 } from '@parity/api/util/sha3';
 import SolidityUtils from '~/util/solidity';
 
 const SOLIDITY_LIST_URL = 'https://raw.githubusercontent.com/ethereum/solc-bin/gh-pages/bin/list.json';
-const WRITE_CONTRACT_STORE_KEY = '_parity::writeContractStore';
+const WRITE_CONTRACT_STORE_KEY = '_parity::contractDevelop';
 
 const SNIPPETS = {
   snippet0: {
@@ -76,7 +76,7 @@ const SNIPPETS = {
 
 let instance = null;
 
-export default class WriteContractStore {
+export default class ContractDevelopStore {
   @observable sourcecode = '';
 
   @observable compiled = false;
@@ -119,7 +119,7 @@ export default class WriteContractStore {
 
   static get () {
     if (!instance) {
-      instance = new WriteContractStore();
+      instance = new ContractDevelopStore();
     }
 
     return instance;

js/src/views/Contracts/contracts.js

@@ -16,7 +16,6 @@
 
 import React, { Component, PropTypes } from 'react';
 import { FormattedMessage } from 'react-intl';
-import { Link } from 'react-router';
 import { connect } from 'react-redux';
 import { bindActionCreators } from 'redux';
 import { uniq, isEqual } from 'lodash';
@@ -24,7 +23,7 @@ import { uniq, isEqual } from 'lodash';
 import { AddContract, DeployContract } from '~/modals';
 import { setVisibleAccounts } from '~/redux/providers/personalActions';
 import { Actionbar, ActionbarSearch, ActionbarSort, Button, Page } from '~/ui';
-import { AddIcon, DevelopIcon } from '~/ui/Icons';
+import { AddIcon } from '~/ui/Icons';
 
 import List from '../Accounts/List';
 
@@ -171,21 +170,6 @@ class Contracts extends Component {
         }
         onClick={ this.onDeployContract }
       />,
-      <Link
-        to='/contracts/develop'
-        key='writeContract'
-      >
-        <Button
-          icon={ <DevelopIcon /> }
-          label={
-            <FormattedMessage
-              id='contracts.buttons.develop'
-              defaultMessage='develop'
-            />
-          }
-        />
-      </Link>,
-
       this.renderSearchButton(),
       this.renderSortButton()
     ];

js/src/views/Contracts/index.js

@@ -14,4 +14,32 @@
 // You should have received a copy of the GNU General Public License
 // along with Parity.  If not, see <http://www.gnu.org/licenses/>.
 
-export default from './contracts';
+import ReactDOM from 'react-dom';
+import React from 'react';
+import { hashHistory } from 'react-router';
+
+import injectTapEventPlugin from 'react-tap-event-plugin';
+injectTapEventPlugin();
+
+import { api } from './parity';
+
+import ContractInstances from '~/contracts';
+import { initStore } from '~/redux';
+import ContextProvider from '~/ui/ContextProvider';
+import muiTheme from '~/ui/Theme';
+
+import Contracts from './contracts';
+
+import '~/../assets/fonts/Roboto/font.css';
+import '~/../assets/fonts/RobotoMono/font.css';
+
+ContractInstances.get(api);
+
+const store = initStore(api, hashHistory);
+
+ReactDOM.render(
+  <ContextProvider api={ api } muiTheme={ muiTheme } store={ store }>
+    <Contracts />
+  </ContextProvider>,
+  document.querySelector('#container')
+);

js/src/views/Contracts/package.json

@@ -0,0 +1,19 @@
+{
+  "name": "@parity/view-contracts",
+  "description": "Parity contracts views",
+  "version": "0.0.0",
+  "main": "index.js",
+  "author": "Parity Team <admin@parity.io>",
+  "maintainers": [],
+  "contributors": [],
+  "license": "GPL-3.0",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/paritytech/parity.git"
+  },
+  "keywords": [],
+  "scripts": {},
+  "devDependencies": {},
+  "dependencies": {},
+  "peerDependencies": {}
+}

js/src/views/Contracts/parity.js

@@ -0,0 +1,21 @@
+// Copyright 2015-2017 Parity Technologies (UK) Ltd.
+// This file is part of Parity.
+
+// Parity is free software: you can redistribute it and/or modify
+// it under the terms of the GNU General Public License as published by
+// the Free Software Foundation, either version 3 of the License, or
+// (at your option) any later version.
+
+// Parity is distributed in the hope that it will be useful,
+// but WITHOUT ANY WARRANTY; without even the implied warranty of
+// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+// GNU General Public License for more details.
+
+// You should have received a copy of the GNU General Public License
+// along with Parity.  If not, see <http://www.gnu.org/licenses/>.
+
+const api = window.parent.secureApi;
+
+export {
+  api
+};

js/src/views/Settings/Views/defaults.js

@@ -16,7 +16,7 @@
 
 import React from 'react';
 
-import { AppsIcon, ContactsIcon, FingerprintIcon } from '~/ui/Icons';
+import { AppsIcon, FingerprintIcon } from '~/ui/Icons';
 
 const defaultViews = {
   apps: {
@@ -26,13 +26,6 @@ const defaultViews = {
     value: 'app'
   },
 
-  contracts: {
-    active: true,
-    icon: <ContactsIcon />,
-    route: '/contracts',
-    value: 'contract'
-  },
-
   signer: {
     active: true,
     fixed: true,

js/src/views/index.js

@@ -18,11 +18,9 @@ export Account from './Account';
 export Address from './Address';
 export Application from './Application';
 export Contract from './Contract';
-export Contracts from './Contracts';
 export Dapp from './Dapp';
 export Dapps from './Dapps';
 export ParityBar from './ParityBar';
 export Signer from './Signer';
 export Wallet from './Wallet';
 export Web from './Web';
-export WriteContract from './WriteContract';