Matthew Posts - Answer Overflow

Matthew

•Created by Matthew on 12/2/2024 in #❓┊help

Issue with reordable table

    public static function table(Table $table): Table
    {
        return $table
            ->columns([
                TextColumn::make('name'),
                TextColumn::make('email'),
            ])
            ->filters([
                //
            ])
            ->actions([
                Impersonate::make(),
                Tables\Actions\EditAction::make(),
            ])
            ->bulkActions([
                Tables\Actions\BulkActionGroup::make([
                    Tables\Actions\DeleteBulkAction::make(),
                ]),
            ])
            ->reorderable('name', true);
    }

    public static function table(Table $table): Table
    {
        return $table
            ->columns([
                TextColumn::make('name'),
                TextColumn::make('email'),
            ])
            ->filters([
                //
            ])
            ->actions([
                Impersonate::make(),
                Tables\Actions\EditAction::make(),
            ])
            ->bulkActions([
                Tables\Actions\BulkActionGroup::make([
                    Tables\Actions\DeleteBulkAction::make(),
                ]),
            ])
            ->reorderable('name', true);
    }

34 replies

FFilament

•Created by Matthew on 11/19/2024 in #❓┊help

Use HeaderAction to upload file in FileUpload.

Assume I have a fileupload component in a form on my page. By pressing a header action, is it possible to upload that file (to the specified disk)? Generally when you upload something, before you press create, that file is sitting in the livewire-tmp directory, and its only when you press "Create" that the file goes to its proper directory. In this case, we dont have a create action or a model.

4 replies

FFilament

•Created by Matthew on 11/15/2024 in #❓┊help

Plugin development: JS file net::ERR_ABORTED 404 (Not Found)

<?php

namespace TheThunderTurner\FilamentLatex;

use Filament\Support\Assets\AlpineComponent;
use Filament\Support\Facades\FilamentAsset;
use Livewire\Livewire;
use Spatie\LaravelPackageTools\Package;
use Spatie\LaravelPackageTools\PackageServiceProvider;

class FilamentLatexServiceProvider extends PackageServiceProvider
{
    public static string $name = 'filament-latex';

    public function configurePackage(Package $package): void
    {
        $package->name(static::$name)
            ->hasViews()
            ->hasTranslations();
    }

    public function packageBooted(): void
    {
        Livewire::component('filament-latex', FilamentLatex::class);

        FilamentAsset::register(
            assets: [
                AlpineComponent::make('filament-latex', __DIR__ . '/../resources/dist/filament-latex.js'),
            ],
            package: 'thethunderturner/filament-latex'
        );
    }
}

<?php

namespace TheThunderTurner\FilamentLatex;

use Filament\Support\Assets\AlpineComponent;
use Filament\Support\Facades\FilamentAsset;
use Livewire\Livewire;
use Spatie\LaravelPackageTools\Package;
use Spatie\LaravelPackageTools\PackageServiceProvider;

class FilamentLatexServiceProvider extends PackageServiceProvider
{
    public static string $name = 'filament-latex';

    public function configurePackage(Package $package): void
    {
        $package->name(static::$name)
            ->hasViews()
            ->hasTranslations();
    }

    public function packageBooted(): void
    {
        Livewire::component('filament-latex', FilamentLatex::class);

        FilamentAsset::register(
            assets: [
                AlpineComponent::make('filament-latex', __DIR__ . '/../resources/dist/filament-latex.js'),
            ],
            package: 'thethunderturner/filament-latex'
        );
    }
}

export default function clockWidget() {
    return {
        time: new Date().toLocaleTimeString(),
        init() {
            setInterval(() => {
                this.time = new Date().toLocaleTimeString();
            }, 1000);
        }
    }
}

export default function clockWidget() {
    return {
        time: new Date().toLocaleTimeString(),
        init() {
            setInterval(() => {
                this.time = new Date().toLocaleTimeString();
            }, 1000);
        }
    }
}

