Samus_Aran Posts - Answer Overflow

Samus_Aran

•Created by Samus_Aran on 6/16/2024 in #❓┊help

Form with Textarea on custom widget causing JS errors

I have a custom widget added to a resource view page. The widget is implementing a form according to https://filamentphp.com/docs/3.x/forms/adding-a-form-to-a-livewire-component. My form is for adding comments, so its quite simple:

public function form(Form $form): Form
{
    return $form
        ->schema([
            Forms\Components\Textarea::make('text')
              ->rows(3)
              ->autosize()
              ->hiddenLabel(true)
              ->placeholder('Write a comment...')
              ->required(),
        ])
        ->model(Comment::class)
        ->statePath('data');
}

public function form(Form $form): Form
{
    return $form
        ->schema([
            Forms\Components\Textarea::make('text')
              ->rows(3)
              ->autosize()
              ->hiddenLabel(true)
              ->placeholder('Write a comment...')
              ->required(),
        ])
        ->model(Comment::class)
        ->statePath('data');
}

However, this is causing JS errors in my Browser console:

Alpine Expression Error: textareaFormComponent is not defined
Expression: "textareaFormComponent({ initialHeight: 3.75 })"

Alpine Expression Error: height is not defined
Expression: "{ height }"

Uncaught ReferenceError: textareaFormComponent is not defined

Uncaught ReferenceError: height is not defined

Alpine Expression Error: textareaFormComponent is not defined
Expression: "textareaFormComponent({ initialHeight: 3.75 })"

Alpine Expression Error: height is not defined
Expression: "{ height }"

Uncaught ReferenceError: textareaFormComponent is not defined

Uncaught ReferenceError: height is not defined

Is this a filament bug or an issue on my end? I am on the latest filament version 🤔 The error disappears, if I change from Textarea to Textinput in my form.

4 replies

FFilament

•Created by Samus_Aran on 6/16/2024 in #❓┊help

Problems closing a parent modal

Hi there! I a have a Filament Table for invoices that opens a modal with invoice details using the ViewAction when clicking on a table row. The modal is rendered with a custom blade view. Somewhere inside that view I have a Livewire Component with an InfoList. This is where I placed a delete action for the currently opened invoice. Deleting the invoice works fine. However, I am immediately greeted with various exceptions, probably because the ViewAction modal is trying to refresh with a record that obviously doesn't exist anymore. Is there a way to make my delete action work and send some Livewire event or something else to have the parent modal close? I don't have any issues when I put the action from my InfoList into the ViewAction using ->extraModalFooterActions([DeleteAction::make()->cancelParentActions()]) . However, I would like to place my action inside the modal content in my infolist for various UI reasons.

2 replies

FFilament

•Created by Samus_Aran on 6/7/2024 in #❓┊help

Using an Infolist-Action with another infolist in it.

I am Building an infolist on my OrderResource view page. For the Client field in my infolist I want to add a prefix/suffix/hint Action. This action should open a modal displaying additional client Information. I can add my client infolist using the infolist() method on the Action but I can’t seem to find the methods for setting the record or state. I therefore get an exception when clicking the action link. How can I set the record for my modal infolist?

12 replies

FFilament

•Created by Samus_Aran on 6/6/2024 in #❓┊help

Use recordAction() In a Table Widget

Hello! I have a TableWidget that displays all invoices that I have for an OrderResource on it's view page. The Invoices don't have a page on their own. I created an Action that opens a modal. I can add this action to the actions() method of my table, but this will render a "View" Link on each table row. Instead I simply want the whole table row to be clickable. I know this can be done with the method ->recordAction(), but I can't seem to get it working. Can someboy explain to me how to wire up my Table Row Action so that I can use it with ->recordAction()?

19 replies

FFilament

•Created by Samus_Aran on 5/25/2024 in #❓┊help

Refresh a modal after an extra footer action is performed?

Hi there! I have a question regarding this part of the docs: https://filamentphp.com/docs/3.x/actions/modals#adding-an-extra-modal-action-button-to-the-footer I have a Table displaying invoices. Each row provides a ViewAction to open a modal to view the invoice details. An Invoice may have a state (Open, Booked, Checked, Paid, etc.) and the modal should provide a n extra footer action depending on the current state to move the invoice to it's next state. For example, if the invoice is "open", I want to have the "book" action in my modal footer. Here is the relevant bit of my code:

public function table(Table $table): Table
{
    return $table
      ->actions([
        Tables\Actions\ViewAction::make()
          ->modalWidth(MaxWidth::SevenExtraLarge)
          ->modalContent(fn (Invoice $record) => view('filament.project.pages.invoice', ['invoice' => $record]))
          ->extraModalFooterActions(fn (Invoice $record): array => $this->getNextInvoiceActions($record->status))
      ]);
}

public function table(Table $table): Table
{
    return $table
      ->actions([
        Tables\Actions\ViewAction::make()
          ->modalWidth(MaxWidth::SevenExtraLarge)
          ->modalContent(fn (Invoice $record) => view('filament.project.pages.invoice', ['invoice' => $record]))
          ->extraModalFooterActions(fn (Invoice $record): array => $this->getNextInvoiceActions($record->status))
      ]);
}

Now my problem is this: after performing the action that is returned from getNextInvoiceActions() I need the modal to refresh. So if we move from "open" to "booked", I now need the "check" action in my footer. However, I still have the "book" action in my footer, which then results in a weird state situation. I can solve this issue by adding ->cancelParentActions() to my action definitions in getNextInvoiceActions() . However, this will close the view modal, after completing the action, requiring the user to look for the invoice in the table again and reopening the view modal to proceed with other actions, which is not a good UX. Is there to somehow "refresh" the parent of an extra action after it is performed?

