From 1765435922c36966d88a5f5227f790b42712374f Mon Sep 17 00:00:00 2001
From: fvictorio <victorio.franco@gmail.com>
Date: Mon, 17 Dec 2018 15:40:13 -0300
Subject: [PATCH] Handle new blocks older than last block

---
 .../assets/__tests__/pages/blocks.js          | 21 +++++++++++++++++++
 .../block_scout_web/assets/js/pages/blocks.js |  7 ++++---
 2 files changed, 25 insertions(+), 3 deletions(-)

diff --git a/apps/block_scout_web/assets/__tests__/pages/blocks.js b/apps/block_scout_web/assets/__tests__/pages/blocks.js
index 4d89363ea2..bed57a4c4d 100644
--- a/apps/block_scout_web/assets/__tests__/pages/blocks.js
+++ b/apps/block_scout_web/assets/__tests__/pages/blocks.js
@@ -103,6 +103,27 @@ describe('RECEIVED_NEW_BLOCK', () => {
         '<div data-block-number="4"></div>'
     ])
   })
+  test('replaces duplicated block older than last one', () => {
+    const state = Object.assign({}, initialState, {
+      items: [
+        '<div data-block-number="5"></div>',
+        '<div data-block-number="4"></div>'
+      ],
+      blockType: 'block'
+    })
+    const action = {
+      type: 'RECEIVED_NEW_BLOCK',
+      msg: {
+        blockHtml: '<div data-block-number="4" class="new"></div>',
+      }
+    }
+    const output = reducer(state, action)
+
+    expect(output.items).toEqual([
+        '<div data-block-number="5"></div>',
+        '<div data-block-number="4" class="new"></div>'
+    ])
+  })
   test('skips if new block height is lower than lowest on page', () => {
     const state = Object.assign({}, initialState, {
       items: [
diff --git a/apps/block_scout_web/assets/js/pages/blocks.js b/apps/block_scout_web/assets/js/pages/blocks.js
index f494c6b518..39d9543b8e 100644
--- a/apps/block_scout_web/assets/js/pages/blocks.js
+++ b/apps/block_scout_web/assets/js/pages/blocks.js
@@ -56,15 +56,16 @@ function withMissingBlocks (reducer) {
 
     if (result.items.length < 2) return result
 
-    const maxBlock = getBlockNumber(_.first(result.items))
-    const minBlock = getBlockNumber(_.last(result.items))
-
     const blockNumbersToItems = result.items.reduce((acc, item) => {
       const blockNumber = getBlockNumber(item)
       acc[blockNumber] = acc[blockNumber] || item
       return acc
     }, {})
 
+    const blockNumbers = _(blockNumbersToItems).keys().map(x => parseInt(x, 10)).value()
+    const minBlock = _.min(blockNumbers)
+    const maxBlock = _.max(blockNumbers)
+
     return Object.assign({}, result, {
       items: _.rangeRight(minBlock, maxBlock + 1)
         .map((blockNumber) => blockNumbersToItems[blockNumber] || placeHolderBlock(blockNumber))