Updates to sections in ExamPage #12182

nucleogenesis · 2024-05-17T00:28:59Z

Summary

As discussed with @rtibbles this is one part of a greater set of updates with regards to how we present the new "sections" to users. This updates the quiz-taking experience.

References

Closes #12246
Closes #12168
Closes #12162

Reviewer guidance

General

Can create a quiz
Can replace questions in the quiz sections (seems When editing a quiz I cannot replace a questions #12246 is fixed here)
Can take the quiz and navigate through appropriately
Upon submitting the quiz, you see the report as usual
Coach can view the learner's quiz report

Mobile-specific

These should apply to both taking the quiz and viewing the reports

On small screens, the side-bar accordion of questions should now be hidden and the user has a dropdown list of questions.
When there are more than one section, there is a dropdown list for sections too
When selecting a section by the dropdown, the first question of that section becomes the "selected question"

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 · 2024-05-17T01:01:26Z

Build Artifacts

Asset type	Download link
PEX file	kolibri-.pex
Windows Installer (EXE)	kolibri-0.16.2a0.dev0+git.1233.gf8a38c4b-windows-setup-unsigned.exe
Debian Package	kolibri_0.16.2a0.dev0+git.1233.gf8a38c4b-0ubuntu1_all.deb
Mac Installer (DMG)	kolibri-0.16.2a0.dev0+git.1233.gf8a38c4b-0.4.2.dmg
Android Package (APK)	kolibri-0.16.2a0.dev0+git.1233.gf8a38c4b-0.1.3-debug.apk
TAR file	kolibri-0.16.2a0.dev0+git.1233.gf8a38c4b.tar.gz
WHL file	kolibri-0.16.2a0.dev0+git.1233.gf8a38c4b-py2.py3-none-any.whl

pcenov · 2024-06-04T14:46:14Z

Hi @nucleogenesis seems that there are conflicts that need to be resolved before I can test your latest changes here - the build artefacts above are from 4 days ago?
Nevertheless I also had a look with that asset and here are some minor considerations:

If I input the max number of characters for the Section title I am seeing issues in the editor. Otherwise from a learners point of view it looks ok:

Long.texts.everywhere.mp4

It's possible to save a section without any questions - not sure what is the expected behavior here, but it might look like a glitch from a learner's point of view:

no.questions.mp4

rtibbles · 2024-06-04T15:09:59Z

@pcenov the empty sections were a deliberate choice, we have a follow up issue to get rid of these at publish time to avoid this showing to learners: #12217

We wanted to leave the empty sections so that someone editing a quiz can leave something as 'work in progress'.

radinamatic · 2024-06-06T10:41:18Z

Replacing questions so far seems OK, still need to do more poking around, but we're not catching properly when the coach is trying to use the quiz title that already exists:

radinamatic · 2024-06-06T10:59:01Z

I did not realize this before, and I'm not saying it needs fixing now, but was the decision to contain the scope of the pool of available resources within each section (and not the whole quiz) intentional? In a sense that when a coach wants to replace a question in section 2, they only have available the resources they specifically selected for that section to select from, and if they wanted to use one of the questions from resources selected for section 1, they need to update the resources in section 2 first, and re-select those included in section 1, to be able to pick some questions from it to select for inserting in the section 2. Tad repetitive, imo... 🤔
cc @tomiwaoLE

radinamatic · 2024-06-06T11:34:11Z

Proposal to simplify the UX writing in this message:

More	Fewer

Saying Select N **more** questions to continue (when none are selected) or Select N **fewer** questions to continue sounds convoluted and unnecessarily complicated. Did we consider keeping the same straightforward message Select N questions to continue all the time (with the Replace button inactive) UNTIL the user selects exactly N questions?

Maybe add a ❗ icon at the beginning of that message too, to point the user's attention or similar... cc @tomiwaoLE

radinamatic · 2024-06-06T11:43:09Z

And after poking around the replacing questions long enough, I got this message that was blocking me from further editing (logs attached at the bottom):

db-logs.zip

nucleogenesis · 2024-06-06T15:57:53Z

but was the decision to contain the scope of the pool of available resources within each section (and not the whole quiz) intentional?

I recall mentioning this early on in the design discussion / review process when I was initially structuring things. This was the decided path forward, although I must say I agree with you that this makes for a slightly convoluted workflow.

As it stands now, I think we could do better with how we inform the user about how the resource selection stuff works. Perhaps messages explaining that you're selecting resources for this section if we keep things how they are.

(cc @tomiwaoLE @radinamatic @rtibbles )

nucleogenesis · 2024-06-06T19:34:47Z

kolibri/plugins/coach/assets/src/views/plan/CreateExamPage/ReplaceQuestions.vue

@@ -2,7 +2,7 @@

  <div class="wrapper">
    <h1 class="section-header" :style="{ color: `${$themeTokens.annotation}` }">
-      {{ activeSection.section_title }}


This is the line of code where Radina's replacements sidepanel was failing... not sure if my changes would help avoid that or not though.

nucleogenesis · 2024-06-06T19:40:49Z

kolibri/plugins/coach/assets/src/views/plan/CreateExamPage/ReplaceQuestions.vue

+        const activeSectionIndex = allSections.value.findIndex(section =>
+          isEqual(JSON.stringify(section), JSON.stringify(activeSection.value))
+        );


There have been a couple places like this where I have to work out where in the list of sections the "current" section is and it makes me miss having a unique ID on them.

However, since sections cannot have duplicate questions between them AND a user cannot replace questions until they've added questions... this ought to do just fine unless JSON.stringify isn't as deterministic as I think.

rtibbles · 2024-06-06T22:52:24Z

kolibri/plugins/learn/assets/src/views/QuizRenderer/QuizReport.vue

@@ -17,6 +17,7 @@
    :questions="questions"
    :isSurvey="isSurvey"
    :isQuiz="!isSurvey"
+    :sections="exam.question_sources"


This will never be defined - can be cleaned up once there's a default on the sections prop.

…tle if oly once seciont without a title

pcenov · 2024-06-07T14:38:33Z

Hi @nucleogenesis,
Here's a list with the issues I was able to find:

Since we are using the default title of 'Section 1' when I open the section settings I am expecting to see that title by default. Currently it's missing and when I attempt to manually enter it I see the 'Section titles must be unique within this quiz' message:

section.title.mp4

The same happens if I just enter any name, click the Apply settings button and then attempt to make and additional changes:

section.mp4

If I leave an interval after the title it can be saved looking as a duplicate. The same is valid if I enter the title with caps lock on:

duplicate.mp4

When deleting a section with the default title, then that title is also missing in the confirmation message:

delete.mp4

I can't select and start a practice quiz:

can.t.select.a.practize.quiz.mp4

nucleogenesis · 2024-06-10T16:49:03Z

Thank you @pcenov -- I will make a follow-up issue for cleaning up the over-eager yet-also-failing validations. The practice quiz issue is being addressed in a separate PR by @rtibbles

With that, I think that we'll just need reviewer approval and can get this merged. I think it'd be helpful for #9759 to rebase on my work to see if the latest reported issues there are fixed here

Edit: Follow-up issue

…onTitle

rtibbles

A couple of things that I think could be resolved quickly.

I guess we decided not to allow selection of folders at all? Have we updated that in the selection behaviour as well?

rtibbles · 2024-06-10T23:15:28Z

kolibri/plugins/coach/assets/src/views/plan/CoachExamsPage/index.vue

@@ -140,6 +140,7 @@
          @submit="handleOpenQuiz(activeQuiz.id)"
        >
          <p>{{ openQuizModalDetail$() }}</p>
+          <p>{{ canNoLongerEditQuizNotice$() }}</p>


This should be conditionalized on quiz.draft being true - otherwise we will show this warning for quizzes that couldn't be edited anyway.

rtibbles · 2024-06-10T23:16:50Z

kolibri/plugins/coach/assets/src/views/common/commonCoachStrings.js

@@ -522,6 +522,11 @@ const coachStrings = createTranslator('CommonCoachStrings', {
    context:
      "Text shown on a modal pop-up window when the user clicks the 'Start Quiz' button. This explains what will happen when the user confirms the action of starting the quiz.",
  },
+  canNoLongerEditQuizNotice: {
+    message: 'You will no longer be able to edit the quiz.',


This is inaccurate - it should be something like "You will no longer be able to edit the questions and sections in this quiz" - as they will still be able to edit the title and assignments.

rtibbles · 2024-06-10T23:28:25Z

packages/kolibri-common/strings/enhancedQuizManagementStrings.js

@@ -73,7 +73,7 @@ export const enhancedQuizManagementStrings = createTranslator('EnhancedQuizManag
    message: 'Add questions',
  },
  selectFoldersOrExercises: {


Might be worth changing the message id if we're not only allowing selection of resources?

+1 good thought richard

marcellamaki

No blockers from my perspective on the code review side (although I didn't do any manual QA). Jacob, if you're able to get in the small pieces of feedback from Richard right away, then let's go ahead and merge and iterate from there so we can also get Richard's PR in and give him time to sort through merge conflicts

kolibri/plugins/coach/assets/src/views/plan/assignments/AssignmentDetailsModal.vue

marcellamaki · 2024-06-11T16:46:52Z

packages/kolibri-common/strings/enhancedQuizManagementStrings.js

@@ -73,7 +73,7 @@ export const enhancedQuizManagementStrings = createTranslator('EnhancedQuizManag
    message: 'Add questions',
  },
  selectFoldersOrExercises: {


+1 good thought richard

marcellamaki

quick smoke test and workflow walk through seems good, so let's merge and carry on!

github-actions bot added APP: Learn Re: Learn App (content, quizzes, lessons, etc.) APP: Coach Re: Coach App (lessons, quizzes, groups, reports, etc.) DEV: frontend SIZE: large labels May 17, 2024

nucleogenesis self-assigned this May 21, 2024

nucleogenesis added this to the Kolibri 0.17: Enhanced Quiz Management milestone May 23, 2024

nucleogenesis force-pushed the enhancement--quiz-section-question-list branch from 1183b13 to d65d6b8 Compare May 28, 2024 19:50

github-actions bot added the SIZE: very large label May 28, 2024

nucleogenesis requested a review from rtibbles May 28, 2024 22:06

nucleogenesis force-pushed the enhancement--quiz-section-question-list branch 2 times, most recently from a046f94 to 946b42f Compare May 31, 2024 22:31

nucleogenesis marked this pull request as ready for review June 4, 2024 05:31

nucleogenesis requested a review from pcenov June 4, 2024 05:31

nucleogenesis added the TAG: user strings Application text that gets translated label Jun 4, 2024

nucleogenesis force-pushed the enhancement--quiz-section-question-list branch from ab359ce to f8b27af Compare June 5, 2024 23:04

nucleogenesis commented Jun 6, 2024

View reviewed changes

nucleogenesis added 5 commits June 6, 2024 14:54

include item uid

bb48d8e

eqm strings updated

9681689

update accordion* with useAccordion; update eqm components

e989aa6

sections in core and learn exams

cc9fe58

updates for validations, section management

599460b

nucleogenesis force-pushed the enhancement--quiz-section-question-list branch from c5ae963 to 599460b Compare June 6, 2024 21:56

nucleogenesis added 3 commits June 6, 2024 15:05

attemptloglist conditionalize accordion on now-optional sections prop

e296ed5

fix strings, bad early return in attemptloglist

8401422

clear selected questions when moving between sections

d9bee6b

rtibbles reviewed Jun 6, 2024

View reviewed changes

nucleogenesis added 2 commits June 6, 2024 16:04

add save & close button to quiz creation;redirect accordingly

6c900c9

practice quizzes don't have sections, reports work, hide accordion ti…

2198598

…tle if oly once seciont without a title

nucleogenesis mentioned this pull request Jun 10, 2024

EQM: Section form validation improvements #12262

Closed

2 tasks

don't remove replacementQuestionPool injection

8366ee9

nucleogenesis mentioned this pull request Jun 10, 2024

EQM: Cannot "Save & Close" directly after "Save"-ing a quiz #12263

Closed

nucleogenesis added 3 commits June 10, 2024 14:37

string updates post-review

239d377

add currentSectionIndex to examViewer getters; displaysectiontitle

0140393

update places where we used section_title but should use displaySecti…

5b7ef32

…onTitle

rtibbles mentioned this pull request Jun 10, 2024

Upgrade perseus to npm published version. #9759

Merged

9 tasks

rtibbles reviewed Jun 10, 2024

View reviewed changes

nucleogenesis added 3 commits June 11, 2024 08:50

conditionalize cannot edit notice on quiz.draft

02e0bb0

add context around quiz edit warnings on start quiz

7c0b654

update key for message to better represent the message

766faf0

marcellamaki reviewed Jun 11, 2024

View reviewed changes

marcellamaki approved these changes Jun 11, 2024

View reviewed changes

nucleogenesis merged commit c25cdc8 into learningequality:develop Jun 11, 2024
31 checks passed

This was referenced Jun 11, 2024

EQM Fix: Use can actually select topics #12265

Merged

When creating/editing a quiz, clicking the Save button results in immediately closing the modal #12245

Closed

pcenov mentioned this pull request Jun 12, 2024

When editing a quiz I cannot replace a questions #12246

Closed

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Updates to sections in ExamPage #12182

Updates to sections in ExamPage #12182

nucleogenesis commented May 17, 2024 •

edited by radinamatic

Loading

github-actions bot commented May 17, 2024 •

edited

Loading

pcenov commented Jun 4, 2024

rtibbles commented Jun 4, 2024

radinamatic commented Jun 6, 2024

radinamatic commented Jun 6, 2024

radinamatic commented Jun 6, 2024 •

edited

Loading

radinamatic commented Jun 6, 2024

nucleogenesis commented Jun 6, 2024

nucleogenesis Jun 6, 2024

nucleogenesis Jun 6, 2024

rtibbles Jun 6, 2024

pcenov commented Jun 7, 2024

nucleogenesis commented Jun 10, 2024 •

edited

Loading

rtibbles left a comment

rtibbles Jun 10, 2024

rtibbles Jun 10, 2024

rtibbles Jun 10, 2024

marcellamaki Jun 11, 2024

marcellamaki left a comment

marcellamaki Jun 11, 2024

marcellamaki left a comment

Updates to sections in ExamPage #12182

Updates to sections in ExamPage #12182

Conversation

nucleogenesis commented May 17, 2024 • edited by radinamatic Loading

Summary

References

Reviewer guidance

General

Mobile-specific

Testing checklist

PR process

Reviewer checklist

github-actions bot commented May 17, 2024 • edited Loading

pcenov commented Jun 4, 2024

rtibbles commented Jun 4, 2024

radinamatic commented Jun 6, 2024

radinamatic commented Jun 6, 2024

radinamatic commented Jun 6, 2024 • edited Loading

radinamatic commented Jun 6, 2024

nucleogenesis commented Jun 6, 2024

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

pcenov commented Jun 7, 2024

nucleogenesis commented Jun 10, 2024 • edited Loading

rtibbles left a comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

marcellamaki left a comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

marcellamaki left a comment

Choose a reason for hiding this comment

nucleogenesis commented May 17, 2024 •

edited by radinamatic

Loading

github-actions bot commented May 17, 2024 •

edited

Loading

radinamatic commented Jun 6, 2024 •

edited

Loading

nucleogenesis commented Jun 10, 2024 •

edited

Loading