2 replies

FFilament

•Created by Samus_Aran on 5/15/2024 in #❓┊help

Filtering a Table Widget from a Chart Widget on a Resource View page possible?

Hi guys! In my Filament app I have a BudgetResource. Budgets can have multiple Segments. Then Orders are assigned to a segment and its budget. On my Budget View page I have a Chart Widget that displays a Pie Charts of all Segments for the current budget as well as a Table Widget that displays all Orders that are assigned to the budget. Now what I would love to do is that when the user clicks on a segment in the pie chart widget to have that segment id applied as a filter to the table widget so the user then only sees the orders for that segment. Is this doable in Filament? I know that Widgets can access the page table but only on List pages, but I am on a View page. And nested resources are not yet a thing in Filament either...

5 replies

FFilament

•Created by Samus_Aran on 5/2/2024 in #❓┊help

Conditional Multi-Tenancy Panel Redirect

Well hello there! I have a panel with Multi-Tenancy in my app. When a user that has not yet any tenants clicks the link to the panel, he will get a 404. Now I can configure the panel with a tenant registration page. Now instead of a 404 the user will get directed to that creation page. However, I don't want all users to be able to create a tenant. So I adjusted my Policy class for the tenant model. Now the users get a 404 again. Is there a possibilty to configure conditional redirects? Admin users should be able to create a new model, while other users should see a page that informs them to "ask an admin to have them added to a tenant"

4 replies

FFilament

•Created by Samus_Aran on 3/3/2024 in #❓┊help

Wrapping all Panels by subdomain

I am currently experimenting with a SaaS boilerplate using Filament. I currently have 3 panels to structure my app: - A Dashboard Panel, that shows stuff for the user (his open tasks, settings, etc.) - An Admin Panel, which is only accessible for admin users - A Project Panel, which uses Filament's Multi-Tenancy to give a user access to the projects he is assigned to Now I want to scope all my panels using a subdomain. This would be something like an "Account" model that gets created after someone subscribes to my SaaS. In each PanelServiceProvider I specified this domain as such: $panel->domain('{account}.filament.test') I then registered a global Middleware with Laravel that sets the URL parameter, so I don't get crashes when Filament tries to assemble its URLs: URL::defaults(['account' => Str::betweenFirst($request->url(), '://', '.')]) This second bit is a bit hacky, it's just there to prove my concept. In the finished app I would try to resolve the real 'Account' model from the database and redirect to a subscription-page, if no account has been found or the authenticated user does not belong to the account instance. In my Filament Panels, all resources would access the account url parameter in a global scope to ensure that I only display stuff from the correct account. I was just wondering, if this is an approach that would work, or if I might be missing some Settings for this use case that might be available in Filament. Or maybe this is already totally fine?

5 replies

FFilament

•Created by Samus_Aran on 12/10/2023 in #❓┊help

Limit text on TextColumn depending on the breakpoint?

Is it possible to pass multiple values to limit() somehow? I currently use limit(30) to ensure my table doesn't scroll on mobile, but I'd like to increase the limit to 60 on higher breakpoints like lg or xl...

4 replies

FFilament

•Created by Samus_Aran on 12/5/2023 in #❓┊help

SelectFilter: Filter by value, null or any

I have a Table with articles where you can filter by author (user_id). However, the user_id can also be null. This indicates that an article has been written by the whole team instead of a specific team member. Is it possible to cover this with a SelectFilter? I can load the options by relation (check), the dropdown will also contains an "All" option that deactivates the filter (check), but I cannot find a way to add an additional dedicated null option with a label like "From the Team" that would add a ->whereNull('user_id') to the query?

1 replies

FFilament

•Created by Samus_Aran on 12/4/2023 in #❓┊help

Enum cast not working when editing a resource

I have a model "Article" with a "category" field. This Field is being cast to an enum ArticleCategory::class. The Enum class is implementing Filament\Support\Contracts\HasLabel. In my ArticleResource form I am populating a select input using ->options(ArticleCategory::class). I am also providing ->default(ArticleCategory::STORY) to set the default during article creation. Further down in my form I have a conditional grid, which only gets displayed, if $get('category') matches ArticleCategory::REVIEW Everything works when creating a new article. During editing however, I noticed that my conditional grid is never displayed. Upon further inspection I found out that the value for "category" was not an instance of my Enum class, but just a plain String. I was able to fix my issue using this piece of Code in my EditArticle.php file:

protected function mutateFormDataBeforeFill(array $data): array
{
    $data['category'] = ArticleCategory::from($data['category']);
     
    return $data;
}

protected function mutateFormDataBeforeFill(array $data): array
{
    $data['category'] = ArticleCategory::from($data['category']);
     
    return $data;
}

This feels rather cumbersome, as I was expecting that Filament would take my Enum Cast into account during editing, considering that the Select Input works so nicely with Enum classes. Is this a bug? Or is there a simpler way to do this? Or is this already the proper way to do this?

32 replies

FFilament

•Created by Samus_Aran on 11/30/2023 in #❓┊help

Change the HTTP method to GET for the Logout MenuItem

Hi there! I am trying to override the behaviour of the logout menu item in the user dropdown on my admin panel by adding this piece of code:

->userMenuItems([
  'logout' => MenuItem::make()
    ->url(fn (): string => route('home'))
    ->label('Leave'),
])

->userMenuItems([
  'logout' => MenuItem::make()
    ->url(fn (): string => route('home'))
    ->label('Leave'),
])

I get an error, because Filament still wants to process this as POST. I can fix it by changing the key from "logout" to "leave" but then it obviously doesn't replace the logout menu item... Is it possible to explicitly set the request method somehow?

27 replies

Gaming

Programming