Refactor config + add icons to tree items

Author: sten

CLAUDE.md

@@ -43,7 +43,7 @@ php artisan flexible-content-block-pages:seed
 - **Settings** (`src/Models/Settings.php`): Global CMS settings and configuration
 - **Redirect** (`src/Models/Redirect.php`): URL redirect management
 - **Tag/TagType** (`src/Models/Tag.php`, `src/Models/TagType.php`): Content tagging system
-- **Menu/MenuItem** (`src/Models/Menu.php`, `src/Models/MenuItem.php`): Hierarchical menu system with nested structure using kalnoy/nestedset
+- **Menu/MenuItem** (`src/Models/Menu.php`, `src/Models/MenuItem.php`): Hierarchical menu system using solution-forest/filament-tree with parent_id/order structure
 
 ### Key Components
 - **Filament Resources**: Located in `src/Resources/` - provide admin interface for all models
@@ -78,42 +78,58 @@ Pages use the flexible content blocks system from the parent package, allowing:
 - Spatie packages for tags, media library, and redirects
 - Laravel Localization for multilingual support
 - SEOTools for meta tag and OpenGraph management
-- kalnoy/nestedset for hierarchical menu structure
+- solution-forest/filament-tree for hierarchical menu structure
 
-## Menu Builder System (In Development)
+## Menu Builder System
 
 ### Current Status
-The menu builder is partially implemented with the following components:
+The menu builder is **fully implemented** using solution-forest/filament-tree with the following components:
 
 **✅ Completed:**
-- Menu and MenuItem models with kalnoy/nestedset integration
-- Database migrations for menus and menu_items tables
-- MenuResource with basic CRUD operations
-- ManageMenuItems page with drag-and-drop tree interface
-- Alpine.js + SortableJS powered tree builder component
-- Translation support (EN/NL)
-- Configuration system with max depth settings
-
-**🚧 Remaining Tasks:**
-- MenuItem form/modal for adding and editing menu items
-- Linkable model integration (following call-to-action patterns)
-- Frontend helper methods and blade components for menu rendering
-- Validation and error handling
-- Proper nested set operations for reordering
+- Menu and MenuItem models with solution-forest/filament-tree integration
+- Database migrations with parent_id/order structure (migrated from kalnoy/nestedset)
+- MenuResource with CRUD operations and enhanced management
+- ManageMenuItems page with drag-and-drop tree interface using solution-forest/filament-tree
+- Complete MenuItem form with dynamic type selection (URL, Route, Linkable Model)
+- Linkable model integration with polymorphic relationships
+- Enhanced tree display with icons and translated model labels
+- Translation support for all menu components
+- Frontend menu rendering components for various styles
+
+**🔧 Key Features:**
+- **Enhanced Tree Interface**: Icons indicate item type and visibility (eye-slash for hidden items)
+- **Resource Integration**: Uses Filament resource labels and icons for linkable models
+- **Smart Descriptions**: Shows route URLs instead of names, translated model labels
+- **Flexible Configuration**: Structured linkable_models config with class/resource mapping
+- **Translation Support**: Full multilingual support with translatable labels
 
 ### Architecture
-- **Menu Model**: Simple container with name, code, and description
-- **MenuItem Model**: Nested set structure with linkable polymorphic relationships
-- **ManageMenuItems Page**: Dedicated interface for menu structure management
-- **Tree Builder Component**: Custom Filament field with Alpine.js interactions
+- **Menu Model**: Container with name, code, description, and configurable styles
+- **MenuItem Model**: Simple tree structure (parent_id/order) with ModelTree trait
+- **ManageMenuItems Page**: Full tree management with create/edit/delete actions
+- **MenuItemForm**: Dynamic form supporting URL, Route, and Model linking types
+- **Frontend Components**: Menu rendering with multiple style support
 
 ### Configuration
 ```php
 'menu' => [
-    'max_depth' => 2,  // Configurable nesting level
+    'max_depth' => 2,
+    'linkable_models' => [
+        [
+            'class' => \Statikbe\FilamentFlexibleContentBlockPages\Models\Page::class,
+            'resource' => \Statikbe\FilamentFlexibleContentBlockPages\Resources\PageResource::class,
+        ],
+    ],
+    'styles' => ['default', 'horizontal', 'vertical', 'dropdown'],
 ],
 ```
 
