feat(gallery-web): fix derivedLoader to correctly update isRefreshing

Author: samuelreichert

packages/pluggableWidgets/gallery-web/src/Gallery.tsx

@@ -91,6 +91,7 @@ const Container = observer(function GalleryContainer(props: GalleryContainerProp
             focusController={focusController}
             getPosition={getPositionCallback}
             loadMoreButtonCaption={props.loadMoreButtonCaption?.value}
+            showRefreshIndicator={rootStore.loaderCtrl.showRefreshIndicator}
         />
     );
 });

packages/pluggableWidgets/gallery-web/src/controllers/DerivedLoaderController.ts

@@ -1,25 +1,23 @@
-type DerivedLoaderControllerSpec = {
-    refreshIndicator: boolean;
-    query: {
-        isRefreshing: boolean;
-        isSilentRefresh: boolean;
-    };
-};
+import { DatasourceController } from "@mendix/widget-plugin-grid/query/DatasourceController";
+import { makeObservable, computed } from "mobx";
 
 export class DerivedLoaderController {
-    constructor(private spec: DerivedLoaderControllerSpec) {}
+    constructor(
+        private datasourceController: DatasourceController,
+        private refreshIndicator: boolean
+    ) {
+        makeObservable(this, {
+            isRefreshing: computed,
+            showRefreshIndicator: computed
+        });
+    }
 
     get isRefreshing(): boolean {
-        const { isSilentRefresh, isRefreshing } = this.spec.query;
-
+        const { isSilentRefresh, isRefreshing } = this.datasourceController;
         return !isSilentRefresh && isRefreshing;
     }
 
     get showRefreshIndicator(): boolean {
-        if (!this.spec.refreshIndicator) {
-            return false;
-        }
-
-        return this.isRefreshing;
+        return this.refreshIndicator && this.isRefreshing;
     }
 }

packages/pluggableWidgets/gallery-web/src/stores/GalleryStore.ts

@@ -87,13 +87,7 @@ export class GalleryStore extends BaseControllerHost {
             host: this._sortHost
         };
 
-        this.loaderCtrl = new DerivedLoaderController({
-            refreshIndicator: spec.refreshIndicator,
-            query: {
-                isRefreshing: this._query.isRefreshing,
-                isSilentRefresh: this._query.isSilentRefresh
-            }
-        });
+        this.loaderCtrl = new DerivedLoaderController(this._query, spec.refreshIndicator);
 
         new RefreshController(this, {
             delay: 0,