From d83d7322dc9772dc2cd0d6bd3ee35818b8d1ebe2 Mon Sep 17 00:00:00 2001
From: Nolan Lawson <nolan@nolanlawson.com>
Date: Tue, 4 Dec 2018 07:24:55 -0800
Subject: [PATCH] Revert "chore(store): clean up usage of svelte store (#713)"
 (#725)

This reverts commit 36d90d34e50919016a6b8e3a2bb713766d26fc82.

Fixes #724
---
 .../_components/virtualList/VirtualList.html  | 19 ++++++++++++++-----
 .../virtualList/VirtualListContainer.html     | 10 +++++++---
 .../virtualList/virtualListStore.js           |  3 ---
 3 files changed, 21 insertions(+), 11 deletions(-)

diff --git a/routes/_components/virtualList/VirtualList.html b/routes/_components/virtualList/VirtualList.html
index 5ce39d76..f8f759f4 100644
--- a/routes/_components/virtualList/VirtualList.html
+++ b/routes/_components/virtualList/VirtualList.html
@@ -63,20 +63,26 @@
         this.store.setForRealm({ items: newItems })
         stop('set items')
       })
-      this.store.observe('allVisibleItemsHaveHeight', allVisibleItemsHaveHeight => {
+      this.observe('allVisibleItemsHaveHeight', allVisibleItemsHaveHeight => {
         if (allVisibleItemsHaveHeight) {
           this.fire('initializedVisibleItems')
         }
       })
 
+      let observedOnce = false
+
       this.observe('distanceFromBottom', (distanceFromBottom) => {
+        if (!observedOnce) {
+          observedOnce = true // TODO: the first time is always 0... need better way to handle this
+          return
+        }
         if (distanceFromBottom >= 0 &&
             distanceFromBottom <= DISTANCE_FROM_BOTTOM_TO_FIRE) {
           this.fireScrollToBottom()
         }
-      }, { init: false })
+      })
 
-      this.store.observe('scrollTop', (scrollTop) => {
+      this.observe('scrollTop', (scrollTop) => {
         this.fire('scrollTopChanged', scrollTop)
         if (scrollTop === 0) {
           this.fireScrollToTop()
@@ -97,7 +103,10 @@
     computed: {
       distanceFromBottom: ({ $scrollHeight, $scrollTop, $offsetHeight }) => {
         return $scrollHeight - $scrollTop - $offsetHeight
-      }
+      },
+      scrollTop: ({ $scrollTop }) => $scrollTop,
+      // TODO: bug in svelte store, shouldn't need to do this
+      allVisibleItemsHaveHeight: ({ $allVisibleItemsHaveHeight }) => $allVisibleItemsHaveHeight
     },
     methods: {
       observe,
@@ -114,4 +123,4 @@
       }
     }
   }
-</script>
+</script>
\ No newline at end of file
diff --git a/routes/_components/virtualList/VirtualListContainer.html b/routes/_components/virtualList/VirtualListContainer.html
index ffb55786..23a69d1f 100644
--- a/routes/_components/virtualList/VirtualListContainer.html
+++ b/routes/_components/virtualList/VirtualListContainer.html
@@ -29,7 +29,7 @@
       let { scrollTop } = this.store.get()
       let scrollContainer = getScrollContainer()
       if (scrollTop > 0) {
-        this.store.observe('allVisibleItemsHaveHeight', allVisibleItemsHaveHeight => {
+        this.observe('allVisibleItemsHaveHeight', allVisibleItemsHaveHeight => {
           console.log('allVisibleItemsHaveHeight', allVisibleItemsHaveHeight)
           let { initializedScrollTop } = this.get()
           if (!initializedScrollTop && allVisibleItemsHaveHeight) {
@@ -46,7 +46,7 @@
         })
       } else {
         this.fire('noNeedToScroll')
-        this.store.observe('allVisibleItemsHaveHeight', allVisibleItemsHaveHeight => {
+        this.observe('allVisibleItemsHaveHeight', allVisibleItemsHaveHeight => {
           if (allVisibleItemsHaveHeight) {
             console.log('initialized VirtualList')
             this.fire('initialized')
@@ -110,6 +110,10 @@
           offsetHeight: getOffsetHeight()
         })
       }
+    },
+    computed: {
+      // TODO: bug in svelte/store – the observer in oncreate() never get removed without this hack
+      allVisibleItemsHaveHeight: ({ $allVisibleItemsHaveHeight }) => $allVisibleItemsHaveHeight
     }
   }
-</script>
+</script>
\ No newline at end of file
diff --git a/routes/_components/virtualList/virtualListStore.js b/routes/_components/virtualList/virtualListStore.js
index 0df2985b..c7a2a6cd 100644
--- a/routes/_components/virtualList/virtualListStore.js
+++ b/routes/_components/virtualList/virtualListStore.js
@@ -1,7 +1,6 @@
 import { mark, stop } from '../../_utils/marks'
 import { RealmStore } from '../../_utils/RealmStore'
 import { reselect } from '../../_utils/reselect'
-import { observe } from 'svelte-extras'
 
 const RENDER_BUFFER_FACTOR = 2.5
 
@@ -11,8 +10,6 @@ class VirtualListStore extends RealmStore {
   }
 }
 
-VirtualListStore.prototype.observe = observe
-
 const virtualListStore = new VirtualListStore()
 
 virtualListStore.computeForRealm('items', null)