Skip to content

Card actions for improved functionality #5

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 2 commits into
base: main
Choose a base branch
from
Open
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
38 changes: 38 additions & 0 deletions README.md
Original file line number Diff line number Diff line change
@@ -266,6 +266,44 @@ public function editAction(Action $action): Action

**Note:** If this method is not implemented, cards will be read-only and users won't be able to edit them.

### cardActions() - For adding custom actions to cards

If you want to add custom actions to each card (such as viewing details, archiving, marking as complete, etc.), implement this method:

```php
use Filament\Actions\Action;
use Filament\Actions\ActionGroup;

public function cardActions(ActionGroup $actionGroup): ActionGroup
{
return $actionGroup
->actions([
Action::make('view')
->icon('heroicon-m-eye')
->url(fn (mixed $record): string => route('tasks.show', ['task' => $record])),

Action::make('archive')
->icon('heroicon-m-archive-box')
->requiresConfirmation()
->action(function (mixed $record): void {
$task = $this->getSubject()->find($record);
$task->update(['archived' => true]);
$this->refreshBoard();
}),

Action::make('complete')
->icon('heroicon-m-check-circle')
->action(function (mixed $record): void {
$task = $this->getSubject()->find($record);
$task->update(['status' => 'completed']);
$this->refreshBoard();
}),
]);
}
```

**Note:** If this method is not implemented, no action dropdown will appear on cards. Actions can perform operations on the specific card record and can open modals, execute code, or navigate to other pages.

## 🧩 Optional Configuration

These settings enhance your board but are not required:
1,730 changes: 1,729 additions & 1 deletion resources/dist/flowforge.css

Large diffs are not rendered by default.

17 changes: 16 additions & 1 deletion resources/views/livewire/card.blade.php
Original file line number Diff line number Diff line change
@@ -13,7 +13,22 @@
@endif
>
<div class="ff-card__content">
<h4 class="ff-card__title">{{ $record['title'] }}</h4>
<div class="flex justify-between items-start">
<h4 class="ff-card__title">{{ $record['title'] }}</h4>

@if($this->cardActions() && count($this->cardActions()->getActions()) > 0)
<div class="ff-card__actions" onclick="event.stopPropagation();">
<x-filament-actions::group
:actions="$this->cardActions()->getActions()"
:record="$record['id']"
:action="$this->cardActions()"
:color="$this->cardActions()->getColor()"
:icon="$this->cardActions()->getIcon()"
:size="$this->cardActions()->getSize()"
/>
</div>
@endif
</div>

@if(!empty($record['description']))
<p class="ff-card__description">{{ $record['description'] }}</p>
9 changes: 9 additions & 0 deletions src/Contracts/KanbanBoardPageInterface.php
Original file line number Diff line number Diff line change
@@ -5,6 +5,7 @@
namespace Relaticle\Flowforge\Contracts;

use Filament\Actions\Action;
use Filament\Actions\ActionGroup;
use Illuminate\Database\Eloquent\Builder;

interface KanbanBoardPageInterface
@@ -14,4 +15,12 @@ public function getSubject(): Builder;
// public function createAction(Action $action): Action;
//
// public function editAction(Action $action): Action;

/**
* Define custom actions that will be displayed on each card.
*
* @param ActionGroup $actionGroup The action group to add actions to
* @return ActionGroup The modified action group
*/
public function cardActions(ActionGroup $actionGroup): ActionGroup;
}
12 changes: 12 additions & 0 deletions src/Filament/Pages/KanbanBoardPage.php
Original file line number Diff line number Diff line change
@@ -4,6 +4,7 @@

namespace Relaticle\Flowforge\Filament\Pages;

use Filament\Actions\ActionGroup;
use Filament\Pages\Page;
use Illuminate\Support\Str;
use Relaticle\Flowforge\Adapters\DefaultKanbanAdapter;
@@ -179,6 +180,17 @@ public function pluralCardLabel(string $label): static
return $this;
}

/**
* Define custom actions that will be displayed on each card.
*
* @param ActionGroup $actionGroup The action group to add actions to
* @return ActionGroup The modified action group
*/
public function cardActions(ActionGroup $actionGroup): ActionGroup
{
return $actionGroup;
}

/**
* Get the Kanban adapter.
*
17 changes: 17 additions & 0 deletions src/Livewire/KanbanBoard.php
Original file line number Diff line number Diff line change
@@ -5,6 +5,7 @@
namespace Relaticle\Flowforge\Livewire;

use Filament\Actions\Action;
use Filament\Actions\ActionGroup;
use Filament\Actions\Concerns\InteractsWithActions;
use Filament\Actions\Contracts\HasActions;
use Filament\Forms\Concerns\InteractsWithForms;
@@ -206,6 +207,22 @@ public function createAction(): ?Action
return $boardPage->createAction($action);
}

public function cardActions(): ?ActionGroup
{
$boardPage = app($this->pageClass);

if (! method_exists($boardPage, 'cardActions')) {
return null;
}

$actionGroup = ActionGroup::make([])
->icon('heroicon-m-ellipsis-horizontal')
->size('sm')
->iconButton();

return $boardPage->cardActions($actionGroup);
}

public function editAction(): ?Action
{
$boardPage = app($this->pageClass);