search

ariaieboy / filament-currency

Enhanced Currency Related stuff for Filament
MIT License
42 stars 8 forks source link

[Bug]: Using currencyMask in a form inside a Repeater that uses afterStateUpdated() causes livewire loop #39

Closed mendozal closed 1 month ago

mendozal commented 1 month ago

What happened?

I have a repeater that runs a function on the repeater's afterStateUpdate().

This function calculates totals and also updates a field inside the repeater's line that's called "total". This total field has a currencyMask().

The issue is that updating the "total" field from the afterStateUpdate() callback triggers an infinite series of posts to /livewire/update. This doesn't happen when I remove the currencyMask() function.

It seems as if updating the total field triggers a currency format, and this in turn triggers the afterStateUpdate again and so on.

How to reproduce the bug

Create a repeater maybe liket his:

Forms\Components\Repeater::make('items')
    ->schema([
            Forms\Components\TextInput::make('total')
                ->label('Total')
                ->dehydrated(false)
                ->disabled()
                ->default(0)
                ->currencyMask(thousandSeparator: '.', precision: 0)
                ->prefix(fn(Get $get): string => config("money.currencies.{$get('../../moneda')}.symbol"))
                ->columnSpan(2),
    ])
    ->afterStateUpdated(fn(Get $get, Set $set, $state) => self::calculateTotals($get, $set, $state))

    protected static function calculateTotals(Get $get, Set $set, $state)
    {
        $x = 0;
        foreach ($state as $index => $item) {
            $x++;
            $set("items.{$index}.total", 5000);
            logger($x);
        }
    }

I created this function to test. It automatically sets the value to 5000 which trigger the infinite loop thing.

Please notice that if I set a value below 1000, for example 999 or 50, it doesn't seem to trigger this behavior. Since it doesn't seem to need to format the string.

Check the output of php artisan serve:

2024-08-08 15:59:44 /css/filament/support/support.css?v=3.2.97.0 ...................................................................................................... ~ 0.08ms 2024-08-08 15:59:44 /css/filament/filament/app.css?v=3.2.97.0 ......................................................................................................... ~ 0.04ms 2024-08-08 15:59:44 /js/filament/notifications/notifications.js?v=3.2.97.0 ............................................................................................ ~ 0.02ms 2024-08-08 15:59:44 /js/filament/support/async-alpine.js?v=3.2.97.0 ................................................................................................... ~ 0.02ms 2024-08-08 15:59:44 /js/filament/support/support.js?v=3.2.97.0 ........................................................................................................ ~ 0.02ms 2024-08-08 15:59:44 /js/filament/filament/echo.js?v=3.2.97.0 .......................................................................................................... ~ 0.02ms 2024-08-08 15:59:44 /js/filament/filament/app.js?v=3.2.97.0 ........................................................................................................... ~ 0.02ms 2024-08-08 15:59:44 /js/filament/forms/components/select.js?v=3.2.97.0 ................................................................................................ ~ 0.02ms 2024-08-08 15:59:44 /favicon.ico ...................................................................................................................................... ~ 0.04ms 2024-08-08 15:59:47 /livewire/update .................................................................................................................................. ~ 0.18ms 2024-08-08 15:59:47 /livewire/update .................................................................................................................................. ~ 0.04ms 2024-08-08 15:59:47 /livewire/update .................................................................................................................................. ~ 0.02ms 2024-08-08 15:59:47 /livewire/update .................................................................................................................................. ~ 0.04ms 2024-08-08 15:59:47 /livewire/update .................................................................................................................................. ~ 0.07ms 2024-08-08 15:59:48 /livewire/update ................................................................................................................................ ~ 500.27ms 2024-08-08 15:59:48 /livewire/update .................................................................................................................................. ~ 0.04ms 2024-08-08 15:59:48 /livewire/update .................................................................................................................................. ~ 0.02ms 2024-08-08 15:59:48 /livewire/update .................................................................................................................................. ~ 0.04ms 2024-08-08 15:59:48 /livewire/update .................................................................................................................................. ~ 0.02ms 2024-08-08 15:59:48 /livewire/update .................................................................................................................................. ~ 0.04ms 2024-08-08 15:59:48 /livewire/update .................................................................................................................................. ~ 0.04ms 2024-08-08 15:59:48 /livewire/update .................................................................................................................................. ~ 0.04ms 2024-08-08 15:59:48 /livewire/update .................................................................................................................................. ~ 0.08ms 2024-08-08 15:59:48 /livewire/update .................................................................................................................................. ~ 0.06ms 2024-08-08 15:59:48 /livewire/update .................................................................................................................................. ~ 0.04ms 2024-08-08 15:59:48 /livewire/update .................................................................................................................................. ~ 0.04ms 2024-08-08 15:59:48 /livewire/update .................................................................................................................................. ~ 0.04ms 2024-08-08 15:59:48 /livewire/update .................................................................................................................................. ~ 0.05ms 2024-08-08 15:59:48 /livewire/update .................................................................................................................................. ~ 0.05ms 2024-08-08 15:59:49 /livewire/update ................................................................................................................................ ~ 500.39ms 2024-08-08 15:59:49 /livewire/update .................................................................................................................................. ~ 0.07ms 2024-08-08 15:59:49 /livewire/update .................................................................................................................................. ~ 0.04ms 2024-08-08 15:59:49 /livewire/update .................................................................................................................................. ~ 0.04ms 2024-08-08 15:59:49 /livewire/update .................................................................................................................................. ~ 0.04ms 2024-08-08 15:59:49 /livewire/update .................................................................................................................................. ~ 0.04ms 2024-08-08 15:59:49 /livewire/update .................................................................................................................................. ~ 0.04ms

