diff --git a/apps/posts/src/components/label-picker/label-picker.tsx b/apps/posts/src/components/label-picker/label-picker.tsx
index 6f0cd27988e..12af1d326db 100644
--- a/apps/posts/src/components/label-picker/label-picker.tsx
+++ b/apps/posts/src/components/label-picker/label-picker.tsx
@@ -6,7 +6,8 @@ import {
     CommandEmpty,
     CommandGroup,
     CommandItem,
-    CommandList
+    CommandList,
+    useFilterOptionsInfiniteScroll
 } from '@tryghost/shade/components';
 import {EditRow} from './edit-row';
 import {Label} from '@tryghost/admin-x-framework/api/labels';
@@ -73,6 +74,7 @@ interface LabelListItemsProps {
     labels: Label[];
     selectedSlugs: string[];
     search: string;
+    optionSource: ComboboxOptionSource<string>;
     onToggle: (slug: string) => void;
     onEdit?: (id: string, name: string) => Promise<void>;
     onDelete?: (id: string) => Promise<void>;
@@ -87,6 +89,7 @@ const LabelListItems: React.FC<LabelListItemsProps> = ({
     labels,
     selectedSlugs,
     search,
+    optionSource,
     onToggle,
     onEdit,
     onDelete,
@@ -103,6 +106,12 @@ const LabelListItems: React.FC<LabelListItemsProps> = ({
         : labels;
     const showCreate = !!onCreate && search.trim() && canCreateFromSearch?.(search);
     const showEdit = !!onEdit;
+    const loadMoreSentinelRef = useFilterOptionsInfiniteScroll({
+        optionSource,
+        optionsCount: visibleLabels.length,
+        resetKey: search
+    });
+
     const handleCreate = async () => {
         if (onCreate) {
             const newLabel = await onCreate(search.trim());
@@ -128,7 +137,7 @@ const LabelListItems: React.FC<LabelListItemsProps> = ({
 
     return (
         <>
-            {!showCreate && visibleLabels.length === 0 && (
+            {!showCreate && visibleLabels.length === 0 && !optionSource.hasMore && (
                 <CommandEmpty>No labels found</CommandEmpty>
             )}
             {visibleLabels.length > 0 && (
@@ -167,6 +176,18 @@ const LabelListItems: React.FC<LabelListItemsProps> = ({
                     </CommandItem>
                 </CommandGroup>
             )}
+            {optionSource.hasMore && (
+                <div ref={loadMoreSentinelRef} className="p-1.5">
+                    <button
+                        className="flex w-full items-center justify-center rounded-xs px-2 py-1.5 text-sm text-muted-foreground hover:bg-accent hover:text-accent-foreground disabled:opacity-50"
+                        disabled={optionSource.isLoadingMore}
+                        type="button"
+                        onClick={optionSource.loadMore}
+                    >
+                        {optionSource.isLoadingMore ? 'Loading labels...' : 'Load more'}
+                    </button>
+                </div>
+            )}
         </>
     );
 };
@@ -338,6 +359,7 @@ const ComboboxPicker: React.FC<ComboboxPickerProps> = ({
                                     isCreating={isCreating}
                                     isDuplicateName={isDuplicateName}
                                     labels={labels}
+                                    optionSource={optionSource}
                                     search={search}
                                     selectedSlugs={selectedSlugs}
                                     onCreate={onCreate}
diff --git a/apps/posts/src/hooks/filter-sources/create-combined-value-source.ts b/apps/posts/src/hooks/filter-sources/create-combined-value-source.ts
index d6a645358f0..b3c2ecb301b 100644
--- a/apps/posts/src/hooks/filter-sources/create-combined-value-source.ts
+++ b/apps/posts/src/hooks/filter-sources/create-combined-value-source.ts
@@ -26,6 +26,7 @@ export function createCombinedValueSource<T = string>(
                 loadMore: () => {
                     if (firstState.hasMore) {
                         firstState.loadMore();
+                        return;
                     }
 
                     if (secondState.hasMore) {
diff --git a/apps/posts/test/unit/hooks/create-combined-value-source.test.tsx b/apps/posts/test/unit/hooks/create-combined-value-source.test.tsx
new file mode 100644
index 00000000000..6644f60c77c
--- /dev/null
+++ b/apps/posts/test/unit/hooks/create-combined-value-source.test.tsx
@@ -0,0 +1,115 @@
+import {FilterOption, ValueSourceState} from '@tryghost/shade/patterns';
+import {createCombinedValueSource} from '@src/hooks/filter-sources/create-combined-value-source';
+import {describe, expect, it, vi} from 'vitest';
+import {renderHook} from '@testing-library/react';
+
+const firstOptions: FilterOption<string>[] = [
+    {value: 'post-1', label: 'Post 1'},
+    {value: 'post-2', label: 'Post 2'}
+];
+
+const secondOptions: FilterOption<string>[] = [
+    {value: 'page-1', label: 'Page 1'},
+    {value: 'page-2', label: 'Page 2'}
+];
+
+function buildState(options: FilterOption<string>[], overrides: Partial<ValueSourceState<string>> = {}): ValueSourceState<string> {
+    return {
+        options,
+        isInitialLoad: false,
+        isSearching: false,
+        isLoadingMore: false,
+        hasMore: false,
+        loadMore: () => {},
+        ...overrides
+    };
+}
+
+describe('createCombinedValueSource', () => {
+    it('orders first source options before second source options', () => {
+        const useCombinedSource = createCombinedValueSource(
+            () => ({
+                id: 'posts',
+                useOptions: () => buildState(firstOptions)
+            }),
+            () => ({
+                id: 'pages',
+                useOptions: () => buildState(secondOptions)
+            })
+        );
+
+        const {result} = renderHook(() => {
+            const source = useCombinedSource();
+            return source.useOptions({query: '', selectedValues: []});
+        });
+
+        expect(result.current.options).toEqual([
+            {value: 'post-1', label: 'Post 1'},
+            {value: 'post-2', label: 'Post 2'},
+            {value: 'page-1', label: 'Page 1'},
+            {value: 'page-2', label: 'Page 2'}
+        ]);
+    });
+
+    it('loads more from the first source while it still has more pages', () => {
+        const loadMoreFirst = vi.fn();
+        const loadMoreSecond = vi.fn();
+        const useCombinedSource = createCombinedValueSource(
+            () => ({
+                id: 'posts',
+                useOptions: () => buildState(firstOptions, {
+                    hasMore: true,
+                    loadMore: loadMoreFirst
+                })
+            }),
+            () => ({
+                id: 'pages',
+                useOptions: () => buildState(secondOptions, {
+                    hasMore: true,
+                    loadMore: loadMoreSecond
+                })
+            })
+        );
+
+        const {result} = renderHook(() => {
+            const source = useCombinedSource();
+            return source.useOptions({query: '', selectedValues: []});
+        });
+
+        result.current.loadMore();
+
+        expect(loadMoreFirst).toHaveBeenCalledTimes(1);
+        expect(loadMoreSecond).not.toHaveBeenCalled();
+    });
+
+    it('loads more from the second source once the first source is exhausted', () => {
+        const loadMoreFirst = vi.fn();
+        const loadMoreSecond = vi.fn();
+        const useCombinedSource = createCombinedValueSource(
+            () => ({
+                id: 'posts',
+                useOptions: () => buildState(firstOptions, {
+                    hasMore: false,
+                    loadMore: loadMoreFirst
+                })
+            }),
+            () => ({
+                id: 'pages',
+                useOptions: () => buildState(secondOptions, {
+                    hasMore: true,
+                    loadMore: loadMoreSecond
+                })
+            })
+        );
+
+        const {result} = renderHook(() => {
+            const source = useCombinedSource();
+            return source.useOptions({query: '', selectedValues: []});
+        });
+
+        result.current.loadMore();
+
+        expect(loadMoreFirst).not.toHaveBeenCalled();
+        expect(loadMoreSecond).toHaveBeenCalledTimes(1);
+    });
+});
diff --git a/apps/shade/src/components.ts b/apps/shade/src/components.ts
index 3f73e4eb64a..7ffd17068ce 100644
--- a/apps/shade/src/components.ts
+++ b/apps/shade/src/components.ts
@@ -45,6 +45,7 @@ export * from './components/ui/tabs';
 export * from './components/ui/textarea';
 export * from './components/ui/toggle-group';
 export * from './components/ui/tooltip';
+export * from './components/ui/use-filter-options-infinite-scroll';
 
 export type {DropdownMenuCheckboxItemProps as DropdownMenuCheckboxItemProps} from '@radix-ui/react-dropdown-menu';
 
diff --git a/apps/shade/src/components/ui/filters.tsx b/apps/shade/src/components/ui/filters.tsx
index 3c83d33620a..f5faa219c8a 100644
--- a/apps/shade/src/components/ui/filters.tsx
+++ b/apps/shade/src/components/ui/filters.tsx
@@ -20,6 +20,7 @@ import {
 import {Popover, PopoverContent, PopoverTrigger} from '@/components/ui/popover';
 import {Switch} from '@/components/ui/switch';
 import {Tooltip, TooltipContent, TooltipTrigger} from '@/components/ui/tooltip';
+import {type FilterOptionsInfiniteScrollSource, useFilterOptionsInfiniteScroll} from '@/components/ui/use-filter-options-infinite-scroll';
 import {cva, type VariantProps} from 'class-variance-authority';
 import {AlertCircle, Check, Loader2, Plus, X} from 'lucide-react';
 import {cn} from '@/lib/utils';
@@ -1094,10 +1095,8 @@ interface SelectOptionsListProps<T = unknown> {
     contextLabel?: string;
     selectedOptions: FilterOption<T>[];
     unselectedOptions: FilterOption<T>[];
-    isInitialLoad: boolean;
-    isLoadingMore: boolean;
-    hasMore: boolean;
-    onLoadMore: () => void;
+    optionSource: FilterOptionsInfiniteScrollSource;
+    searchInput: string;
     onSelectSelected: (option: FilterOption<T>) => void;
     onSelectUnselected: (option: FilterOption<T>) => void;
 }
@@ -1106,18 +1105,22 @@ function SelectOptionsList<T = unknown>({
     contextLabel,
     selectedOptions,
     unselectedOptions,
-    isInitialLoad,
-    isLoadingMore,
-    hasMore,
-    onLoadMore,
+    optionSource,
+    searchInput,
     onSelectSelected,
     onSelectUnselected
 }: Readonly<SelectOptionsListProps<T>>) {
     const context = useFilterContext();
+    const renderedOptionsCount = selectedOptions.length + unselectedOptions.length;
+    const loadMoreSentinelRef = useFilterOptionsInfiniteScroll({
+        optionSource,
+        optionsCount: renderedOptionsCount,
+        resetKey: searchInput
+    });
 
     return (
         <CommandList className="outline-hidden">
-            {isInitialLoad ? (
+            {optionSource.isInitialLoad ? (
                 <div className="flex items-center justify-center py-6 text-sm text-muted-foreground">
                     <Loader2 className="mr-2 size-4 animate-spin" />
                     {context.i18n.loading}
@@ -1167,18 +1170,18 @@ function SelectOptionsList<T = unknown>({
                     </CommandGroup>
                 </>
             )}
-            {hasMore && (
+            {optionSource.hasMore && (
                 <>
                     {(selectedOptions.length > 0 || unselectedOptions.length > 0) && <CommandSeparator />}
-                    <div className="p-1.5">
+                    <div ref={loadMoreSentinelRef} className="p-1.5">
                         <button
                             className="flex w-full items-center justify-center rounded-xs px-2 py-1.5 text-sm text-muted-foreground hover:bg-accent hover:text-accent-foreground disabled:opacity-50"
-                            disabled={isLoadingMore}
+                            disabled={optionSource.isLoadingMore}
                             type="button"
-                            onClick={onLoadMore}
+                            onClick={optionSource.loadMore}
                         >
-                            {isLoadingMore && <Loader2 className="mr-2 size-4 animate-spin" />}
-                            {isLoadingMore ? context.i18n.loading : context.i18n.loadMore}
+                            {optionSource.isLoadingMore && <Loader2 className="mr-2 size-4 animate-spin" />}
+                            {optionSource.isLoadingMore ? context.i18n.loading : context.i18n.loadMore}
                         </button>
                     </div>
                 </>
@@ -1206,6 +1209,13 @@ function ResolvedSelectOptionsPopover<T = unknown>({
     // Track selected options separately so they persist during async search
     const [cachedSelectedOptions, setCachedSelectedOptions] = useState<FilterOption<T>[]>([]);
     const context = useFilterContext();
+    const optionSource: FilterOptionsInfiniteScrollSource = {
+        hasMore,
+        isInitialLoad,
+        isLoadingMore,
+        isSearching,
+        loadMore: onLoadMore
+    };
 
     const isMultiSelect = field.type === 'multiselect' || values.length > 1;
     const effectiveValues = useMemo(() => field.value ?? values, [field.value, values]);
@@ -1295,12 +1305,10 @@ function ResolvedSelectOptionsPopover<T = unknown>({
                     />
                     <SelectOptionsList
                         contextLabel={field.label || 'Selected'}
-                        hasMore={hasMore}
-                        isInitialLoad={isInitialLoad}
-                        isLoadingMore={isLoadingMore}
+                        optionSource={optionSource}
+                        searchInput={searchInput}
                         selectedOptions={visibleSelectedOptions}
                         unselectedOptions={unselectedOptions}
-                        onLoadMore={onLoadMore}
                         onSelectSelected={(option) => {
                             if (isMultiSelect) {
                                 const next = effectiveValues.filter(v => v !== option.value) as T[];
@@ -1401,12 +1409,10 @@ function ResolvedSelectOptionsPopover<T = unknown>({
                         onSearchChange={handleSearchChange}
                     />
                     <SelectOptionsList
-                        hasMore={hasMore}
-                        isInitialLoad={isInitialLoad}
-                        isLoadingMore={isLoadingMore}
+                        optionSource={optionSource}
+                        searchInput={searchInput}
                         selectedOptions={visibleSelectedOptions}
                         unselectedOptions={unselectedOptions}
-                        onLoadMore={onLoadMore}
                         onSelectSelected={(option) => {
                             if (isMultiSelect) {
                                 onChange(values.filter(v => v !== option.value) as T[]);
diff --git a/apps/shade/src/components/ui/multi-select-combobox.tsx b/apps/shade/src/components/ui/multi-select-combobox.tsx
index fc5e9734388..cdde0ebe48b 100644
--- a/apps/shade/src/components/ui/multi-select-combobox.tsx
+++ b/apps/shade/src/components/ui/multi-select-combobox.tsx
@@ -11,6 +11,7 @@ import {
     CommandList,
     CommandSeparator
 } from '@/components/ui/command';
+import {useFilterOptionsInfiniteScroll} from '@/components/ui/use-filter-options-infinite-scroll';
 import {Check, Loader2} from 'lucide-react';
 import {cn} from '@/lib/utils';
 import type {FilterOption, ValueSource} from '@/components/ui/filters';
@@ -236,6 +237,13 @@ export function MultiSelectCombobox<T = unknown>({
         () => resolvedOptions.filter(opt => !values.includes(opt.value)),
         [resolvedOptions, values]
     );
+    const renderedOptionsCount = visibleSelectedOptions.length + unselectedOptions.length;
+    const loadMoreSentinelRef = useFilterOptionsInfiniteScroll({
+        optionSource: source,
+        optionsCount: renderedOptionsCount,
+        resetKey: searchInput
+    });
+
     // --- Handlers ---
 
     const handleDeselect = useCallback((option: FilterOption<T>) => {
@@ -352,7 +360,7 @@ export function MultiSelectCombobox<T = unknown>({
                     {source.hasMore && (
                         <>
                             {(visibleSelectedOptions.length > 0 || unselectedOptions.length > 0) && <CommandSeparator />}
-                            <div className="p-1.5">
+                            <div ref={loadMoreSentinelRef} className="p-1.5">
                                 <button
                                     className="flex w-full items-center justify-center rounded-xs px-2 py-1.5 text-sm text-muted-foreground hover:bg-accent hover:text-accent-foreground disabled:opacity-50"
                                     disabled={source.isLoadingMore}
diff --git a/apps/shade/src/components/ui/use-filter-options-infinite-scroll.ts b/apps/shade/src/components/ui/use-filter-options-infinite-scroll.ts
new file mode 100644
index 00000000000..9e5255c4c18
--- /dev/null
+++ b/apps/shade/src/components/ui/use-filter-options-infinite-scroll.ts
@@ -0,0 +1,83 @@
+import {useCallback, useEffect, useRef} from 'react';
+
+export interface FilterOptionsInfiniteScrollSource {
+    hasMore: boolean;
+    isInitialLoad: boolean;
+    isLoadingMore: boolean;
+    isSearching: boolean;
+    loadMore: () => void;
+}
+
+interface UseFilterOptionsInfiniteScrollOptions {
+    optionSource: FilterOptionsInfiniteScrollSource;
+    optionsCount: number;
+    resetKey: string;
+}
+
+export function useFilterOptionsInfiniteScroll({
+    optionSource,
+    optionsCount,
+    resetKey
+}: UseFilterOptionsInfiniteScrollOptions) {
+    const {
+        hasMore,
+        isInitialLoad,
+        isLoadingMore,
+        isSearching,
+        loadMore
+    } = optionSource;
+    const observerRef = useRef<IntersectionObserver | null>(null);
+    // Tracks the optionsCount at which we last triggered onLoadMore, so we don't
+    // fire repeatedly while the same page of results is still in view.
+    const requestedOptionsCountRef = useRef<number | null>(null);
+
+    useEffect(() => {
+        requestedOptionsCountRef.current = null;
+    }, [resetKey]);
+
+    const requestLoadMoreIfReady = useCallback(() => {
+        if (
+            hasMore &&
+            !isInitialLoad &&
+            !isLoadingMore &&
+            !isSearching &&
+            optionsCount > 0 &&
+            requestedOptionsCountRef.current !== optionsCount
+        ) {
+            requestedOptionsCountRef.current = optionsCount;
+            loadMore();
+        }
+    }, [hasMore, isInitialLoad, isLoadingMore, isSearching, loadMore, optionsCount]);
+
+    const sentinelRef = useCallback((node: HTMLDivElement | null) => {
+        observerRef.current?.disconnect();
+        observerRef.current = null;
+
+        if (!node || typeof IntersectionObserver === 'undefined') {
+            return;
+        }
+
+        const root = node.closest('[data-slot="command-list"]');
+        observerRef.current = new IntersectionObserver((entries) => {
+            const [entry] = entries;
+
+            if (entry?.isIntersecting) {
+                requestLoadMoreIfReady();
+            }
+        }, {
+            root,
+            rootMargin: '0px 0px 48px 0px'
+        });
+
+        observerRef.current.observe(node);
+    }, [requestLoadMoreIfReady]);
+
+    useEffect(() => {
+        return () => {
+            observerRef.current?.disconnect();
+            observerRef.current = null;
+        };
+    }, []);
+
+    return sentinelRef;
+}
diff --git a/apps/shade/test/unit/components/ui/filters.test.tsx b/apps/shade/test/unit/components/ui/filters.test.tsx
index 70b29bd7823..f7ea9184035 100644
--- a/apps/shade/test/unit/components/ui/filters.test.tsx
+++ b/apps/shade/test/unit/components/ui/filters.test.tsx
@@ -13,6 +13,12 @@ const ALL_OPTIONS: TestOption[] = [
     {value: 'draft', label: 'Draft'}
 ];
 
+type IntersectionObserverCallback = ConstructorParameters<typeof IntersectionObserver>[0];
+
+let intersectionObserverCallback: IntersectionObserverCallback | undefined;
+const observe = vi.fn();
+const disconnect = vi.fn();
+
 function TestFilters({valueSource}: Readonly<{valueSource: ValueSource<string>}>) {
     const [filters, setFilters] = useState([createFilter('status', 'is', ['published'])]);
     const fields = useMemo(() => ([
@@ -86,12 +92,42 @@ describe('Filters ValueSource', () => {
             }
         } as unknown as typeof ResizeObserver;
         HTMLElement.prototype.scrollIntoView = vi.fn();
+        global.IntersectionObserver = vi.fn((callback: IntersectionObserverCallback) => {
+            intersectionObserverCallback = callback;
+
+            return {
+                observe,
+                disconnect,
+                root: null,
+                rootMargin: '',
+                thresholds: [],
+                takeRecords: () => [],
+                unobserve: vi.fn()
+            };
+        }) as unknown as typeof IntersectionObserver;
     });
 
     afterEach(() => {
         vi.useRealTimers();
+        vi.clearAllMocks();
+        intersectionObserverCallback = undefined;
     });
 
+    async function intersectLoadMoreSentinel() {
+        await act(async () => {
+            intersectionObserverCallback?.(
+                [{isIntersecting: true} as IntersectionObserverEntry],
+                {} as IntersectionObserver
+            );
+        });
+    }
+
+    async function expectLoadMoreObserverToAttach() {
+        await waitFor(() => {
+            expect(observe).toHaveBeenCalled();
+        });
+    }
+
     it('calls the value source with local query state and selected values', async () => {
         const valueSource = createMatchingValueSource();
         const {useOptions} = valueSource;
@@ -203,6 +239,76 @@ describe('Filters ValueSource', () => {
         expect(loadMore).toHaveBeenCalledTimes(1);
     });
 
+    it('automatically loads more when the end of the option list is reached', async () => {
+        const loadMore = vi.fn();
+        const useOptions = vi.fn(() => ({
+            options: ALL_OPTIONS,
+            isInitialLoad: false,
+            isSearching: false,
+            isLoadingMore: false,
+            hasMore: true,
+            loadMore
+        }));
+
+        render(<TestFilters valueSource={{id: 'status', useOptions}} />);
+
+        openSelectedValuePopover();
+        await expectLoadMoreObserverToAttach();
+
+        await intersectLoadMoreSentinel();
+
+        expect(loadMore).toHaveBeenCalledTimes(1);
+    });
+
+    it('does not automatically load more while a page is already loading', async () => {
+        const loadMore = vi.fn();
+        const useOptions = vi.fn(() => ({
+            options: ALL_OPTIONS,
+            isInitialLoad: false,
+            isSearching: false,
+            isLoadingMore: true,
+            hasMore: true,
+            loadMore
+        }));
+
+        render(<TestFilters valueSource={{id: 'status', useOptions}} />);
+
+        openSelectedValuePopover();
+        await expectLoadMoreObserverToAttach();
+
+        await intersectLoadMoreSentinel();
+
+        expect(loadMore).not.toHaveBeenCalled();
+    });
+
+    it('waits for rendered options before automatically loading more after a search change', async () => {
+        const loadMore = vi.fn();
+        const useOptions = vi.fn(({query, selectedValues}: {query: string; selectedValues: string[]}) => ({
+            options: query ? [] : ALL_OPTIONS.filter(option => selectedValues.includes(option.value) || option.value === 'draft'),
+            isInitialLoad: false,
+            isSearching: !!query,
+            isLoadingMore: false,
+            hasMore: true,
+            loadMore
+        }));
+
+        render(<TestFilters valueSource={{id: 'status', useOptions}} />);
+
+        openSelectedValuePopover();
+        await expectLoadMoreObserverToAttach();
+
+        const input = await screen.findByPlaceholderText('Search status...');
+        fireEvent.change(input, {target: {value: 'missing'}});
+
+        await waitFor(() => {
+            expect(screen.queryByText('Draft')).toBeNull();
+        });
+
+        await intersectLoadMoreSentinel();
+
+        expect(loadMore).not.toHaveBeenCalled();
+    });
+
     it('shows loading states for static select fields', async () => {
         const {rerender} = render(<StaticLoadingFilters isLoading={true} options={[]} />);
 
diff --git a/e2e/helpers/pages/admin/members/members-list-page.ts b/e2e/helpers/pages/admin/members/members-list-page.ts
index 7ee53292ea3..7f298e279d7 100644
--- a/e2e/helpers/pages/admin/members/members-list-page.ts
+++ b/e2e/helpers/pages/admin/members/members-list-page.ts
@@ -95,6 +95,15 @@ export class MembersListPage extends AdminPage implements MembersListSurface {
         }
     }
 
+    async openFilterField(fieldName: string): Promise<void> {
+        await this.filterButton.click();
+        await this.page.getByRole('option', {name: fieldName, exact: true}).click();
+    }
+
+    getFilterOption(name: string | RegExp): Locator {
+        return this.page.getByRole('option', {name});
+    }
+
     async addSearchableFilter(fieldName: string, searchText: string, optionName: string): Promise<void> {
         await this.filterButton.click();
         await this.page.getByRole('option', {name: fieldName, exact: true}).click();
diff --git a/e2e/tests/admin/members/multiselect-filters.test.ts b/e2e/tests/admin/members/multiselect-filters.test.ts
index 50c33ada97d..447827ceff6 100644
--- a/e2e/tests/admin/members/multiselect-filters.test.ts
+++ b/e2e/tests/admin/members/multiselect-filters.test.ts
@@ -63,6 +63,58 @@ async function createOfferAndRedeem(page: Page, request: APIRequestContext, stri
     return {offer, suffix};
 }
 
+async function mockPaginatedLabels(page: Page, totalLabels: number): Promise<Set<number>> {
+    const labels = Array.from({length: totalLabels}, (_label, index) => {
+        const paddedIndex = index.toString().padStart(3, '0');
+
+        return {
+            id: `label-${paddedIndex}`,
+            name: `Infinite Label ${paddedIndex}`,
+            slug: `infinite-label-${paddedIndex}`,
+            created_at: '2026-01-01T00:00:00.000Z',
+            updated_at: '2026-01-01T00:00:00.000Z'
+        };
+    });
+    const requestedPages = new Set<number>();
+
+    await page.route('**/ghost/api/admin/labels/**', async (route) => {
+        const request = route.request();
+
+        if (request.method() !== 'GET') {
+            await route.fallback();
+            return;
+        }
+
+        const requestUrl = new URL(request.url());
+        const limit = Number(requestUrl.searchParams.get('limit') ?? 100);
+        const pageNumber = Number(requestUrl.searchParams.get('page') ?? 1);
+        requestedPages.add(pageNumber);
+        const start = (pageNumber - 1) * limit;
+        const pageLabels = labels.slice(start, start + limit);
+        const pages = Math.ceil(labels.length / limit);
+        const next = pageNumber < pages ? pageNumber + 1 : null;
+
+        await route.fulfill({
+            contentType: 'application/json',
+            body: JSON.stringify({
+                labels: pageLabels,
+                meta: {
+                    pagination: {
+                        page: pageNumber,
+                        limit,
+                        pages,
+                        total: labels.length,
+                        next,
+                        prev: pageNumber > 1 ? pageNumber - 1 : null
+                    }
+                }
+            })
+        });
+    });
+
+    return requestedPages;
+}
+
 test.describe('Ghost Admin - Members Label Multiselect Filter', () => {
     let memberFactory: MemberFactory;
 
@@ -115,6 +167,22 @@ test.describe('Ghost Admin - Members Label Multiselect Filter', () => {
         await expect(membersPage.getMemberByName('Targeted Member')).toBeVisible();
     });
 
+    test('label filter value options load more remote labels', async ({page}) => {
+        const requestedLabelPages = await mockPaginatedLabels(page, 120);
+        const membersPage = await seedMembersAndNavigate(memberFactory, page, [
+            {name: 'Visible Member', email: 'visible@example.com'}
+        ]);
+
+        await membersPage.openFilterField('Label');
+        await membersPage.getFilterOption(/Infinite Label 000/).click();
+        await membersPage.openFilterValue('Label');
+
+        await page.getByRole('button', {name: 'Load more'}).click();
+
+        await expect.poll(() => requestedLabelPages.has(2)).toBe(true);
+        await expect(membersPage.getFilterOption(/Infinite Label 105/)).toBeVisible();
+    });
+
     test('deselects a label from the combobox to update results', async ({page}) => {
         const membersPage = await seedMembersAndNavigate(memberFactory, page, [
             {name: 'VIP Member', email: 'vip@example.com', labels: ['VIP']},