Skip to main content

패널 커스터마이징

📝 초안 (Draft)

이 문서는 검토 중입니다. 내용이 변경될 수 있습니다.

Filament 패널을 커스터마이징하는 방법을 설명합니다.

개요​

Multi-SaaS Kit의 Level 0~6 계층 패널은 Filament v4를 기반으로 합니다. 각 패널을 프로젝트 요구사항에 맞게 커스터마이징할 수 있습니다.

테마 변경​

패널별 색상​

각 패널은 고유한 색상으로 구분됩니다:

패널기본 색상설정
PlatformRedColor::Red
SaaSOrangeColor::Orange
TenantBlueColor::Blue
OrgTealColor::Teal
WorkspaceIndigoColor::Indigo
TeamGreenColor::Green
AppSlateColor::Slate
// PanelProvider에서 색상 변경
->colors([
    'primary' => Color::Blue,
    'danger' => Color::Rose,
    'warning' => Color::Amber,
    'success' => Color::Green,
])

다크 모드​

// 다크 모드 강제 적용
->darkMode(true)

// 사용자 선택 허용 (기본값)
->darkMode()

브랜드 로고​

->brandLogo(asset('images/logo.svg'))
->darkModeBrandLogo(asset('images/logo-dark.svg'))
->brandLogoHeight('2rem')

메뉴 커스터마이징​

네비게이션 그룹​

// Resource에서 그룹 지정
protected static ?string $navigationGroup = '사용자 관리';
protected static ?int $navigationSort = 1;

조건부 네비게이션​

// 특정 조건에서만 메뉴 표시
public static function shouldRegisterNavigation(): bool
{
    return auth()->user()->level <= 2;
}

커스텀 메뉴 항목​

// PanelProvider에서 직접 추가
->navigationItems([
    NavigationItem::make('대시보드')
        ->icon('heroicon-o-home')
        ->isActiveWhen(fn () => request()->routeIs('dashboard'))
        ->url('/dashboard'),
])

위젯 추가​

대시보드 위젯​

namespace App\Filament\Platform\Widgets;

use Filament\Widgets\StatsOverviewWidget;
use Filament\Widgets\StatsOverviewWidget\Stat;

class StatsOverview extends StatsOverviewWidget
{
    protected function getStats(): array
    {
        return [
            Stat::make('총 테넌트', Tenant::count())
                ->description('활성 테넌트')
                ->color('success'),
            Stat::make('총 사용자', User::count())
                ->description('전체 사용자 수')
                ->color('primary'),
        ];
    }
}

위젯 등록​

// PanelProvider에서 등록
->widgets([
    StatsOverview::class,
    RecentActivityWidget::class,
])

위젯 컬럼 조절​

protected int | string | array $columnSpan = 'full';
// 또는
protected int | string | array $columnSpan = 2;

경로 변경​

환경변수로 설정​

# .env
PANEL_PATH_PLATFORM=admin-secret
PANEL_PATH_TENANT=customer
PANEL_PATH_APP=my
// PanelProvider에서 사용
->path(env('PANEL_PATH_PLATFORM', 'platform'))

nginx 별칭 설정​

여러 경로로 같은 패널에 접근하려면:

# nginx.conf
location /shop {
    rewrite ^/shop(.*)$ /team$1 last;
}

인증 커스터마이징​

로그인 페이지​

->login(CustomLoginPage::class)

회원가입​

->registration(CustomRegisterPage::class)
// 또는 기본 활성화
->registration()

비밀번호 재설정​

->passwordReset()

프로필 페이지​

->profile(CustomProfilePage::class)
// 또는 기본 활성화
->profile()

플러그인 연동​

Filament 공식 플러그인​

Multi-SaaS Kit은 다음 Filament 플러그인과 호환됩니다:

플러그인용도
Spatie Media Library파일 업로드
Notifications알림 시스템
Actions벌크 액션
Shield권한 관리 (선택적)

플러그인 등록​

// PanelProvider에서
->plugins([
    SpatieLaravelTranslatablePlugin::make(),
    FilamentShieldPlugin::make(),
])

페이지 커스터마이징​

커스텀 대시보드​

namespace App\Filament\Platform\Pages;

use Filament\Pages\Dashboard as BaseDashboard;

class Dashboard extends BaseDashboard
{
    protected static ?string $navigationIcon = 'heroicon-o-home';

    protected static string $view = 'filament.platform.pages.dashboard';
}

커스텀 페이지 추가​

namespace App\Filament\Platform\Pages;

use Filament\Pages\Page;

class SystemSettings extends Page
{
    protected static ?string $navigationIcon = 'heroicon-o-cog';
    protected static string $view = 'filament.platform.pages.system-settings';
    protected static ?string $navigationGroup = '설정';
}

다국어 지원​

언어 설정​

// config/app.php
'locale' => 'ko',
'fallback_locale' => 'en',

번역 파일​

lang/
├── ko/
│   └── filament.php
└── en/
    └── filament.php

Resource 라벨 번역​

protected static ?string $modelLabel = '사용자';
protected static ?string $pluralModelLabel = '사용자 목록';
protected static ?string $navigationLabel = '사용자 관리';

성능 최적화​

리소스 캐싱​

// Resource에서 캐시 활성화
protected static bool $shouldCache = true;

Lazy Loading​

// 테이블 레코드 지연 로딩
protected int $defaultPaginationPageOption = 25;

쿼리 최적화​

// 관계 미리 로딩
public static function getEloquentQuery(): Builder
{
    return parent::getEloquentQuery()
        ->with(['organization', 'tenant']);
}

관련 문서​