From 1b023fb6d783862a9d187c27c4f299335fa2245f Mon Sep 17 00:00:00 2001
From: Tom Moor <tom.moor@gmail.com>
Date: Sat, 8 Aug 2020 17:39:30 -0700
Subject: [PATCH] fix: Remove flash of loading state for document lists

---
 app/components/PaginatedList.js | 12 +++++++++++-
 1 file changed, 11 insertions(+), 1 deletion(-)

diff --git a/app/components/PaginatedList.js b/app/components/PaginatedList.js
index 7440ef730..60a69668a 100644
--- a/app/components/PaginatedList.js
+++ b/app/components/PaginatedList.js
@@ -20,6 +20,8 @@ type Props = {
 @observer
 class PaginatedList extends React.Component<Props> {
   isInitiallyLoaded: boolean = false;
+  timeout: ?TimeoutID;
+  @observable isLongLoading: boolean = false;
   @observable isLoaded: boolean = false;
   @observable isFetchingMore: boolean = false;
   @observable isFetching: boolean = false;
@@ -34,6 +36,11 @@ class PaginatedList extends React.Component<Props> {
 
   componentDidMount() {
     this.fetchResults();
+    this.timeout = setTimeout(() => (this.isLongLoading = true), 200);
+  }
+
+  componentWillUnmount() {
+    clearTimeout(this.timeout);
   }
 
   componentDidUpdate(prevProps: Props) {
@@ -90,7 +97,10 @@ class PaginatedList extends React.Component<Props> {
     const { items, heading, empty } = this.props;
 
     const showLoading =
-      this.isFetching && !this.isFetchingMore && !this.isInitiallyLoaded;
+      this.isFetching &&
+      this.isLongLoading &&
+      !this.isFetchingMore &&
+      !this.isInitiallyLoaded;
     const showEmpty = !items.length && !showLoading;
     const showList =
       (this.isLoaded || this.isInitiallyLoaded) && !showLoading && !showEmpty;