fix(client): fix v7 certlocation (#41565)

client/src/templates/Introduction/SuperBlockIntro.js

@@ -132,7 +132,7 @@ export class SuperBlockIntroductionPage extends Component {
     const {
       data: {
         markdownRemark: {
-          frontmatter: { superBlock }
+          frontmatter: { superBlock, title }
         },
         allChallengeNode: { edges }
       },
@@ -175,7 +175,7 @@ export class SuperBlockIntroductionPage extends Component {
                 ))}
                 {superBlock !== 'coding-interview-prep' && (
                   <div>
-                    <CertChallenge superBlock={superBlock} />
+                    <CertChallenge superBlock={superBlock} title={title} />
                   </div>
                 )}
               </div>
@@ -216,6 +216,7 @@ export const query = graphql`
     markdownRemark(fields: { slug: { eq: $slug } }) {
       frontmatter {
         superBlock
+        title
       }
     }
     allChallengeNode(

client/src/templates/Introduction/components/CertChallenge.js

@@ -10,10 +10,12 @@ import GreenPass from '../../../assets/icons/GreenPass';
 import GreenNotCompleted from '../../../assets/icons/GreenNotCompleted';
 import { userSelector } from '../../../redux';
 import { User } from '../../../redux/propTypes';
+import { certMap } from '../../../resources/certAndProjectMap';
 
 const propTypes = {
   superBlock: PropTypes.string,
   t: PropTypes.func,
+  title: PropTypes.string,
   user: User
 };
 
@@ -28,6 +30,7 @@ export class CertChallenge extends Component {
     const {
       superBlock,
       t,
+      title,
       user: {
         is2018DataVisCert,
         isApisMicroservicesCert,
@@ -56,8 +59,9 @@ export class CertChallenge extends Component {
       'machine-learning-with-python': isMachineLearningPyCertV7
     };
 
+    const cert = certMap.find(x => x.title === title);
     const isCertified = userCertificates[superBlock];
-    const certLocation = `/certification/${username}/${superBlock}`;
+    const certLocation = `/certification/${username}/${cert.slug}`;
     const certCheckmarkStyle = { height: '40px', width: '40px' };
     const i18nSuperBlock = t(`intro:${superBlock}.title`);
     const i18nCertText = t(`intro:misc-text.certification`, {