From bbed3490b13b4262086ba7a07ef8041645ce03d0 Mon Sep 17 00:00:00 2001 From: Paul Kuruvilla Date: Tue, 10 Dec 2024 23:45:00 +0530 Subject: [PATCH 1/3] move everything to legacy namespace --- .../{ => legacy}/create-repository-card.hbs | 8 ++++---- .../{ => legacy}/create-repository-card.ts | 2 +- .../create-repository-card/language-button.hbs | 0 .../create-repository-card/language-button.ts | 2 +- .../request-language-button.hbs | 2 +- .../request-language-button.ts | 2 +- .../request-language-dropdown.hbs | 0 .../request-language-dropdown.ts | 2 +- .../requested-languages-prompt.hbs | 0 .../requested-languages-prompt.ts | 2 +- .../select-expected-activity-frequency-section.hbs | 0 .../select-expected-activity-frequency-section.ts | 2 +- .../select-language-proficiency-level-section.hbs | 0 .../select-language-proficiency-level-section.ts | 2 +- .../select-language-section.hbs | 12 ++++++------ .../select-language-section.ts | 2 +- .../select-reminders-preference-section.hbs | 0 .../select-reminders-preference-section.ts | 2 +- .../show-other-languages-button.hbs | 0 .../show-other-languages-button.ts | 2 +- .../introduction-step/{ => legacy}/welcome-card.hbs | 0 .../introduction-step/{ => legacy}/welcome-card.ts | 2 +- app/templates/course/introduction.hbs | 4 ++-- 23 files changed, 24 insertions(+), 24 deletions(-) rename app/components/course-page/introduction-step/{ => legacy}/create-repository-card.hbs (82%) rename app/components/course-page/introduction-step/{ => legacy}/create-repository-card.ts (96%) rename app/components/course-page/introduction-step/{ => legacy}/create-repository-card/language-button.hbs (100%) rename app/components/course-page/introduction-step/{ => legacy}/create-repository-card/language-button.ts (80%) rename app/components/course-page/introduction-step/{ => legacy}/create-repository-card/request-language-button.hbs (80%) rename app/components/course-page/introduction-step/{ => legacy}/create-repository-card/request-language-button.ts (86%) rename app/components/course-page/introduction-step/{ => legacy}/create-repository-card/request-language-dropdown.hbs (100%) rename app/components/course-page/introduction-step/{ => legacy}/create-repository-card/request-language-dropdown.ts (96%) rename app/components/course-page/introduction-step/{ => legacy}/create-repository-card/requested-languages-prompt.hbs (100%) rename app/components/course-page/introduction-step/{ => legacy}/create-repository-card/requested-languages-prompt.ts (82%) rename app/components/course-page/introduction-step/{ => legacy}/create-repository-card/select-expected-activity-frequency-section.hbs (100%) rename app/components/course-page/introduction-step/{ => legacy}/create-repository-card/select-expected-activity-frequency-section.ts (84%) rename app/components/course-page/introduction-step/{ => legacy}/create-repository-card/select-language-proficiency-level-section.hbs (100%) rename app/components/course-page/introduction-step/{ => legacy}/create-repository-card/select-language-proficiency-level-section.ts (93%) rename app/components/course-page/introduction-step/{ => legacy}/create-repository-card/select-language-section.hbs (78%) rename app/components/course-page/introduction-step/{ => legacy}/create-repository-card/select-language-section.ts (94%) rename app/components/course-page/introduction-step/{ => legacy}/create-repository-card/select-reminders-preference-section.hbs (100%) rename app/components/course-page/introduction-step/{ => legacy}/create-repository-card/select-reminders-preference-section.ts (84%) rename app/components/course-page/introduction-step/{ => legacy}/create-repository-card/show-other-languages-button.hbs (100%) rename app/components/course-page/introduction-step/{ => legacy}/create-repository-card/show-other-languages-button.ts (68%) rename app/components/course-page/introduction-step/{ => legacy}/welcome-card.hbs (100%) rename app/components/course-page/introduction-step/{ => legacy}/welcome-card.ts (82%) diff --git a/app/components/course-page/introduction-step/create-repository-card.hbs b/app/components/course-page/introduction-step/legacy/create-repository-card.hbs similarity index 82% rename from app/components/course-page/introduction-step/create-repository-card.hbs rename to app/components/course-page/introduction-step/legacy/create-repository-card.hbs index cd8e3c7389..4c1275c13e 100644 --- a/app/components/course-page/introduction-step/create-repository-card.hbs +++ b/app/components/course-page/introduction-step/legacy/create-repository-card.hbs @@ -13,14 +13,14 @@ <:expandedSection> {{#if (eq this.expandedSection.type "SelectLanguageSection")}} - {{else if (eq this.expandedSection.type "SelectLanguageProficiencyLevelSection")}} - @@ -29,13 +29,13 @@ ↓ Next question {{/if}} {{else if (eq this.expandedSection.type "SelectExpectedActivityFrequencySection")}} - {{else if (eq this.expandedSection.type "SelectRemindersPreferenceSection")}} - diff --git a/app/components/course-page/introduction-step/create-repository-card.ts b/app/components/course-page/introduction-step/legacy/create-repository-card.ts similarity index 96% rename from app/components/course-page/introduction-step/create-repository-card.ts rename to app/components/course-page/introduction-step/legacy/create-repository-card.ts index 7e57dd06d6..18926b80e4 100644 --- a/app/components/course-page/introduction-step/create-repository-card.ts +++ b/app/components/course-page/introduction-step/legacy/create-repository-card.ts @@ -82,6 +82,6 @@ export default class CreateRepositoryCardComponent extends Component declare module '@glint/environment-ember-loose/registry' { export default interface Registry { - 'CoursePage::IntroductionStep::CreateRepositoryCard': typeof CreateRepositoryCardComponent; + 'CoursePage::IntroductionStep::Legacy::CreateRepositoryCard': typeof CreateRepositoryCardComponent; } } diff --git a/app/components/course-page/introduction-step/create-repository-card/language-button.hbs b/app/components/course-page/introduction-step/legacy/create-repository-card/language-button.hbs similarity index 100% rename from app/components/course-page/introduction-step/create-repository-card/language-button.hbs rename to app/components/course-page/introduction-step/legacy/create-repository-card/language-button.hbs diff --git a/app/components/course-page/introduction-step/create-repository-card/language-button.ts b/app/components/course-page/introduction-step/legacy/create-repository-card/language-button.ts similarity index 80% rename from app/components/course-page/introduction-step/create-repository-card/language-button.ts rename to app/components/course-page/introduction-step/legacy/create-repository-card/language-button.ts index e8a783145a..8cc16ae76f 100644 --- a/app/components/course-page/introduction-step/create-repository-card/language-button.ts +++ b/app/components/course-page/introduction-step/legacy/create-repository-card/language-button.ts @@ -15,6 +15,6 @@ export default class LanguageButtonComponent extends Component {} declare module '@glint/environment-ember-loose/registry' { export default interface Registry { - 'CoursePage::IntroductionStep::CreateRepositoryCard::LanguageButton': typeof LanguageButtonComponent; + 'CoursePage::IntroductionStep::Legacy::CreateRepositoryCard::LanguageButton': typeof LanguageButtonComponent; } } diff --git a/app/components/course-page/introduction-step/create-repository-card/request-language-button.hbs b/app/components/course-page/introduction-step/legacy/create-repository-card/request-language-button.hbs similarity index 80% rename from app/components/course-page/introduction-step/create-repository-card/request-language-button.hbs rename to app/components/course-page/introduction-step/legacy/create-repository-card/request-language-button.hbs index 319e6a790b..bf9ec39de0 100644 --- a/app/components/course-page/introduction-step/create-repository-card/request-language-button.hbs +++ b/app/components/course-page/introduction-step/legacy/create-repository-card/request-language-button.hbs @@ -15,6 +15,6 @@ - + \ No newline at end of file diff --git a/app/components/course-page/introduction-step/create-repository-card/request-language-button.ts b/app/components/course-page/introduction-step/legacy/create-repository-card/request-language-button.ts similarity index 86% rename from app/components/course-page/introduction-step/create-repository-card/request-language-button.ts rename to app/components/course-page/introduction-step/legacy/create-repository-card/request-language-button.ts index 6c3505370f..765b23bbfa 100644 --- a/app/components/course-page/introduction-step/create-repository-card/request-language-button.ts +++ b/app/components/course-page/introduction-step/legacy/create-repository-card/request-language-button.ts @@ -26,6 +26,6 @@ export default class RequestLanguageButtonComponent extends Component declare module '@glint/environment-ember-loose/registry' { export default interface Registry { - 'CoursePage::IntroductionStep::CreateRepositoryCard::RequestLanguageButton': typeof RequestLanguageButtonComponent; + 'CoursePage::IntroductionStep::Legacy::CreateRepositoryCard::RequestLanguageButton': typeof RequestLanguageButtonComponent; } } diff --git a/app/components/course-page/introduction-step/create-repository-card/request-language-dropdown.hbs b/app/components/course-page/introduction-step/legacy/create-repository-card/request-language-dropdown.hbs similarity index 100% rename from app/components/course-page/introduction-step/create-repository-card/request-language-dropdown.hbs rename to app/components/course-page/introduction-step/legacy/create-repository-card/request-language-dropdown.hbs diff --git a/app/components/course-page/introduction-step/create-repository-card/request-language-dropdown.ts b/app/components/course-page/introduction-step/legacy/create-repository-card/request-language-dropdown.ts similarity index 96% rename from app/components/course-page/introduction-step/create-repository-card/request-language-dropdown.ts rename to app/components/course-page/introduction-step/legacy/create-repository-card/request-language-dropdown.ts index 6707b25da7..090812e370 100644 --- a/app/components/course-page/introduction-step/create-repository-card/request-language-dropdown.ts +++ b/app/components/course-page/introduction-step/legacy/create-repository-card/request-language-dropdown.ts @@ -122,6 +122,6 @@ export default class RequestLanguageDropdownComponent extends ComponentCreating repository... {{else}} - {{/each}} - + {{else}} {{#each this.orderedLanguageConfigurations as |languageConfiguration|}} - {{/each}} - + {{/if}} {{/if}} {{#animated-if (gt this.requestedAndUnsupportedLanguages.length 0) use=this.requestedLanguagesPromptTransition}} - {{/animated-if}} diff --git a/app/components/course-page/introduction-step/create-repository-card/select-language-section.ts b/app/components/course-page/introduction-step/legacy/create-repository-card/select-language-section.ts similarity index 94% rename from app/components/course-page/introduction-step/create-repository-card/select-language-section.ts rename to app/components/course-page/introduction-step/legacy/create-repository-card/select-language-section.ts index 4341122e75..756d4ae214 100644 --- a/app/components/course-page/introduction-step/create-repository-card/select-language-section.ts +++ b/app/components/course-page/introduction-step/legacy/create-repository-card/select-language-section.ts @@ -60,6 +60,6 @@ export default class SelectLanguageSectionComponent extends Component declare module '@glint/environment-ember-loose/registry' { export default interface Registry { - 'CoursePage::IntroductionStep::CreateRepositoryCard::SelectLanguageSection': typeof SelectLanguageSectionComponent; + 'CoursePage::IntroductionStep::Legacy::CreateRepositoryCard::SelectLanguageSection': typeof SelectLanguageSectionComponent; } } diff --git a/app/components/course-page/introduction-step/create-repository-card/select-reminders-preference-section.hbs b/app/components/course-page/introduction-step/legacy/create-repository-card/select-reminders-preference-section.hbs similarity index 100% rename from app/components/course-page/introduction-step/create-repository-card/select-reminders-preference-section.hbs rename to app/components/course-page/introduction-step/legacy/create-repository-card/select-reminders-preference-section.hbs diff --git a/app/components/course-page/introduction-step/create-repository-card/select-reminders-preference-section.ts b/app/components/course-page/introduction-step/legacy/create-repository-card/select-reminders-preference-section.ts similarity index 84% rename from app/components/course-page/introduction-step/create-repository-card/select-reminders-preference-section.ts rename to app/components/course-page/introduction-step/legacy/create-repository-card/select-reminders-preference-section.ts index 495e1608a6..796ab585ff 100644 --- a/app/components/course-page/introduction-step/create-repository-card/select-reminders-preference-section.ts +++ b/app/components/course-page/introduction-step/legacy/create-repository-card/select-reminders-preference-section.ts @@ -28,6 +28,6 @@ export default class SelectRemindersPreferenceSectionComponent extends Component declare module '@glint/environment-ember-loose/registry' { export default interface Registry { - 'CoursePage::IntroductionStep::CreateRepositoryCard::SelectRemindersPreferenceSection': typeof SelectRemindersPreferenceSectionComponent; + 'CoursePage::IntroductionStep::Legacy::CreateRepositoryCard::SelectRemindersPreferenceSection': typeof SelectRemindersPreferenceSectionComponent; } } diff --git a/app/components/course-page/introduction-step/create-repository-card/show-other-languages-button.hbs b/app/components/course-page/introduction-step/legacy/create-repository-card/show-other-languages-button.hbs similarity index 100% rename from app/components/course-page/introduction-step/create-repository-card/show-other-languages-button.hbs rename to app/components/course-page/introduction-step/legacy/create-repository-card/show-other-languages-button.hbs diff --git a/app/components/course-page/introduction-step/create-repository-card/show-other-languages-button.ts b/app/components/course-page/introduction-step/legacy/create-repository-card/show-other-languages-button.ts similarity index 68% rename from app/components/course-page/introduction-step/create-repository-card/show-other-languages-button.ts rename to app/components/course-page/introduction-step/legacy/create-repository-card/show-other-languages-button.ts index 19c9421384..aa20acf510 100644 --- a/app/components/course-page/introduction-step/create-repository-card/show-other-languages-button.ts +++ b/app/components/course-page/introduction-step/legacy/create-repository-card/show-other-languages-button.ts @@ -8,6 +8,6 @@ export default class ShowOtherLanguagesButtonComponent extends Component {} declare module '@glint/environment-ember-loose/registry' { export default interface Registry { - 'CoursePage::IntroductionStep::WelcomeCard': typeof WelcomeCardComponent; + 'CoursePage::IntroductionStep::Legacy::WelcomeCard': typeof WelcomeCardComponent; } } diff --git a/app/templates/course/introduction.hbs b/app/templates/course/introduction.hbs index 4dfd607487..0e69eb6c40 100644 --- a/app/templates/course/introduction.hbs +++ b/app/templates/course/introduction.hbs @@ -7,8 +7,8 @@ /> {{/if}} - - + Date: Wed, 11 Dec 2024 15:19:24 +0530 Subject: [PATCH 2/3] wip --- .../introduction-step/welcome-section.hbs | 18 ++++++++ .../introduction-step/welcome-section.ts | 43 +++++++++++++++++++ app/templates/course/introduction.hbs | 6 ++- .../course-page/start-course-test.js | 1 + 4 files changed, 66 insertions(+), 2 deletions(-) create mode 100644 app/components/course-page/introduction-step/welcome-section.hbs create mode 100644 app/components/course-page/introduction-step/welcome-section.ts diff --git a/app/components/course-page/introduction-step/welcome-section.hbs b/app/components/course-page/introduction-step/welcome-section.hbs new file mode 100644 index 0000000000..6a9d79aadc --- /dev/null +++ b/app/components/course-page/introduction-step/welcome-section.hbs @@ -0,0 +1,18 @@ +
+
+

+ Welcome to the + {{@repository.course.name}} + challenge! +

+ + {{markdown-to-html @repository.course.descriptionMarkdown}} +
+ + +
\ No newline at end of file diff --git a/app/components/course-page/introduction-step/welcome-section.ts b/app/components/course-page/introduction-step/welcome-section.ts new file mode 100644 index 0000000000..d61665e279 --- /dev/null +++ b/app/components/course-page/introduction-step/welcome-section.ts @@ -0,0 +1,43 @@ +import Component from '@glimmer/component'; +import type RepositoryModel from 'codecrafters-frontend/models/repository'; +import { action } from '@ember/object'; +import LanguageModel from 'codecrafters-frontend/models/language'; + +export interface Signature { + Element: HTMLDivElement; + + Args: { + repository: RepositoryModel; + }; +} + +export default class WelcomeSectionComponent extends Component { + @tracked repositoryCreationErrorMessage?: string; + + @action + async handleLanguageSelection(language: LanguageModel) { + this.repositoryCreationErrorMessage = undefined; + this.args.repository.language = language; + + try { + await this.args.repository.save(); // TODO: This is kinda slow, investigate ways to make it faster + } catch (error) { + this.args.repository.language = undefined; + this.repositoryCreationErrorMessage = + 'Failed to create repository, please try again? Contact us at hello@codecrafters.io if this error persists.'; + Sentry.captureException(error); + + return; + } + + this.expandNextSection(); + + this.router.transitionTo({ queryParams: { repo: this.args.repository.id, track: null } }); + } +} + +declare module '@glint/environment-ember-loose/registry' { + export default interface Registry { + 'CoursePage::IntroductionStep::WelcomeSection': typeof WelcomeSectionComponent; + } +} diff --git a/app/templates/course/introduction.hbs b/app/templates/course/introduction.hbs index 0e69eb6c40..4c1667ef06 100644 --- a/app/templates/course/introduction.hbs +++ b/app/templates/course/introduction.hbs @@ -7,11 +7,13 @@ /> {{/if}} - + + + {{!-- + /> --}} \ No newline at end of file diff --git a/tests/acceptance/course-page/start-course-test.js b/tests/acceptance/course-page/start-course-test.js index 8116dcf784..62a46df992 100644 --- a/tests/acceptance/course-page/start-course-test.js +++ b/tests/acceptance/course-page/start-course-test.js @@ -54,6 +54,7 @@ module('Acceptance | course-page | start-course', function (hooks) { await catalogPage.visit(); await catalogPage.clickOnCourse('Build your own Dummy'); await courseOverviewPage.clickOnStartCourse(); + await this.pauseTest(); assert.strictEqual(currentURL(), '/courses/dummy/introduction', 'current URL is course page URL'); From 1470b163ef9dec2079e9796c96e19433791a89f6 Mon Sep 17 00:00:00 2001 From: Paul Kuruvilla Date: Fri, 13 Dec 2024 18:47:16 +0530 Subject: [PATCH 3/3] Add Pre-Challenge Assessment step and related components to course page flow. --- .../course-page/header/main-section.hbs | 4 +- .../course-page/header/main-section.ts | 19 +++++++ app/components/course-page/header/tab-list.ts | 18 +------ .../legacy/create-repository-card.hbs | 9 +--- .../introduction-step/welcome-section.hbs | 6 +-- .../introduction-step/welcome-section.ts | 10 +++- app/components/course-page/step-content.hbs | 2 +- app/components/course-page/step-list-item.hbs | 4 ++ .../course/pre-challenge-assessment.ts | 17 +++++++ app/router.ts | 1 + .../course/pre-challenge-assessment.hbs | 13 +++++ app/utils/course-page-step-list.ts | 2 + .../introduction-step.ts | 28 ++-------- .../pre-challenge-assessment-step.ts | 51 +++++++++++++++++++ app/utils/course-page-step-list/step.ts | 1 + .../pre-challenge-assessment-section-list.ts | 1 - .../course-page/complete-first-stage-test.js | 2 + 17 files changed, 129 insertions(+), 59 deletions(-) create mode 100644 app/controllers/course/pre-challenge-assessment.ts create mode 100644 app/templates/course/pre-challenge-assessment.hbs create mode 100644 app/utils/course-page-step-list/pre-challenge-assessment-step.ts diff --git a/app/components/course-page/header/main-section.hbs b/app/components/course-page/header/main-section.hbs index ca0bd09eaa..6a0f03de1d 100644 --- a/app/components/course-page/header/main-section.hbs +++ b/app/components/course-page/header/main-section.hbs @@ -29,9 +29,7 @@ - {{! For complete steps, we have the "You've completed this step" banner" }} - {{! For in-progress steps, users shouldn't be focused on this area anyway }} - {{#if (not (or (eq @currentStep.status "complete") (eq @currentStep.status "in_progress")))}} + {{#if this.shouldShowProgressIndicator}} {{/if}} diff --git a/app/components/course-page/header/main-section.ts b/app/components/course-page/header/main-section.ts index ce4d0b7fbb..8c6928ed63 100644 --- a/app/components/course-page/header/main-section.ts +++ b/app/components/course-page/header/main-section.ts @@ -21,6 +21,25 @@ export default class MainSectionComponent extends Component { get currentStepAsCourseStageStep(): CourseStageStep { return this.args.currentStep as CourseStageStep; } + + get shouldShowProgressIndicator(): boolean { + // For complete steps, we have the "You've completed this step" banner + if (this.args.currentStep.status === 'complete') { + return false; + } + + // For in-progress steps, users shouldn't be focused on this area anyway + if (this.args.currentStep.status === 'in_progress') { + return false; + } + + // On the introduction step, let's not distract the user and instead focus on content + if (this.args.currentStep.type === 'IntroductionStep') { + return false; + } + + return true; + } } declare module '@glint/environment-ember-loose/registry' { diff --git a/app/components/course-page/header/tab-list.ts b/app/components/course-page/header/tab-list.ts index 51288c36ce..d5bf4ba126 100644 --- a/app/components/course-page/header/tab-list.ts +++ b/app/components/course-page/header/tab-list.ts @@ -31,12 +31,13 @@ export default class TabListComponent extends Component { get allTabs(): Tab[] { return { - SetupStep: this.setupTabs, + SetupStep: this.introductionTabs, // Can be the same as IntroductionStep for now CourseCompletedStep: this.courseCompletedTabs, CourseStageStep: this.stageTabs, IntroductionStep: this.introductionTabs, BaseStagesCompletedStep: this.courseCompletedTabs, // Can be the same as CourseCompletedStep for now ExtensionCompletedStep: this.courseCompletedTabs, // Can be the same as CourseCompletedStep for now + PreChallengeAssessmentStep: this.introductionTabs, // Can be the same as IntroductionStep for now }[this.args.currentStep.type]; } @@ -74,21 +75,6 @@ export default class TabListComponent extends Component { ]; } - get setupTabs(): Tab[] { - return [ - { - icon: 'document-text', - name: 'Instructions', - slug: 'instructions', - internalLink: { - route: this.args.currentStep.routeParams.route, - models: this.args.currentStep.routeParams.models, - }, - isActive: this.router.currentRouteName === this.args.currentStep.routeParams.route, - }, - ]; - } - get stageTabs(): Tab[] { const tabs: Tab[] = []; diff --git a/app/components/course-page/introduction-step/legacy/create-repository-card.hbs b/app/components/course-page/introduction-step/legacy/create-repository-card.hbs index 4c1275c13e..8bbea75b3f 100644 --- a/app/components/course-page/introduction-step/legacy/create-repository-card.hbs +++ b/app/components/course-page/introduction-step/legacy/create-repository-card.hbs @@ -12,14 +12,7 @@ <:expandedSection> - {{#if (eq this.expandedSection.type "SelectLanguageSection")}} - - {{else if (eq this.expandedSection.type "SelectLanguageProficiencyLevelSection")}} + {{#if (eq this.expandedSection.type "SelectLanguageProficiencyLevelSection")}} -
+

Welcome to the {{@repository.course.name}} @@ -10,8 +10,8 @@

diff --git a/app/components/course-page/introduction-step/welcome-section.ts b/app/components/course-page/introduction-step/welcome-section.ts index d61665e279..480d6a5e68 100644 --- a/app/components/course-page/introduction-step/welcome-section.ts +++ b/app/components/course-page/introduction-step/welcome-section.ts @@ -1,7 +1,11 @@ +import * as Sentry from '@sentry/ember'; import Component from '@glimmer/component'; +import LanguageModel from 'codecrafters-frontend/models/language'; import type RepositoryModel from 'codecrafters-frontend/models/repository'; +import type RouterService from '@ember/routing/router-service'; import { action } from '@ember/object'; -import LanguageModel from 'codecrafters-frontend/models/language'; +import { service } from '@ember/service'; +import { tracked } from '@glimmer/tracking'; export interface Signature { Element: HTMLDivElement; @@ -12,6 +16,8 @@ export interface Signature { } export default class WelcomeSectionComponent extends Component { + @service declare router: RouterService; + @tracked repositoryCreationErrorMessage?: string; @action @@ -30,7 +36,7 @@ export default class WelcomeSectionComponent extends Component { return; } - this.expandNextSection(); + // this.expandNextSection(); this.router.transitionTo({ queryParams: { repo: this.args.repository.id, track: null } }); } diff --git a/app/components/course-page/step-content.hbs b/app/components/course-page/step-content.hbs index 81c072e48f..ae74d5389e 100644 --- a/app/components/course-page/step-content.hbs +++ b/app/components/course-page/step-content.hbs @@ -1,4 +1,4 @@ -
+
{{#if (and (not this.shouldHideCompletionNotice) @step.completionNoticeMessage)}} {{svg-jar "arrow-right" class="w-4 h-4 fill-current text-teal-500"}}
+ {{else if (eq @step.type "PreChallengeAssessmentStep")}} +
+ {{svg-jar "dots-horizontal" class="w-4 h-4 fill-current text-teal-500"}} +
{{else if (eq @step.type "CourseStageStep")}}
{{svg-jar "dots-horizontal" class="w-4 h-4 fill-current text-teal-500"}} diff --git a/app/controllers/course/pre-challenge-assessment.ts b/app/controllers/course/pre-challenge-assessment.ts new file mode 100644 index 0000000000..7b26908f13 --- /dev/null +++ b/app/controllers/course/pre-challenge-assessment.ts @@ -0,0 +1,17 @@ +import Controller from '@ember/controller'; +import { inject as service } from '@ember/service'; +import type AuthenticatorService from 'codecrafters-frontend/services/authenticator'; +import type CoursePageStateService from 'codecrafters-frontend/services/course-page-state'; +import type { ModelType as CourseRouteModelType } from 'codecrafters-frontend/routes/course'; +import type Step from 'codecrafters-frontend/utils/course-page-step-list/step'; + +export default class PreChallengeAssessmentController extends Controller { + declare model: CourseRouteModelType; + + @service declare authenticator: AuthenticatorService; + @service declare coursePageState: CoursePageStateService; + + get currentStep(): Step { + return this.coursePageState.currentStep as Step; + } +} diff --git a/app/router.ts b/app/router.ts index 40f7389cf6..8aedef2a2d 100644 --- a/app/router.ts +++ b/app/router.ts @@ -46,6 +46,7 @@ Router.map(function () { // TODO: Add dark mode support this.route('course', { path: '/courses/:course_slug' }, function () { this.route('introduction'); + this.route('pre-challenge-assessment'); this.route('setup'); // Stage identifier either be '1' (for base stages) or 'ext2:1' (for extension stages) diff --git a/app/templates/course/pre-challenge-assessment.hbs b/app/templates/course/pre-challenge-assessment.hbs new file mode 100644 index 0000000000..3ca187fa2d --- /dev/null +++ b/app/templates/course/pre-challenge-assessment.hbs @@ -0,0 +1,13 @@ + +
+
+ Complete the pre-challenge assessment below to proceed: +
+ + +
+ \ No newline at end of file diff --git a/app/utils/course-page-step-list.ts b/app/utils/course-page-step-list.ts index 5ddf97903a..552807517f 100644 --- a/app/utils/course-page-step-list.ts +++ b/app/utils/course-page-step-list.ts @@ -10,6 +10,7 @@ import RepositoryStageListItemModel from 'codecrafters-frontend/models/repositor import CourseCompletedStep from 'codecrafters-frontend/utils/course-page-step-list/course-completed-step'; import CourseStageStep from 'codecrafters-frontend/utils/course-page-step-list/course-stage-step'; import IntroductionStep from 'codecrafters-frontend/utils/course-page-step-list/introduction-step'; +import PreChallengeAssessmentStep from 'codecrafters-frontend/utils/course-page-step-list/pre-challenge-assessment-step'; import SetupStep from 'codecrafters-frontend/utils/course-page-step-list/setup-step'; import Step from 'codecrafters-frontend/utils/course-page-step-list/step'; import StepGroup from 'codecrafters-frontend/utils/course-page-step-list/step-group'; @@ -31,6 +32,7 @@ export class StepList { const steps: Step[] = []; steps.push(new IntroductionStep(this.repository)); + steps.push(new PreChallengeAssessmentStep(this.repository)); steps.push(new SetupStep(this.repository)); if (!this.repository.stageList) { diff --git a/app/utils/course-page-step-list/introduction-step.ts b/app/utils/course-page-step-list/introduction-step.ts index 2114674d3b..1c6c728cd3 100644 --- a/app/utils/course-page-step-list/introduction-step.ts +++ b/app/utils/course-page-step-list/introduction-step.ts @@ -15,13 +15,7 @@ export default class IntroductionStep extends Step { if (this.status === 'complete') { return { dotType: 'none', - text: 'Introduction complete.', - }; - } else if (this.status === 'in_progress') { - return { - dotColor: 'yellow', - dotType: 'blinking', - text: 'Complete pre-challenge assessment to proceed', + text: 'Language selected.', }; } else { return { @@ -40,27 +34,11 @@ export default class IntroductionStep extends Step { } get status() { - // @ts-ignore - if (this.repository.isNew) { - return 'not_started'; - } - - // Old users don't have a pre-challenge assessment, let's still show this as completed for them. - // @ts-ignore - if (this.repository.firstSubmissionCreated) { - return 'complete'; - } - - // @ts-ignore - if (this.repository.preChallengeAssessmentSectionList.isComplete) { - return 'complete'; - } - - return 'in_progress'; + return this.repository.language ? 'complete' : 'not_started'; } get title() { - return 'Introduction'; + return 'Select language'; } get type(): 'IntroductionStep' { diff --git a/app/utils/course-page-step-list/pre-challenge-assessment-step.ts b/app/utils/course-page-step-list/pre-challenge-assessment-step.ts new file mode 100644 index 0000000000..f164ee2842 --- /dev/null +++ b/app/utils/course-page-step-list/pre-challenge-assessment-step.ts @@ -0,0 +1,51 @@ +import Step from 'codecrafters-frontend/utils/course-page-step-list/step'; +import type ProgressIndicator from 'codecrafters-frontend/utils/course-page-step-list/progress-indicator'; +import { tracked } from '@glimmer/tracking'; +import type RepositoryModel from 'codecrafters-frontend/models/repository'; + +export default class PreChallengeAssessmentStep extends Step { + @tracked repository: RepositoryModel; + + constructor(repository: RepositoryModel) { + super(); + + this.repository = repository; + } + + get progressIndicator(): ProgressIndicator | null { + if (this.status === 'complete') { + return { + dotType: 'none', + text: 'Pre-challenge assessment complete.', + }; + } else { + return { + dotType: 'none', + text: 'Complete pre-challenge assessment to proceed', + }; + } + } + + get routeParams() { + return { + route: 'course.pre-challenge-assessment', + models: [this.repository.course.slug], + }; + } + + get status() { + if (!this.repository.language) { + return 'locked'; + } + + return this.repository.preChallengeAssessmentSectionList.isComplete ? 'complete' : 'in_progress'; + } + + get title() { + return 'Pre-challenge assessment'; + } + + get type(): 'PreChallengeAssessmentStep' { + return 'PreChallengeAssessmentStep'; + } +} diff --git a/app/utils/course-page-step-list/step.ts b/app/utils/course-page-step-list/step.ts index e6e5ab4053..4d19598377 100644 --- a/app/utils/course-page-step-list/step.ts +++ b/app/utils/course-page-step-list/step.ts @@ -3,6 +3,7 @@ import { type ProgressIndicatorWithDot } from 'codecrafters-frontend/utils/cours export type StepType = | 'IntroductionStep' + | 'PreChallengeAssessmentStep' | 'SetupStep' | 'CourseStageStep' | 'BaseStagesCompletedStep' diff --git a/app/utils/pre-challenge-assessment-section-list.ts b/app/utils/pre-challenge-assessment-section-list.ts index ed1ac2ce06..62336f9d8e 100644 --- a/app/utils/pre-challenge-assessment-section-list.ts +++ b/app/utils/pre-challenge-assessment-section-list.ts @@ -139,7 +139,6 @@ export class SectionList { export function buildSectionList(repository: RepositoryModel) { return new SectionList([ - new SelectLanguageSection(repository), new SelectLanguageProficiencyLevelSection(repository), new SelectExpectedActivityFrequencySection(repository), new SelectRemindersPreferenceSection(repository), diff --git a/tests/acceptance/course-page/complete-first-stage-test.js b/tests/acceptance/course-page/complete-first-stage-test.js index 80460ed8af..ba7fdb5544 100644 --- a/tests/acceptance/course-page/complete-first-stage-test.js +++ b/tests/acceptance/course-page/complete-first-stage-test.js @@ -44,6 +44,8 @@ module('Acceptance | course-page | complete-first-stage', function (hooks) { assert.notOk(coursePage.firstStageTutorialCard.steps[1].isComplete, 'Second step is not complete'); assert.notOk(coursePage.firstStageTutorialCard.steps[1].isExpanded, 'Second step is not expanded'); + // await this.pauseTest(); + await coursePage.firstStageTutorialCard.steps[0].click(); assert.notOk(coursePage.firstStageTutorialCard.steps[0].isComplete, 'First step is not complete');