Filament Context Menu Laravel Package

Getting Started

Minimal Setup

1. Installation:

   composer require aymanalhattami/filament-context-menu
   

   Ensure compatibility with your Filament version (3.x, 4.x, or 5.x).

2. First Use Case: Add the PageHasContextMenu trait to a Filament page (e.g., ListRecords or ViewRecord):

   use AymanAlhattami\FilamentContextMenu\Traits\PageHasContextMenu;
   
   class ListUsers extends ListRecords
   {
       use PageHasContextMenu;
   
       public function getContextMenuActions(): array
       {
           return [
               Action::make('Refresh')
                   ->action(fn () => $this->refresh())
           ];
       }
   }
   

   • Where to look first: The getContextMenuActions() method in your page class.

Implementation Patterns

Page-Level Context Menus

1. Basic Actions: Use Filament’s built-in actions (e.g., CreateAction, EditAction) or custom actions:

   public function getContextMenuActions(): array
   {
       return [
           CreateAction::make()->model(User::class),
           Action::make('Custom Action')
               ->action(fn () => $this->customLogic())
       ];
   }
   

2. Dynamic Actions: Pass context (e.g., $this->record) to actions:

   Action::make('Delete')
       ->action(fn () => $this->record->delete())
       ->requiresConfirmation()
       ->visible(fn () => $this->record->trashed())
   

3. Grouping Actions: Use ContextMenuDivider to separate actions logically:

   return [
       Action::make('Edit'),
       ContextMenuDivider::make(),
       Action::make('Export'),
   ];
   

4. Prebuilt Actions: Leverage built-in actions like RefreshAction, GoBackAction, or GoForwardAction:

   use AymanAlhattami\FilamentContextMenu\Actions\{RefreshAction, GoBackAction};
   
   public function getContextMenuActions(): array
   {
       return [
           RefreshAction::make(),
           GoBackAction::make(),
       ];
   }
   

Table Cell Context Menus

1. Column Integration: Replace standard columns with context-menu-enabled variants:

   ContextMenuTextColumn::make('name')
       ->getContextMenuActions(fn ($record) => [
           Action::make('View')
               ->url(fn () => $this->getResource()::getUrl('view', ['record' => $record])),
       ]);
   

2. Dynamic Actions: Pass the record to cell-specific actions:

   ContextMenuIconColumn::make('status')
       ->getContextMenuActions(fn ($record) => [
           Action::make('Toggle Status')
               ->action(fn () => $record->toggleStatus())
       ]);
   

3. Conditional Visibility: Hide/show actions based on record state:

   ->visible(fn ($record) => !$record->isArchived())
   

Workflows

1. Resource Pages:

   • Add context menus to ListRecords, CreateRecord, EditRecord, etc.
   • Example: Bulk actions in ListRecords:

     public function getContextMenuActions(): array
     {
         return [
             Action::make('Bulk Delete')
                 ->action(fn () => $this->table->getSelectedRecords()->each->delete())
                 ->requiresConfirmation(),
         ];
     }
     

2. Custom Pages:

   • Use for dashboards or utility pages:

     class SettingsPage extends Page
     {
         use PageHasContextMenu;
     
         public function getContextMenuActions(): array
         {
             return [
                 Action::make('Reset Settings')
                     ->action(fn () => $this->resetSettings()),
             ];
         }
     }
     

3. Modals and Forms:

   • Embed forms in context menus for quick edits:

     Action::make('Quick Edit')
         ->form([
             TextInput::make('name'),
         ])
         ->action(fn (array $data) => $this->record->update($data))
     

Gotchas and Tips

Pitfalls

1. Action Scope:

   • Issue: Actions in getContextMenuActions() may not have access to $this if defined as static.
   • Fix: Use instance methods or pass context via closures:

     Action::make('Edit')
         ->action(fn () => $this->edit($this->record))
     

2. Performance:

   • Issue: Complex actions (e.g., large exports) in context menus may lag.
   • Fix: Offload heavy logic to background jobs or use ->async() where possible.

3. Overriding Defaults:

   • Issue: Custom isContextMenuEnabled() may conflict with global CONTEXT_MENU_ENABLED.
   • Fix: Prioritize instance-level checks (e.g., $this->contextMenuEnabled).

4. Table Cell Actions:

   • Issue: Actions in ContextMenu*Column may not persist across pagination.
   • Fix: Use ->getContextMenuActions() with the full record context.

Debugging

1. Disabled Menu:

   • Check CONTEXT_MENU_ENABLED env var or $contextMenuEnabled property.
   • Verify the PageHasContextMenu trait is applied.

2. Missing Actions:

   • Ensure getContextMenuActions() returns an array of valid Action instances.
   • Use ->visible(fn () => true) temporarily to test visibility.

3. Styling Issues:

   • Dark/light mode conflicts: Override CSS via Filament’s styles config or custom assets.

Tips

1. Reusability:

   • Extract common actions to a base class or trait:

     trait HasCommonContextMenuActions
     {
         public function getCommonActions(): array
         {
             return [
                 RefreshAction::make(),
                 Action::make('Export')->url(fn () => route('exports.index')),
             ];
         }
     }
     

2. Testing:

   • Test context menus with Filament’s test helpers:

     $this->rightClickOn($table->getTableCell('name', $record))
          ->assertSee('Edit')
          ->click('Edit');
     

3. Localization:

   • Translate action labels using Filament’s __() helper:

     Action::make(__('filament-context-menu::actions.edit'))
     

4. Permissions:

   • Gate actions using Filament’s can():

     Action::make('Delete')
         ->canSee(fn () => auth()->user()->can('delete', $this->record))
     

5. Extension Points:

   • Custom Columns: Extend ContextMenu*Column for new column types.
   • Action Modifiers: Create decorators for actions (e.g., add icons dynamically).