承接 fibtegis/filament-infinite-scroll 相关项目开发

从需求分析到上线部署,全程专人跟进,保证项目质量与交付效率

邮箱:yvsm@zunyunkeji.com | QQ:316430983 | 微信:yvsm316

fibtegis/filament-infinite-scroll

Composer 安装命令:

composer require fibtegis/filament-infinite-scroll

包简介

Seamless infinite scrolling plugin that replaces pagination in Filament Tables.

README 文档

README

Filament Infinite Scroll is a lightweight plugin that replaces the standard Filament v3 table pagination with a fluid, auto-loading infinite scroll mechanism. It is compatible with all tables, including Resources, Relation Managers, Widgets, and standalone Table Builders.

As the user approaches the end of a list, more rows are fetched transparently via Livewire, preserving filters, search, and sorting.

Developed and maintained by Fibtegis Yazılım Proje ve Danışmanık Hizmetleri LTD. ŞTİ. https://fbt.gs

Features

  • 🔄 Seamless Integration: Smooth infinite scroll on any Filament table.
  • 🪄 One-Line Setup: Enable it by simply adding the ->infinite() method.
  • 🏎️ Efficient Server Usage: Low server memory usage as records are fetched in batches.
  • 🌗 Theme-Aware: Works in both dark and light modes, inheriting your panel's theme.
  • 📏 Auto-Height: Automatically calculates the table height once and keeps it fixed for the session, making only the table body scrollable.
  • ⚙️ Auto-Reset: Automatically resets when the user changes filters, search, or sorting.
  • 🛠️ Modern Standards: Fully PSR-4 compliant, installable via Composer, and auto-discoverable by the panel.

Requirements

Package Version
PHP 8.1+
Laravel 10 or 11
Filament 3.0+
Livewire Ships with Filament
Alpine.js Ships with Filament

Installation

Install the package into your project via Composer:

composer require fibtegis/filament-infinite-scroll

After installation, it's good practice to clear cached views and plugins:

php artisan optimize:clear

The plugin is auto-discovered by Filament. No manual registration is needed.

Quick Start

Enabling infinite scroll is just a two-step process:

  1. Use the Trait: Add the InteractsWithInfiniteScroll trait to your respective ListRecords page, relation manager, or table widget.

    // app/Filament/Resources/CustomerResource/Pages/ListCustomers.php
    
    use Fibtegis\FilamentInfiniteScroll\Concerns\InteractsWithInfiniteScroll;
    use Filament\Resources\Pages\ListRecords;
    
    class ListCustomers extends ListRecords
    {
        use InteractsWithInfiniteScroll;
    
        // ...
    }
  2. Enable the Method: Inside your table() method, chain the ->infinite() method to your table definition.

    // app/Filament/Resources/CustomerResource.php
    
    use Filament\Tables\Table;
    
    public static function table(Table $table): Table
    {
        return $table
            ->columns([
                // ... your columns ...
            ])
            ->filters([
                // ... your filters ...
            ])
            ->actions([
                // ... your actions ...
            ])
            ->bulkActions([
                // ... your bulk actions ...
            ])
            ->infinite(); // 👈 Just add this line
    }

That's it! Your table will now automatically load new records when you scroll to the bottom.

Configuration

The infinite() method accepts a parameter to define the number of records to load per batch.

->infinite(perPage: 50) // Load 50 records at a time (default: 25)
Option Default Description
perPage 25 The number of records to fetch in each batch.

How It Works

  • A Table::mixin adds the ->infinite() method. This method disables native pagination and limits the query based on the current page.
  • The InteractsWithInfiniteScroll Trait tracks the current $page number and whether all records have been loaded ($infiniteEnded).
  • An Alpine.js component uses an IntersectionObserver to detect when the end of the page is reached.
  • When the end of the page is reached, the loadMore() method is triggered via Livewire.
  • On initial page load, Alpine.js calculates the maximum height of the table container once and injects this style into the page's <head> tag. This ensures the style is permanent and unaffected by Livewire updates.
  • When the records run out ($infiniteEnded = true), the observer is automatically stopped.

💖 Supporting the Project

