Skip to content

Implement infinite scrolling in new and deprecated view#1766

Merged
UnniKohonen merged 4 commits intomainfrom
issue1765-changes-view-infinite-scroll
Mar 13, 2025
Merged

Implement infinite scrolling in new and deprecated view#1766
UnniKohonen merged 4 commits intomainfrom
issue1765-changes-view-infinite-scroll

Conversation

@UnniKohonen
Copy link
Contributor

@UnniKohonen UnniKohonen commented Mar 11, 2025

Reasons for creating this PR

Changes view in sidebar does not currently load more concepts as the list is scrolled in Skosmos 3. This PR adds functionality to address this.

Link to relevant issue(s), if any

Description of the changes in this PR

  • Add an event listener for scrolling changes list
  • Load more concepts when list is scrolled to the bottom
  • Add spinners when loading content
  • Add a cypress test for loading new changes
  • Add dark color to deprecated concepts' line throughs

Addresses requirement 7 in #1735

Known problems or uncertainties in this PR

Checklist

  • phpUnit tests pass locally with my changes
  • I have added tests that show that the new code works, or tests are not relevant for this PR (e.g. only HTML/CSS changes)
  • The PR doesn't reduce accessibility of the front-end code (e.g. tab focus, scaling to different resolutions, use of .sr-only class, color contrast)
  • The PR doesn't introduce unintended code changes (e.g. empty lines or useless reindentation)

@UnniKohonen UnniKohonen added this to the 3.0 milestone Mar 11, 2025
@UnniKohonen UnniKohonen self-assigned this Mar 11, 2025
@UnniKohonen UnniKohonen moved this to Needs review in Skosmos 3.x Backlog Mar 11, 2025
@sonarqubecloud
Copy link

@UnniKohonen UnniKohonen requested a review from joelit March 12, 2025 10:18
Copy link
Contributor

@joelit joelit left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I'd personally take some of the logging off at this point, but we can have a look at JS logging levels as a whole in a separate issue instead of tackling it here.

The feature works as intended, even in a mobile width single-column window - LGTM!

this.currentOffset = 200
// Add scrolling event listener back after changes are loaded
this.$refs.tabChanges.$refs.list.addEventListener('scroll', this.handleScrollEvent)
console.log('changes', this.changedConcepts)
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Maybe we don't need the logging anymore at this point

return data.json()
})
.then(data => {
console.log('data', data)
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Ditto. Maybe we don't need the logging anymore at this point.

if (data.changeList.length > 0) {
this.$refs.tabChanges.$refs.list.addEventListener('scroll', this.handleScrollEvent)
}
console.log('changes', this.changedConcepts)
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Ditto. Maybe we don't need the logging anymore at this point.

@joelit
Copy link
Contributor

joelit commented Mar 13, 2025

I created a separate issue about logging levels - #1773

@UnniKohonen UnniKohonen merged commit 54fe53f into main Mar 13, 2025
11 checks passed
@github-project-automation github-project-automation bot moved this from Needs review to Issue/PR closed in Skosmos 3.x Backlog Mar 13, 2025
@UnniKohonen UnniKohonen deleted the issue1765-changes-view-infinite-scroll branch March 13, 2025 07:17
@UnniKohonen UnniKohonen moved this from Issue/PR closed to Done (verified in test.dev.finto.fi, set Milestone 3.0 for both issue & PR) in Skosmos 3.x Backlog May 13, 2025
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Implement infinite scrolling in new and deprecated view

2 participants