diff --git a/packages/pluggableWidgets/gallery-native/CHANGELOG.md b/packages/pluggableWidgets/gallery-native/CHANGELOG.md index 2e18f9c30..856885010 100644 --- a/packages/pluggableWidgets/gallery-native/CHANGELOG.md +++ b/packages/pluggableWidgets/gallery-native/CHANGELOG.md @@ -6,11 +6,15 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/), ## [Unreleased] +### Fixed + +- We've fixed an issue with a race condition where the Gallery widget would not consistently render items when using virtual scrolling in arbitrary scenarios. + ## [2.0.1] - 2025-10-17 ### Fixed -- We've fixed an issue where the Gallery widget would not properly load more items when scrolling down quickly. +- We've fixed an issue where the Gallery widget would not properly load more items when scrolling down quickly. ## [2.0.0] - 2024-12-3 diff --git a/packages/pluggableWidgets/gallery-native/package.json b/packages/pluggableWidgets/gallery-native/package.json index 245dc9bb6..faa93222d 100644 --- a/packages/pluggableWidgets/gallery-native/package.json +++ b/packages/pluggableWidgets/gallery-native/package.json @@ -1,7 +1,7 @@ { "name": "gallery-native", "widgetName": "Gallery", - "version": "2.0.1", + "version": "2.0.2", "description": "A flexible gallery widget that renders columns, rows and layouts.", "copyright": "© Mendix Technology BV 2022. All rights reserved.", "license": "Apache-2.0", diff --git a/packages/pluggableWidgets/gallery-native/src/Gallery.tsx b/packages/pluggableWidgets/gallery-native/src/Gallery.tsx index a32886d77..433f274d2 100644 --- a/packages/pluggableWidgets/gallery-native/src/Gallery.tsx +++ b/packages/pluggableWidgets/gallery-native/src/Gallery.tsx @@ -1,5 +1,5 @@ import { all } from "deepmerge"; -import { createElement, ReactElement, useCallback, useEffect, useMemo, useState, useRef } from "react"; +import { createElement, ReactElement, useCallback, useEffect, useMemo, useState, useRef, Fragment } from "react"; import { executeAction, FilterType, @@ -13,7 +13,7 @@ import { extractFilters } from "./utils/filters"; import { FilterCondition } from "mendix/filters"; import { Gallery as GalleryComponent, GalleryProps as GalleryComponentProps } from "./components/Gallery"; import { GalleryProps } from "../typings/GalleryProps"; -import { ObjectItem } from "mendix"; +import { ObjectItem, ValueStatus } from "mendix"; export const Gallery = (props: GalleryProps): ReactElement => { const viewStateFilters = useRef(undefined); @@ -49,6 +49,7 @@ export const Gallery = (props: GalleryProps): ReactElement => { }), {} ), + // eslint-disable-next-line react-hooks/exhaustive-deps [props.filterList, viewStateFilters.current] ); @@ -103,6 +104,10 @@ export const Gallery = (props: GalleryProps): ReactElement => { [FilterContext, customFiltersState, filterList, initialFilters, isFilterable, props.filtersPlaceholder] ); + if (props.datasource.status === ValueStatus.Loading && props.datasource.items === undefined) { + return ; + } + return ( - +