Package Version

1.8.1

PHP Version

8.3.10

Laravel Version

11.20.0

Which operating systems does with happen with?

Linux

Notes

No response

ariaieboy commented 1 month ago

@mendozal I can't reproduce this bug please create a public repo with the minimum amount of code that reproduces this bug send the link here and mention me so I reopen this issue.

mendozal commented 1 month ago

Hi @ariaieboy

This is the repository https://github.com/mendozal/filament-money-test

username: admin@test.com password: password

Please enter an amount that can be formatted in the Item Amount field (starting 1,000)

Once formatted, the output of the php artisan serve command should show infinite livewire/update calls. And if you remove the currencyMask function from the second repeater component, it doesn't do it.

mendozal commented 1 month ago

Hi @ariaieboy

I noticed that this new release fixed the issue where infinite livewire/update calls were made.

But now I noticed that if the live() field (the one that causes the afterStateUpdated) has a currencyMask, it's basically rendered as not being live() and doesn't trigger any livewire/update at all.

I updated the github repository if you'd like to test. The steps are to enable and disable the currencyMask on the "itemAmount" field and see the effects.

ariaieboy commented 1 month ago

Hi @ariaieboy

I noticed that this new release fixed the issue where infinite livewire/update calls were made.

But now I noticed that if the live() field (the one that causes the afterStateUpdated) has a currencyMask, it's basically rendered as not being live() and doesn't trigger any livewire/update at all.

I updated the github repository if you'd like to test. The steps are to enable and disable the currencyMask on the "itemAmount" field and see the effects.

test https://github.com/ariaieboy/filament-currency/releases/tag/1.8.3

mendozal commented 1 month ago

Hi @ariaieboy I noticed that this new release fixed the issue where infinite livewire/update calls were made. But now I noticed that if the live() field (the one that causes the afterStateUpdated) has a currencyMask, it's basically rendered as not being live() and doesn't trigger any livewire/update at all. I updated the github repository if you'd like to test. The steps are to enable and disable the currencyMask on the "itemAmount" field and see the effects.

test https://github.com/ariaieboy/filament-currency/releases/tag/1.8.3

Now the last issue is fixed, but the infinite livewire/update issue is back.

ariaieboy commented 1 month ago

@mendozal test 1.8.4

mendozal commented 1 month ago

@mendozal test 1.8.4

Working fine now. Thanks!