<x-filament-panels::page>
    <x-filament::section>
        <x-slot name="heading">
            Test
        </x-slot>

        <div
            x-ignore
            ax-load
            ax-load-src="{{ \Filament\Support\Facades\FilamentAsset::getAlpineComponentSrc('filament-latex', 'thethunderturner/filament-latex') }}"
            x-data="clockWidget()"
            class="text-center"
        >
            <p class="text-xl" x-text="time"></p>
        </div>
    </x-filament::section>
</x-filament-panels::page>

<x-filament-panels::page>
    <x-filament::section>
        <x-slot name="heading">
            Test
        </x-slot>

        <div
            x-ignore
            ax-load
            ax-load-src="{{ \Filament\Support\Facades\FilamentAsset::getAlpineComponentSrc('filament-latex', 'thethunderturner/filament-latex') }}"
            x-data="clockWidget()"
            class="text-center"
        >
            <p class="text-xl" x-text="time"></p>
        </div>
    </x-filament::section>
</x-filament-panels::page>

46 replies

FFilament

•Created by Matthew on 11/15/2024 in #❓┊help

How to set up hscrollbar

How can I setup a "divider" that resizes two divs by dragging left/right just like in tailwind playground?

3 replies

FFilament

•Created by Matthew on 11/14/2024 in #❓┊help

FileUpload max size validation isnt working

FileUpload::make('server')
    ->maxSize(102400)
    ->disk('<...>')
    ->visibility('private'),

FileUpload::make('server')
    ->maxSize(102400)
    ->disk('<...>')
    ->visibility('private'),

if I upload a file of size > 12MB, it gets rejected for being too large. However, post_max_size,memory_limit,max_upload_size,upload_max_filesize in the ini file are all over 128MB, and the validation, still considers 12MB as the limit. Am I missing something?

3 replies

FFilament

•Created by Matthew on 11/14/2024 in #❓┊help

Section label doesnt override default value

Im not sure if this is intentional or not, but setting a ->label() to a section does not override the name of Section::make('something'). Is this intentional, if so why?

2 replies

FFilament

•Created by Matthew on 11/14/2024 in #❓┊help

Action is always loading when running a laravel process

13 replies

FFilament

•Created by Matthew on 11/11/2024 in #❓┊help

Is there a better way to write this x-init?

Is there a better way to write this: x-init="@this.call('loadCastData')" in a blade file? Currently prettier has some issues with the syntax of the quotes.

16 replies

FFilament

•Created by Matthew on 8/25/2024 in #❓┊help

How can I add alpine plugin to my filament plugin?

I have the following js file:

import sort from '@alpinejs/sort'
document.addEventListener('alpine:init', () => {
    window.Alpine.plugin(sort)
})

export default function widgetList({ options }) {
    return {

    };
}

import sort from '@alpinejs/sort'
document.addEventListener('alpine:init', () => {
    window.Alpine.plugin(sort)
})

export default function widgetList({ options }) {
    return {

    };
}

blade:

<x-filament-widgets::widget>
    <x-filament::section>
        <div
            x-ignore
            ax-load
            ax-load-src="{{ \Filament\Support\Facades\FilamentAsset::getAlpineComponentSrc('widget-list', 'thethunderturner/widget-list') }}"
            x-data="widgetList({
                    options: @js($options),
                })">
            <ul x-sort>
                <li x-sort:item>foo</li>
                <li x-sort:item>bar</li>
                <li x-sort:item>baz</li>
            </ul>
        </div>
    </x-filament::section>
</x-filament-widgets::widget>

<x-filament-widgets::widget>
    <x-filament::section>
        <div
            x-ignore
            ax-load
            ax-load-src="{{ \Filament\Support\Facades\FilamentAsset::getAlpineComponentSrc('widget-list', 'thethunderturner/widget-list') }}"
            x-data="widgetList({
                    options: @js($options),
                })">
            <ul x-sort>
                <li x-sort:item>foo</li>
                <li x-sort:item>bar</li>
                <li x-sort:item>baz</li>
            </ul>
        </div>
    </x-filament::section>
</x-filament-widgets::widget>

However, the list doesnt sort? For some reason it seems the plugin is not applied. What am I missing?

6 replies

FFilament

•Created by Matthew on 8/14/2024 in #❓┊help

