From af4218e7070d6e1a0a5063765124cec7267d5805 Mon Sep 17 00:00:00 2001 From: Yoga Pangestu Date: Thu, 12 Mar 2026 08:34:43 +0700 Subject: [PATCH] feat: Add and configure mobile bottom navigation for the Filament admin panel. --- app/Providers/Filament/AdminPanelProvider.php | 31 +++ composer.json | 1 + composer.lock | 79 ++++++- .../views/vendor/mobile-bottom-nav/.gitkeep | 0 .../bottom-navigation.blade.php | 219 ++++++++++++++++++ 5 files changed, 329 insertions(+), 1 deletion(-) create mode 100644 resources/views/vendor/mobile-bottom-nav/.gitkeep create mode 100644 resources/views/vendor/mobile-bottom-nav/bottom-navigation.blade.php diff --git a/app/Providers/Filament/AdminPanelProvider.php b/app/Providers/Filament/AdminPanelProvider.php index 0c35012..d83d45f 100644 --- a/app/Providers/Filament/AdminPanelProvider.php +++ b/app/Providers/Filament/AdminPanelProvider.php @@ -14,8 +14,11 @@ use Filament\Panel; use Filament\PanelProvider; use Filament\Support\Colors\Color; +use Filament\Support\Icons\Heroicon; use Filament\Widgets\AccountWidget; use Filament\Widgets\FilamentInfoWidget; +use Hammadzafar05\MobileBottomNav\MobileBottomNav; +use Hammadzafar05\MobileBottomNav\MobileBottomNavItem; use Illuminate\Cookie\Middleware\AddQueuedCookiesToResponse; use Illuminate\Cookie\Middleware\EncryptCookies; use Illuminate\Foundation\Http\Middleware\VerifyCsrfToken; @@ -88,6 +91,34 @@ public function panel(Panel $panel): Panel ->navigationLabel('Log') ->navigationUrl('/system/logs') ->pollingTime(null), + + MobileBottomNav::make() + ->items([ + MobileBottomNavItem::make('Dasbor') + ->icon(Heroicon::OutlinedHome) + ->activeIcon(Heroicon::Home) + ->url('/admin') + ->isActive(fn () => request()->is('admin')), + + MobileBottomNavItem::make('Presensi') + ->icon(Heroicon::OutlinedCheckCircle) + ->activeIcon(Heroicon::CheckCircle) + ->url('/admin/learning/attendances') + ->isActive(fn () => request()->is('admin/learning/attendances')), + + MobileBottomNavItem::make('Materi') + ->icon(Heroicon::OutlinedBookOpen) + ->activeIcon(Heroicon::BookOpen) + ->url('/admin/learning/materials') + ->isActive(fn () => request()->is('admin/learning/materials')), + + MobileBottomNavItem::make('Tugas') + ->icon(Heroicon::OutlinedClipboardDocumentList) + ->activeIcon(Heroicon::ClipboardDocumentList) + ->url('/admin/learning/assignments') + ->isActive(fn () => request()->is('admin/learning/assignments')), + ]) + ->moreButton(false), ]) ->maxContentWidth('full') ->defaultAvatarProvider(FacehashProvider::class) diff --git a/composer.json b/composer.json index d06e547..95f5ab2 100644 --- a/composer.json +++ b/composer.json @@ -13,6 +13,7 @@ "filament/filament": "^5.0", "filament/spatie-laravel-media-library-plugin": "^5.0", "filament/spatie-laravel-settings-plugin": "^5.0", + "hammadzafar05/mobile-bottom-nav": "^1.0", "joaopaulolndev/filament-pdf-viewer": "^3.0", "laravel/framework": "^12.0", "laravel/tinker": "^2.10.1", diff --git a/composer.lock b/composer.lock index 96c25aa..41bfa62 100644 --- a/composer.lock +++ b/composer.lock @@ -4,7 +4,7 @@ "Read more about it at https://getcomposer.org/doc/01-basic-usage.md#installing-dependencies", "This file is @generated automatically" ], - "content-hash": "8392d40ff038be5645719684849b3b88", + "content-hash": "a1dbb9834deb9867961bae477b5e320b", "packages": [ { "name": "achyutn/filament-log-viewer", @@ -2433,6 +2433,83 @@ ], "time": "2025-08-22T14:27:06+00:00" }, + { + "name": "hammadzafar05/mobile-bottom-nav", + "version": "v1.0.2", + "source": { + "type": "git", + "url": "https://github.com/hammadzafar05/mobile-bottom-nav.git", + "reference": "740d2020f6dc7d6e2db466c221d11ee1d829feaa" + }, + "dist": { + "type": "zip", + "url": "https://api.github.com/repos/hammadzafar05/mobile-bottom-nav/zipball/740d2020f6dc7d6e2db466c221d11ee1d829feaa", + "reference": "740d2020f6dc7d6e2db466c221d11ee1d829feaa", + "shasum": "" + }, + "require": { + "filament/filament": "^4.0 || ^5.0", + "php": "^8.2", + "spatie/laravel-package-tools": "^1.15.0" + }, + "require-dev": { + "larastan/larastan": "^3.0", + "laravel/pint": "^1.0", + "nunomaduro/collision": "^8.0", + "orchestra/testbench": "^9.0|^10.0", + "pestphp/pest": "^3.7|^4.0", + "pestphp/pest-plugin-arch": "^3.0|^4.0", + "pestphp/pest-plugin-laravel": "^3.0|^4.0", + "pestphp/pest-plugin-livewire": "^3.0|^4.0", + "rector/rector": "^2.0", + "spatie/laravel-ray": "^1.26" + }, + "type": "library", + "extra": { + "laravel": { + "providers": [ + "Hammadzafar05\\MobileBottomNav\\MobileBottomNavServiceProvider" + ] + } + }, + "autoload": { + "psr-4": { + "Hammadzafar05\\MobileBottomNav\\": "src/" + } + }, + "notification-url": "https://packagist.org/downloads/", + "license": [ + "MIT" + ], + "authors": [ + { + "name": "Hammad Zafar", + "email": "hammadarain05@gmail.com", + "role": "Developer" + } + ], + "description": "A thumb-friendly mobile bottom navigation bar for Filament panels. It programmatically integrates with the Filament navigation registry to provide a seamless, ergonomic mobile experience with full support for dark mode and safe-area insets.", + "homepage": "https://github.com/hammadzafar05/mobile-bottom-nav", + "keywords": [ + "filament", + "filament-plugin", + "filamentphp", + "hammadzafar05", + "laravel", + "mobile-bottom-nav" + ], + "support": { + "issues": "https://github.com/hammadzafar05/mobile-bottom-nav/issues", + "source": "https://github.com/hammadzafar05/mobile-bottom-nav" + }, + "funding": [ + { + "url": "https://github.com/hammadzafar05", + "type": "github" + } + ], + "time": "2026-02-24T07:51:29+00:00" + }, { "name": "joaopaulolndev/filament-pdf-viewer", "version": "v3.0.3", diff --git a/resources/views/vendor/mobile-bottom-nav/.gitkeep b/resources/views/vendor/mobile-bottom-nav/.gitkeep new file mode 100644 index 0000000..e69de29 diff --git a/resources/views/vendor/mobile-bottom-nav/bottom-navigation.blade.php b/resources/views/vendor/mobile-bottom-nav/bottom-navigation.blade.php new file mode 100644 index 0000000..552d06c --- /dev/null +++ b/resources/views/vendor/mobile-bottom-nav/bottom-navigation.blade.php @@ -0,0 +1,219 @@ +@php + use function Filament\Support\generate_href_html; + use function Filament\Support\generate_icon_html; + use Filament\Support\Enums\IconSize; +@endphp + + +