Ehsan Posts - Answer Overflow

Ehsan

•Created by Ehsan on 2/18/2024 in #❓┊help

File upload with Livewire component

I am trying to use SpatieMediaLibraryFileUpload component with Livewire component in a filament form. I have followed steps as mentioned at https://filamentphp.com/docs/3.x/forms/adding-a-form-to-a-livewire-component#setting-up-the-livewire-component to make the form work, but the files somehow are not getting uploaded.

SpatieMediaLibraryFileUpload::make('photo')
                            ->label('Member Photograph')
                            ->collection('member_photos')
                            ->conversion('preview')
                            ->imagePreviewHeight('250')
                            ->required()
                            ->image(),

SpatieMediaLibraryFileUpload::make('photo')
                            ->label('Member Photograph')
                            ->collection('member_photos')
                            ->conversion('preview')
                            ->imagePreviewHeight('250')
                            ->required()
                            ->image(),

The above element code works in filament v3 admin panel with a filepond component. I am trying to save the data in a custom method with following code

Member:create($this->form->getState());

Member:create($this->form->getState());

It saves the data to database without the spatie media upload. DDing $this->form->getState(); doesn't show the member_photos element in it.

4 replies

FFilament

•Created by Ehsan on 11/28/2023 in #❓┊help

Url generation from BulkAction

I want to generate Identity Cards for selected members from my MemberResource The identity cards will be visible to user before printing on a new page. I have created below bulk action to achieve the same. I have also created a custom page for this new route.

BulkAction::make('generate_id')
  ->label('Generate ID Card')
  ->requiresConfirmation()
  ->action(function ($livewire, Collection $records) {
    $memberIds = implode(',', $records->pluck('id')->all());
    $livewire->js("window.open('members/print-id-cards/{$memberIds}', '_blank')");
  })

BulkAction::make('generate_id')
  ->label('Generate ID Card')
  ->requiresConfirmation()
  ->action(function ($livewire, Collection $records) {
    $memberIds = implode(',', $records->pluck('id')->all());
    $livewire->js("window.open('members/print-id-cards/{$memberIds}', '_blank')");
  })

This works and the member IDs are passed to this custom route comma separated. But this exposes IDs to end user. I would like to convert the route to POST instead of GET so that I can pass the data to it. Please help with the same or suggest any other way of achieving this.

2 replies

FFilament

•Created by Ehsan on 8/29/2023 in #❓┊help

Unable to use colors on blade components in livewire form component

I have created a livewire form component using docs from https://filamentphp.com/docs/3.x/forms/adding-a-form-to-a-livewire-component Inside the component, I am using a filament blade component like this

<x-filament::button color="success">
    New user
</x-filament::button>

<x-filament::button color="success">
    New user
</x-filament::button>

The problem is, that the button is rendered, without background color / border. The text is rendered in white properly though. I tried with other variants like warning, danger etc, but nothing is displayed. My tailwind.config.js looks like this

import colors from 'tailwindcss/colors'
import forms from '@tailwindcss/forms'

/** @type {import('tailwindcss').Config} */
export default {
    content: [
        './resources/**/*.blade.php',
        './vendor/laravel/framework/src/Illuminate/Pagination/resources/views/*.blade.php',
        './storage/framework/views/*.php',
        './vendor/filament/**/*.blade.php'
    ],
    theme: {
        extend: {
            colors: {
                danger: colors.rose,
                primary: colors.blue,
                success: colors.green,
                warning: colors.yellow,
            },
        },
    },
    darkMode: 'class',
    plugins: [forms],
}

import colors from 'tailwindcss/colors'
import forms from '@tailwindcss/forms'

/** @type {import('tailwindcss').Config} */
export default {
    content: [
        './resources/**/*.blade.php',
        './vendor/laravel/framework/src/Illuminate/Pagination/resources/views/*.blade.php',
        './storage/framework/views/*.php',
        './vendor/filament/**/*.blade.php'
    ],
    theme: {
        extend: {
            colors: {
                danger: colors.rose,
                primary: colors.blue,
                success: colors.green,
                warning: colors.yellow,
            },
        },
    },
    darkMode: 'class',
    plugins: [forms],
}

The buttons are displayed correctly in the admin panel though. I also tried to register the colors in boot() method of AppServiceProvider , but no result

use Filament\Support\Colors\Color;
use Filament\Support\Facades\FilamentColor;
 
FilamentColor::register([
    'danger' => Color::Red,
    'gray' => Color::Zinc,
    'info' => Color::Blue,
    'primary' => Color::Amber,
    'success' => Color::Green,
    'warning' => Color::Amber,
]);

use Filament\Support\Colors\Color;
use Filament\Support\Facades\FilamentColor;
 
FilamentColor::register([
    'danger' => Color::Red,
    'gray' => Color::Zinc,
    'info' => Color::Blue,
    'primary' => Color::Amber,
    'success' => Color::Green,
    'warning' => Color::Amber,
]);

6 replies

FFilament

•Created by Ehsan on 8/27/2023 in #❓┊help

Spatie Media Library plugin not working in livewire form component

19 replies

FFilament

•Created by Ehsan on 8/26/2023 in #❓┊help

Disabling dark mode for form component

I have created a custom form component and embedded the component on a page. I have also disabled darkMode for the panel using panel configuration ->darkMode(false) which has disabled the same on admin panel. But the form component added to a view is displayed in darkMode. I tried to disable the same using Javascript, but it doesn't work.

localStorage.theme = 'light';
document.documentElement.classList.remove('dark')

localStorage.theme = 'light';
document.documentElement.classList.remove('dark')

The form is basically using OS default theme instead, which in my case is dark. I also tried with darkMode: 'class' in tailwind.config.js I am following this example https://filamentphp.com/docs/3.x/forms/adding-a-form-to-a-livewire-component Any help rendered will be appreciated.

2 replies

FFilament

•Created by Ehsan on 8/17/2023 in #❓┊help

Disabling dark mode for form component only

I have created a custom form component and embedded the livewire component on a page. The dark mode is enabled by default in filament config, but I want to disable it for this particular livewire form component. How to achieve that

6 replies

FFilament

•Created by Ehsan on 7/29/2023 in #❓┊help

Help with custom resource page

I have created a custom resource page and added its entry in getPages() method like this: 'print' => Pages\PrintCouponBatch::route('/print/{record}') I want the view for this page to use a custom layout. Also I am not able to access the $record in the view. {{ $record }} shows variable undefined whileas the doc says, the route param should be available in view. Any help with this will be appreciated.

6 replies

FFilament

•Created by Ehsan on 7/26/2023 in #❓┊help

Update TextInput programmatically in reactive way

Hello guys, I have a reactive Select component on form and I want to update value of a TextInput based on the onchange value of this Select element. I tried to use value() method, but it sets the value only once on load and doesn’t change on Select changes. Please help.

5 replies

Gaming

Programming