Home landing page (#4178)

* Home entry point (basics)

* WIP store for web

* Add DappUrlInput component

* Updated tests

* WIP store update

* Adjust styling

* Add home tab

* Collapse first/last without extra divs

* Navigation actually navigates

* styling

* Encoding of ethlink.io URLs

* encodedUrl setup

* base58 encoded URLs

* Added decoding, updated tests to Parity-compliant

* Base32 (synced with Rust implementation via tests)

* Split URL into 63 character chunks

* Fix store test

* Cleanups

* s/ethlink/dapplink/

* Display app navigation & histroy

* Start on /accounts (for now, until expanded fully)

* Update tests

* ethlink.io -> web3.site

* Basic list layout

* Store history on navigation

* Show Accounts & Dapps

* Add skeleton for DappIcon (WIP)

* DappIcon WIP

* DappIcon in place

* Split into maneable sub-components

* WIP

* Tests for views/Home

* Swap default entry-point to /home

* Expose registry.get via lookupMeta

* Add getEntry interface, fix instance retrieval (with tests)

* Add news display component

* Add tests for added contracts/registry methods

* Fix GHH test refactoring

* render news via SectionList

* News items store directly

* Images

* News & Urls has new layout

* Convert remainder

* First run-through of MVP for SectionList

* Update tests

* Deploycontract should not override global p styles

* Allow styles overrides for head & body

* Adjust layout styling

* revert Container>flex

* Adjust sizes of history items

* Cleanups

* HistoryStore for tracking relevant routes

* Default route is still /accounts

* Fix tests

* Update 2015-2017

* Add lookupMeta & tests

* Add getEntry & tests

* Split Dapp icon into ui/DappIcon

* Update copyright dates

* Encoding for *.web3.site urls

* Dapp history retrieval

* Grow to only 40% on hover

* Update description

* Add DappUrlInput component

* Update Web views with store

* Update spec description

* Update spec description

* edited url does not allow in-place store edits

* Use /web/<hash> urls for iframe

* Removed (now) unused _list.css

* Mistamtched merge fixed

* Tab split (WIP)

* Split Tab component

* Update tests after merge

* typo

* Remove background !important

* Set item width to parent

* Set width, remove overflow-x: hidden

* Align hover overlays

* Container defaults to some opacity

* Display history from listRecentDapps

* Override styles for a tags

* Open URLs in new window when extension is available

* Fix tests after update

* AccountCard width 100%

* Re-add opening correct url in tab

* Cleanup link rendering

* Remove hardcoded news URL

* pre-merge

* Extra padding at Home bottom (Pr grumble)

* Match js-vaults stretch

* s/Web Apps via URL/Web Apps/ (PR grumble)

* Store recent wallets (PR grumble)

* Simplify inline style matching (PR comment)

* Add store for new retrieval

* Add missing observer

* Auto-link based on account type

* Fix UI overlaps

* Extra spacing

* Only show account when accountInfo is available

* Align timestamp line-heights

* Fix tests

* Update tests

* Really fix failing test (check for Connect(Account))

js/src/views/Web/store.js

@@ -82,8 +82,31 @@ export default class Store {
     this.setNextUrl(this.currentUrl);
   }
 
-  @action setHistory = (history) => {
-    this.history = history;
+  @action setHistory = (urls) => {
+    this.history = Object
+      .keys(urls)
+      .filter((url) => url && !url.startsWith(this._api.dappsUrl) && url.indexOf('127.0.0.1') === -1)
+      .sort((urlA, urlB) => {
+        const timeA = urls[urlA].getTime();
+        const timeB = urls[urlB].getTime();
+
+        if (timeA > timeB) {
+          return -1;
+        } else if (timeA < timeB) {
+          return 1;
+        }
+
+        return 0;
+      })
+      .map((url) => {
+        const hostname = url.replace(/^http[s]?:\/\//, '').split('/')[0];
+
+        return {
+          hostname,
+          timestamp: urls[url],
+          url
+        };
+      });
   }
 
   @action setLoading = (isLoading) => {

js/src/views/Web/store.spec.js

@@ -18,7 +18,13 @@ import sinon from 'sinon';
 
 import Store from './store';
 
-const TEST_HISTORY = ['somethingA', 'somethingB'];
+const TEST_HISTORY_URLA = 'http://testingA';
+const TEST_HISTORY_URLB = 'http://testingB';
+const TEST_HISTORY = {
+  '': new Date(678),
+  [TEST_HISTORY_URLA]: new Date(123),
+  [TEST_HISTORY_URLB]: new Date(456)
+};
 const TEST_TOKEN = 'testing-123';
 const TEST_URL1 = 'http://some.test.domain.com';
 const TEST_URL2 = 'http://something.different.com';
@@ -89,9 +95,28 @@ describe('views/Web/Store', () => {
     });
 
     describe('setHistory', () => {
-      it('sets the history', () => {
+      let history;
+
+      beforeEach(() => {
         store.setHistory(TEST_HISTORY);
-        expect(store.history.peek()).to.deep.equal(TEST_HISTORY);
+        history = store.history.peek();
+      });
+
+      it('sets the history', () => {
+        expect(history.length).to.equal(2);
+      });
+
+      it('adds hostname to entries', () => {
+        expect(history[1].hostname).to.be.ok;
+      });
+
+      it('removes hostname http prefixes', () => {
+        expect(history[1].hostname.indexOf('http')).to.equal(-1);
+      });
+
+      it('sorts the entries according to recently accessed', () => {
+        expect(history[0].url).to.equal(TEST_HISTORY_URLB);
+        expect(history[1].url).to.equal(TEST_HISTORY_URLA);
       });
     });
 
@@ -195,7 +220,7 @@ describe('views/Web/Store', () => {
       });
 
       it('sets the history as retrieved', () => {
-        expect(store.history.peek()).to.deep.equal(TEST_HISTORY);
+        expect(store.history.peek().length).not.to.equal(0);
       });
     });
   });