+**Migration Notes:**
+- Successfully migrated from 15web/filament-tree + kalnoy/nestedset to solution-forest/filament-tree
+- Removed complex nested set structure (_lft, _rgt) in favor of simple parent_id/order
+- Enhanced with resource-based translations and icons
+- Backward compatibility not maintained (no existing projects using menus)
+
 ## Development Guidelines
 
 ### Use Existing Filament Components

config/filament-flexible-content-block-pages.php

@@ -100,25 +100,24 @@
     ],
 
     'menu' => [
-
         'max_depth' => 2,
         'linkable_models' => [
             // Models that can be linked in menu items
             // These models must implement HasMenuLabel interface
-            \Statikbe\FilamentFlexibleContentBlockPages\Models\Page::class,
+            [
+                'class' => \Statikbe\FilamentFlexibleContentBlockPages\Models\Page::class,
+                'resource' => \Statikbe\FilamentFlexibleContentBlockPages\Resources\PageResource::class,
+            ],
 
             // Add your own models here:
-            // \App\Models\Category::class,
-            // \App\Models\Product::class,
-        ],
-        'model_icons' => [
-            // Configure icons for different model types based on their morph class
-            'filament-flexible-content-block-pages::page' => 'heroicon-o-document-text',
-
-            // Add custom icons for your models:
-            // 'category' => 'heroicon-o-tag',
-            // 'product' => 'heroicon-o-shopping-bag',
-            // 'post' => 'heroicon-o-newspaper',
+            // [
+            //     'class' => \App\Models\Category::class,
+            //     'resource' => \App\Filament\Resources\CategoryResource::class,
+            // ],
+            // [
+            //     'class' => \App\Models\Product::class,
+            //     'resource' => \App\Filament\Resources\ProductResource::class,
+            // ],
         ],
         'styles' => [
             // Available menu styles (codes only - labels come from translations)

src/FilamentFlexibleContentBlockPagesConfig.php

@@ -160,9 +160,31 @@ public function getMenuLinkableModels(): array
         return $this->packageConfig('menu.linkable_models', []);
     }
 
-    public function getMenuModelIcons(): array
+    public function getMenuLinkableModelClasses(): array
     {
-        return $this->packageConfig('menu.model_icons', []);
+        $models = $this->getMenuLinkableModels();
+        $classes = [];
+
+        foreach ($models as $model) {
+            if (isset($model['class'])) {
+                $classes[] = $model['class'];
+            }
+        }
+
+        return $classes;
+    }
+
+    public function getMenuLinkableModelResource(string $modelClass): ?string
+    {
+        $models = $this->getMenuLinkableModels();
+
+        foreach ($models as $model) {
+            if (isset($model['class'], $model['resource']) && $model['class'] === $modelClass) {
+                return $model['resource'];
+            }
+        }
+
+        return null;
     }
 
     public function getMenuStyles(): array

src/Form/Fields/Types/LinkableMenuItemType.php

@@ -6,9 +6,6 @@
 use Filament\Forms\Components\Select;
 use Statikbe\FilamentFlexibleContentBlockPages\Facades\FilamentFlexibleContentBlockPages;
 use Statikbe\FilamentFlexibleContentBlockPages\Models\Contracts\HasMenuLabel;
-use function Statikbe\FilamentFlexibleContentBlockPages\Filament\Form\Fields\Types\call_user_func;
-use function Statikbe\FilamentFlexibleContentBlockPages\Filament\Form\Fields\Types\is_subclass_of;
-use function Statikbe\FilamentFlexibleContentBlockPages\Filament\Form\Fields\Types\method_exists;
 
 class LinkableMenuItemType extends AbstractMenuItemType
 {

src/Form/Fields/Types/RouteMenuItemType.php

@@ -4,8 +4,6 @@
 
 use Filament\Forms\Components\Select;
 use Illuminate\Support\Facades\Route;
-use function Statikbe\FilamentFlexibleContentBlockPages\Filament\Form\Fields\Types\fnmatch;
-use function Statikbe\FilamentFlexibleContentBlockPages\Filament\Form\Fields\Types\ksort;
 
 class RouteMenuItemType extends AbstractMenuItemType
 {

src/Form/Forms/MenuItemForm.php

@@ -8,15 +8,14 @@
 use Filament\Forms\Components\TextInput;
 use Filament\Forms\Components\Toggle;
 use Filament\Forms\Get;
+use Statikbe\FilamentFlexibleContentBlockPages\Facades\FilamentFlexibleContentBlockPages;
 use Statikbe\FilamentFlexibleContentBlockPages\Form\Fields\LabelField;
 use Statikbe\FilamentFlexibleContentBlockPages\Form\Fields\Types\AbstractMenuItemType;
 use Statikbe\FilamentFlexibleContentBlockPages\Form\Fields\Types\LinkableMenuItemType;
 use Statikbe\FilamentFlexibleContentBlockPages\Form\Fields\Types\RouteMenuItemType;
 use Statikbe\FilamentFlexibleContentBlockPages\Form\Fields\Types\UrlMenuItemType;
 use Statikbe\FilamentFlexibleContentBlockPages\Models\Contracts\HasMenuLabel;
 use Statikbe\FilamentFlexibleContentBlocks\FilamentFlexibleBlocksConfig;
-use function Statikbe\FilamentFlexibleContentBlockPages\Filament\Form\Forms\is_string;
-use function Statikbe\FilamentFlexibleContentBlockPages\Filament\Form\Forms\is_subclass_of;
 
 class MenuItemForm
 {
@@ -154,8 +153,10 @@ protected static function getLinkableField(): Select
                 $type = static::getTypeByAlias($linkType);
 
                 if ($type && $type->isModelType()) {
+                    $modelLabel = static::getModelLabelFromResource($type->getModel());
+
                     return flexiblePagesTrans('menu_items.form.linkable_help', [
-                        'model' => class_basename($type->getModel()),
+                        'model' => $modelLabel,
                     ]);
                 }
 
@@ -246,11 +247,29 @@ protected static function getTypeLabel(AbstractMenuItemType $type): string
             return flexiblePagesTrans('menu_items.form.types.route');
         }
 
+        // Get translated model label from Filament resource
+        $modelLabel = static::getModelLabelFromResource($type->getModel());
+
         return flexiblePagesTrans('menu_items.form.types.model', [
-            'model' => class_basename($type->getModel()),
+            'model' => $modelLabel,
         ]);
     }
 
+    protected static function getModelLabelFromResource(string $modelClass): string
+    {
+        $resourceClass = \Statikbe\FilamentFlexibleContentBlockPages\Facades\FilamentFlexibleContentBlockPages::config()->getMenuLinkableModelResource($modelClass);
+
+        if ($resourceClass && class_exists($resourceClass)) {
+            try {
+                return $resourceClass::getModelLabel();
+            } catch (\Exception $e) {
+                // Fallback to class basename if resource method fails
+            }
+        }
+
+        return class_basename($modelClass);
+    }
+
     protected static function getTypes(): array
     {
         if (static::$types === null) {
@@ -260,10 +279,10 @@ protected static function getTypes(): array
             ];
 
             // Add configured linkable models from config
-            $configuredModels = config('filament-flexible-content-block-pages.menu.linkable_models', []);
+            $configuredModels = FilamentFlexibleContentBlockPages::config()->getMenuLinkableModelClasses();
 
             foreach ($configuredModels as $modelClass) {
-                if (is_string($modelClass) && is_subclass_of($modelClass, HasMenuLabel::class)) {
+                if (is_subclass_of($modelClass, HasMenuLabel::class)) {
                     static::$types[] = new LinkableMenuItemType($modelClass);
                 }
             }

src/Resources/MenuResource/Pages/ManageMenuItems.php

@@ -23,8 +23,6 @@ class ManageMenuItems extends TreePage
 
     public mixed $menu;
 
-    protected static int $maxDepth = 3;
-
     public function mount(): void
     {
         $menuModelClass = MenuResource::getModel();
@@ -78,7 +76,7 @@ protected function getTreeActions(): array
         return [
             EditAction::make()
                 ->mountUsing(
-                    function($arguments, $form, $model, MenuItem $record) {
+                    function ($arguments, $form, $model, MenuItem $record) {
                         $data = [
                             ...$record->toArray(),
                             'menu_id' => $this->record->id,
@@ -127,28 +125,96 @@ public function getTreeRecordDescription(?Model $record = null): string|HtmlStri
     protected function getMenuItemTypeDescription(MenuItem $record): string
     {
         if ($record->linkable_type && $record->linkable) {
-            return flexiblePagesTrans('menu_items.tree.linked_to').' '.class_basename($record->linkable_type);
-        }
+            // Get model label from Filament resource if available
+            $modelLabel = $this->getModelLabelFromResource($record->linkable_type);
 
-        if ($record->url) {
+            return flexiblePagesTrans('menu_items.tree.linked_to').' '.$modelLabel;
+        } elseif ($record->url) {
             return flexiblePagesTrans('menu_items.tree.external_url').': '.$record->url;
+        } elseif ($record->route) {
+            // Show route URL instead of route name
+            $routeUrl = $this->getRouteUrl($record->route);
+
+            return flexiblePagesTrans('menu_items.tree.route').': '.($routeUrl ?: $record->route);
+        } else {
+            return flexiblePagesTrans('menu_items.tree.no_link');
         }
+    }
 
-        if ($record->route) {
-            return flexiblePagesTrans('menu_items.tree.route').': '.$record->route;
+    protected function getModelLabelFromResource(string $modelClass): string
+    {
+        $resourceClass = FilamentFlexibleContentBlockPages::config()->getMenuLinkableModelResource($modelClass);
+
+        if ($resourceClass && class_exists($resourceClass)) {
+            try {
+                return $resourceClass::getModelLabel();
+            } catch (\Exception $e) {
+                // Fallback to class basename if resource method fails
+            }
+        }
+
+        return class_basename($modelClass);
+    }
+
+    protected function getModelIconFromResource(string $modelClass): ?string
+    {
+        $resourceClass = FilamentFlexibleContentBlockPages::config()->getMenuLinkableModelResource($modelClass);
+
+        if ($resourceClass && class_exists($resourceClass)) {
+            try {
+                return $resourceClass::getNavigationIcon();
+            } catch (\Exception $e) {
+                // Fallback to null if resource method fails
+            }
         }
 
-        return flexiblePagesTrans('menu_items.tree.no_link');
+        return null;
+    }
+
+    protected function getRouteUrl(string $routeName): ?string
+    {
+        try {
+            return route($routeName);
+        } catch (\Exception $e) {
+            return null;
+        }
     }
 
     public function getTreeRecordIcon(?\Illuminate\Database\Eloquent\Model $record = null): ?string
     {
-        // TODO
-        return parent::getTreeRecordIcon($record);
+        /** @var MenuItem $record */
+        if (! $record) {
+            return null;
+        }
+
+        // If not visible, show eye-slash icon
+        if (! $record->is_visible) {
+            return 'heroicon-o-eye-slash';
+        }
+
+        // Return appropriate icon based on type
+        if ($record->linkable_type && $record->linkable) {
+            return $this->getModelIconFromResource($record->linkable_type) ?: 'heroicon-o-link';
+        }
+
+        if ($record->url) {
+            return 'heroicon-o-globe-alt';
+        }
+
+        if ($record->route) {
+            return 'heroicon-o-command-line';
+        }
+
+        return 'heroicon-o-bars-3';
     }
 
     protected function getFormSchema(): array
     {
         return MenuItemForm::getSchema();
     }
+
+    public static function getMaxDepth(): int
+    {
+        return FilamentFlexibleContentBlockPages::config()->getMenuMaxDepth() ?? 3;
+    }
 }