Enhanced Quiz Management: Side panel and routing foundations #11132
Conversation
github-actions
bot
added
APP: Coach
Build Artifacts
|
| * Calls the currently displayed ref's focusFirstEl method. | ||
| */ | ||
| findFirstEl() { | ||
| this.$refs[this.$route.name].focusFirstEl(); |
There was a problem hiding this comment.
It looks like this seems to break the modal some times. The modal failed to show some times on click. Please see a screenshot below;
|
|
||
| import Backdrop from 'kolibri.coreVue.components.Backdrop'; | ||
| import commonCoreStrings from 'kolibri.coreVue.mixins.commonCoreStrings'; | ||
| import responsiveWindowMixin from 'kolibri.coreVue.mixins.responsiveWindowMixin'; |
There was a problem hiding this comment.
Just wondering why we are still using this mixin when we have a better alternative in useKResponsiveWindow thats more flexible and offers more readability 😄
There was a problem hiding this comment.
Yes, that does seem like a good thing to switch at this point.
There was a problem hiding this comment.
Thanks @nucleogenesis! The code generally looks good to me. I have left a few comments that I don't think are necessarily blockers but more for reflection. There's also a few UI glitches that I think we might want to look into including the ones below. I am not sure if these are scoped in this task.;
- We might want to add some padding on the model
- The Close button for the "Create new quiz" doesn't seem to work.
|
@rtibbles note that this PR moves the |
| }, | ||
| $trs: { | ||
| /* eslint-disable kolibri/vue-no-unused-translations */ | ||
| topicHeader: { |
There was a problem hiding this comment.
I think the main concern with reusing this side panel modal is any topic specific logic that still exists in it - I had tried to remove it recently, but seems like this message is still here, so would be good to move this somewhere else more appropriate too!
There was a problem hiding this comment.
Looks like this string was abandoned altogether as I can't find out how/where it is missing exactly. The "AlsoInThis" component is used and lists links to contents within the same lesson w/ a title "Next in lesson" where I tested it.
Seems safe to say this message just missed a clean-up pass at some point? (cc @marcellamaki @radinamatic )
There was a problem hiding this comment.
That seems plausible: the string is in Crowdin, translated 2 years ago, but I can't find it used anywhere in the UI... 🤔
There was a problem hiding this comment.
It is possible that it is still being used in 0.16 as part of a crossComponent translator, so that's the only thing I would look out for.
It should contain code that is reused across plugins but that we don't want to be on the hook for as 'core' API - which is probably a lot of things that we reuse, outside of some core state, resources, clients, urls, etc. |
nucleogenesis
force-pushed
the
feature--quiz-routing
branch
from
5a8faf3 to
4cec782
Compare
Summary
Creates basic routes and side panel component outlets for follow-up work to populate with functional components.
Uses common "PageNames" pattern with the routing to identify which page should be shown within a component.
Note that I tried to use nested views, but ran into an issue where the
<router-view />would show twice - once in the side panel where I wanted it and once on the page where the side panel was wrapping the router view. I gave up on that after several attempts and went with the pattern here as it is used commonly throughout Kolibri and is well suited to the currently simple side panel routing.This uses a
:section_idparam to indicate which section is currently being edited so connecting this with the work in #11088 -- this also should make sure that fwd/back navigation between sections should work smoothly as the route changing will decide what is shown overall.References
Closes #11014
Reviewer guidance
Go to create a new quiz. There you will see the very much in-progress and not yet ready for testing quiz creation page.
Above the content are two buttons indicating which side panel they will open. You should be able to open either of them, navigate to the "Select resources" and then use the back arrow there to go back to the previous side panel, which will then let you click the X to close it.
The back/forward navigation should work exactly as expected going between the side panels.
Note that you should have your focus placed on the textbox in the "Select resources" page after your first TAB (@radinamatic please correct if I'm wrong here).