Add filter and group support

[janpeterka]

Hi, I started to play with this, and I stumbled on missing filter and group support.

Filter is not so needed, I was for my case able to solve that. For moving items between lists I need the group attribute however. Is it possible to add that? I can create PR, but have no experience with ts, so I don't know how to test it end everything..

Thanks for reply, and thanks for these controllers!

---

In case someone needs this functionaly, it's possible to implement with something like this:

export default class extends Sortable {
  initialize() {
    super.initialize()
    this.onAdd = this.onAdd.bind(this)
  }

  connect() {
    super.connect()
    console.log("SortableController connected")
  }

  get options() {
    let options = super.options
    options["group"] = this.element.dataset.sortableGroupValue
    options["onAdd"] = this.onAdd
    options["onRemove"] = this.onRemove

    return options
  }

  async onAdd(event) {
    // For now, as I only use this for recipes in DailyPlans, this calls "move".
    const { item, newIndex } = event
    const listId = this.element.dataset.sortableListId
    const moveUrl = item.dataset.sortableMoveUrl

    const param = this.resourceNameValue ? `${this.resourceNameValue}[${this.paramNameValue}]` : this.paramNameValue

    const data = new FormData()
    data.append(param, newIndex + 1)
    data.append("daily_plan_id", listId)

    return await patch(moveUrl, { body: data, responseKind: this.responseKindValue })
  }

}

onAdd and onRemove are Sortable functions for moving items between lists. I used most of code from onUpdate for this, with few changes:

• I need id of the list item is moved to, so I just add that to ul element. It could be generalized more, but I didn't do that.
• In my case, I don't need separate add/remove actions, I can call move endpoint that just changes element attribute. So I only define data-sortable-move-url on my <li> item, as I'm basically PATCHing this resource.