From 5a6e2f89ddc46b0f09560e2b8322207404a16f69 Mon Sep 17 00:00:00 2001 From: Jaco Greeff Date: Mon, 14 Nov 2016 17:02:45 +0100 Subject: [PATCH] Hide external apps by default --- js/src/views/Dapps/AddDapps/AddDapps.js | 5 +- js/src/views/Dapps/Summary/summary.js | 3 +- js/src/views/Dapps/builtin.json | 13 ++- js/src/views/Dapps/dapps.js | 2 +- js/src/views/Dapps/dappsStore.js | 114 ++++++++++++------------ 5 files changed, 70 insertions(+), 67 deletions(-) diff --git a/js/src/views/Dapps/AddDapps/AddDapps.js b/js/src/views/Dapps/AddDapps/AddDapps.js index 38bb64792..49d3c5e8d 100644 --- a/js/src/views/Dapps/AddDapps/AddDapps.js +++ b/js/src/views/Dapps/AddDapps/AddDapps.js @@ -52,7 +52,7 @@ export default class AddDapps extends Component { visible scroll> - { store.apps.map(this.renderApp) } + { store.sortedApps.map(this.renderApp) } ); @@ -60,7 +60,8 @@ export default class AddDapps extends Component { renderApp = (app) => { const { store } = this.props; - const isHidden = store.hidden.includes(app.id); + const isHidden = !store.displayApps[app.id].visible; + const onCheck = () => { if (isHidden) { store.showApp(app.id); diff --git a/js/src/views/Dapps/Summary/summary.js b/js/src/views/Dapps/Summary/summary.js index 912f1495e..b0963a560 100644 --- a/js/src/views/Dapps/Summary/summary.js +++ b/js/src/views/Dapps/Summary/summary.js @@ -17,7 +17,7 @@ import React, { Component, PropTypes } from 'react'; import { Link } from 'react-router'; -import { Container, ContainerTitle } from '../../../ui'; +import { Container, ContainerTitle, Tags } from '../../../ui'; import styles from './summary.css'; @@ -49,6 +49,7 @@ export default class Summary extends Component { return ( { image } +
", - "version": "1.0.0" + "version": "1.0.0", + "visible": true }, { "id": "0xd1adaede68d344519025e2ff574650cd99d3830fe6d274c7a7843cdc00e17938", @@ -13,7 +14,8 @@ "name": "Registry", "description": "A global registry of addresses on the network", "author": "Parity Team ", - "version": "1.0.0" + "version": "1.0.0", + "visible": true }, { "id": "0x0a8048117e51e964628d0f2d26342b3cd915248b59bcce2721e1d05f5cfa2208", @@ -21,7 +23,8 @@ "name": "Token Registry", "description": "A registry of transactable tokens on the network", "author": "Parity Team ", - "version": "1.0.0" + "version": "1.0.0", + "visible": true }, { "id": "0xf49089046f53f5d2e5f3513c1c32f5ff57d986e46309a42d2b249070e4e72c46", @@ -29,7 +32,8 @@ "name": "Method Registry", "description": "A registry of method signatures for lookups on transactions", "author": "Parity Team ", - "version": "1.0.0" + "version": "1.0.0", + "visible": true }, { "id": "0x058740ee9a5a3fb9f1cfa10752baec87e09cc45cd7027fd54708271aca300c75", @@ -38,6 +42,7 @@ "description": "A mapping of GitHub URLs to hashes for use in contracts as references", "author": "Parity Team ", "version": "1.0.0", + "visible": false, "secure": true } ] diff --git a/js/src/views/Dapps/dapps.js b/js/src/views/Dapps/dapps.js index 708c52cb5..5d9877d73 100644 --- a/js/src/views/Dapps/dapps.js +++ b/js/src/views/Dapps/dapps.js @@ -54,7 +54,7 @@ export default class Dapps extends Component { />
- { this.store.visible.map(this.renderApp) } + { this.store.visibleApps.map(this.renderApp) }
diff --git a/js/src/views/Dapps/dappsStore.js b/js/src/views/Dapps/dappsStore.js index 599dc18e9..78be6d9fb 100644 --- a/js/src/views/Dapps/dappsStore.js +++ b/js/src/views/Dapps/dappsStore.js @@ -14,39 +14,42 @@ // You should have received a copy of the GNU General Public License // along with Parity. If not, see . +import BigNumber from 'bignumber.js'; import { action, computed, observable, transaction } from 'mobx'; +import store from 'store'; import Contracts from '../../contracts'; import { hashToImageUrl } from '../../redux/util'; import builtinApps from './builtin.json'; -const LS_KEY_HIDDEN = 'hiddenApps'; -const LS_KEY_EXTERNAL = 'externalApps'; +const LS_KEY_DISPLAY = 'displayApps'; export default class DappsStore { @observable apps = []; - @observable externalApps = []; - @observable hiddenApps = []; + @observable displayApps = {}; @observable modalOpen = false; constructor (api) { this._api = api; - this._readHiddenApps(); - this._readExternalApps(); + this._readDisplayApps(); - this._fetchBuiltinApps(); - this._fetchLocalApps(); - this._fetchRegistryApps(); + Promise + .all([ + this._fetchBuiltinApps(), + this._fetchLocalApps(), + this._fetchRegistryApps() + ]) + .then(this._writeDisplayApps); } - @computed get visible () { - return this.apps - .filter((app) => { - return this.externalApps.includes(app.id) || !this.hiddenApps.includes(app.id); - }) - .sort((a, b) => a.name.localeCompare(b.name)); + @computed get sortedApps () { + return this.apps.sort((a, b) => a.name.localeCompare(b.name)); + } + + @computed get visibleApps () { + return this.sortedApps.filter((app) => this.displayApps[app.id] && this.displayApps[app.id].visible); } @action openModal = () => { @@ -58,13 +61,33 @@ export default class DappsStore { } @action hideApp = (id) => { - this.hiddenApps = this.hiddenApps.concat(id); - this._writeHiddenApps(); + const app = this.displayApps[id] || {}; + app.visible = false; + + this.displayApps[id] = app; + this._writeDisplayApps(); } @action showApp = (id) => { - this.hiddenApps = this.hiddenApps.filter((_id) => _id !== id); - this._writeHiddenApps(); + const app = this.displayApps[id] || {}; + app.visible = true; + + this.displayApps[id] = app; + this._writeDisplayApps(); + } + + @action setDisplayApps = (apps) => { + this.displayApps = apps; + } + + @action addApp = (app, visible) => { + transaction(() => { + this.apps.push(app); + + if (!this.displayApps[app.id]) { + this.displayApps[app.id] = { visible }; + } + }); } _getHost (api) { @@ -83,9 +106,12 @@ export default class DappsStore { builtinApps.forEach((app, index) => { app.type = 'builtin'; app.image = hashToImageUrl(imageIds[index]); - this.apps.push(app); + this.addApp(app, app.visible); }); }); + }) + .catch((error) => { + console.warn('DappsStore:fetchBuiltinApps', error); }); } @@ -106,7 +132,7 @@ export default class DappsStore { }) .then((apps) => { transaction(() => { - (apps || []).forEach((app) => this.apps.push(app)); + (apps || []).forEach((app) => this.addApp(app, true)); }); }) .catch((error) => { @@ -132,7 +158,9 @@ export default class DappsStore { .then((appsInfo) => { const appIds = appsInfo .map(([appId, owner]) => this._api.util.bytesToHex(appId)) - .filter((appId) => !builtinApps.find((app) => app.id === appId)); + .filter((appId) => { + return (new BigNumber(appId)).gt(0) && !builtinApps.find((app) => app.id === appId); + }); return Promise .all([ @@ -181,7 +209,7 @@ export default class DappsStore { }) .then((apps) => { transaction(() => { - (apps || []).forEach((app) => this.apps.push(app)); + (apps || []).forEach((app) => this.addApp(app, false)); }); }) .catch((error) => { @@ -202,43 +230,11 @@ export default class DappsStore { }); } - _readHiddenApps () { - const stored = localStorage.getItem(LS_KEY_HIDDEN); - - if (stored) { - try { - this.hiddenApps = JSON.parse(stored); - } catch (error) { - console.warn('DappsStore:readHiddenApps', error); - } - } + _readDisplayApps = () => { + this.setDisplayApps(store.get(LS_KEY_DISPLAY) || {}); } - _readExternalApps () { - const stored = localStorage.getItem(LS_KEY_EXTERNAL); - - if (stored) { - try { - this.externalApps = JSON.parse(stored); - } catch (error) { - console.warn('DappsStore:readExternalApps', error); - } - } - } - - _writeExternalApps () { - try { - localStorage.setItem(LS_KEY_EXTERNAL, JSON.stringify(this.externalApps)); - } catch (error) { - console.error('DappsStore:writeExternalApps', error); - } - } - - _writeHiddenApps () { - try { - localStorage.setItem(LS_KEY_HIDDEN, JSON.stringify(this.hiddenApps)); - } catch (error) { - console.error('DappsStore:writeHiddenApps', error); - } + _writeDisplayApps = () => { + store.set(LS_KEY_DISPLAY, this.displayApps); } }