fix(curriculum): reset lesson text (#56130)

Co-authored-by: Tom <20648924+moT01@users.noreply.github.com>

client/i18n/locales/english/translations.json

@@ -52,6 +52,8 @@
     "create-post": "Create a help post on the forum",
     "cancel": "Cancel",
     "reset-lesson": "Reset this lesson",
+    "revert": "Revert",
+    "revert-to-saved-code": "Revert to Saved Code",
     "run": "Run",
     "run-test": "Run the Tests (Ctrl + Enter)",
     "check-code": "Check Your Code",
@@ -420,6 +422,7 @@
     "reset": "Reset this lesson?",
     "reset-warn": "Are you sure you wish to reset this lesson? The editors and tests will be reset.",
     "reset-warn-2": "This cannot be undone.",
+    "revert-warn": "Are you sure you wish to revert this lesson? Your latest changes will be undone and the code reverted to the most recently saved version.",
     "scrimba-tip": "Tip: If the mini-browser is covering the code, click and drag to move it. Also, feel free to stop and edit the code in the video at any time.",
     "chal-preview": "Challenge Preview",
     "donation-record-not-found": "Your donation record has not been found.",

client/src/templates/Challenges/classic/show.tsx

@@ -522,7 +522,7 @@ function ShowClassic({
         <CompletionModal />
         <HelpModal challengeTitle={title} challengeBlock={blockName} />
         <VideoModal videoUrl={videoUrl} />
-        <ResetModal />
+        <ResetModal challengeType={challengeType} />
         <ProjectPreviewModal
           challengeData={challengeData}
           closeText={t('buttons.start-coding')}

client/src/templates/Challenges/components/reset-modal.tsx

@@ -8,10 +8,12 @@ import { Button, Modal } from '@freecodecamp/ui';
 import { closeModal, resetChallenge } from '../redux/actions';
 import { isResetModalOpenSelector } from '../redux/selectors';
 import callGA from '../../../analytics/call-ga';
+import { isProjectBased } from '../../../utils/curriculum-layout';
 
 interface ResetModalProps {
   close: () => void;
   isOpen: boolean;
+  challengeType: number;
   reset: () => void;
 }
 
@@ -35,7 +37,12 @@ function withActions(...fns: Array<() => void>) {
   return () => fns.forEach(fn => fn());
 }
 
-function ResetModal({ reset, close, isOpen }: ResetModalProps): JSX.Element {
+function ResetModal({
+  reset,
+  close,
+  challengeType,
+  isOpen
+}: ResetModalProps): JSX.Element {
   const { t } = useTranslation();
   if (isOpen) {
     callGA({ event: 'pageview', pagePath: '/reset-modal' });
@@ -46,7 +53,11 @@ function ResetModal({ reset, close, isOpen }: ResetModalProps): JSX.Element {
         {t('learn.reset')}
       </Modal.Header>
       <Modal.Body alignment='center'>
-        <p>{t('learn.reset-warn')}</p>
+        <p>
+          {isProjectBased(challengeType)
+            ? t('learn.revert-warn')
+            : t('learn.reset-warn')}
+        </p>
         <p>
           <em>{t('learn.reset-warn-2')}</em>
         </p>
@@ -58,7 +69,9 @@ function ResetModal({ reset, close, isOpen }: ResetModalProps): JSX.Element {
           variant='danger'
           onClick={withActions(reset, close)}
         >
-          {t('buttons.reset-lesson')}
+          {isProjectBased(challengeType)
+            ? t('buttons.revert-to-saved-code')
+            : t('buttons.reset-lesson')}
         </Button>
       </Modal.Footer>
     </Modal>

client/src/templates/Challenges/components/tool-panel.tsx

@@ -15,6 +15,7 @@ import { challengeMetaSelector } from '../redux/selectors';
 import { saveChallenge } from '../../../redux/actions';
 import { isSignedInSelector } from '../../../redux/selectors';
 import { Spacer } from '../../../components/helpers';
+import { isProjectBased } from '../../../utils/curriculum-layout';
 
 const mapStateToProps = createSelector(
   challengeMetaSelector,
@@ -90,7 +91,17 @@ function ToolPanel({
       <>
         <Spacer size='xxSmall' />
         <Button block={true} variant='primary' onClick={openResetModal}>
-          {isMobile ? t('buttons.reset') : t('buttons.reset-lesson')}
+          {isMobile
+            ? t(
+                isProjectBased(challengeType)
+                  ? 'buttons.revert'
+                  : 'buttons.reset'
+              )
+            : t(
+                isProjectBased(challengeType)
+                  ? 'buttons.revert-to-saved-code'
+                  : 'buttons.reset-lesson'
+              )}
         </Button>
       </>
       <Spacer size='xxSmall' />

e2e/challenge-reset-modal.spec.ts

@@ -21,16 +21,9 @@ const expectToRenderResetModal = async (page: Page) => {
     })
   ).toBeVisible();
 
-  await expect(page.getByText(translations.learn['reset-warn'])).toBeVisible();
   await expect(
     page.getByText(translations.learn['reset-warn-2'])
   ).toBeVisible();
-
-  await expect(
-    page.getByRole('button', {
-      name: translations.buttons['reset-lesson']
-    })
-  ).toBeVisible();
 };
 
 test('should render the modal content correctly', async ({ page }) => {
@@ -41,6 +34,14 @@ test('should render the modal content correctly', async ({ page }) => {
   await page.getByRole('button', { name: translations.buttons.reset }).click();
 
   await expectToRenderResetModal(page);
+
+  await expect(
+    page.getByRole('button', {
+      name: translations.buttons['reset-lesson']
+    })
+  ).toBeVisible();
+
+  await expect(page.getByText(translations.learn['reset-warn'])).toBeVisible();
 });
 
 test('User can reset challenge', async ({ page, isMobile, browserName }) => {
@@ -190,16 +191,24 @@ test('User can reset on a multi-file project', async ({
   await getEditors(page).fill(sampleText);
   await expect(page.getByText(sampleText)).toBeVisible();
 
-  await page.getByRole('button', { name: translations.buttons.reset }).click();
+  await page.getByRole('button', { name: translations.buttons.revert }).click();
 
   await expectToRenderResetModal(page);
 
+  await expect(
+    page.getByRole('button', {
+      name: translations.buttons['revert-to-saved-code']
+    })
+  ).toBeVisible();
+
   await page
     .getByRole('button', {
-      name: translations.buttons['reset-lesson']
+      name: translations.buttons['revert-to-saved-code']
     })
     .click();
 
+  await expect(page.getByText(translations.learn['revert-warn'])).toBeVisible();
+
   await expect(page.getByText(sampleText)).not.toBeVisible();
 });
 
@@ -241,12 +250,12 @@ test.describe('Signed in user', () => {
     await getEditors(page).fill(updatedText);
 
     await page
-      .getByRole('button', { name: translations.buttons.reset })
+      .getByRole('button', { name: translations.buttons.revert })
       .click();
 
     await page
       .getByRole('button', {
-        name: translations.buttons['reset-lesson']
+        name: translations.buttons['revert-to-saved-code']
       })
       .click();
 
@@ -279,12 +288,12 @@ test.describe('Signed in user', () => {
     await getEditors(page).fill(updatedText);
 
     await page
-      .getByRole('button', { name: translations.buttons.reset })
+      .getByRole('button', { name: translations.buttons.revert })
       .click();
 
     await page
       .getByRole('button', {
-        name: translations.buttons['reset-lesson']
+        name: translations.buttons['revert-to-saved-code']
       })
       .click();