KeyValue Sorting Capabilities are broken

[fabrizzio-dotCMS]

Describe the bug

If you add elements to a key value then save then reorder them via drag and drop. Then save again. The new version doesn't get saved respecting the new order of the elements.

The bug is reproducible in master and demo.

To Reproduce

Steps to reproduce the behavior:

1. Create a CT with a KeyValue Field
2. Create an instance of that CT. And fill the key-value field with keys like 1,2,3 (The values are not important on this test).
3. Save the content. And Close the dialog
4. Re-Open the dialog. Then change the order of the elements on the KeyValue Via Drag-and-drop. Hit Save again.
5. Close the dialog again. And Re-Open.
6. Verify the new order established in step 4. Is lost

Expected behavior

You should be able to change the order of the elements on the UI save and recover the pre-established order.

Screenshots

I believe the bug originated due to a change introduced in the class JSONObject

Where the inner map implementation was changed from LinkedHashMap into a plain HashMap

Acceptance criteria

• We should be able to manipulate the order of the elements added to the KeyValue

[fabrizzio-dotCMS]

PR: https://github.com/dotCMS/core/pull/22997

[nollymar]

Internal QA: Passed

I was able to sort key/values once and again without issues

[josemejias07]

Failed QA - Tested on 22.10_a3659b56_SNAPSHOT // Docker // macOS 12.6 FF v105

Sorting animation is not looking as intended on all browsers. FireFox animation is looking different from Chrome's.

See below FF

Chrome

[alfredo-dotcms]

@note to QA: This is using native browser Drag and Drop animation, it's not something we can control with current implementation.

[josemejias07]

Approved QA with note - Tested on 22.10_53380a7c_SNAPSHOT // Docker // macOS 12.6 FF v105

Note from Dev: This is using native browser Drag and Drop animation, it's not something we can control with current implementation.