Open-Assistant
Open-Assistant copied to clipboard
Use DnDKit for all ranking tasks
Ranking tasks #33 #34 implemented in #127 and #154 use simple up / down buttons for ranking the items.
Use Drag and drop with https://dndkit.com/ to create a more interactive and pleasing experience for the user. Make sure it works on touch devices.
The modifications should be (in theory) constrained to the Sortable.tsx
component.
Questions:
- what happens when the text that should be ranked is too long that it covers the entire screen of a small smartphone?
For text that's too long, can we have a button to collapse it and only show the first X characters?
I'm interested in taking on this task. Initially I thought I'd just use dnd-kit/sortable to replace the arrow buttons and reimplement the existing sort functionality and then try to improve the ux for smaller/touch screens, making one PR so long as that is simple.
dnd-kit appears to have a specific sorting extension, I figured that should be used.
I assume that the arrows are not required if drag and drop works, please let me know if that is not the intent.
I assume that the arrows are not required if drag and drop works, please let me know if that is not the intent.
Exactly. Yeah when it was built we didn't realize we wanted DnD. The arrows should go away and there should be a drag handle. Something like RxDragHandleDots2 or MdDragHandle. On the left or right side is debatable. (both?)
Oops, just realized that @AbdBarho had already self assigned this issue and has a branch (dnd) which is further ahead and appears to have touch support. Anyway I've pushed my changes to my fork in case any of it is of any use (https://github.com/LAION-AI/Open-Assistant/compare/main...othrayte:Open-Assistant:dnd-ranking?expand=1).
@othrayte thanks for wanting to contribute! I think the points that @k-nearest-neighbor mentioned are still open, with drag handles and styling and such. also what @fozziethebeat mentioned for the long text #190.
Feel free to improve what I did, as it was just a skeleton and not final by any means.
@AbdBarho I created an issue for the drag handles (#223), I'm happy to take that on if someone wants to triage/cleanup the issue tags and assign me.