refactor: split introduction and FAQ into separate components #3233
Conversation
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Bundle ReportChanges will increase total bundle size by 3.51kB (0.01%) ⬆️. This is within the configured threshold ✅ Detailed changes
Affected Assets, Files, and Routes:view changes for bundle: client-array-pushAssets Changed:
Files in
Files in
|
Test Results 1 files ±0 1 suites ±0 9m 20s ⏱️ -3s For more details on these errors, see this check. Results for commit 061809c. ± Comparison against base commit 78899bd. ♻️ This comment has been updated with latest results. |
❌ 1 Tests Failed:
View the full list of 1 ❄️ flaky test(s)
To view more test analytics, go to the Test Analytics Dashboard |
![cursor[bot]](https://avatars.githubusercontent.com/in/1210556?s=60&v=4){kind=small}
This comment was marked as outdated.
This comment was marked as outdated.
Sorry, something went wrong.
This comment was marked as outdated.
This comment was marked as outdated.
Sorry, something went wrong.
This comment was marked as outdated.
This comment was marked as outdated.
Sorry, something went wrong.
This comment was marked as outdated.
This comment was marked as outdated.
Sorry, something went wrong.
rohitpaulk
force-pushed
the
refactor-split-introduction-faq
branch
2 times, most recently
from
bfb016e to
8f4e5ca
Compare
Remove the combined IntroductionAndStages component and create a new IntroductionAndFaq component to render the course description and FAQ. Update templates to use IntroductionAndFaq and Stages separately for better separation of concerns and improved maintainability.
Replace the CourseOverviewPage::Stages component with CourseOverviewPage::StageCardList in course overview and join course templates. Rename the corresponding component class and registry entry to reflect the new name. This improves naming consistency and better represents the component's purpose as a list of stage cards.
Replace the single stage list with a new StageCardList structure that groups stages by base and extensions with separate cards. This improves the UI by clearly separating base course stages from extension stages. Introduce StageCardList::Item and StageListItem components to modularize the stage display with enhanced layout and styling. Add connecting lines and state indicators for current and completed stages in StageList. Adjust component arguments to better match the new structure and support highlighting the current stage. This prepares the course overview page for improved clarity and usability when showing courses with multiple extension stages.
Remove the StageCardList and StageCardList::Item components and inline their markup directly in the course-overview and join-course templates. This change simplifies the component hierarchy and removes unnecessary wrappers by directly rendering base stages and extensions with their descriptions and stage lists in a consistent grid layout. The refactor improves maintainability by reducing indirection and allows easier styling adjustments. It also removes unused TypeScript component files associated with the deleted components.
Introduce a new StageListCard component to encapsulate the layout and styling of stage lists with their titles and descriptions. Refactor the join-course and course-overview templates to replace repeated markup with this reusable component, improving consistency and maintainability.
Rename StageList and StageListItem components and their module registry entries to StageListCardList and StageListCardListItem respectively. Update template references to reflect new full namespaced paths. These changes improve component naming consistency and better indicate their role within the StageListCard context.
Replace repeated stage list card markup in course overview and join course templates with a new StageListCardList component. This improves code clarity and reduces duplication by centralizing the rendering of base stages and extension stages into a single reusable component.
Clean up unnecessary whitespace in the course overview template to improve code readability. This change does not affect functionality but ensures consistent formatting.
Simplify stage list items by removing isCurrent and isComplete flags and always rendering the bullet point with default gray styles. This cleans up the component API and UI logic, as the visual distinction based on stage status is no longer needed.
Remove unnecessary line breaks by consolidating the StageListCard ListItem component invocation into a single line. This improves code readability and consistency without changing functionality.
Simplify styling in course overview page by removing the leading-7 class from prose elements in the introduction-and-faq and stage-list-card components. This change ensures consistent typography by relying solely on the base prose styles, improving readability and visual coherence.
Make stage list cards collapsible with a default collapsed state for extensions. This introduces an expand button overlay to reveal full content when collapsed, preventing excessive initial content height. Update titles to conditionally show "Base Stages" only if extensions are present, otherwise show "Stages". This improves clarity and UI consistency for courses with and without extensions.
rohitpaulk
force-pushed
the
refactor-split-introduction-faq
branch
from
8f4e5ca to
061809c
Compare
| <CourseOverviewPage::Notices @course={{this.model.course}} class="mb-4" /> | ||
| <CourseOverviewPage::IntroductionAndStages @course={{this.model.course}} class="w-full" /> | ||
| <CourseOverviewPage::IntroductionAndFaq @course={{this.model.course}} class="w-full mb-4" /> | ||
| <CourseOverviewPage::StageListCardList @course={{this.model.course}} /> |
There was a problem hiding this comment.
Bug: Stage Progress Display Broken
The completedStages data is no longer being passed to the new StageListCardList component. Similar to the course-overview template, this breaks the stage completion display feature that was present in the old component structure.
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Remove the combined IntroductionAndStages component and create a new
IntroductionAndFaq component to render the course description and FAQ.
Update templates to use IntroductionAndFaq and Stages separately for
better separation of concerns and improved maintainability.
Note
Separates course intro/FAQ from stages and introduces an expandable, card-based stage list; updates templates to use the new components.
CourseOverviewPage::IntroductionAndFaqrenders@course.descriptionMarkdownand@course.frequentlyAskedQuestions(adjusted spacing, removed extra prose/margin classes).CourseOverviewPage::StageListCardListto show base stages and per-extension sections; extensions collapsed by default.CourseOverviewPage::StageListCard,::List, and::ListItemwith expand-on-click behavior and difficulty labels.IntroductionAndStageswithIntroductionAndFaq+StageListCardListinapp/templates/course-overview.hbsandapp/templates/join-course.hbs.CourseOverviewPage::IntroductionAndStagesand oldStageListusage; introducedCourseOverviewPage::StageListCard::List(updated signature/registry).Written by Cursor Bugbot for commit 061809c. This will update automatically on new commits. Configure here.