diff --git a/js/src/util/dapps.js b/js/src/util/dapps.js index 0eb49135f..d85d4d522 100644 --- a/js/src/util/dapps.js +++ b/js/src/util/dapps.js @@ -25,7 +25,13 @@ import { hashToImageUrl } from '~/redux/util'; import builtinJson from '~/config/dappsBuiltin.json'; import viewsJson from '~/config/dappsViews.json'; -const builtinApps = [].concat(viewsJson, builtinJson).filter((app) => app.id); +const builtinApps = [].concat( + viewsJson.map((app) => { + app.isView = true; + return app; + }), + builtinJson.filter((app) => app.id) +); function getHost (api) { const host = process.env.DAPPS_URL || @@ -96,7 +102,9 @@ export function fetchBuiltinApps (api) { .all(builtinApps.map((app) => dappReg.getImage(app.id))) .then((imageIds) => { return builtinApps.map((app, index) => { - app.type = 'builtin'; + app.type = app.isView + ? 'view' + : 'builtin'; app.image = hashToImageUrl(imageIds[index]); return app; }); diff --git a/js/src/views/Dapps/dapps.js b/js/src/views/Dapps/dapps.js index 685e599b0..41730b1ca 100644 --- a/js/src/views/Dapps/dapps.js +++ b/js/src/views/Dapps/dapps.js @@ -114,6 +114,7 @@ class Dapps extends Component { ] } /> +
{ this.renderList(this.store.visibleViews) }
{ this.renderList(this.store.visibleLocal) }
{ this.renderList(this.store.visibleBuiltin) }
{ this.renderList(this.store.visibleNetwork, externalOverlay) }
diff --git a/js/src/views/Dapps/dappsStore.js b/js/src/views/Dapps/dappsStore.js index 47bdb89e9..573ab6208 100644 --- a/js/src/views/Dapps/dappsStore.js +++ b/js/src/views/Dapps/dappsStore.js @@ -61,6 +61,38 @@ export default class DappsStore extends EventEmitter { return instance; } + @computed get sortedBuiltin () { + return this.apps.filter((app) => app.type === 'builtin'); + } + + @computed get sortedLocal () { + return this.apps.filter((app) => app.type === 'local'); + } + + @computed get sortedNetwork () { + return this.apps.filter((app) => app.type === 'network'); + } + + @computed get visibleApps () { + return this.apps.filter((app) => this.displayApps[app.id] && this.displayApps[app.id].visible); + } + + @computed get visibleBuiltin () { + return this.visibleApps.filter((app) => app.type === 'builtin'); + } + + @computed get visibleLocal () { + return this.visibleApps.filter((app) => app.type === 'local'); + } + + @computed get visibleNetwork () { + return this.visibleApps.filter((app) => app.type === 'network'); + } + + @computed get visibleViews () { + return this.visibleApps.filter((app) => app.type === 'view'); + } + /** * Try to find the app from the local (local or builtin) * apps, else fetch from the node @@ -199,34 +231,6 @@ export default class DappsStore extends EventEmitter { }); } - @computed get sortedBuiltin () { - return this.apps.filter((app) => app.type === 'builtin'); - } - - @computed get sortedLocal () { - return this.apps.filter((app) => app.type === 'local'); - } - - @computed get sortedNetwork () { - return this.apps.filter((app) => app.type === 'network'); - } - - @computed get visibleApps () { - return this.apps.filter((app) => this.displayApps[app.id] && this.displayApps[app.id].visible); - } - - @computed get visibleBuiltin () { - return this.visibleApps.filter((app) => app.type === 'builtin'); - } - - @computed get visibleLocal () { - return this.visibleApps.filter((app) => app.type === 'local'); - } - - @computed get visibleNetwork () { - return this.visibleApps.filter((app) => app.type === 'network'); - } - @action openModal = () => { this.modalOpen = true; }