Filament Form Builder Laravel Package

Getting Started

Minimal Setup

1. Installation:

   composer require tapp/filament-form-builder:"^4.0"
   php artisan vendor:publish --tag="filament-form-builder-migrations"
   php artisan migrate
   

2. Register Plugins:

   • Admin Panel (app/Providers/Filament/AdminPanelProvider.php):

     ->plugins([FilamentFormBuilderPlugin::make()])
     

   • Guest Panel (app/Providers/Filament/GuestPanelProvider.php):

     ->plugins([FilamentFormBuilderGuestPlugin::make()])
     

   • Frontend/App Panel (app/Providers/Filament/AppPanelProvider.php):

     ->plugins([FilamentFormBuilderFrontendPlugin::make()])
     

3. First Use Case:

   • Access /admin/forms to create a form via Filament’s CRUD interface.
   • Add fields (e.g., TextInput, RichEditor) using Filament’s field components.
   • Publish the form to a frontend route (e.g., /forms/{form-slug}) for submissions.

Implementation Patterns

Core Workflow

1. Form Creation:

   • Use Filament’s FilamentFormResource to define forms with fields (supports all Filament field types).
   • Example:

     FilamentForm::create([
         'name' => 'Contact Us',
         'slug' => 'contact-us',
         'fields' => json_encode([
             ['type' => 'text', 'name' => 'email', 'label' => 'Email'],
             ['type' => 'rich_editor', 'name' => 'message', 'label' => 'Message'],
         ]),
     ]);
     

2. Frontend Integration:

   • Embed forms in Blade/Livewire:

     @livewire('tapp.filament-form-builder.livewire.filament-form.show', ['form' => $form])
     

   • Customize appearance via CSS hooks (e.g., .fb-form-container).

3. Data Handling:

   • Submissions: Automatically saved as FilamentFormUser entries.
   • Validation: Inherits Laravel validation rules (e.g., required, email).
   • Events: Listen to EntrySaved (Livewire/Laravel) for post-submission logic:

     // Livewire
     protected $listeners = ['entrySaved'];
     public function entrySaved(FilamentFormUser $entry) {
         // Send email, log data, etc.
     }
     

4. Multi-Tenancy:

   • Enable in config/filament-form-builder.php:

     'tenancy' => [
         'enabled' => true,
         'model' => \App\Models\Team::class,
     ]
     

   • Forms/entries auto-scope to the current tenant.

5. Private Entries:

   • Enable via form toggle (private_entries).
   • Implement FilamentFormPolicy::viewEntries() to restrict access:

     public function viewEntries(User $user, FilamentForm $form): bool {
         return $user->isAdmin();
     }
     

Integration Tips

• Dynamic Forms: Use FilamentForm::findOrFail($slug) to fetch forms dynamically.
• CSV Export: Leverage maatwebsite/excel via the Entries Relation Manager.
• Custom Fields: Extend FilamentFormField for reusable components.
• Guest Access: Set permit_guest_entries on forms for unauthenticated submissions.

Gotchas and Tips

Pitfalls

1. Tenancy Configuration:

   • Must enable before migrations or manually add tenant columns (tenant_id).
   • Tenant URLs follow /admin/{tenant-slug}/forms.

2. Private Entries:

   • Policy method must be named viewEntries (case-sensitive).
   • Disabled toggle UI if user lacks viewEntries permission.

3. Route Conflicts:

   • Default routes (/forms/{form}, /entries/{entry}) may clash with existing routes.
   • Customize in config/filament-form-builder.php:

     'filament-form-uri' => 'custom-forms',
     

4. Livewire Redirects:

   • Use blockRedirect prop to embed forms without redirects:

     @livewire('tapp.filament-form-builder.livewire.filament-form.show', [
         'form' => $form,
         'blockRedirect' => true
     ])
     

5. Field Serialization:

   • Fields are stored as JSON; ensure valid JSON when updating via API/DB.

Debugging

• Form Not Showing?:
  • Verify the panel plugin is registered.
  • Check filament-form-uri config matches your route.
• Entries Missing:
  • Confirm filament_form_id is set on filament_form_users table.
  • Validate tenant scope if using multi-tenancy.
• Policy Issues:
  • Use php artisan filament:debug to test permissions.

Extension Points

1. Custom Pages:

   • Override ShowForm/ShowEntry pages in config:

     'pages' => [
         'guest' => [
             'show_form' => \App\Pages\CustomShowForm::class,
         ],
     ]
     

2. Field Extensions:

   • Create custom fields by extending FilamentFormField:

     class CustomField extends FilamentFormField {
         protected static string $view = 'filament-form-builder::fields.custom';
     }
     

3. Event Listeners:

   • Extend EntrySaved event for custom logic:

     // app/Providers/EventServiceProvider.php
     protected $listen = [
         \Tapp\FilamentFormBuilder\Events\EntrySaved::class => [
             \App\Listeners\LogSubmission::class,
         ],
     ];
     

4. Tailwind Integration:

   • Add vendor paths to tailwind.config.js:

     content: [
         './vendor/tapp/**/*.blade.php',
     ],
     

Pro Tips

• Bulk Actions: Use the Entries Relation Manager’s "Export Selected" for CSV exports.
• Field Ordering: Use spatie/eloquent-sortable for drag-and-drop field reordering.
• Validation: Reuse Laravel validation rules (e.g., rules: ['email' => 'required|email']).
• Testing: Mock FilamentFormUser entries for unit tests:

  $entry = FilamentFormUser::factory()->create(['filament_form_id' => $form->id]);