Resource selection UX- Improvement

[AllanOXDi]

Summary

Replaced the View more button with a KCircularLoader when clicked and things are loading.

Added loading ref in the useQuizResources

The View more button fetches the same amount of resources that the initial fetch

The back arrow is now only visible when there is somewhere within the panel to go back to.
The back arrow also serves as clicking the browser "Back" button
closes #11733

References

#11733

Reviewer guidance

• Confirm that the "View more" button is effectively replaced with a KCircularLoader when clicked and during the loading state
• Review the implementation of a separate "loading" ref, loadingMore, to manage the loading state for the "View more"
• Confirm that the back arrow icon is only visible when there is a valid context within the panel to go back to.
• Clarify that the back arrow does not close the panel; rather, it navigates back within the panel

Testing checklist

• Contributor has fully tested the PR manually
• If there are any front-end changes, before/after screenshots are included
• Critical user journeys are covered by Gherkin stories
• Critical and brittle code paths are covered by unit tests

PR process

• PR has the correct target branch and milestone
• PR has 'needs review' or 'work-in-progress' label
• If PR is ready for review, a reviewer has been added. (Don't use 'Assignees')
• If this is an important user-facing change, PR or related issue has a 'changelog' label
• If this includes an internal dependency change, a link to the diff is provided

Reviewer checklist

• Automated test coverage is satisfactory
• PR is fully functional
• PR has been tested for accessibility regressions
• External dependency files were updated if necessary (yarn and pip)
• Documentation is updated
• Contributor is in AUTHORS.md

[github-actions]

Build Artifacts

Asset type	Download link
PEX file	kolibri-0.16.0b13.dev0_git.532.gbf4bceff.pex
Windows Installer (EXE)	kolibri-0.16.0b13.dev0+git.532.gbf4bceff-unsigned.exe
Debian Package	kolibri_0.16.0b13.dev0+git.532.gbf4bceff-0ubuntu1_all.deb
Mac Installer (DMG)	kolibri-0.16.0b13.dev0+git.532.gbf4bceff-0.3.0.dmg
Android Package (APK)	kolibri-0.16.0b13.dev0+git.532.gbf4bceff-0.1.0-debug.apk
TAR file	kolibri-0.16.0b13.dev0+git.532.gbf4bceff.tar.gz
WHL file	kolibri-0.16.0b13.dev0+git.532.gbf4bceff-py2.py3-none-any.whl

[nucleogenesis]

I think the loadingMore needs to be put onto the first v-if at the top like v-if="loading && !loadingMore" as I'm still seeing the page flash when I click to "view more".

Otherwise, changes look good

[nucleogenesis]

Thanks Allan - this is good to merge.