PHPackages                             lara-zeus/activity-timeline - PHPackages - PHPackages  [Skip to content](#main-content)[PHPackages](/)[Directory](/)[Categories](/categories)[Trending](/trending)[Leaderboard](/leaderboard)[Changelog](/changelog)[Analyze](/analyze)[Collections](/collections)[Log in](/login)[Sign up](/register)

1. [Directory](/)
2. /
3. [Utility & Helpers](/categories/utility)
4. /
5. lara-zeus/activity-timeline

ActiveLibrary[Utility & Helpers](/categories/utility)

lara-zeus/activity-timeline
===========================

Add timelines to custom pages or infolist entries effortlessly. Plus, it teams up smoothly with Spatie Activitylog for easy tracking.

5.0.2(2mo ago)43.2k—7.7%2MITPHPPHP ^8.2

Since Oct 19Pushed 2mo ago1 watchersCompare

[ Source](https://github.com/lara-zeus/activity-timeline)[ Packagist](https://packagist.org/packages/lara-zeus/activity-timeline)[ Docs](https://github.com/lara-zeus/activity-timeline)[ RSS](/packages/lara-zeus-activity-timeline/feed)WikiDiscussions 5.x Synced 1mo ago

READMEChangelog (4)Dependencies (15)Versions (6)Used By (0)

Activity Timeline
=================

[](#activity-timeline)

> This is a maintained fork from the package by [199ocero](https://github.com/199ocero/activity-timeline) to support filament v4

#### Add timelines to custom pages or infolist entries effortlessly. Plus, it teams up smoothly with Spatie Activitylog for easy tracking..

[](#add-timelines-to-custom-pages-or-infolist-entries-effortlessly-plus-it-teams-up-smoothly-with-spatie-activitylog-for-easy-tracking)

[![Latest Version on Packagist](https://camo.githubusercontent.com/b31e5dd51334fa90caea408f96edada738f0c5613b6103c0ec3191d84d124030/68747470733a2f2f696d672e736869656c64732e696f2f7061636b61676973742f762f6c6172612d7a6575732f61637469766974792d74696d656c696e652e7376673f7374796c653d666c61742d737175617265)](https://packagist.org/packages/lara-zeus/activity-timeline)[![Total Downloads](https://camo.githubusercontent.com/2f43f2454892c2545143c543f3e587f7cd62708353304183f7c0fff9b815b512/68747470733a2f2f696d672e736869656c64732e696f2f7061636b61676973742f64742f6c6172612d7a6575732f61637469766974792d74696d656c696e652e7376673f7374796c653d666c61742d737175617265)](https://packagist.org/packages/lara-zeus/activity-timeline)[![Total Stars](https://camo.githubusercontent.com/786d2e17bb209482b43c4977fdf33d57897797d040c188a81c93551584c96896/68747470733a2f2f696d672e736869656c64732e696f2f6769746875622f73746172732f6c6172612d7a6575732f61637469766974792d74696d656c696e653f7374796c653d666c61742d737175617265)](https://github.com/lara-zeus/activity-timeline)

Installation
------------

[](#installation)

You can install the package via composer:

```
composer require lara-zeus/activity-timeline
```

To adhere to Filament's theming approach, you'll be required to employ a personalized theme in order to utilize this plugin.

Usage
-----

[](#usage)

This plugin is already accessible within the Infolists builder and now supports both the `->state([])` and `->record()` methods.

```
public function activityTimelineInfolist(Infolist $infolist): Infolist
{
    return $infolist
        ->state([
            'activities' => [
                    [
                        'title' => "Published Article 🔥 - Published with Laravel Filament and Tailwind CSS",
                        'description' => "Approved and published. Here is the link.",
                        'status' => 'published',
                        'created_at' => now()->addDays(8),
                    ],
                    [
                        'title' => 'Reviewing Article - Final Touches',
                        'description' => "Reviewing the article and making it ready for publication.",
                        'status' => '',
                        'created_at' => now()->addDays(5),
                    ],
                    [
                        'title' => "Drafting Article - Make it ready for review",
                        'description' => 'Drafting the article and making it ready for review.',
                        'status' => 'drafting',
                        'created_at' => now()->addDays(2),
                    ],
                    [
                        'title' => 'Ideation - Looking for Ideas 🤯',
                        'description' => 'Idea for my article.',
                        'status' => 'ideation',
                        'created_at' => now()->subDays(7),
                    ]
                ]
        ])
        ->schema([

         /*
    	    You should enclose the entire components within a personalized "ActivitySection" entry.
            This section functions identically to the repeater entry; you simply have to provide the array state's key.
    	 */

            ActivitySection::make('activities')
                ->label('My Activities')
                ->description('These are the activities that have been recorded.')
                ->schema([
                    ActivityTitle::make('title')
                        ->placeholder('No title is set')
                        ->allowHtml(), // Be aware that you will need to ensure that the HTML is safe to render, otherwise your application will be vulnerable to XSS attacks.
                    ActivityDescription::make('description')
                        ->placeholder('No description is set')
                        ->allowHtml(),
                    ActivityDate::make('created_at')
                        ->date('F j, Y', 'Asia/Manila')
                        ->placeholder('No date is set.'),
                    ActivityIcon::make('status')
                        ->icon(fn (string | null $state): string | null => match ($state) {
                            'ideation' => 'heroicon-m-light-bulb',
                            'drafting' => 'heroicon-m-bolt',
                            'reviewing' => 'heroicon-m-document-magnifying-glass',
                            'published' => 'heroicon-m-rocket-launch',
                            default => null,
                        })
                        ->color(fn (string | null $state): string | null => match ($state) {
                            'ideation' => 'purple',
                            'drafting' => 'info',
                            'reviewing' => 'warning',
                            'published' => 'success',
                            default => 'gray',
                        }),
                ])
                ->showItemsCount(2) // Show up to 2 items
                ->showItemsLabel('View Old') // Show "View Old" as link label
                ->showItemsIcon('heroicon-m-chevron-down') // Show button icon
                ->showItemsColor('gray') // Show button color and it supports all colors
                ->aside(true)
                ->headingVisible(true) // make heading visible or not
                ->extraAttributes(['class'=>'my-new-class']) // add extra class
        ]);
}
```

When utilizing the `->record()` function, you provide your model in a manner similar to the code showcased below:

```
protected $activities;

public function __construct()
{
    $this->activities = User::query()->with('activities')->where('id', auth()->user()->id)->first();
}

public function activityTimelineInfolist(Infolist $infolist): Infolist
{
    return $infolist
        ->record($this->activities)
        // ... remaining code
}
```

Sometimes, when we don't have any info to show to users, it's important to improve their experience by displaying something. So, I include an empty state, like the one in the [Filament Table Empty State](https://filamentphp.com/docs/3.x/tables/empty-state).

```
public function activityTimelineInfolist(Infolist $infolist): Infolist
{
    return $infolist
        ->state([
            'activities' => []
        )]
        ->schema([
            ActivitySection::make('activities')
                // ... other code
                ->emptyStateHeading('No activities yet.')
                ->emptyStateDescription('Check back later for activities that have been recorded.')
                ->emptyStateIcon('heroicon-o-bolt-slash')
        ])
}
```

Usage with Spatie Activity Log Package
--------------------------------------

[](#usage-with-spatie-activity-log-package)

This plugin works with [spatie/laravel-activitylog](https://github.com/spatie/laravel-activitylog), making it easy to log user actions in your app. It can also automatically log model events, storing everything in the `activity_log` table. To use the plugin, just install `spatie/laravel-activitylog`, set it up, and you're good to go.

### Creating a Custom Page

[](#creating-a-custom-page)

You are required to create a custom page within your `resources` to display all activities based on the record passed to the route.

```
php artisan make:filament-page ViewOrderActivities --resource=OrderResource --type=custom
```

### Including the Page in your Resource Class

[](#including-the-page-in-your-resource-class)

Simply include the custom page in the `getPages()` method so that we can access it.

```
public static function getPages(): array
{
    return [
        // ... other pages
        // The format of route doesn't matter, as long as it includes the route parameter {record}.
        'activities' => Pages\ViewOrderActivities::route('/order/{record}/activities'),
    ];
}
```

In the `actions` method of your table, include an additional custom action. This action should redirect users to the custom page we've generated earlier.

```
public static function table(Table $table): Table
{
    return $table
        ->columns([
            // ...
        ])
        ->filters([
            // ...
        ])
        ->actions([
            Tables\Actions\Action::make('view_activities')
                ->label('Activities')
                ->icon('heroicon-m-bolt')
                ->color('purple')
                ->url(fn ($record) => OrderResource::getUrl('activities', ['record' => $record])),
        ])
        ->bulkActions([
            // ...
        ]);
}
```

### Setting up your Custom Page

[](#setting-up-your-custom-page)

Changes are needed in your custom page. Instead of extending using the regular `Page` class will make use of a specific class called `ActivityTimelinePage` provided by the plugin. Additionally, you should include your resource class.

```
use App\Filament\Resources\OrderResource;
use LaraZeus\ActivityTimeline\Pages\ActivityTimelinePage;

class ViewOrderActivities extends ActivityTimelinePage
{
    protected static string $resource = OrderResource::class;
}
```

### Configuration

[](#configuration)

Behind the scenes, the plugin utilizes the previously mentioned infolists entry. We only modify the properties/data, but the logic remains unchanged.

```
use App\Filament\Resources\OrderResource;
use LaraZeus\ActivityTimeline\Pages\ActivityTimelinePage;

class ViewOrderActivities extends ActivityTimelinePage
{
    protected static string $resource = OrderResource::class;

    protected function configuration(): array
    {
        return [
            'activity_section' => [
                'label' => 'Activities', // label for the section
                'description' => 'These are the activities that have been recorded.', // description for the section
                'show_items_count' => 0, // show the number of items to be shown
                'show_items_label' => 'Show more', // show button label
                'show_items_icon' => 'heroicon-o-chevron-down', // show button icon,
                'show_items_color' => 'gray', // show button color,
                'aside' => true, // show the section in the aside
                'empty_state_heading' => 'No activities yet', // heading for the empty state
                'empty_state_description' => 'Check back later for activities that have been recorded.', // description for the empty state
                'empty_state_icon' => 'heroicon-o-bolt-slash', // icon for the empty state
                'heading_visible' => true, // show the heading
                'extra_attributes' => [], // extra attributes
            ],
            'activity_title' => [
                'placeholder' => 'No title is set', // this will show when there is no title
                'allow_html' => true, // set true to allow html in the title

                /**
                 * You are free to adjust the state before displaying it on your page.
                 * Take note that the state returns these data below:
                 *      [
                 *       'log_name' => $activity->log_name,
                  *      'description' => $activity->description,
                  *      'subject' => $activity->subject,
                  *      'event' => $activity->event,
                  *      'causer' => $activity->causer,
                  *      'properties' => json_decode($activity->properties, true),
                  *      'batch_uuid' => $activity->batch_uuid,
                  *     ]

                  * If you wish to make modifications, please refer to the default code in the HasSetting trait.
                 */

                // 'modify_state' => function (array $state) {
                //
                // }

            ],
            'activity_description' => [
                'placeholder' => 'No description is set', // this will show when there is no description
                'allow_html' => true, // set true to allow html in the description

                /**
                 * You are free to adjust the state before displaying it on your page.
                 * Take note that the state returns these data below:
                 *      [
                 *       'log_name' => $activity->log_name,
                  *      'description' => $activity->description,
                  *      'subject' => $activity->subject,
                  *      'event' => $activity->event,
                  *      'causer' => $activity->causer,
                  *      'properties' => json_decode($activity->properties, true),
                  *      'batch_uuid' => $activity->batch_uuid,
                  *     ]

                  * If you wish to make modifications, please refer to the default code in the HasSetting trait.
                 */

                // 'modify_state' => function (array $state) {
                //
                // }

            ],
            'activity_date' => [
                'name' => 'created_at', // or updated_at
                'date' => 'F j, Y g:i A', // date format
                'placeholder' => 'No date is set', // this will show when there is no date
            ],
            'activity_icon' => [
                'icon' => fn (string | null $state): string | null => match ($state) {
                    /**
                     * 'event_name' => 'heroicon-o-calendar',
                     * ... and more
                     */
                    default => null
                },
                'color' => fn (string | null $state): string | null => match ($state) {
                    /**
                     * 'event_name' => 'primary',
                     * ... and more
                     */
                    default => null
                },
            ]
        ];
    }
}
```

Style customization
-------------------

[](#style-customization)

Similar to Filament, this plugin also includes CSS `hook` classes that enable the customization of different HTML elements through CSS.

```
.fi-timeline-section {
    @apply bg-transparent !important;
}
```

This plugin comes with numerous CSS `hook` classes. For a straightforward approach, consider using your browser's developer tools to carefully examine the element and identify these classes.

That's all! If you encounter any issues or have features you'd like to discuss, feel free to chat with me in our Discord channel.

Changelog
---------

[](#changelog)

Please see [CHANGELOG](CHANGELOG.md) for more information on what has changed recently.

Contributing
------------

[](#contributing)

Please see [CONTRIBUTING](.github/CONTRIBUTING.md) for details.

Security Vulnerabilities
------------------------

[](#security-vulnerabilities)

Please review [our security policy](../../security/policy) on how to report security vulnerabilities.

Credits
-------

[](#credits)

- [Jay-Are Ocero](https://github.com/199ocero)
- [All Contributors](../../contributors)

License
-------

[](#license)

The MIT License (MIT). Please see [License File](LICENSE.md) for more information.

###  Health Score

47

—

FairBetter than 94% of packages

Maintenance86

Actively maintained with recent releases

Popularity29

Limited adoption so far

Community11

Small or concentrated contributor base

Maturity51

Maturing project, gaining track record

 Bus Factor1

Top contributor holds 87.5% of commits — single point of failure

How is this calculated?**Maintenance (25%)** — Last commit recency, latest release date, and issue-to-star ratio. Uses a 2-year decay window.

**Popularity (30%)** — Total and monthly downloads, GitHub stars, and forks. Logarithmic scaling prevents top-heavy scores.

**Community (15%)** — Contributors, dependents, forks, watchers, and maintainers. Measures real ecosystem engagement.

**Maturity (30%)** — Project age, version count, PHP version support, and release stability.

###  Release Activity

Cadence

Every ~28 days

Recently: every ~35 days

Total

6

Last Release

69d ago

Major Versions

4.x-dev → 5.0.02026-01-19

PHP version history (2 changes)4.0.0PHP ^8.1

5.0.2PHP ^8.2

### Community

Maintainers

![](https://avatars.githubusercontent.com/u/1952412?v=4)[Lara Zeus](/maintainers/atmonshi)[@atmonshi](https://github.com/atmonshi)

---

Top Contributors

[![atmonshi](https://avatars.githubusercontent.com/u/1952412?v=4)](https://github.com/atmonshi "atmonshi (7 commits)")[![marcogermani87](https://avatars.githubusercontent.com/u/998645?v=4)](https://github.com/marcogermani87 "marcogermani87 (1 commits)")

---

Tags

filament-pluginfilamentphptimelinelaraveltimelinefilamentphplara-zeusactivity-timelinefilament-infolists

###  Code Quality

TestsPest

### Embed Badge

![Health badge](/badges/lara-zeus-activity-timeline/health.svg)

```
[![Health](https://phpackages.com/badges/lara-zeus-activity-timeline/health.svg)](https://phpackages.com/packages/lara-zeus-activity-timeline)
```

###  Alternatives

[jaocero/activity-timeline

Add timelines to custom pages or infolist entries effortlessly. Plus, it teams up smoothly with Spatie Activitylog for easy tracking.

90154.3k](/packages/jaocero-activity-timeline)[lara-zeus/popover

Zeus Popover is filamentphp component to show a Popover with custom content in tables and infolist

2968.2k3](/packages/lara-zeus-popover)[dotswan/filament-map-picker

Easily pick and retrieve geo-coordinates using a map-based interface in your Filament applications.

124139.3k2](/packages/dotswan-filament-map-picker)[lara-zeus/inline-chart

Zeus Inline Chart easily add a chart in filamentPHP table column

2139.9k](/packages/lara-zeus-inline-chart)[jibaymcs/filament-tour

Bring the power of DriverJs to your Filament panels and start a tour !

12247.8k](/packages/jibaymcs-filament-tour)[codewithdennis/filament-lucide-icons

A Filament plugin that integrates Lucide icons, allowing you to use them seamlessly across Filament forms, tables, actions, and more.

4529.4k2](/packages/codewithdennis-filament-lucide-icons)

PHPackages © 2026

[Directory](/)[Categories](/categories)[Trending](/trending)[Changelog](/changelog)[Analyze](/analyze)