refactor: rename class ContextMenu

aymanalhattami · Apr 19, 2024 · 63f112d · 63f112d
1 parent 26d73ca
commit 63f112d
Show file tree

Hide file tree

Showing 3 changed files with 78 additions and 20 deletions.
diff --git a/README.md b/README.md
@@ -6,8 +6,11 @@
 [![Total Downloads](https://img.shields.io/packagist/dt/aymanalhattami/filament-context-menu.svg?style=flat-square)](https://packagist.org/packages/aymanalhattami/filament-context-menu)
 
 ---
-This package is used to add context menu for resource pages and custom pages of filament
-
+This package is used to add context menu for resource pages and custom pages of [Filament Admin Panel](https://filamentphp.com/)
+* Support dark and light mode
+* Support LTR and RTL direction
+* Support Divider between menu items
+* Use of ```Filament\Actions\Action``` to set menu items.
 
 ## Installation
 
@@ -18,9 +21,64 @@ composer require aymanalhattami/filament-context-menu
 ```
 
 ## Usage
+1. Define a ```getContextMenu``` method inside the page, the method should return and instance of ```ContentMenu```
+2. Use ```ContentMenu``` class to set menu items as an array
 
 ```php
-
+use Filament\Resources\Pages\ListRecords;
+use AymanAlhattami\FilamentContextMenu\ContextMenu;
+use AymanAlhattami\FilamentContextMenu\ContentMenuDivider;
+use Filament\Actions\Action;
+
+class ListMarkets extends ListRecords
+{
+    // 
+
+    public static function getContextMenu(): ContextMenu
+    {
+        return ContextMenu::make()
+            ->actions([
+                    Action::make()
+                        ->label('Create market')
+                        ->translateLabel()
+                        ->link()
+                        ->color('gray')
+                        ->url(CreateMarket::getUrl())
+                        ->icon('heroicon-o-plus-circle'),
+                    ImportAction::make()
+                        ->link()
+                        ->label('Excel import')
+                        ->translateLabel()
+                        ->importer(MarketImporter::class)
+                        ->icon('heroicon-o-arrow-up-tray'),
+                    Action::make('Upload images')
+                        ->translateLabel()
+                        ->link()
+                        ->icon('heroicon-o-photo')
+                        ->modalWidth(MaxWidth::ExtraLarge)
+                        ->color('gray')
+                        ->form(/* form inputs */)
+                        ->action(/* you own handling */),
+                    ContentMenuDivider::make(),
+                    Action::make('requested_markets')
+                        ->label('Requested Markets')
+                        ->link()
+                        ->color('gray')
+                        ->url(CreateMarket::getUrl())
+                        ->badge(25)
+                        ->icon('heroicon-o-building-storefront'),
+                    Action::make('requested_markets')
+                        ->label('Closed markets')
+                        ->link()
+                        ->color('gray')
+                        ->url(CreateMarket::getUrl())
+                        ->badge(4)
+                        ->icon('heroicon-o-building-storefront'),
+                ]);
+    }
+
+    // 
+}
 ```
 
 ## Testing
@@ -43,7 +101,7 @@ Please review [our security policy](../../security/policy) on how to report secu
 
 ## Credits
 
-- [:author_name](https://github.com/:author_username)
+- [aymanalhattami](https://github.com/aymanalhattami)
 - [All Contributors](../../contributors)
 
 ## License

diff --git a/resources/views/components/context-menu.blade.php b/resources/views/components/context-menu.blade.php
@@ -1,30 +1,30 @@
 @if(method_exists(static::class, 'getContextMenu'))
     <div id="contextMenu" class="flex z-50 min-w-48 max-w-2xl text-neutral-800 rounded-md ring-1 ring-gray-950/5 transition bg-white text-sm fixed p-2 shadow-md dark:text-gray-200 dark:bg-gray-900 dark:ring-white/10" style="display: none;">
-        @foreach(static::getContextMenu()->getItems() as $item)
-            @if($item instanceof \Filament\Actions\Action)
+        @foreach(static::getContextMenu()->getActions() as $action)
+            @if($action instanceof \Filament\Actions\Action)
                 <span @class([
                     'context-menu-filament-action flex gap-x-4 select-none group justify-between rounded px-2 py-1.5 hover:bg-neutral-100 outline-none pl-8 data-[disabled]:opacity-50 data-[disabled]:pointer-events-none dark:hover:bg-white/5',
                     'mt-1' => !$loop->first
                 ])>
-                    {{ $item }}
+                    {{ $action }}
                 </span>
-            @elseif($item instanceof \AymanAlhattami\FilamentContextMenu\ContentMenuItem)
-                <a href="{{ $item->getUrl() }}" target="{{ $item->getTarget() }}" @click="contextMenuOpen=false" @class([
+            @elseif($action instanceof \AymanAlhattami\FilamentContextMenu\ContentMenuItem)
+                <a href="{{ $action->getUrl() }}" target="{{ $action->getTarget() }}" @click="contextMenuOpen=false" @class([
                     "flex gap-x-1 select-none group justify-between rounded px-2 py-1.5 hover:bg-neutral-100 outline-none  data-[disabled]:opacity-50 data-[disabled]:pointer-events-none dark:hover:bg-white/5",
                     'mt-1' => !$loop->first,
                 ])>
                     <span class="flex gap-x-1">
-                        @if(filled($item->getIcon()))
+                        @if(filled($action->getIcon()))
                             <span class="flex h-5 w-5 items-center justify-center">
                                 <x-filament::icon
-                                    :icon="$item->getIcon()"
+                                    :icon="$action->getIcon()"
                                     class="h-5 w-5 ml-auto text-xs tracking-widest text-neutral-400"/>
                             </span>
                         @endif
-                        <span class="font-semibold hover:underline group-hover/link:underline group-focus-visible/link:underline text-sm text-gray-700 dark:text-gray-200">{{ $item->getTitle() }}</span>
+                        <span class="font-semibold hover:underline group-hover/link:underline group-focus-visible/link:underline text-sm text-gray-700 dark:text-gray-200">{{ $action->getTitle() }}</span>
                     </span>
                 </a>
-            @elseif($item instanceof \AymanAlhattami\FilamentContextMenu\ContentMenuDivider)
+            @elseif($action instanceof \AymanAlhattami\FilamentContextMenu\ContentMenuDivider)
                 <div @class([
                     "flex h-px my-1 -mx-1 bg-gray-100 dark:bg-white/5",
                     'mt-1' => !$loop->first,

diff --git a/src/ContentMenu.php → src/ContextMenu.php b/src/ContentMenu.php → src/ContextMenu.php
@@ -6,15 +6,15 @@
 use Filament\Actions\Action;
 use Filament\Support\Concerns\EvaluatesClosures;
 
-class ContentMenu
+class ContextMenu
 {
     use EvaluatesClosures;
 
     private string | null | Closure $title = null;
 
     private Closure | bool $translateTitle = false;
 
-    private array | Closure $items = [];
+    private array | Closure $actions = [];
 
     public static function make(): static
     {
@@ -49,17 +49,17 @@ public function isTitleTranslatable(): bool
         return (bool) $this->evaluate($this->translateTitle);
     }
 
-    public function getItems(): array
+    public function getActions(): array
     {
-        return $this->evaluate($this->items);
+        return $this->evaluate($this->actions);
     }
 
     /**
-     * @param  array<ContentMenuItem|Action>  $items
+     * @param  array<Action>  $actions
      */
-    public function items(array | Closure $items): static
+    public function actions(array | Closure $actions): static
     {
-        $this->items = $items;
+        $this->actions = $actions;
 
         return $this;
     }