If you find this plugin useful and would like to support its future development, you can do so by simply acquiring our company's token. Your support is greatly appreciated and helps us continue to maintain and improve this project.

License

Published under the Apache-2.0 License. See the LICENSE file for details.

© 2025 Fibtegis Yazılım Proje ve Danışmanık Hizmetleri LTD. ŞTİ.

⚠️ Trait Collision: InteractsWithInfiniteScroll vs AdvancedTables

If you're using both InteractsWithInfiniteScroll and AdvancedTables traits in the same class (such as ListRecords), method name collisions like updatedTableFilters, updatedTableSearch, and updatedTableSortColumn may occur.

To resolve this, explicitly alias the methods and define a custom implementation that calls both versions:

use InteractsWithInfiniteScroll, AdvancedTables {
    InteractsWithInfiniteScroll::updatedTableFilters as infiniteUpdatedTableFilters;
    InteractsWithInfiniteScroll::updatedTableSearch as infiniteUpdatedTableSearch;
    InteractsWithInfiniteScroll::updatedTableSortColumn as infiniteUpdatedTableSortColumn;
    AdvancedTables::updatedTableFilters as advancedUpdatedTableFilters;
    AdvancedTables::updatedTableSearch as advancedUpdatedTableSearch;
    AdvancedTables::updatedTableSortColumn as advancedUpdatedTableSortColumn;
}

public function updatedTableFilters(): void
{
    $this->infiniteUpdatedTableFilters();
    $this->advancedUpdatedTableFilters();
}

public function updatedTableSearch(): void
{
    $this->infiniteUpdatedTableSearch();
    $this->advancedUpdatedTableSearch();
}

public function updatedTableSortColumn(): void
{
    $this->infiniteUpdatedTableSortColumn();
    $this->advancedUpdatedTableSortColumn();
}

This ensures both plugins work together without conflict.

Contributors ✨

Thanks goes to these wonderful people:


OccTherapist

💻

fibtegis/filament-infinite-scroll 适用场景与选型建议

fibtegis/filament-infinite-scroll 是一款 基于 PHP 开发的 Composer 扩展包,目前已累计 3.69k 次下载、GitHub Stars 达 20, 最近一次更新时间为 2025 年 06 月 22 日, 在 PHP 生态内属于活跃度较高的组件。

它主要适用于以下技术方向: 「pagination」 「tables」 「infinite-scroll」 「lazy-loading」 「filament」 「fibtegis」 等业务场景。在实际项目中,围绕这些方向常见需要落地的问题包括:接口对接、性能调优、并发安全、与既有框架(Laravel / ThinkPHP / Yii / Webman 等)的兼容适配,以及生产环境的日志埋点与稳定性保障。

我们在过去多个企业项目中使用过 fibtegis/filament-infinite-scroll 或与其功能相近的方案,如果你在选型或落地过程中遇到问题,例如 版本兼容、二次改造、私有化封装、与内部系统对接、生产 BUG 排查,欢迎联系我们协助评估。

围绕 fibtegis/filament-infinite-scroll 我们能提供哪些服务?
定制开发 / 二次开发

基于 fibtegis/filament-infinite-scroll 在你已有业务上做功能扩展、字段裁剪、UI 适配、与内部账号 / 权限 / 日志系统的深度对接。

BUG 修复 & 性能优化

线上偶发问题、内存泄漏、慢查询、并发异常等排查修复;针对高流量场景做缓存、队列、索引层面的调优。

项目外包 & 长期维护

承接完整的项目从需求 → 设计 → 开发 → 上线 → 长期运维;也可按月提供技术保姆服务。

yvsm@zunyunkeji.com QQ:316430983 微信:yvsm316 西安尊云信息科技 · 专注 PHP / Go / 分布式系统研发

统计信息

  • 总下载量: 3.69k
  • 月度下载量: 0
  • 日度下载量: 0
  • 收藏数: 20
  • 点击次数: 27
  • 依赖项目数: 0
  • 推荐数: 0

GitHub 信息

  • Stars: 20
  • Watchers: 0
  • Forks: 4
  • 开发语言: PHP

其他信息

  • 授权协议: Apache-2.0
  • 更新时间: 2025-06-22