diff --git a/client/src/templates/Challenges/classic/Show.js b/client/src/templates/Challenges/classic/Show.js index 2e467bd7f9..501d94dbc0 100644 --- a/client/src/templates/Challenges/classic/Show.js +++ b/client/src/templates/Challenges/classic/Show.js @@ -277,8 +277,10 @@ class ShowClassic extends Component { render() { const { + block, fields: { blockName }, forumTopicId, + superBlock, title } = this.getChallenge(); const { @@ -331,7 +333,11 @@ class ShowClassic extends Component { testOutput={this.renderTestOutput()} /> - + diff --git a/client/src/templates/Challenges/components/CompletionModal.js b/client/src/templates/Challenges/components/CompletionModal.js index 7fbfd5a543..8ebfaf9d87 100644 --- a/client/src/templates/Challenges/components/CompletionModal.js +++ b/client/src/templates/Challenges/components/CompletionModal.js @@ -70,6 +70,7 @@ const mapDispatchToProps = function (dispatch) { const propTypes = { allowBlockDonationRequests: PropTypes.func, + block: PropTypes.string, blockName: PropTypes.string, close: PropTypes.func.isRequired, completedChallengesIds: PropTypes.array, @@ -81,6 +82,7 @@ const propTypes = { isSignedIn: PropTypes.bool.isRequired, message: PropTypes.string, submitChallenge: PropTypes.func.isRequired, + superBlock: PropTypes.string, t: PropTypes.func.isRequired, title: PropTypes.string }; @@ -184,13 +186,14 @@ export class CompletionModalInner extends Component { render() { const { - blockName = '', + block, close, isOpen, message, t, title, - isSignedIn + isSignedIn, + superBlock = '' } = this.props; const { completedPercent } = this.state; @@ -220,8 +223,9 @@ export class CompletionModalInner extends Component { diff --git a/client/src/templates/Challenges/components/CompletionModalBody.js b/client/src/templates/Challenges/components/CompletionModalBody.js index 58592ac6da..1af6745b0f 100644 --- a/client/src/templates/Challenges/components/CompletionModalBody.js +++ b/client/src/templates/Challenges/components/CompletionModalBody.js @@ -5,8 +5,9 @@ import GreenPass from '../../../assets/icons/GreenPass'; import { withTranslation } from 'react-i18next'; const propTypes = { - blockName: PropTypes.string, + block: PropTypes.string, completedPercent: PropTypes.number, + superBlock: PropTypes.string, t: PropTypes.func.isRequired }; @@ -58,7 +59,8 @@ export class CompletionModalBody extends PureComponent { } render() { - const { blockName, completedPercent, t } = this.props; + const { block, completedPercent, superBlock, t } = this.props; + const blockTitle = t(`intro:${superBlock}.blocks.${block}.title`); return ( <> @@ -73,7 +75,7 @@ export class CompletionModalBody extends PureComponent { />
-
{blockName}
+
{blockTitle}
{t('learn.percent-complete', { diff --git a/client/src/templates/Challenges/components/CompletionModalBody.test.js b/client/src/templates/Challenges/components/CompletionModalBody.test.js index 9f8f71f8e9..4aca48f988 100644 --- a/client/src/templates/Challenges/components/CompletionModalBody.test.js +++ b/client/src/templates/Challenges/components/CompletionModalBody.test.js @@ -6,8 +6,9 @@ import { render, fireEvent } from '@testing-library/react'; import CompletionModalBody from './CompletionModalBody'; const props = { - blockName: 'Basic HTML and HTML5', - completedPercent: Math.floor(Math.random() * 101) + block: 'basic-html-and-html5', + completedPercent: Math.floor(Math.random() * 101), + superBlock: 'responsive-web-design' }; describe('', () => { diff --git a/client/src/templates/Challenges/components/__snapshots__/CompletionModalBody.test.js.snap b/client/src/templates/Challenges/components/__snapshots__/CompletionModalBody.test.js.snap index eb447a6d86..c07104cca5 100644 --- a/client/src/templates/Challenges/components/__snapshots__/CompletionModalBody.test.js.snap +++ b/client/src/templates/Challenges/components/__snapshots__/CompletionModalBody.test.js.snap @@ -64,7 +64,7 @@ exports[` matches snapshot 1`] = `
- Basic HTML and HTML5 + intro:responsive-web-design.blocks.basic-html-and-html5.title
- + diff --git a/client/src/templates/Challenges/projects/frontend/Show.js b/client/src/templates/Challenges/projects/frontend/Show.js index 27de6cce9f..c868707c0d 100644 --- a/client/src/templates/Challenges/projects/frontend/Show.js +++ b/client/src/templates/Challenges/projects/frontend/Show.js @@ -176,7 +176,11 @@ export class Project extends Component {
- + diff --git a/client/src/templates/Challenges/video/Show.js b/client/src/templates/Challenges/video/Show.js index cdc271ad84..8b71a77a19 100644 --- a/client/src/templates/Challenges/video/Show.js +++ b/client/src/templates/Challenges/video/Show.js @@ -298,7 +298,11 @@ export class Project extends Component { - +