Merge of Insiders features tied to 'Black Pearl' funding goal

src/assets/javascripts/components/tabs/index.ts

@@ -26,11 +26,16 @@ import {
   finalize,
   map,
   observeOn,
+  switchMap,
   tap
 } from "rxjs/operators"
 
 import { resetTabsState, setTabsState } from "~/actions"
-import { Viewport, watchViewportAt } from "~/browser"
+import {
+  Viewport,
+  watchElementSize,
+  watchViewportAt
+} from "~/browser"
 
 import { Component } from "../_"
 import { Header } from "../header"
@@ -81,8 +86,9 @@ interface MountOptions {
 export function watchTabs(
   el: HTMLElement, { viewport$, header$ }: WatchOptions
 ): Observable<Tabs> {
-  return watchViewportAt(el, { header$, viewport$ })
+  return watchElementSize(document.body)
     .pipe(
+      switchMap(() => watchViewportAt(el, { header$, viewport$ })),
       map(({ offset: { y } }) => {
         return {
           hidden: y >= 10