Allowed memory size of 134217728 bytes exhausted (tried to allocate 31817560 byte

How can I fix this error? Im using a forked version of filament because I working on a PR. (Since v4 doesnt build yet im testing it on v3) Everything was working fine until suddenly I got this message. I was playing around with table.js. When this happened I reverted back to HEAD and I still get this error. I cleared laravel cache, views and I even restarted and I still get the error. Does anyone have an Idea?

5 replies

FFilament

•Created by Matthew on 8/7/2024 in #❓┊help

How can I get started with a JS field?

I want to create my own filament field (Slider) which is based on JS nouislider This is currently an Issue on github for filament 4.1. I want to get a jumpstart on this, and even if it doesnt get merged, at least I learned something new 😅 The problem is I have NO IDEA how to get started with javascript plugins. For starters, I added nouislider in the package.json. Furthermore, I've also create the Slider class, blade and JS file as follows: packages/forms/src/Components/Slider.php

<?php

namespace Filament\Forms\Components;

use Filament\Support\Concerns\HasExtraAlpineAttributes;

class Slider extends Field
{
    use HasExtraAlpineAttributes;

    /**
     * @var view-string
     */
    protected string $view = 'filament-forms::components.slider';

    protected function setUp(): void
    {
        parent::setUp();
    }
}

<?php

namespace Filament\Forms\Components;

use Filament\Support\Concerns\HasExtraAlpineAttributes;

class Slider extends Field
{
    use HasExtraAlpineAttributes;

    /**
     * @var view-string
     */
    protected string $view = 'filament-forms::components.slider';

    protected function setUp(): void
    {
        parent::setUp();
    }
}

packages/forms/resources/js/components/slider.js

export default function sliderFormComponent({ start = [20,80], min=0, max=100 }) {
    return {
        slider: null,

        init: function () {
            this.slider = document.getElementById('slider')

            noUiSlider.create(this.slider, {
                start: start,
                connect: true,
                range: {
                    'min': min,
                    'max': max
                }
            })
        }
    }
}

export default function sliderFormComponent({ start = [20,80], min=0, max=100 }) {
    return {
        slider: null,

        init: function () {
            this.slider = document.getElementById('slider')

            noUiSlider.create(this.slider, {
                start: start,
                connect: true,
                range: {
                    'min': min,
                    'max': max
                }
            })
        }
    }
}

packages/forms/resources/views/components/slider.blade.php

<x-dynamic-component :component="$getFieldWrapperView()" :field="$field">
    <div
        id="slider"
        x-data="sliderFormComponent({ start: [20, 80], min: 0, max: 100 })"
        x-init="init()"
        ax-load-src="{{ \Filament\Support\Facades\FilamentAsset::getAlpineComponentSrc('slider', 'filament/forms') }}">
    </div>
</x-dynamic-component>

<x-dynamic-component :component="$getFieldWrapperView()" :field="$field">
    <div
        id="slider"
        x-data="sliderFormComponent({ start: [20, 80], min: 0, max: 100 })"
        x-init="init()"
        ax-load-src="{{ \Filament\Support\Facades\FilamentAsset::getAlpineComponentSrc('slider', 'filament/forms') }}">
    </div>
</x-dynamic-component>

In the create page, I have the Slider field, but when the page is loaded I get this error: Alpine component with ID [slider] not found for package [filament/forms]. What am I missing? Can anyone help?

22 replies

FFilament

•Created by Matthew on 8/1/2024 in #❓┊help

filament contribution

21 replies

FFilament

•Created by Matthew on 8/1/2024 in #❓┊help

Why is filament clone so large?

6 replies

FFilament

•Created by Matthew on 7/29/2024 in #❓┊help

Modal wont close after you create a laravel Process

I've set to run a job after I submit the Action Modal. That job creates a process. After a job is created, the modal wont close automatically, and I also cant redirect (e.g. I cant visit the dashboard). How can I fix this?

20 replies

FFilament

•Created by Matthew on 7/24/2024 in #❓┊help

Using a wizard as a modal form

use Filament\Forms\Components\MarkdownEditor;
use Filament\Forms\Components\TextInput;
use Filament\Forms\Components\Toggle;
use Filament\Forms\Components\Wizard\Step;
 
Action::make('create')
    ->steps([
        Step::make('Name')
            ->description('Give the category a unique name')
            ->schema([
                CheckboxList::make('technologies')
                    ->options($data),
            ])
            ->afterValidation(function () {
                // ...

                if (true) {
                    throw new Halt();
                }
            }),
        Step::make('Description')
            ->description('Add some extra details')
            ->schema([
                MarkdownEditor::make('description'),
            ]),
        Step::make('Visibility')
            ->description('Control who can view it')
            ->schema([
                Toggle::make('is_visible')
                    ->label('Visible to customers.')
                    ->default(true),
            ]),
    ])

use Filament\Forms\Components\MarkdownEditor;
use Filament\Forms\Components\TextInput;
use Filament\Forms\Components\Toggle;
use Filament\Forms\Components\Wizard\Step;
 
Action::make('create')
    ->steps([
        Step::make('Name')
            ->description('Give the category a unique name')
            ->schema([
                CheckboxList::make('technologies')
                    ->options($data),
            ])
            ->afterValidation(function () {
                // ...

                if (true) {
                    throw new Halt();
                }
            }),
        Step::make('Description')
            ->description('Add some extra details')
            ->schema([
                MarkdownEditor::make('description'),
            ]),
        Step::make('Visibility')
            ->description('Control who can view it')
            ->schema([
                Toggle::make('is_visible')
                    ->label('Visible to customers.')
                    ->default(true),
            ]),
    ])

How can I check if at least 1 element is clicked on the checboxlist. If nothing is selected the next button should be disabled. Atm halt only blocks you from going to the next button, but its not disabled.

4 replies

FFilament

•Created by Matthew on 7/19/2024 in #❓┊help

ReferenceError: browser is not defined

I get this error in the console. Is this a laravel issue or a filament issue? Im using the brave browser

12 replies

FFilament

•Created by Matthew on 7/19/2024 in #❓┊help

Wizard feature suggestion

7 replies

FFilament

•Created by Matthew on 7/17/2024 in #❓┊help

404 error on create

11 replies

FFilament

•Created by Matthew on 4/25/2024 in #❓┊help

Github/Gitlab Actions

I want to make a github/gitlab action that checks if LOCM/SLOC *100% > 15% In other words, Percentage of lines of comments (% LOCM). Can anyone point me in the right direction?

4 replies

FFilament

•Created by Matthew on 4/17/2024 in #❓┊help

How can I change emptystate with the tabs?

class ListMovies extends ListRecords
{
    protected static string $resource = MovieResource::class;

    public function getTabs(): array
    {
        return [
            'all' => Tab::make()
                ->icon('heroicon-m-bars-arrow-down'),
            'Favorites' => Tab::make()
                ->icon('heroicon-o-star')
                ->modifyQueryUsing(function (Builder $query) {
                    $userFavorites = Auth::user()->favorites ?? [];

                    return $query->whereIn('id', $userFavorites);
                }),
            'Downloaded' => Tab::make()
                ->icon('heroicon-m-folder-arrow-down'),
            // ->modifyQueryUsing(fn (Builder $query) => $query->where('active', false)),
        ];
    }
}

class ListMovies extends ListRecords
{
    protected static string $resource = MovieResource::class;

    public function getTabs(): array
    {
        return [
            'all' => Tab::make()
                ->icon('heroicon-m-bars-arrow-down'),
            'Favorites' => Tab::make()
                ->icon('heroicon-o-star')
                ->modifyQueryUsing(function (Builder $query) {
                    $userFavorites = Auth::user()->favorites ?? [];

                    return $query->whereIn('id', $userFavorites);
                }),
            'Downloaded' => Tab::make()
                ->icon('heroicon-m-folder-arrow-down'),
            // ->modifyQueryUsing(fn (Builder $query) => $query->where('active', false)),
        ];
    }
}

So if no records are found, how can I change the description for each different tab? Is it even possible?

4 replies

Gaming

Programming