dcasia/column-toggler

Resource loading issue.

philipbaginski opened this issue · 23 comments

Hi!

First of all thank you so much for this package. It helps a lot to show/hide columns. I have just installed package inside brand new Nova 4.23 with Laravel 9.5 and there is one thing I would like to ask about: When I'm going to resource index view and index table is being loaded, it looks fine. But when index table is loaded, just in the same second is reloaded again. I checked this behavior of index table with more resources and all of them behave the same. Index table is loaded and loaded again. Is it normal for this package or it is a issue?

No, this isn't happening on my end, maybe other package you may have is interfering with it? Can you send what you have on your composer json file?

Also before it reloads, do you see columns that should be hidden? And then after reload they are hidden again?

Try again the latest version v0.0.9 I might have found the reason

Thank you. Now index view is loaded at once. No reloading.

But, it looks like on the relations it does not show now - the button with toggle options. I have relations belongsTo - hasMany and in any place of app I can not see toggle button.

I have the following in my test project and it is showing...

class User extends Resource
{
    public function fields(NovaRequest $request): array
    {
        return [
            HasMany::make('Articles', 'articles', Article::class),
        ];
    }
}

image

Is your resource set up differently?

What is the output of this when you copy/paste to the console?

$('[dusk$="-index-component"] div.h-9.ml-auto.flex.items-center.pr-2.md\\:pr-3 > div.hidden.md\\:flex.px-2')

image

Relation I have the same set up and output the same. I will down grade into previous version and see how it looks.

After downgrade to 0.0.8 version toggle button is showing on every relation.

After upgrading to version 0.0.9 the same issue - no toggle button on relations.

The only reason the toggle button may not appear is if somehow this function fails to locate this element:

$('[dusk$="-index-component"] div.h-9.ml-auto.flex.items-center.pr-2.md\\:pr-3 > div.hidden.md\\:flex.px-2')

Can you double check if you can see this element on the relationship page?

Another thing I changed on the last version is the button will be hidden if your table is empty.. since when it is empty and you try to toggle it would result in the table reloading unnecessarily, so you need to have atleast 1 resource in order for the toggle button to appear

Okay. Tested version 0.0.9 and I found issue: when I have relation displayed inside some resource it will not show toggle button. The index table of relation is displayed by default. But if I will use collapsable option and hide index view of relation and show again, the toggle button will appear. Any idea what is wrong?

It looks like it is null when the page loads: https://github.com/dcasia/column-toggler/blob/main/resources/js/tool.js#L42 when you hide/show it will re-run this function and on the second time it will render the button toggle correctly

So, why it works in 0.0.8 version?

Can you try v0.0.10, if it still doesn't work can you give me an easy copy/paste example so I can replicate the issue locally? so far I have not been able to replicate

Tested with version 10 and it looks the same. Downgraded to 8 and it works fine (relations). Will try with fresh Nova install and see how it looks.

Tested with fresh Nova 4.23 Everything works perfect. So, the problem is on my side. Version 8 works, version 9 and 10 does not - speaking about relations. That is start point.

Can you post your composer.json it could be another package that is interfering with it...

"require": { "php": "^8.0.2", "badinansoft/nova-language-switch": "^1.1", "badinansoft/nova-tooltip": "^1.0", "barryvdh/laravel-dompdf": "^2.0", "barryvdh/laravel-snappy": "^1.0", "calebporzio/parental": "^1.3", "coroowicaksono/chart-js-integration": "^0.4.0", "degecko/nova-filters-summary": "^2.0", "digital-creative/column-toggler": "^0.0.8", "eminiarts/nova-tabs": "^2.2", "guzzlehttp/guzzle": "^7.2", "harrald/nova-combobox-filter": "^1.0", "interaction-design-foundation/nova-html-card": "^3.0", "kiritokatklian/nova-permission": "^4.0", "laravel/framework": "^9.2", "laravel/nova": "4.23.0", "laravel/sanctum": "^2.14.1", "laravel/tinker": "^2.7", "marshmallow/live-update": "^2.0", "mostafaznv/nova-video": "^3.0", "norman-huth/nova-iframe-popup": "^1.0", "oneduo/nova-file-manager": "^0.8.0", "outl1ne/nova-detached-filters": "^2.0", "outl1ne/nova-inline-text-field": "^2.0", "outl1ne/nova-multiselect-filter": "^4.0", "outl1ne/nova-notes-field": "^3.0", "outl1ne/nova-sortable": "^3.4", "rosamarsky/nova-range-filter": "^1.0", "ryanito/nova-country-flag": "^1.0", "shuvroroy/nova-dynamic-views": "^1.0", "simonhamp/laravel-nova-csv-import": "^0.4.0", "slash2nl/nova-back-button": "^2.0", "spatie/laravel-permission": "^5.5", "sprigs/expandable-row": "^0.0.5", "trin4ik/nova-switcher": "^0.3.0" },

Also I have a question regarding Stack field in Nova: toggle column works for all Stack field, but if I want to show/hide field inside Stack field it does not work. Also I tested case: Two fields with the same column name I.e. position, but different Field name I.e. Position and Position Update. First field is Text field, another is Liveupdate field. Second one I want only show when I need to update all models on index view. By default is hidden. In this case toggle filter see only one field, based on column name.

I believe the issue might be related to this package: https://github.com/shuvroroy/nova-dynamic-views. How are you using it? Since it completely overrides the index Vue (instead of extending it), it causes the column-toggler to not wait for the correct event to happen before injecting itself onto the page: https://github.com/shuvroroy/nova-dynamic-views/blob/main/resources/js/tool.js#L10.

The reason why v8 works and v9 doesn't is the same as you described when toggling the panel on and off. In v8, there was a delay that caused the page to render first, and then after the delay, it would rerun the logic and refresh the resource table. As long as the logic runs after the index file is overwritten, it's fine. However, due to that package, it may run too early, and therefore, it doesn't detect the resource index component.

Also I have a question regarding Stack field in Nova: toggle column works for all Stack field, but if I want to show/hide field inside Stack field it does not work. Also I tested case: Two fields with the same column name I.e. position, but different Field name I.e. Position and Position Update. First field is Text field, another is Liveupdate field. Second one I want only show when I need to update all models on index view. By default is hidden. In this case toggle filter see only one field, based on column name.

The stack field is considered a single field from the frontend point of view so wouldn't be possible to toggle just a single element from it with the current logic of this package...

And having 2 fields with the same name is fine the problem is having 2 fields with the same attribute, Field::make(name, ATTRIBUTE) the attribute is used as the unique key of each column if you have duplicates only the first match would be seen...

I have a question regarding this package https://github.com/dcasia/expandable-table-row and there is no option to ask question without opening issue, what I do not want to do, so I will ask here, if I can: This package helps to extend row on index view and show selected fields inside extra row. Is it possible to show inside extended row relation? On detail view I have relation hasMany and want to show this relation inside extended row the same way it is displayed on detail page - as table with rows, just without table header ( search field and tools). Is it something this package can handle?

Lol you still can open an issue to ask questions... but anyways that package does not support showing a full resource table when it is expanded.. but I think it might be possible if you create a custom field that is actually a table etc.. since what is shown when you expand is whatever field you feed it with..