Create question preview display for "shopping cart" in quizzes

[marcellamaki]

Overview

In the updates to quizzes, we will take some of the new features of the lessons side panel work and integrate them into the quiz workflows. One of these will be to take the "shopping cart" which allows a coach to easily see a list of selected resources at a glance. It is essentially a list view of all selections, across channels and folders.

For quizzes, we will have a manual selection workflow where coaches can create a quiz by choosing each individual question. We will need to update the shopping cart so that what is currently built only to be a resource preview will also allow for a preview of the specific questions selected (using the same accordion question view that is used across several places in lessons and quizzes.

References

Figma - please see the question selection "manual" titled workflow

The question preview accordions

The link to open the shopping cart should be available throughout the workflow on the bottom bar. This is visible throughout the figma spec for the workflow. Example:

Acceptance Criteria

• the PR uses the existing "question accordion" shared component for question display
• This PR displays the question view conditionally - when we are in "manual quiz creation mode". We don't yet have state for this, but for now, set a condition. Explain in your PR how to test this with both the condition being true and false
• the question preview appears on the bottom bar, and the questions render no matter which sub page the user is on
• The figma is followed
• Radina approves accessibility concerns including - tab navigation, screen reader labeling of accordion headers and state, and content within the accordion preview. (this should be handled with the existing component accordion and is more about not breaking anything 😅)

[ishwarthecodddr]

assign me this issue.

[AllanOXDi]

Hi @ishwarthecodddr this issue is not ready to be assign yet! You can find a "help wanted" issue with no assignee

[Madhav17777777]

Hi! I’d like to work on this issue. I understand that the task involves creating a question preview display for practice resources. I’m familiar with the codebase and have experience working with UI components and integrating them into existing systems.

To tackle this issue, I plan to:

1. Design and implement the question preview display, ensuring it aligns with the current design system and UX guidelines.

2. Integrate it with practice resources, making sure the data is displayed correctly.

3. Test the functionality thoroughly to ensure compatibility and accessibility.

Please let me know if there are any specific requirements or guidelines I should follow. I’m excited to contribute! Please assign me this task.

[ozer550]

Hi @Madhav17777777! This issue is assigned to the internal team, you can find other "help wanted" issue with no assignees here.