From fb2dbafaed74d5dd651231aa9c094d32864ed10f Mon Sep 17 00:00:00 2001 From: Paul Kuruvilla Date: Fri, 18 Oct 2024 05:34:35 +0100 Subject: [PATCH] Refactor feedback prompt component and integrate it into current step modal. --- .../course-stage-step/feedback-prompt.hbs | 36 +--- .../course-stage-step/feedback-prompt.ts | 4 +- .../current-step-complete-modal.hbs | 18 +- .../current-step-complete-modal.ts | 19 ++ app/components/course-page/step-content.ts | 2 +- app/controllers/course/stage/instructions.ts | 4 - app/templates/course/stage/instructions.hbs | 189 +++++++++--------- 7 files changed, 136 insertions(+), 136 deletions(-) diff --git a/app/components/course-page/course-stage-step/feedback-prompt.hbs b/app/components/course-page/course-stage-step/feedback-prompt.hbs index 8c947fd44..bca15d12f 100644 --- a/app/components/course-page/course-stage-step/feedback-prompt.hbs +++ b/app/components/course-page/course-stage-step/feedback-prompt.hbs @@ -1,24 +1,8 @@ - - {{#if this.isEditingClosedSubmission}} - - {{/if}} - -
- {{svg-jar "check-circle" class="w-6 fill-current text-teal-500"}} -
- +
{{#if (and this.submissionIsClosed (not this.isEditingClosedSubmission))}} -
+
Feedback submitted!
- {{else}} -
- {{#if this.isEditingClosedSubmission}} - How did we do? - {{else}} - {{this.congratulatoryMessage}} - How did we do? - {{/if}} + {{else if (not this.isEditingClosedSubmission)}} +
+ {{this.congratulatoryMessage}} + How did we do?
{{/if}}
@@ -56,7 +36,7 @@
{{#if this.feedbackSubmission.hasSelectedAnswer}} -
+
P.S. - \ No newline at end of file +
\ No newline at end of file diff --git a/app/components/course-page/course-stage-step/feedback-prompt.ts b/app/components/course-page/course-stage-step/feedback-prompt.ts index cfcea5869..ea0c1e0cd 100644 --- a/app/components/course-page/course-stage-step/feedback-prompt.ts +++ b/app/components/course-page/course-stage-step/feedback-prompt.ts @@ -14,7 +14,7 @@ interface Signature { Args: { courseStage: CourseStageModel; repository: RepositoryModel; - onSubmit: () => void; + onSubmit?: () => void; }; } @@ -103,7 +103,7 @@ export default class FeedbackPromptComponent extends Component { this.feedbackSubmission!.status = 'closed'; // Don't fire for editing submissions - if (!this.isEditingClosedSubmission) { + if (this.args.onSubmit && !this.isEditingClosedSubmission) { this.args.onSubmit(); } diff --git a/app/components/course-page/current-step-complete-modal.hbs b/app/components/course-page/current-step-complete-modal.hbs index 708bbc84d..9e3fdf4a7 100644 --- a/app/components/course-page/current-step-complete-modal.hbs +++ b/app/components/course-page/current-step-complete-modal.hbs @@ -4,11 +4,19 @@ 🎉  {{if (eq this.currentStep.type "CourseStageStep") "Stage Completed!" "Step Completed!"}}
-
-

- {{this.currentStep.completionNoticeMessage}} -

-
+ {{#if this.shouldShowFeedbackPrompt}} + + {{else}} +
+

+ {{this.currentStep.completionNoticeMessage}} +

+
+ {{/if}}
{ @service declare coursePageState: CoursePageStateService; + @service declare router: RouterService; get currentStep() { return this.coursePageState.currentStep; } + get currentStepAsCourseStageStep() { + return this.currentStep as CourseStageStep; + } + get nextStep() { return this.coursePageState.nextStep; } + + get shouldShowFeedbackPrompt() { + return this.currentStep.type === 'CourseStageStep' && !this.currentStepAsCourseStageStep.courseStage.isFirst; + } + + @action + handleFeedbackPromptSubmit() { + // @ts-expect-error transitionTo types are wrong? + this.router.transitionTo(this.args.activeStep.routeParams.route, ...this.args.activeStep.routeParams.models); + } } declare module '@glint/environment-ember-loose/registry' { diff --git a/app/components/course-page/step-content.ts b/app/components/course-page/step-content.ts index 6ca897808..64273b376 100644 --- a/app/components/course-page/step-content.ts +++ b/app/components/course-page/step-content.ts @@ -26,7 +26,7 @@ export default class StepContentComponent extends Component { @service declare coursePageState: CoursePageStateService; get shouldHideCompletionNotice(): boolean { - return this.args.step.type === 'IntroductionStep' || this.args.step.type === 'SetupStep'; + return this.args.step.type === 'IntroductionStep' || this.args.step.type === 'SetupStep' || this.args.step.type === 'CourseStageStep'; } get shouldShowPreviousStepsIncompleteModal(): boolean { diff --git a/app/controllers/course/stage/instructions.ts b/app/controllers/course/stage/instructions.ts index 5f088b223..a1682e86c 100644 --- a/app/controllers/course/stage/instructions.ts +++ b/app/controllers/course/stage/instructions.ts @@ -40,10 +40,6 @@ export default class CourseStageInstructionsController extends Controller { return this.model.courseStage.prerequisiteInstructionsMarkdownFor(this.model.activeRepository); } - get shouldShowFeedbackPrompt() { - return !this.currentStep.courseStage.isFirst && this.currentStep.status === 'complete'; - } - get shouldShowLanguageGuide() { return !this.model.courseStage.isFirst && this.authenticator.currentUser?.isStaff; } diff --git a/app/templates/course/stage/instructions.hbs b/app/templates/course/stage/instructions.hbs index 1eb9d4d61..812d9dd5d 100644 --- a/app/templates/course/stage/instructions.hbs +++ b/app/templates/course/stage/instructions.hbs @@ -1,116 +1,113 @@ -
- {{#if this.shouldShowUpgradePrompt}} - - {{/if}} + +
+ {{#if this.shouldShowUpgradePrompt}} + + {{/if}} - {{#if this.shouldShowFeedbackPrompt}} - - {{/if}} + {{#if (gt this.badgeAwards.length 0)}} + + {{/if}} - {{#if (gt this.badgeAwards.length 0)}} - - {{/if}} - - {{#if (and this.shouldShowTestRunnerCard (eq this.currentStep.testsStatus "passed"))}} - - {{/if}} - - {{#if @model.courseStage.isFirst}} - - {{/if}} - - {{#if @model.courseStage.isSecond}} - - {{/if}} - - {{#if (and this.shouldShowTestRunnerCard (not-eq this.currentStep.testsStatus "passed"))}} -
+ {{#if (and this.shouldShowTestRunnerCard (eq this.currentStep.testsStatus "passed"))}} + {{/if}} - {{#if this.shouldSuppressTestRunnerCardExpands}} - -
- {{#if (eq this.currentStep.testsStatus "failed")}} -

- This failure is expected! Check the - How to pass this stage - section for instructions. -

- {{else}} -

- Check the - How to pass this stage - section for instructions. -

- {{/if}} -
- - {{/if}} -
- {{/if}} + {{#if @model.courseStage.isFirst}} + + {{/if}} - {{! TODO: Bring this back? }} - {{!-- {{#if this.shouldShowPrerequisites}} + {{#if @model.courseStage.isSecond}} + + {{/if}} + + {{#if (and this.shouldShowTestRunnerCard (not-eq this.currentStep.testsStatus "passed"))}} +
+ + + {{#if this.shouldSuppressTestRunnerCardExpands}} + +
+ {{#if (eq this.currentStep.testsStatus "failed")}} +

+ This failure is expected! Check the + How to pass this stage + section for instructions. +

+ {{else}} +

+ Check the + How to pass this stage + section for instructions. +

+ {{/if}} +
+ + {{/if}} +
+ {{/if}} + + {{! TODO: Bring this back? }} + {{!-- {{#if this.shouldShowPrerequisites}} {{/if}} --}} - + - {{#if this.shouldShowLanguageGuide}} - - {{/if}} + {{#if this.shouldShowLanguageGuide}} + + {{/if}} -
-
-

Hints

+
+
+

Hints

- {{#if @model.activeRepository.language}} -
- Filter by {{@model.activeRepository.language.name}} - + {{#if @model.activeRepository.language}} +
+ Filter by {{@model.activeRepository.language.name}} + - - {{#if this.commentListIsFilteredByLanguage}} - You're currently viewing hints that are relevant to - {{@model.activeRepository.language.name}}. Turn this off to view hints for all languages. - {{else}} - You're currently viewing hints for all languages. Turn this on to filter hints that are relevant to - {{@model.activeRepository.language.name}}. - {{/if}} - -
- {{/if}} -
+ + {{#if this.commentListIsFilteredByLanguage}} + You're currently viewing hints that are relevant to + {{@model.activeRepository.language.name}}. Turn this off to view hints for all languages. + {{else}} + You're currently viewing hints for all languages. Turn this on to filter hints that are relevant to + {{@model.activeRepository.language.name}}. + {{/if}} + +
+ {{/if}} +
- + +
-
+ \ No newline at end of file