Merge pull request #87 from solutionforest/feature/add_toolbar_actions

Feature/add toolbar actions

Author: cklei-carly

.github/copilot-instructions.md

@@ -119,6 +119,21 @@ public function getTreeRecordIcon(?Model $record = null): ?string
 }
 ```
 
+**Toolbar Actions**: Add global actions displayed above the tree:
+
+```php
+protected function getTreeToolbarActions(): array
+{
+    return [
+        CreateAction::make(),
+        ExportAction::make(),
+        ImportAction::make(),
+    ];
+}
+```
+
+> **Note**: Toolbar actions are only supported in version 3.1.0 and later.
+
 ## Key File Locations
 
 - Models: Add `ModelTree` trait to any hierarchical model

README.md

@@ -1,5 +1,5 @@
 > [!IMPORTANT]
-> Please note that we will only be updating to version 2.x or 3.x, excluding any bug fixes.
+> Please note that we will only be updating to version 3.x, excluding any bug fixes.
 
 # Filament Tree
 
@@ -544,6 +544,34 @@ class ProductCategoryWidget extends BaseWidget
 }
 ```
 
+#### Toolbar Actions
+
+You can add global actions that appear in the toolbar above the tree by implementing the `getTreeToolbarActions()` method. These actions are displayed alongside the default expand/collapse and save buttons:
+
+```php
+protected function getTreeToolbarActions(): array
+{
+    return [
+        \SolutionForest\FilamentTree\Actions\CreateAction::make()
+            ->label('Add Category')
+            ->icon('heroicon-o-plus')
+            ->color('primary'),
+        \Filament\Actions\ExportAction::make()
+            ->label('Export Tree')
+            ->icon('heroicon-o-document-arrow-down'),
+        \Filament\Actions\ImportAction::make()
+            ->label('Import Tree')
+            ->icon('heroicon-o-document-arrow-up'),
+    ];
+}
+```
+
+![Tree toolbar actions](https://github.com/user-attachments/assets/6d2e29c0-caa3-432c-8a7f-00ae7d7265ba)
+
+The toolbar actions are automatically generated by the Artisan command and include a `CreateAction` by default for tree widgets, but return an empty array for tree pages. You can customize this method to add any actions you need.
+
+> **Note**: Toolbar actions are only supported in version 3.1.0 and later.
+
 ### Pages
 
 This plugin enables you to create tree pages in the admin panel. To create a tree page for a model, use the `make:filament-tree-page` command. For example, to create a tree page for the ProductCategory model, you can run:

resources/css/custom-nestable-item.css

@@ -106,5 +106,15 @@
 }
 
 .filament-tree-component .nestable-menu {
-    @apply flex gap-2 mb-4;
+    @apply mb-4;
+}
+.filament-tree-component .nestable-menu,
+.filament-tree-component .nestable-menu .toolbar-btns {
+    @apply flex items-center gap-2;
+}
+.filament-tree-component .nestable-menu {
+    @apply justify-between;
+}
+.filament-tree-component .nestable-menu .toolbar-btns.main {
+    @apply flex-1;
 }

resources/dist/filament-tree.css

@@ -1,12 +1 @@
-<x-filament-tree::actions.action
-    :action="$action"
-    dynamic-component="filament::button"
-    :outlined="$isOutlined()"
-    :labeled-from="$getLabeledFromBreakpoint()"
-    :icon-position="$getIconPosition()"
-    :icon-size="$getIconSize()"
-    class="filament-tree-button-action"
->
-    {{ $getLabel() }}
-</x-filament-tree::actions.action>
-
+{{-- Deprecated with filament v4 --}}

resources/views/actions/button-action.blade.php

@@ -1,9 +1 @@
-<x-filament-actions::group
-    :actions="$getActions()"
-    :dark-mode="config('filament.dark_mode')"
-    :color="$getColor()"
-    :icon="$getIcon()"
-    :label="$getLabel()"
-    :size="$getSize()"
-    :tooltip="$getTooltip()"
-/>
+{{-- Deprecated with filament v4 --}}

resources/views/actions/group.blade.php

@@ -1,8 +1 @@
-<x-filament-tree::actions.action
-    :action="$action"
-    dynamic-component="filament::dropdown.list.item"
-    :icon="$getGroupedIcon()"
-    class="filament-grouped-action"
->
-    {{ $getLabel() }}
-</x-filament-tree::actions.action>
+{{-- Deprecated with filament v4 --}}

resources/views/actions/grouped-action.blade.php

@@ -1,6 +1 @@
-<x-filament-tree::actions.action
-    :action="$action"
-    :label="$getLabel()"
-    dynamic-component="filament::icon-button"
-    class="filament-tree-icon-button-action"
-/>
+{{-- Deprecated with filament v4 --}}

resources/views/actions/icon-button-action.blade.php

@@ -1,9 +1 @@
-<x-filament-tree::actions.action
-    :action="$action"
-    dynamic-component="filament::link"
-    :icon-position="$getIconPosition()"
-    :icon-size="$getIconSize()"
-    class="filament-tree-link-action"
->
-    {{ $getLabel() }}
-</x-filament-tree::actions.action>
+{{-- Deprecated with filament v4 --}}