feat: add share in twitter button to the end of project. (#49395)

Co-authored-by: Muhammed Mustafa <muhammed@freecodecamp.org>
Co-authored-by: ahmad abdolsaheb <ahmad.abdolsaheb@gmail.com>
Co-authored-by: Muhammed Mustafa <MuhammedElruby@gmail.com>

client/i18n/locales/english/translations.json

@@ -77,6 +77,7 @@
     "change-language": "Change Language",
     "resume-project": "Resume project",
     "start-project": "Start project",
+    "tweet": "Tweet",
     "previous-question": "Previous question",
     "next-question": "Next question",
     "finish-exam": "Finish the exam",

client/src/components/share/index.tsx

@@ -0,0 +1,12 @@
+import React from 'react';
+import { ShareTemplate } from './share-template';
+import { ShareProps } from './types';
+import { useShare } from './use-share';
+
+export const Share = ({ superBlock, block }: ShareProps): JSX.Element => {
+  const redirectURL = useShare({
+    superBlock,
+    block
+  });
+  return <ShareTemplate redirectURL={redirectURL} />;
+};

client/src/components/share/share-template.test.tsx

@@ -0,0 +1,16 @@
+import React from 'react';
+import { render, screen } from '@testing-library/react';
+import { ShareTemplate } from './share-template';
+
+const redirectURL = 'string';
+
+describe('Share Template Testing', () => {
+  render(<ShareTemplate redirectURL={redirectURL} />);
+  test('Testing share templete Click Redirect Event', () => {
+    const link = screen.getByRole('link', {
+      name: 'buttons.tweet aria.opens-new-window'
+    });
+    expect(link).toBeInTheDocument();
+    expect(link).toHaveAttribute('href', 'string');
+  });
+});

client/src/components/share/share-template.tsx

@@ -0,0 +1,29 @@
+import React from 'react';
+import { useTranslation } from 'react-i18next';
+import { faTwitter } from '@fortawesome/free-brands-svg-icons';
+import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
+import { ShareRedirectProps } from './types';
+
+export const ShareTemplate: React.ComponentType<ShareRedirectProps> = ({
+  redirectURL
+}) => {
+  const { t } = useTranslation();
+  return (
+    <a
+      data-testid='ShareTemplateWrapperTestID'
+      className='btn fade-in'
+      href={redirectURL}
+      target='_blank'
+      rel='noreferrer'
+    >
+      <FontAwesomeIcon
+        icon={faTwitter}
+        size='1x'
+        aria-label='twitterIcon'
+        aria-hidden='true'
+      />
+      {t('buttons.tweet')}
+      <span className='sr-only'>{t('aria.opens-new-window')}</span>
+    </a>
+  );
+};

client/src/components/share/types.ts

@@ -0,0 +1,8 @@
+export interface ShareProps {
+  superBlock: string;
+  block: string;
+}
+
+export interface ShareRedirectProps {
+  redirectURL: string;
+}

client/src/components/share/use-share.test.tsx

@@ -0,0 +1,29 @@
+import { useTranslation } from 'react-i18next';
+import {
+  action,
+  hastag,
+  nextLine,
+  space,
+  twitterDevelpoerDomainURL,
+  twitterDomain,
+  useShare
+} from './use-share';
+
+test('useShare testing', () => {
+  const superBlock = 'testSuperBlock';
+  const block = 'testBlock';
+  const { t } = useTranslation();
+
+  const redirectURL = useShare({
+    superBlock: superBlock,
+    block: block
+  });
+
+  const freecodecampLearnDomain = 'www.freecodecamp.org/learn';
+  const i18nSupportedBlock = t(`intro:${superBlock}.blocks.${block}.title`);
+  const tweetMessage = `I${space}have${space}completed${space}${i18nSupportedBlock}${space}%23freecodecamp`;
+  const redirectFreeCodeCampLearnURL = `https://${freecodecampLearnDomain}/${superBlock}/${hastag}${block}`;
+  expect(redirectURL).toBe(
+    `https://${twitterDomain}/${action}?original_referer=${twitterDevelpoerDomainURL}&text=${tweetMessage}${nextLine}&url=${redirectFreeCodeCampLearnURL}`
+  );
+});

client/src/components/share/use-share.tsx

@@ -0,0 +1,22 @@
+import { useTranslation } from 'react-i18next';
+import { ShareProps } from './types';
+
+export const space = '%20';
+export const hastag = '%23';
+export const nextLine = '%0A';
+export const action = 'intent/tweet';
+export const twitterDomain = 'twitter.com';
+export const freecodecampLearnDomainURL = 'www.freecodecamp.org/learn';
+export const twitterDevelpoerDomainURL = 'https://developer.twitter.com';
+
+export const useShare = ({ superBlock, block }: ShareProps): string => {
+  const { t } = useTranslation();
+  const redirectFreeCodeCampLearnURL = `https://${freecodecampLearnDomainURL}/${superBlock}/${hastag}${block}`;
+
+  const i18nSupportedBlock = t(`intro:${superBlock}.blocks.${block}.title`);
+
+  const tweetMessage = `I${space}have${space}completed${space}${i18nSupportedBlock}${space}${hastag}freecodecamp`;
+  const redirectURL = `https://${twitterDomain}/${action}?original_referer=${twitterDevelpoerDomainURL}&text=${tweetMessage}${nextLine}&url=${redirectFreeCodeCampLearnURL}`;
+
+  return redirectURL;
+};

client/src/templates/Challenges/classic/editor.css

@@ -168,11 +168,11 @@ textarea.inputarea {
   gap: 0.75rem;
 }
 
-.utility-bar > button {
+.utility-bar > * {
   display: flex;
   align-items: center;
   justify-content: center;
-  gap: 0.25rem;
+  gap: 0.3rem;
   padding: 6px 0;
 }
 

client/src/templates/Challenges/classic/lower-jaw.tsx

@@ -2,6 +2,8 @@ import React, { useState, useEffect, useRef } from 'react';
 import { useTranslation } from 'react-i18next';
 import { Button } from '@freecodecamp/react-bootstrap';
 
+import { createSelector } from 'reselect';
+import { connect } from 'react-redux';
 import Fail from '../../../assets/icons/fail';
 import LightBulb from '../../../assets/icons/lightbulb';
 import GreenPass from '../../../assets/icons/green-pass';
@@ -10,17 +12,25 @@ import Help from '../../../assets/icons/help';
 import Reset from '../../../assets/icons/reset';
 import { MAX_MOBILE_WIDTH } from '../../../../../config/misc';
 import { apiLocation } from '../../../../../config/env.json';
+import { ChallengeMeta } from '../../../redux/prop-types';
+import { Share } from '../../../components/share';
+import { ShareProps } from '../../../components/share/types';
 import ProgressBar from '../../../components/ProgressBar';
 import Quote from '../../../assets/icons/quote';
+import {
+  challengeMetaSelector,
+  completedPercentageSelector
+} from '../redux/selectors';
 
 const lowerJawButtonStyle = 'btn-block btn';
 
-interface LowerJawPanelProps {
+interface LowerJawPanelProps extends ShareProps {
+  resetButtonText: string;
+  helpButtonText: string;
   resetButtonEvent: () => void;
   helpButtonEvent: () => void;
   hideHelpButton: boolean;
-  resetButtonText: string;
-  helpButtonText: string;
+  showShareButton: boolean;
 }
 
 interface LowerJawTipsProps {
@@ -37,7 +47,9 @@ interface LowerJawStatusProps {
   testText: string;
 }
 
-interface LowerJawProps {
+export interface LowerJawProps {
+  challengeMeta: ChallengeMeta;
+  completedPercent: number;
   hint?: string;
   challengeIsCompleted: boolean;
   openHelpModal: () => void;
@@ -50,12 +62,24 @@ interface LowerJawProps {
   updateContainer: () => void;
 }
 
+const mapStateToProps = createSelector(
+  challengeMetaSelector,
+  completedPercentageSelector,
+  (challengeMeta: ChallengeMeta, completedPercent: number) => ({
+    challengeMeta,
+    completedPercent
+  })
+);
+
 const LowerButtonsPanel = ({
   resetButtonText,
   helpButtonText,
   resetButtonEvent,
   hideHelpButton,
-  helpButtonEvent
+  helpButtonEvent,
+  showShareButton,
+  superBlock,
+  block
 }: LowerJawPanelProps) => {
   return (
     <>
@@ -69,6 +93,7 @@ const LowerButtonsPanel = ({
           <Reset />
           {resetButtonText}
         </button>
+        {showShareButton && <Share superBlock={superBlock} block={block} />}
 
         {hideHelpButton && (
           <button
@@ -137,7 +162,11 @@ const LowerJawStatus = ({
   );
 };
 
+const isBlockCompleted = 100;
+
 const LowerJaw = ({
+  challengeMeta: { superBlock, block },
+  completedPercent,
   openHelpModal,
   challengeIsCompleted,
   hint,
@@ -157,6 +186,7 @@ const LowerJaw = ({
   const [isFeedbackHidden, setIsFeedbackHidden] = useState(false);
   const { t } = useTranslation();
   const testFeedbackRef = React.createRef<HTMLDivElement>();
+
   const checkYourCodeButtonRef = useRef<HTMLButtonElement>(null);
   const submitButtonRef = useRef<HTMLButtonElement>(null);
   const [focusManagementCompleted, setFocusManagementCompleted] =
@@ -171,6 +201,9 @@ const LowerJaw = ({
     );
   };
 
+  const showShareButton =
+    challengeIsCompleted && completedPercent === isBlockCompleted;
+
   useEffect(() => {
     // prevent unnecessary updates:
     if (attempts === currentAttempts) return;
@@ -336,6 +369,9 @@ const LowerJaw = ({
           isAttemptsLargerThanTest && !challengeIsCompleted
         )}
         helpButtonEvent={openHelpModal}
+        showShareButton={showShareButton}
+        superBlock={superBlock}
+        block={block}
       />
     </div>
   );
@@ -343,4 +379,4 @@ const LowerJaw = ({
 
 LowerJaw.displayName = 'LowerJaw';
 
-export default LowerJaw;
+export default connect(mapStateToProps)(LowerJaw);

config/superblock-order.js

@@ -0,0 +1,694 @@
+'use strict';
+Object.defineProperty(exports, '__esModule', { value: true });
+exports.getNotAuditedSuperBlocks =
+  exports.getAuditedSuperBlocks =
+  exports.getLearnSuperBlocks =
+  exports.superBlockOrder =
+  exports.defaultSuperBlockOrder =
+  exports.numberOfSuperBlocksOnLanding =
+  exports.orderedSuperBlockStates =
+  exports.SuperBlockStates =
+  exports.TranslationStates =
+  exports.CurriculumMaps =
+    void 0;
+const i18n_1 = require('./i18n');
+const certification_settings_1 = require('./certification-settings');
+/*
+ * .env SHOW_NEW_CURRICULUM = SuperBlockStates.New
+ * 'New' -> shown only on english staging at the moment
+ *
+ * .env SHOW_UPCOMING_CHANGES = SuperBlockStates.Upcoming
+ * 'Upcoming' is for development -> not shown on stag or prod anywhere
+ *
+ */
+var CurriculumMaps;
+(function (CurriculumMaps) {
+  CurriculumMaps['Landing'] = 'landing';
+  CurriculumMaps['Learn'] = 'learn';
+})((CurriculumMaps = exports.CurriculumMaps || (exports.CurriculumMaps = {})));
+var TranslationStates;
+(function (TranslationStates) {
+  TranslationStates['Audited'] = 'audited';
+  TranslationStates['NotAudited'] = 'notAudited';
+})(
+  (TranslationStates =
+    exports.TranslationStates || (exports.TranslationStates = {}))
+);
+var SuperBlockStates;
+(function (SuperBlockStates) {
+  SuperBlockStates['Current'] = 'current';
+  SuperBlockStates['New'] = 'new';
+  SuperBlockStates['Upcoming'] = 'upcoming';
+  SuperBlockStates['Legacy'] = 'legacy';
+})(
+  (SuperBlockStates =
+    exports.SuperBlockStates || (exports.SuperBlockStates = {}))
+);
+exports.orderedSuperBlockStates = [
+  SuperBlockStates.Current,
+  SuperBlockStates.New,
+  SuperBlockStates.Upcoming,
+  SuperBlockStates.Legacy
+];
+// all languages should have this many, one for each current cert
+exports.numberOfSuperBlocksOnLanding = 12;
+/*
+ * This is the used for tests to make sure a superBlock isn't out of order
+ * e.g. so that a RWD button isn't below a JS button.
+ * It compares each array in `superBlockOrder` to this - those arrays do not
+ * have to include all these superBlocks, but the ones it does include, have
+ * to be in this order
+ */
+exports.defaultSuperBlockOrder = [
+  certification_settings_1.SuperBlocks.RespWebDesignNew,
+  certification_settings_1.SuperBlocks.RespWebDesign,
+  certification_settings_1.SuperBlocks.JsAlgoDataStructNew,
+  certification_settings_1.SuperBlocks.JsAlgoDataStruct,
+  certification_settings_1.SuperBlocks.FrontEndDevLibs,
+  certification_settings_1.SuperBlocks.DataVis,
+  certification_settings_1.SuperBlocks.RelationalDb,
+  certification_settings_1.SuperBlocks.BackEndDevApis,
+  certification_settings_1.SuperBlocks.QualityAssurance,
+  certification_settings_1.SuperBlocks.SciCompPy,
+  certification_settings_1.SuperBlocks.DataAnalysisPy,
+  certification_settings_1.SuperBlocks.InfoSec,
+  certification_settings_1.SuperBlocks.MachineLearningPy,
+  certification_settings_1.SuperBlocks.CollegeAlgebraPy,
+  certification_settings_1.SuperBlocks.CodingInterviewPrep,
+  certification_settings_1.SuperBlocks.ProjectEuler,
+  certification_settings_1.SuperBlocks.TheOdinProject
+];
+/*
+ * The order of superblocks in the arrays below are how they appear on the maps
+ *
+ * The 'Landing' map array should contain exactly one superblock for each
+ * current, non-legacy certification, and only one superblock of each type -
+ * e.g. only one RWD superblock (button)
+ *
+ * The 'Learn' map arrays should contain ALL available SuperBlocks, sorted into
+ * their various states. These will be used to create the 'superOrder' property.
+ *
+ */
+exports.superBlockOrder = {
+  [i18n_1.Languages.English]: {
+    [CurriculumMaps.Landing]: [
+      certification_settings_1.SuperBlocks.RespWebDesignNew,
+      certification_settings_1.SuperBlocks.JsAlgoDataStruct,
+      certification_settings_1.SuperBlocks.FrontEndDevLibs,
+      certification_settings_1.SuperBlocks.DataVis,
+      certification_settings_1.SuperBlocks.RelationalDb,
+      certification_settings_1.SuperBlocks.BackEndDevApis,
+      certification_settings_1.SuperBlocks.QualityAssurance,
+      certification_settings_1.SuperBlocks.SciCompPy,
+      certification_settings_1.SuperBlocks.DataAnalysisPy,
+      certification_settings_1.SuperBlocks.InfoSec,
+      certification_settings_1.SuperBlocks.MachineLearningPy,
+      certification_settings_1.SuperBlocks.CollegeAlgebraPy
+    ],
+    [CurriculumMaps.Learn]: {
+      [TranslationStates.Audited]: {
+        [SuperBlockStates.Current]: [
+          certification_settings_1.SuperBlocks.RespWebDesignNew,
+          certification_settings_1.SuperBlocks.JsAlgoDataStruct,
+          certification_settings_1.SuperBlocks.FrontEndDevLibs,
+          certification_settings_1.SuperBlocks.DataVis,
+          certification_settings_1.SuperBlocks.RelationalDb,
+          certification_settings_1.SuperBlocks.BackEndDevApis,
+          certification_settings_1.SuperBlocks.QualityAssurance,
+          certification_settings_1.SuperBlocks.SciCompPy,
+          certification_settings_1.SuperBlocks.DataAnalysisPy,
+          certification_settings_1.SuperBlocks.InfoSec,
+          certification_settings_1.SuperBlocks.MachineLearningPy,
+          certification_settings_1.SuperBlocks.CollegeAlgebraPy,
+          certification_settings_1.SuperBlocks.CodingInterviewPrep,
+          certification_settings_1.SuperBlocks.ProjectEuler
+        ],
+        [SuperBlockStates.New]: [],
+        [SuperBlockStates.Upcoming]: [
+          certification_settings_1.SuperBlocks.JsAlgoDataStructNew,
+          certification_settings_1.SuperBlocks.TheOdinProject
+        ],
+        [SuperBlockStates.Legacy]: [
+          certification_settings_1.SuperBlocks.RespWebDesign
+        ]
+      },
+      [TranslationStates.NotAudited]: {
+        [SuperBlockStates.Current]: [],
+        [SuperBlockStates.New]: [],
+        [SuperBlockStates.Upcoming]: [],
+        [SuperBlockStates.Legacy]: []
+      }
+    }
+  },
+  [i18n_1.Languages.Espanol]: {
+    [CurriculumMaps.Landing]: [
+      certification_settings_1.SuperBlocks.RespWebDesignNew,
+      certification_settings_1.SuperBlocks.JsAlgoDataStruct,
+      certification_settings_1.SuperBlocks.FrontEndDevLibs,
+      certification_settings_1.SuperBlocks.DataVis,
+      certification_settings_1.SuperBlocks.RelationalDb,
+      certification_settings_1.SuperBlocks.BackEndDevApis,
+      certification_settings_1.SuperBlocks.QualityAssurance,
+      certification_settings_1.SuperBlocks.SciCompPy,
+      certification_settings_1.SuperBlocks.DataAnalysisPy,
+      certification_settings_1.SuperBlocks.InfoSec,
+      certification_settings_1.SuperBlocks.MachineLearningPy,
+      certification_settings_1.SuperBlocks.CollegeAlgebraPy
+    ],
+    [CurriculumMaps.Learn]: {
+      [TranslationStates.Audited]: {
+        [SuperBlockStates.Current]: [
+          certification_settings_1.SuperBlocks.RespWebDesignNew,
+          certification_settings_1.SuperBlocks.JsAlgoDataStruct,
+          certification_settings_1.SuperBlocks.FrontEndDevLibs,
+          certification_settings_1.SuperBlocks.DataVis,
+          certification_settings_1.SuperBlocks.RelationalDb,
+          certification_settings_1.SuperBlocks.BackEndDevApis,
+          certification_settings_1.SuperBlocks.QualityAssurance,
+          certification_settings_1.SuperBlocks.SciCompPy,
+          certification_settings_1.SuperBlocks.DataAnalysisPy
+        ],
+        [SuperBlockStates.New]: [],
+        [SuperBlockStates.Upcoming]: [],
+        [SuperBlockStates.Legacy]: [
+          certification_settings_1.SuperBlocks.RespWebDesign
+        ]
+      },
+      [TranslationStates.NotAudited]: {
+        [SuperBlockStates.Current]: [
+          certification_settings_1.SuperBlocks.InfoSec,
+          certification_settings_1.SuperBlocks.MachineLearningPy,
+          certification_settings_1.SuperBlocks.CollegeAlgebraPy,
+          certification_settings_1.SuperBlocks.CodingInterviewPrep,
+          certification_settings_1.SuperBlocks.ProjectEuler
+        ],
+        [SuperBlockStates.New]: [],
+        [SuperBlockStates.Upcoming]: [
+          certification_settings_1.SuperBlocks.JsAlgoDataStructNew,
+          certification_settings_1.SuperBlocks.TheOdinProject
+        ],
+        [SuperBlockStates.Legacy]: []
+      }
+    }
+  },
+  [i18n_1.Languages.Chinese]: {
+    [CurriculumMaps.Landing]: [
+      certification_settings_1.SuperBlocks.RespWebDesignNew,
+      certification_settings_1.SuperBlocks.JsAlgoDataStruct,
+      certification_settings_1.SuperBlocks.FrontEndDevLibs,
+      certification_settings_1.SuperBlocks.DataVis,
+      certification_settings_1.SuperBlocks.RelationalDb,
+      certification_settings_1.SuperBlocks.BackEndDevApis,
+      certification_settings_1.SuperBlocks.QualityAssurance,
+      certification_settings_1.SuperBlocks.SciCompPy,
+      certification_settings_1.SuperBlocks.DataAnalysisPy,
+      certification_settings_1.SuperBlocks.InfoSec,
+      certification_settings_1.SuperBlocks.MachineLearningPy,
+      certification_settings_1.SuperBlocks.CollegeAlgebraPy
+    ],
+    [CurriculumMaps.Learn]: {
+      [TranslationStates.Audited]: {
+        [SuperBlockStates.Current]: [
+          certification_settings_1.SuperBlocks.RespWebDesignNew,
+          certification_settings_1.SuperBlocks.JsAlgoDataStruct,
+          certification_settings_1.SuperBlocks.FrontEndDevLibs,
+          certification_settings_1.SuperBlocks.DataVis,
+          certification_settings_1.SuperBlocks.RelationalDb,
+          certification_settings_1.SuperBlocks.BackEndDevApis,
+          certification_settings_1.SuperBlocks.QualityAssurance,
+          certification_settings_1.SuperBlocks.SciCompPy,
+          certification_settings_1.SuperBlocks.DataAnalysisPy,
+          certification_settings_1.SuperBlocks.InfoSec,
+          certification_settings_1.SuperBlocks.MachineLearningPy
+        ],
+        [SuperBlockStates.New]: [],
+        [SuperBlockStates.Upcoming]: [],
+        [SuperBlockStates.Legacy]: [
+          certification_settings_1.SuperBlocks.RespWebDesign
+        ]
+      },
+      [TranslationStates.NotAudited]: {
+        [SuperBlockStates.Current]: [
+          certification_settings_1.SuperBlocks.CollegeAlgebraPy,
+          certification_settings_1.SuperBlocks.CodingInterviewPrep,
+          certification_settings_1.SuperBlocks.ProjectEuler
+        ],
+        [SuperBlockStates.New]: [],
+        [SuperBlockStates.Upcoming]: [
+          certification_settings_1.SuperBlocks.JsAlgoDataStructNew,
+          certification_settings_1.SuperBlocks.TheOdinProject
+        ],
+        [SuperBlockStates.Legacy]: []
+      }
+    }
+  },
+  [i18n_1.Languages.ChineseTraditional]: {
+    [CurriculumMaps.Landing]: [
+      certification_settings_1.SuperBlocks.RespWebDesignNew,
+      certification_settings_1.SuperBlocks.JsAlgoDataStruct,
+      certification_settings_1.SuperBlocks.FrontEndDevLibs,
+      certification_settings_1.SuperBlocks.DataVis,
+      certification_settings_1.SuperBlocks.RelationalDb,
+      certification_settings_1.SuperBlocks.BackEndDevApis,
+      certification_settings_1.SuperBlocks.QualityAssurance,
+      certification_settings_1.SuperBlocks.SciCompPy,
+      certification_settings_1.SuperBlocks.DataAnalysisPy,
+      certification_settings_1.SuperBlocks.InfoSec,
+      certification_settings_1.SuperBlocks.MachineLearningPy,
+      certification_settings_1.SuperBlocks.CollegeAlgebraPy
+    ],
+    [CurriculumMaps.Learn]: {
+      [TranslationStates.Audited]: {
+        [SuperBlockStates.Current]: [
+          certification_settings_1.SuperBlocks.RespWebDesignNew,
+          certification_settings_1.SuperBlocks.JsAlgoDataStruct,
+          certification_settings_1.SuperBlocks.FrontEndDevLibs,
+          certification_settings_1.SuperBlocks.DataVis,
+          certification_settings_1.SuperBlocks.RelationalDb,
+          certification_settings_1.SuperBlocks.BackEndDevApis,
+          certification_settings_1.SuperBlocks.QualityAssurance,
+          certification_settings_1.SuperBlocks.SciCompPy,
+          certification_settings_1.SuperBlocks.DataAnalysisPy,
+          certification_settings_1.SuperBlocks.InfoSec,
+          certification_settings_1.SuperBlocks.MachineLearningPy
+        ],
+        [SuperBlockStates.New]: [],
+        [SuperBlockStates.Upcoming]: [],
+        [SuperBlockStates.Legacy]: [
+          certification_settings_1.SuperBlocks.RespWebDesign
+        ]
+      },
+      [TranslationStates.NotAudited]: {
+        [SuperBlockStates.Current]: [
+          certification_settings_1.SuperBlocks.CollegeAlgebraPy,
+          certification_settings_1.SuperBlocks.CodingInterviewPrep,
+          certification_settings_1.SuperBlocks.ProjectEuler
+        ],
+        [SuperBlockStates.New]: [],
+        [SuperBlockStates.Upcoming]: [
+          certification_settings_1.SuperBlocks.JsAlgoDataStructNew,
+          certification_settings_1.SuperBlocks.TheOdinProject
+        ],
+        [SuperBlockStates.Legacy]: []
+      }
+    }
+  },
+  [i18n_1.Languages.Italian]: {
+    [CurriculumMaps.Landing]: [
+      certification_settings_1.SuperBlocks.RespWebDesignNew,
+      certification_settings_1.SuperBlocks.JsAlgoDataStruct,
+      certification_settings_1.SuperBlocks.FrontEndDevLibs,
+      certification_settings_1.SuperBlocks.DataVis,
+      certification_settings_1.SuperBlocks.RelationalDb,
+      certification_settings_1.SuperBlocks.BackEndDevApis,
+      certification_settings_1.SuperBlocks.QualityAssurance,
+      certification_settings_1.SuperBlocks.SciCompPy,
+      certification_settings_1.SuperBlocks.DataAnalysisPy,
+      certification_settings_1.SuperBlocks.InfoSec,
+      certification_settings_1.SuperBlocks.MachineLearningPy,
+      certification_settings_1.SuperBlocks.CollegeAlgebraPy
+    ],
+    [CurriculumMaps.Learn]: {
+      [TranslationStates.Audited]: {
+        [SuperBlockStates.Current]: [
+          certification_settings_1.SuperBlocks.RespWebDesignNew,
+          certification_settings_1.SuperBlocks.JsAlgoDataStruct,
+          certification_settings_1.SuperBlocks.FrontEndDevLibs,
+          certification_settings_1.SuperBlocks.DataVis,
+          certification_settings_1.SuperBlocks.RelationalDb,
+          certification_settings_1.SuperBlocks.BackEndDevApis,
+          certification_settings_1.SuperBlocks.QualityAssurance,
+          certification_settings_1.SuperBlocks.SciCompPy,
+          certification_settings_1.SuperBlocks.DataAnalysisPy,
+          certification_settings_1.SuperBlocks.InfoSec,
+          certification_settings_1.SuperBlocks.MachineLearningPy,
+          certification_settings_1.SuperBlocks.CodingInterviewPrep
+        ],
+        [SuperBlockStates.New]: [],
+        [SuperBlockStates.Upcoming]: [],
+        [SuperBlockStates.Legacy]: [
+          certification_settings_1.SuperBlocks.RespWebDesign
+        ]
+      },
+      [TranslationStates.NotAudited]: {
+        [SuperBlockStates.Current]: [
+          certification_settings_1.SuperBlocks.CollegeAlgebraPy,
+          certification_settings_1.SuperBlocks.ProjectEuler
+        ],
+        [SuperBlockStates.New]: [],
+        [SuperBlockStates.Upcoming]: [
+          certification_settings_1.SuperBlocks.JsAlgoDataStructNew,
+          certification_settings_1.SuperBlocks.TheOdinProject
+        ],
+        [SuperBlockStates.Legacy]: []
+      }
+    }
+  },
+  [i18n_1.Languages.Portuguese]: {
+    [CurriculumMaps.Landing]: [
+      certification_settings_1.SuperBlocks.RespWebDesignNew,
+      certification_settings_1.SuperBlocks.JsAlgoDataStruct,
+      certification_settings_1.SuperBlocks.FrontEndDevLibs,
+      certification_settings_1.SuperBlocks.DataVis,
+      certification_settings_1.SuperBlocks.RelationalDb,
+      certification_settings_1.SuperBlocks.BackEndDevApis,
+      certification_settings_1.SuperBlocks.QualityAssurance,
+      certification_settings_1.SuperBlocks.SciCompPy,
+      certification_settings_1.SuperBlocks.DataAnalysisPy,
+      certification_settings_1.SuperBlocks.InfoSec,
+      certification_settings_1.SuperBlocks.MachineLearningPy,
+      certification_settings_1.SuperBlocks.CollegeAlgebraPy
+    ],
+    [CurriculumMaps.Learn]: {
+      [TranslationStates.Audited]: {
+        [SuperBlockStates.Current]: [
+          certification_settings_1.SuperBlocks.RespWebDesignNew,
+          certification_settings_1.SuperBlocks.JsAlgoDataStruct,
+          certification_settings_1.SuperBlocks.FrontEndDevLibs,
+          certification_settings_1.SuperBlocks.DataVis,
+          certification_settings_1.SuperBlocks.RelationalDb,
+          certification_settings_1.SuperBlocks.BackEndDevApis,
+          certification_settings_1.SuperBlocks.QualityAssurance,
+          certification_settings_1.SuperBlocks.SciCompPy,
+          certification_settings_1.SuperBlocks.DataAnalysisPy,
+          certification_settings_1.SuperBlocks.InfoSec,
+          certification_settings_1.SuperBlocks.MachineLearningPy,
+          certification_settings_1.SuperBlocks.CodingInterviewPrep
+        ],
+        [SuperBlockStates.New]: [],
+        [SuperBlockStates.Upcoming]: [
+          certification_settings_1.SuperBlocks.TheOdinProject
+        ],
+        [SuperBlockStates.Legacy]: [
+          certification_settings_1.SuperBlocks.RespWebDesign
+        ]
+      },
+      [TranslationStates.NotAudited]: {
+        [SuperBlockStates.Current]: [
+          certification_settings_1.SuperBlocks.CollegeAlgebraPy,
+          certification_settings_1.SuperBlocks.ProjectEuler
+        ],
+        [SuperBlockStates.New]: [],
+        [SuperBlockStates.Upcoming]: [
+          certification_settings_1.SuperBlocks.JsAlgoDataStructNew
+        ],
+        [SuperBlockStates.Legacy]: []
+      }
+    }
+  },
+  [i18n_1.Languages.Ukrainian]: {
+    [CurriculumMaps.Landing]: [
+      certification_settings_1.SuperBlocks.RespWebDesignNew,
+      certification_settings_1.SuperBlocks.JsAlgoDataStruct,
+      certification_settings_1.SuperBlocks.FrontEndDevLibs,
+      certification_settings_1.SuperBlocks.DataVis,
+      certification_settings_1.SuperBlocks.RelationalDb,
+      certification_settings_1.SuperBlocks.BackEndDevApis,
+      certification_settings_1.SuperBlocks.QualityAssurance,
+      certification_settings_1.SuperBlocks.SciCompPy,
+      certification_settings_1.SuperBlocks.DataAnalysisPy,
+      certification_settings_1.SuperBlocks.InfoSec,
+      certification_settings_1.SuperBlocks.MachineLearningPy,
+      certification_settings_1.SuperBlocks.CollegeAlgebraPy
+    ],
+    [CurriculumMaps.Learn]: {
+      [TranslationStates.Audited]: {
+        [SuperBlockStates.Current]: [
+          certification_settings_1.SuperBlocks.RespWebDesignNew,
+          certification_settings_1.SuperBlocks.JsAlgoDataStruct,
+          certification_settings_1.SuperBlocks.FrontEndDevLibs,
+          certification_settings_1.SuperBlocks.DataVis,
+          certification_settings_1.SuperBlocks.RelationalDb,
+          certification_settings_1.SuperBlocks.BackEndDevApis,
+          certification_settings_1.SuperBlocks.QualityAssurance,
+          certification_settings_1.SuperBlocks.SciCompPy,
+          certification_settings_1.SuperBlocks.DataAnalysisPy,
+          certification_settings_1.SuperBlocks.InfoSec,
+          certification_settings_1.SuperBlocks.MachineLearningPy,
+          certification_settings_1.SuperBlocks.CollegeAlgebraPy
+        ],
+        [SuperBlockStates.New]: [],
+        [SuperBlockStates.Upcoming]: [
+          certification_settings_1.SuperBlocks.TheOdinProject
+        ],
+        [SuperBlockStates.Legacy]: [
+          certification_settings_1.SuperBlocks.RespWebDesign
+        ]
+      },
+      [TranslationStates.NotAudited]: {
+        [SuperBlockStates.Current]: [
+          certification_settings_1.SuperBlocks.CodingInterviewPrep,
+          certification_settings_1.SuperBlocks.ProjectEuler
+        ],
+        [SuperBlockStates.New]: [],
+        [SuperBlockStates.Upcoming]: [
+          certification_settings_1.SuperBlocks.JsAlgoDataStructNew
+        ],
+        [SuperBlockStates.Legacy]: []
+      }
+    }
+  },
+  [i18n_1.Languages.Japanese]: {
+    [CurriculumMaps.Landing]: [
+      certification_settings_1.SuperBlocks.RespWebDesignNew,
+      certification_settings_1.SuperBlocks.JsAlgoDataStruct,
+      certification_settings_1.SuperBlocks.FrontEndDevLibs,
+      certification_settings_1.SuperBlocks.DataVis,
+      certification_settings_1.SuperBlocks.RelationalDb,
+      certification_settings_1.SuperBlocks.BackEndDevApis,
+      certification_settings_1.SuperBlocks.QualityAssurance,
+      certification_settings_1.SuperBlocks.SciCompPy,
+      certification_settings_1.SuperBlocks.DataAnalysisPy,
+      certification_settings_1.SuperBlocks.InfoSec,
+      certification_settings_1.SuperBlocks.MachineLearningPy,
+      certification_settings_1.SuperBlocks.CollegeAlgebraPy
+    ],
+    [CurriculumMaps.Learn]: {
+      [TranslationStates.Audited]: {
+        [SuperBlockStates.Current]: [
+          certification_settings_1.SuperBlocks.RespWebDesignNew,
+          certification_settings_1.SuperBlocks.RespWebDesign,
+          certification_settings_1.SuperBlocks.JsAlgoDataStruct,
+          certification_settings_1.SuperBlocks.FrontEndDevLibs,
+          certification_settings_1.SuperBlocks.DataVis,
+          certification_settings_1.SuperBlocks.RelationalDb,
+          certification_settings_1.SuperBlocks.BackEndDevApis,
+          certification_settings_1.SuperBlocks.QualityAssurance,
+          certification_settings_1.SuperBlocks.SciCompPy,
+          certification_settings_1.SuperBlocks.DataAnalysisPy,
+          certification_settings_1.SuperBlocks.InfoSec,
+          certification_settings_1.SuperBlocks.MachineLearningPy,
+          certification_settings_1.SuperBlocks.CodingInterviewPrep
+        ],
+        [SuperBlockStates.New]: [],
+        [SuperBlockStates.Upcoming]: [],
+        [SuperBlockStates.Legacy]: []
+      },
+      [TranslationStates.NotAudited]: {
+        [SuperBlockStates.Current]: [
+          certification_settings_1.SuperBlocks.CollegeAlgebraPy,
+          certification_settings_1.SuperBlocks.ProjectEuler
+        ],
+        [SuperBlockStates.New]: [],
+        [SuperBlockStates.Upcoming]: [
+          certification_settings_1.SuperBlocks.JsAlgoDataStructNew,
+          certification_settings_1.SuperBlocks.TheOdinProject
+        ],
+        [SuperBlockStates.Legacy]: []
+      }
+    }
+  },
+  [i18n_1.Languages.German]: {
+    [CurriculumMaps.Landing]: [
+      certification_settings_1.SuperBlocks.RespWebDesign,
+      certification_settings_1.SuperBlocks.JsAlgoDataStruct,
+      certification_settings_1.SuperBlocks.FrontEndDevLibs,
+      certification_settings_1.SuperBlocks.DataVis,
+      certification_settings_1.SuperBlocks.RelationalDb,
+      certification_settings_1.SuperBlocks.BackEndDevApis,
+      certification_settings_1.SuperBlocks.QualityAssurance,
+      certification_settings_1.SuperBlocks.SciCompPy,
+      certification_settings_1.SuperBlocks.DataAnalysisPy,
+      certification_settings_1.SuperBlocks.InfoSec,
+      certification_settings_1.SuperBlocks.MachineLearningPy,
+      certification_settings_1.SuperBlocks.CollegeAlgebraPy
+    ],
+    [CurriculumMaps.Learn]: {
+      [TranslationStates.Audited]: {
+        [SuperBlockStates.Current]: [
+          certification_settings_1.SuperBlocks.RespWebDesign,
+          certification_settings_1.SuperBlocks.JsAlgoDataStruct,
+          certification_settings_1.SuperBlocks.FrontEndDevLibs
+        ],
+        [SuperBlockStates.New]: [],
+        [SuperBlockStates.Upcoming]: [],
+        [SuperBlockStates.Legacy]: []
+      },
+      [TranslationStates.NotAudited]: {
+        [SuperBlockStates.Current]: [
+          certification_settings_1.SuperBlocks.RespWebDesignNew,
+          certification_settings_1.SuperBlocks.DataVis,
+          certification_settings_1.SuperBlocks.RelationalDb,
+          certification_settings_1.SuperBlocks.BackEndDevApis,
+          certification_settings_1.SuperBlocks.QualityAssurance,
+          certification_settings_1.SuperBlocks.SciCompPy,
+          certification_settings_1.SuperBlocks.DataAnalysisPy,
+          certification_settings_1.SuperBlocks.InfoSec,
+          certification_settings_1.SuperBlocks.MachineLearningPy,
+          certification_settings_1.SuperBlocks.CollegeAlgebraPy,
+          certification_settings_1.SuperBlocks.CodingInterviewPrep,
+          certification_settings_1.SuperBlocks.ProjectEuler
+        ],
+        [SuperBlockStates.New]: [],
+        [SuperBlockStates.Upcoming]: [
+          certification_settings_1.SuperBlocks.JsAlgoDataStructNew,
+          certification_settings_1.SuperBlocks.TheOdinProject
+        ],
+        [SuperBlockStates.Legacy]: []
+      }
+    }
+  },
+  [i18n_1.Languages.Arabic]: {
+    [CurriculumMaps.Landing]: [
+      certification_settings_1.SuperBlocks.RespWebDesignNew,
+      certification_settings_1.SuperBlocks.JsAlgoDataStruct,
+      certification_settings_1.SuperBlocks.FrontEndDevLibs,
+      certification_settings_1.SuperBlocks.DataVis,
+      certification_settings_1.SuperBlocks.RelationalDb,
+      certification_settings_1.SuperBlocks.BackEndDevApis,
+      certification_settings_1.SuperBlocks.QualityAssurance,
+      certification_settings_1.SuperBlocks.SciCompPy,
+      certification_settings_1.SuperBlocks.DataAnalysisPy,
+      certification_settings_1.SuperBlocks.InfoSec,
+      certification_settings_1.SuperBlocks.MachineLearningPy,
+      certification_settings_1.SuperBlocks.CollegeAlgebraPy
+    ],
+    [CurriculumMaps.Learn]: {
+      [TranslationStates.Audited]: {
+        [SuperBlockStates.Current]: [
+          certification_settings_1.SuperBlocks.RespWebDesignNew,
+          certification_settings_1.SuperBlocks.JsAlgoDataStruct,
+          certification_settings_1.SuperBlocks.FrontEndDevLibs
+        ],
+        [SuperBlockStates.New]: [],
+        [SuperBlockStates.Upcoming]: [],
+        [SuperBlockStates.Legacy]: []
+      },
+      [TranslationStates.NotAudited]: {
+        [SuperBlockStates.Current]: [
+          certification_settings_1.SuperBlocks.DataVis,
+          certification_settings_1.SuperBlocks.RelationalDb,
+          certification_settings_1.SuperBlocks.BackEndDevApis,
+          certification_settings_1.SuperBlocks.QualityAssurance,
+          certification_settings_1.SuperBlocks.SciCompPy,
+          certification_settings_1.SuperBlocks.DataAnalysisPy,
+          certification_settings_1.SuperBlocks.InfoSec,
+          certification_settings_1.SuperBlocks.MachineLearningPy,
+          certification_settings_1.SuperBlocks.CollegeAlgebraPy,
+          certification_settings_1.SuperBlocks.CodingInterviewPrep,
+          certification_settings_1.SuperBlocks.ProjectEuler
+        ],
+        [SuperBlockStates.New]: [],
+        [SuperBlockStates.Upcoming]: [
+          certification_settings_1.SuperBlocks.JsAlgoDataStructNew,
+          certification_settings_1.SuperBlocks.TheOdinProject
+        ],
+        [SuperBlockStates.Legacy]: [
+          certification_settings_1.SuperBlocks.RespWebDesign
+        ]
+      }
+    }
+  }
+};
+// The client uses the object above to create the map
+// Keep this so it can't change
+Object.freeze(exports.superBlockOrder);
+function shouldShowSuperblocks({
+  superBlockState,
+  showNewCurriculum = 'false',
+  showUpcomingChanges = 'false'
+}) {
+  if (
+    (superBlockState === SuperBlockStates.New &&
+      showNewCurriculum !== 'true') ||
+    (superBlockState === SuperBlockStates.Upcoming &&
+      showUpcomingChanges !== 'true')
+  ) {
+    return false;
+  }
+  return true;
+}
+function getLearnSuperBlocks({
+  language = 'english',
+  showNewCurriculum = 'false',
+  showUpcomingChanges = 'false'
+}) {
+  const learnSuperBlocks = [];
+  Object.values(TranslationStates).forEach(translationState => {
+    Object.values(SuperBlockStates).forEach(superBlockState => {
+      if (
+        shouldShowSuperblocks({
+          superBlockState,
+          showNewCurriculum,
+          showUpcomingChanges
+        })
+      ) {
+        learnSuperBlocks.push(
+          ...exports.superBlockOrder[language][CurriculumMaps.Learn][
+            translationState
+          ][superBlockState]
+        );
+      }
+    });
+  });
+  return learnSuperBlocks;
+}
+exports.getLearnSuperBlocks = getLearnSuperBlocks;
+function getAuditedSuperBlocks({
+  language = 'english',
+  showNewCurriculum = 'false',
+  showUpcomingChanges = 'false'
+}) {
+  const auditedSuperBlocks = [];
+  Object.values(SuperBlockStates).forEach(superBlockState => {
+    if (
+      shouldShowSuperblocks({
+        superBlockState,
+        showNewCurriculum,
+        showUpcomingChanges
+      })
+    ) {
+      auditedSuperBlocks.push(
+        ...exports.superBlockOrder[language][CurriculumMaps.Learn][
+          TranslationStates.Audited
+        ][superBlockState]
+      );
+    }
+  });
+  return auditedSuperBlocks;
+}
+exports.getAuditedSuperBlocks = getAuditedSuperBlocks;
+function getNotAuditedSuperBlocks({
+  language = 'english',
+  showNewCurriculum = 'false',
+  showUpcomingChanges = 'false'
+}) {
+  const notAuditedSuperBlocks = [];
+  Object.values(SuperBlockStates).forEach(superBlockState => {
+    if (
+      shouldShowSuperblocks({
+        superBlockState,
+        showNewCurriculum,
+        showUpcomingChanges
+      })
+    ) {
+      notAuditedSuperBlocks.push(
+        ...exports.superBlockOrder[language][CurriculumMaps.Learn][
+          TranslationStates.NotAudited
+        ][superBlockState]
+      );
+    }
+  });
+  return notAuditedSuperBlocks;
+}
+exports.getNotAuditedSuperBlocks = getNotAuditedSuperBlocks;

utils/block-nameify.js

@@ -0,0 +1,34 @@
+'use strict';
+var __importDefault =
+  (this && this.__importDefault) ||
+  function (mod) {
+    return mod && mod.__esModule ? mod : { default: mod };
+  };
+Object.defineProperty(exports, '__esModule', { value: true });
+exports.blockNameify = void 0;
+const preformatted_block_names_json_1 = __importDefault(
+  require('./preformatted-block-names.json')
+);
+const preformatted_words_json_1 = __importDefault(
+  require('./preformatted-words.json')
+);
+const noFormatting = ['and', 'for', 'of', 'the', 'up', 'with', 'to', 'by', 'a'];
+function blockNameify(phrase) {
+  const preFormatted = preformatted_block_names_json_1.default[phrase] || '';
+  if (preFormatted) {
+    return preFormatted;
+  }
+  return phrase
+    .split('-')
+    .map(word => {
+      if (noFormatting.indexOf(word) !== -1) {
+        return word;
+      }
+      if (preformatted_words_json_1.default[word]) {
+        return preformatted_words_json_1.default[word];
+      }
+      return word.charAt(0).toUpperCase() + word.slice(1);
+    })
+    .join(' ');
+}
+exports.blockNameify = blockNameify;

utils/slugs.js

@@ -0,0 +1,26 @@
+'use strict';
+Object.defineProperty(exports, '__esModule', { value: true });
+exports.unDasherize = exports.nameify = exports.dasherize = void 0;
+function dasherize(name) {
+  return ('' + name)
+    .toLowerCase()
+    .trim()
+    .replace(/\s|\./g, '-')
+    .replace(/[^a-z\d\-.]/g, '');
+}
+exports.dasherize = dasherize;
+function nameify(str) {
+  return ('' + str).replace(/[^a-z\d\s]/gi, '');
+}
+exports.nameify = nameify;
+function unDasherize(name) {
+  return (
+    ('' + name)
+      // replace dash with space
+      .replace(/-/g, ' ')
+      // strip nonalphanumarics chars except whitespace
+      .replace(/[^a-z\d\s]/gi, '')
+      .trim()
+  );
+}
+exports.unDasherize = unDasherize;