rappasoft / laravel-livewire-tables

A dynamic table component for Laravel Livewire
https://rappasoft.com/docs/laravel-livewire-tables/v2/introduction
MIT License
1.79k stars 340 forks source link

[Bug]: DOM rare issue, datatablecomponent dissapears version 3 #1429

Closed solusoftek closed 1 year ago

solusoftek commented 1 year ago

What happened?

On version 3-beta when update an attribute on model, Datatable Dissapears, this on nested component review all my code for div's unclosed, nothing found, evrething it's ok, beside only affects to datatable,

Structure -Main Component --Component Master -----Child 1 Component => DatatableComponent -----Child 2 Component => DatatableComponent

   <div x-show="xTab === 1" class="w-full">  <=== Calling child Component From Master
        <livewire:admin.config.catalogs.brands wire:key="ePM9iIzYh3"/>
   </div>

    <div class="w-full"> <=== Calling Datatable Component From Child
           <livewire:admin.config.catalogs.tables.brand-table wire:key="$tableWireKey"/>
     </div>

 public function createNewBrand() <==Creating Model Form, After this atribute changes datatable component dissapears
{
          $this->showBrandCreationModal = true;
}

Also test with other component no modal, same event

WorkAround: Run php artisan vendor:publish --provider="Rappasoft\LaravelLivewireTables\LaravelLivewireTablesServiceProvider" --tag=livewire-tables-views Adding Root DIVS to datatable.blade.php fix the issue

<div> <== Adding
    <x-livewire-tables::wrapper :component="$this" :tableName="$tableName">
         ....
    </x-livewire-tables::wrapper>
</div>

How to reproduce the bug

Create 3 Components and nested on this structure

-Level 1 --Level 2 --- Level 3 <= Create DatatableComponent on this level

Package Version

dev-v3-master

PHP Version

8.1.x

Laravel Version

10.10

Alpine Version

3.13.0

Theme

Tailwind 3.x

Notes

this probably can be caused by my code, am concience of that

Error Message

No response

lrljoe commented 1 year ago

Make sure that any wire keys are unique

Also ensure that the table name is unique, as this is used for wire keys within the table.

If this is the case, then let me know and I'll try to replicate.

solusoftek commented 1 year ago

Make sure that any wire keys are unique

Also ensure that the table name is unique, as this is used for wire keys within the table.

If this is the case, then let me know and I'll try to replicate.

Hi, yes, the wire keys are unique, the table names are unique, the only fix was adding root divs on datatable.blade, in fact, i had this structure working on version 2 with no issues. another information that maybe helps, i dont use legacy model on, i use a Synth for hydra/deshydrate, but from my pov not shouldnt affects, thanks

lrljoe commented 1 year ago

I'll take a look.

I do have a view that has 10 tables in it as child components, without modifying the views, so will need to do some digging!

If you can share the full content of your parent blade then that will help me figure out what isn't quite right

lrljoe commented 1 year ago

@solusoftek - if this is still happening, then the content of your parent blade will help diagnose the issue. Please re-open if it is still happening