SearchKit - Add drag-sortable weight functionality

[colemanw]

Overview

Allows SearchKit table displays to be drag-sortable.

Before

This is with an eye toward replacing those godawful tables in core that look like this:

After

To recreate that table without the awfulness, create a search display and enable the new "Drag and drop sorting" option (this is only available for entities with a "weight" column).

And the result will be a sortable table:

Technical Details

Drag-sortable weights are similar to in-place edit in that it uses the API to update records in the table. In this case it updates the "weight" column when the user drags a row into a different position.

[civibot]

(Standard links)

• If this is your first pull-request for CiviCRM, please browse CONTRIBUTING.md for information about the development and testing processes.
• If you are reviewing this pull-request, you may wish to consult the test sites and the Review Standards (long template, short template).

[demeritcowboy]

I like the idea - have definitely had the experience of clicking 800 times to reorder a list. But am running into a few issues.

1. Locally when I try to save the search I get

Possibly unhandled rejection: {"error_code":0,"error_message":"A non-numeric value encountered"} angular.js:15697:41
    Angular 7
        consoleLog
        get
        processChecks
        $digest
        evalAsync
        completeTask
        timeoutId

This is the search: civicrm/admin/search#/create/OptionValue?params={"version":4,"select":["id","name","label","value","weight"],"orderBy":{},"where":[["option_group_id:name","%3D","activity_type"]],"groupBy":[],"join":[],"having":[]}

It does save on the test site here.

2. It doesn't seem to respect the pager size limit (might be a separate issue). It says 50 but starts off showing 55 (search listing of option values for activity type).

3. I increased the pager size to include all, then dragged Interview above Meeting so it was the first in the list. Then I went to create a new activity - it's not first in the list. It does set the weight to 1, but it doesn't reorder Meeting so that it's second.

[demeritcowboy]

Just looping back on this:

You can ignore number 1. It helps if you run civi upgrades on the correct site. (Problem was UPDATE civicrm_managed SET entity_modified_date = CURRENT_TIMESTAMP WHERE entity_type = 'SavedSearch' AND entity_id = 10 [nativecode=1054 ** Unknown column 'entity_modified_date' in 'field list'])

You can ignore number 2. I was confused.

So just number 3, with an additional comment that the current screen's buttons for "move to top" and "move to bottom" are often convenient whereas dragging an entry across a long list that scrolls off-screen is less convenient. So it would be nice to keep those two shortcuts.

[colemanw]

@demeritcowboy belated thanks for the review. I incorrectly assumed that the BAO was handling weight adjustments, but it turns out to have been implemented at the quickform layer, so I'm going to have to add it to APIv4. PR for that incoming.

I also wasn't happy with the ajax saving mechanics, so have added another PR to improve that: #22125 - will rebase this PR once that one is merged.

I'm a bit stumped about how to do both drag-n-drop and "move to top/bottom" buttons in the same UI. Maybe we can just get the drag-n-drop working for now and ponder the other.

[demeritcowboy]

Ok thanks will take a look.

[colemanw]

Thanks @demeritcowboy - here is the other promised PR to add the weight-adjustment functionality: #22137

[colemanw]

@demeritcowboy all the prerequisites for this have been merged :)

[demeritcowboy]

jenkins retest this please (checking since patch doesn't apply locally for me)

[colemanw]

@demeritcowboy rebased.

[demeritcowboy]

I tried this out again and it looks pretty good.

A good technique for dragging over long lists seems to be to add the Order field to the display, then check the box for in-place edit. Then you can quickly move a row to the nth row.

Now just needs an undo feature...(grin)