Proposal: component to handle form collections

[jmsche]

It would be nice if there was some available JS in the ux components to add basic stuff to handle form collections (add & remove) :)

[kriskoch]

100%. Literally the first thing I thought of when I ready the post was "I wonder if they did this whole initiative just to make UX easier with form collections"

[benr77]

Same for me - form collections were my first thought when hearing about the UX

Has there been any movement on this issue anywhere?

[tgalopin]

Not yet but we are open to contribs :) !

[stakovicz]

Hi everyone,

I just made my first Symfony bundle which should meet your need.
I would like to develop it further and why not propose it to the community.
What do you think ?
https://github.com/stakovicz/ux-collection

Here you have the demo code:
https://github.com/stakovicz/ux-collection-test

[benr77]

@stakovicz Awesome work - I took a quick look at the bundle and it looks good! I will try and test it out in a project of mine later this week.

[daFish]

@stakovicz I just tested your bundle in an application of mine. At first glance it worked pretty good. Just install, change the form type and you're good to go.

It would be great if we could be able to customize the way entries are added, e.g. if you want to use tables. Otherwise good work. 👍

[stakovicz]

@stakovicz I just tested your bundle in an application of mine. At first glance it worked pretty good. Just install, change the form type and you're good to go.

It would be great if we could be able to customize the way entries are added, e.g. if you want to use tables. Otherwise good work. 👍

Thanks, I'll see what I can do.

[benr77]

Just install, change the form type and you're good to go

This is great! Low entry barrier to using the bundle :)

[stakovicz]

Hi @tgalopin,

What do you think of my bundle?
https://github.com/stakovicz/ux-collection

What would be missing to integrate it into Symfony UX?

[tgalopin]

Hey @stakovicz !

I didn't have much time to review it in details, but I see that you are already using Symfony UX :) ! The plug and play behavior isn't linked to the Symfony namespace, your bundle already is integrated with Symfony UX.

Regarding putting it under the Symfony namespace, it does seem to be a great fit and a well implemented bundle, I'd be happy to review a PR to add the component.

I'd probably name it UX Form Collection (UX Collection is maybe a it too generic).

[jmsche]

Hi @stakovicz,

One thing I think your package is missing is handling an other prototype name than __name__, which can be useful for nested form collections.

[stakovicz]

Hey @stakovicz !

I didn't have much time to review it in details, but I see that you are already using Symfony UX :) ! The plug and play behavior isn't linked to the Symfony namespace, your bundle already is integrated with Symfony UX.

Regarding putting it under the Symfony namespace, it does seem to be a great fit and a well implemented bundle, I'd be happy to review a PR to add the component.

I'd probably name it UX Form Collection (UX Collection is maybe a it too generic).

Hi @tgalopin,

Thanks for your support !

I do the changes for the namespace and the name here :
stakovicz/ux-collection@e3922b3

But I don't know how I can make PR on a bundle that doesn't exist.

[richardhj]

But I don't know how I can make PR on a bundle that doesn't exist.

Create a new folder inside src/ within this repository and copy your bundle inside this folder :-)
(The namespace must match, see the composer.json of other bundles inside this monorepo)
The src/ folder will be split into individual repos.

[stakovicz]

Thanks @richardhj !

I did my first PR 🥳

[stakovicz]

One thing I think your package is missing is handling an other prototype name than __name__, which can be useful for nested form collections.

@jmsche you would like to have an attribute to use a custom placeholder __name__ ?

[jmsche]

One thing I think your package is missing is handling an other prototype name than __name__, which can be useful for nested form collections.

@jmsche you would like to have an attribute to use a custom placeholder __name__ ?

I'm not sure I understand the question.

You should be able to pass the prototype name from the Form Type to the view, then it will be available in the form vars, so you can pass it from the view to JS using a data attribute.

I hope it answers your question :)

[stakovicz]

@jmsche I'm not sure about that you want :)

Has you can see here :
https://github.com/stakovicz/ux/blob/main/src/FormCollection/Resources/assets/src/controller.js#L62-L68
the __name__ is replace by the index.
So you want to manipulate it ?

[jmsche]

The idea is to pass the prototype name from the Form Type to the view and finally to JS like this:

• In Form Type: add prototype name to view vars in buildView()
• In template: add a data-{{ controllerName }}-prototype-name attribute with the value coming from view vars
• In JS: use this data attribute value instead of __name__

[stakovicz]

@jmsche I've removed the hard coded property_name value.
I use a Stimulus value passed from the view to the JS.