diff --git a/client/i18n/locales/english/translations.json b/client/i18n/locales/english/translations.json index 9a1cae4d2da..66ee8a7dac8 100644 --- a/client/i18n/locales/english/translations.json +++ b/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.", diff --git a/client/src/templates/Challenges/classic/show.tsx b/client/src/templates/Challenges/classic/show.tsx index 37658f649a6..98ddec58bcd 100644 --- a/client/src/templates/Challenges/classic/show.tsx +++ b/client/src/templates/Challenges/classic/show.tsx @@ -522,7 +522,7 @@ function ShowClassic({ - + 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')} -

{t('learn.reset-warn')}

+

+ {isProjectBased(challengeType) + ? t('learn.revert-warn') + : t('learn.reset-warn')} +

{t('learn.reset-warn-2')}

@@ -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')} diff --git a/client/src/templates/Challenges/components/tool-panel.tsx b/client/src/templates/Challenges/components/tool-panel.tsx index e8bfcb2561d..5d2e7964e6d 100644 --- a/client/src/templates/Challenges/components/tool-panel.tsx +++ b/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({ <> diff --git a/e2e/challenge-reset-modal.spec.ts b/e2e/challenge-reset-modal.spec.ts index ee208a6d65b..ac023c6b33d 100644 --- a/e2e/challenge-reset-modal.spec.ts +++ b/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();