ProjectSidewalk / SidewalkWebpage

Project Sidewalk web page
http://projectsidewalk.org
MIT License
84 stars 24 forks source link

Gallery 'next label' button not disabled when using URL param filters #3621

Closed misaugstad closed 2 weeks ago

misaugstad commented 3 weeks ago
Brief description of problem/feature

You can get the Gallery UI into a state where the 'next label' arrow button on the expanded view is not disabled, even though there are no labels remaining. This results in the following error message in the browser console, and eventually (if you click the arrow repeatedly) a page that says "No matches. Start exploring to contribute more data!" with no way to get out of it without refreshing the page.

TypeError: Cannot read properties of undefined (reading 'getProperties')
    at updateModalCardByIndex (Gallery.js:3581:64)
    at HTMLButtonElement.nextLabel (Gallery.js:3605:13)
    at HTMLButtonElement.dispatch (jquery-1.12.2.min.js:3:12444)
    at r.handle (jquery-1.12.2.min.js:3:9173)
Expected behavior

The button should be disabled if there are no labels remaining. It will look grayed out. For example, if you go to https://sidewalk-walla-walla.cs.washington.edu/gallery and then filter for the Other label type and look at the expanded view for the last label, it will look like this (I'm making a separate issue for the description text not fitting after this): Screenshot from 2024-08-20 11-07-52

Current behavior (add screenshots if applicable; check terminal & browser console for errors)

If you then refresh the page, so the ?labelType=Other parameter is in the URL (https://sidewalk-walla-walla.cs.washington.edu/gallery?labelType=Other) and you click on the last label, the button is enabled. Screenshot from 2024-08-20 11-08-58

Potential solution(s)

We must not be calling some function or setting some variable that we're supposed to when we initially load the page with filters. I'm hoping that it isn't too hard to track down our mistake if we follow the error message in the console.

jsomeara commented 3 weeks ago

So far, it seems that this only occurs when there's 1 page in the gallery or maybe it's something else? Another thing I've noticed is that when I go to the second page, select one of the labels, and then start moving to the next labels, it somehow is able to go past the second page and loop back around to the first? Might be an unrelated issue.

Another weird issue is that when there's only 1 page in the gallery, the next page button is still visible. And clicking that button results in the same "No matches. Start exploring to contribute more data!".

I think it's probably something to do with the isLastPage function.

jsomeara commented 3 weeks ago

Okay, I was able to fix the issue but now I'm running into this other issue on both the first and second page of the results:

Another thing I've noticed is that when I go to the second page, select one of the labels, and then start moving to the next labels, it somehow is able to go past the second page and loop back around to the first? Might be an unrelated issue.

Even weirder, it only seems to be happening on cards that are validated by the current user. On the unvalidated cards, everything works perfectly. I might be missing something super obvious here.

Edit:

Is a user supposed to be able to make multiple validations on a label? I think this might be the root of this other problem because I've currently been testing with multiple validations on a single label. The gallery system cannot handle labels with more than one validation made by the current user.

jsomeara commented 3 weeks ago

I decided to make a PR (#3625) that addresses the problem relevant to this particular GitHub issue. I'm still not sure if users are supposed to be able to make more than one validation for each label. If no, then they should probably be restricted from doing so in the gallery validation system. If yes, then the gallery system seems to not be handling multiple validations correctly. But I feel like both of these scenarios warrant GitHub issues of their own.

misaugstad commented 2 weeks ago

Is a user supposed to be able to make multiple validations on a label? I think this might be the root of this other problem because I've currently been testing with multiple validations on a single label. The gallery system cannot handle labels with more than one validation made by the current user.

No a user isn't supposed to be able to validate the same label multiple times, though it depends on what you mean by that. If they've validated as "correct", for example, they should be able to change their validation to be "incorrect"/"unsure", but this wouldn't be considered a second validation, just editing their original one.

Though again there is a caveat to that, where technically multiple validations are added if one validation is done on the Validate page, and another is done in Gallery or LabelMap, but I was hoping that we were dealing with the correctly on the back end :eyes:

So I guess I'm wondering more specifically what circumstances are causing an issue, and if you think something is broken then please do create a Github issue with steps for reproducing! It's easy enough to close it if we realize that it was actually working correctly. :)

jsomeara commented 2 weeks ago

I made a separate issue: #3629 :)