refactor: use dashedName over dasherize(title)

client/gatsby-node.js

@@ -19,10 +19,10 @@ const createByIdentityMap = {
 exports.onCreateNode = function onCreateNode({ node, actions, getNode }) {
   const { createNodeField } = actions;
   if (node.internal.type === 'ChallengeNode') {
-    const { tests = [], block, title, superBlock } = node;
+    const { tests = [], block, dashedName, superBlock } = node;
     const slug = `/learn/${dasherize(superBlock)}/${dasherize(
       block
-    )}/${dasherize(title)}`;
+    )}/${dashedName}`;
     createNodeField({ node, name: 'slug', value: slug });
     createNodeField({ node, name: 'blockName', value: blockNameify(block) });
     createNodeField({ node, name: 'tests', value: tests });

client/src/components/Map/components/Block.js

@@ -99,11 +99,7 @@ export class Block extends Component {
       return (
         <li
           className={'map-challenge-title' + completedClass}
-          id={
-            challenge.title
-              ? dasherize(challenge.title)
-              : dasherize(challenge.frontmatter.title)
-          }
+          id={challenge.dashedName || dasherize(challenge.frontmatter.title)}
           key={'map-challenge' + challenge.fields.slug}
         >
           <span className='badge map-badge'>

client/src/templates/Challenges/components/CompletionModal.js

@@ -192,6 +192,9 @@ export class CompletionModalInner extends Component {
     if (isOpen) {
       executeGA({ type: 'modal', data: '/completion-modal' });
     }
+    // normally dashedName should be graphQL queried and then passed around,
+    // but it's only used to make a nice filename for downloading, so dasherize
+    // is fine here.
     const dashedName = dasherize(title);
     return (
       <Modal