isaacHagoel / svelte-dnd-action

An action based drag and drop container for Svelte
MIT License
1.8k stars 104 forks source link

Issues rendering and dragging nested entries with two arrays #611

Open prengaiah opened 1 week ago

prengaiah commented 1 week ago

Hi,

I have a requirement that expects a domain model and behavior as below -

Collection is the root object. It contains an array of "Category" entries. These entries can be rearranged. Each category contains two array attributes besides id. They are "items" and "children". Items array can contain one or more CategoryItem. Each CategoryItem has an array attribute called "children". Children array can contain one or more Category objects both at the Category level and at CategoryItem level.

Here is the REPL link of a sample implementation - https://svelte.dev/repl/84ab5ed6768645878ff4aebad7eb65b7?version=4.2.19

There are few problems that I am facing -

  1. I am sure there is some silly mistake, but when I run the code, it doesn't render the entire tree. For example, the Category "category - 2" should show up under "category - 1" as one of the "child" entry.
  2. Dragging any of the "Category" objects and trying to drop at another Category or Item throws getBoundingClientRect error and screen freezes.

Any help pointing issues in my implementation would be helpful.

Thanks.

isaacHagoel commented 1 week ago

i gave it a quick glance and noticed there aren't any on:consider or on:finalize handlers, instead there is on drop which the lib doesn't fire

On Fri, Oct 18, 2024 at 5:11 PM Param Rengaiah @.***> wrote:

Hi,

I have a requirement that expects a domain model and behavior as below -

Collection is the root object. It contains an array of "Category" entries. These entries can be rearranged. Each category contains two array attributes besides id. They are "items" and "children". Items array can contain one or more CategoryItem. Each CategoryItem has an array attribute called "children". Children array can contain one or more Category objects both at the Category level and at CategoryItem level.

Here is the REPL link of a sample implementation - https://svelte.dev/repl/84ab5ed6768645878ff4aebad7eb65b7?version=4.2.19

There are few problems that I am facing -

  1. I am sure there is some silly mistake, but when I run the code, it doesn't render the entire tree. For example, the Category "category - 2" should show up under "category - 1" as one of the "child" entry.
  2. Dragging any of the "Category" objects and trying to drop at another Category or Item throws getBoundingClientRect error and screen freezes.

Any help pointing issues in my implementation would be helpful.

Thanks.

— Reply to this email directly, view it on GitHub https://github.com/isaacHagoel/svelte-dnd-action/issues/611, or unsubscribe https://github.com/notifications/unsubscribe-auth/AE4OZC4OUACN6VPY6GD2W4LZ4CRATAVCNFSM6AAAAABQFG2XB2VHI2DSMVQWIX3LMV43ASLTON2WKOZSGU4TMNJSGM2DQMI . You are receiving this because you are subscribed to this thread.Message ID: @.***>

prengaiah commented 1 week ago

My bad, was following a guide and didn't notice missing on:consider or and on:finalize. Will modify my code and test it. Thanks for the quick response.