Image ordering in sidebar using sorting options

[divyabaid16]

Fixes #638 (<=== Add issue number here)

Make sure these boxes are checked before your pull request (PR) is ready to be reviewed and merged. Thanks!

GIF for the same:

• PR is descriptively titled 📑 and links the original issue above 🔗
• tests pass -- look for a green checkbox ✔️ a few minutes after opening your PR -- or run tests locally with rake test
• code is in uniquely-named feature branch and has no merge conflicts 📁
• screenshots/GIFs are attached 📎 in case of UI updation
• ask @publiclab/reviewers for help, in a comment below

Thanks!

[codeclimate]

Code Climate has analyzed commit 1a01d3f and detected 0 issues on this pull request.

View more on Code Climate.

[codecov]

Codecov Report

❗ No coverage uploaded for pull request base (main@5673c03). Click here to learn what that means.
The diff coverage is n/a.

@@           Coverage Diff           @@
##             main     #640   +/-   ##
=======================================
  Coverage        ?   41.36%           
=======================================
  Files           ?       34           
  Lines           ?     1308           
  Branches        ?        0           
=======================================
  Hits            ?      541           
  Misses          ?      767           
  Partials        ?        0

[divyabaid16]

@publiclab/mapknitter-reviewers

[divyabaid16]

Hey @jywarren @gauravano @sashadev-sky please review this PR.
And also #640

Thanks!

[jywarren]

Hi!! Thank you @divyabaid16 !! This looks amazing. I'm interested in how UI/UX of this interacts with the ordering of images in the map itself. Are they always the same? Does sorting the list sort the map? cc @sashadev-sky

[sashadev-sky]

@jywarren @divyabaid16 no it does not! I think this is ok for this one. But we do need to be more conscious about making sure mapknitter functionality is properly plugged into LDI. for example the #591 bug, might be because we delete the image from the client side but not the mapknitter end (and we just recently added a deletion feature on the mapknitter server side thats separate). Haven't personally looked into that one though, but as we start adding features to the sidebar we should also start taking them out of the toolbar. eventually toolbar might even be gone completely. For this just need to complete work on custom toolbars via @rexagod

[divyabaid16]

Are they always the same? Does sorting the list sort the map?

Currently, sorting is done only for the sidebar. Here, the user can only order the images in the sidebar.

[sashadev-sky]

@divyabaid16 This is really awesome! I think it's ready to go, I just made some refactoring comments to move the styling into a css file.

@divyabaid16 @jywarren I think how the ordering effects image ordering would be a new issue to open for discussion, because the order people like the images in the sidebar isn't necessarily the stacking order they would want them in right?

[divyabaid16]

I have made the changes @sashadev-sky have a look at it.
Thanks!

[sashadev-sky]

@divyabaid16 thank you 😊 that refactoring looks good

There are 2 other things I just noticed that are more broad:

• Changing the ordering in the sidebar results in a page refresh and also takes the user out of the images tab - maybe consider implementing this in JS like you did in drag and drop.
• There could be some sort of update to the images tab specifying what you are actually sorting by currently. Because there is no way to tell.

Let me know what you think!

[divyabaid16]

I'm working on it @sashadev-sky
Thanks!

[divyabaid16]

@sashadev-sky
When I'm working with ajax, the query on warpables is working properly but somehow I get the warpables is not sorted in the correct order in the database.
Sorting in view is happening properly.

[divyabaid16]

@sashadev-sky so is it fine if we just implement the second point?

There could be some sort of update to the images tab specifying what you are actually sorting by currently. Because there is no way to tell.

[sashadev-sky]

@divyabaid16 I think its ok to just open an issue suggesting the 2nd point! @jywarren

[divyabaid16]

@sashadev-sky @jywarren
Okay, then I will create a PR addressing the second point when this is merged.

[codeclimate]

The PR diff size of 7414 lines exceeds the maximum allowed for the inline comments feature.

[divyabaid16]

I have rebased the PR.
Can this be merged now?

[jywarren]

Hi! sorry this took a while to circle back to. In #693 will it use the re-ordering from here to send up the export request? Very cool!

[divyabaid16]

Currently it is only reordering in the sidebar and is independent of the export.
But yes, if after sorting we will click on the export function, the image order will be maintained.

[jywarren]

Does this reload the page to re-order?

[divyabaid16]

Yes, it does currently.
I tried using the controller for it but it wasn't storing the sorted value.
So currently the page does refresh.

[jywarren]

OK, this sounds good! Thanks @divyabaid16 !!!