fix(PM-717): use crypto random instead of math random

src/shared/components/Contentful/Article/Article.jsx

@@ -34,6 +34,7 @@ import IconFacebook from 'assets/images/icon-facebook.svg';
 import IconTwitter from 'assets/images/icon-twitter.svg';
 import IconLinkedIn from 'assets/images/icon-linkedIn.svg';
 import DiscordIconWhite from 'assets/images/tc-edu/discord-icon-white.svg';
+import getSecureRandomIndex from 'utils/secureRandom';
 
 const htmlToText = require('html-to-text');
 
@@ -45,7 +46,7 @@ const LOCAL_STORAGE_KEY = 'VENBcnRpY2xlVm90ZXM=';
 const DEFAULT_BANNER_IMAGE = 'https://images.ctfassets.net/piwi0eufbb2g/7v2hlDsVep7FWufHw0lXpQ/2505e61a880e68fab4e80cd0e8ec1814/0C37CB5E-B253-4804-8935-78E64E67589E.png?w=1200&h=630';
 // random ads banner - left sidebar
 const RANDOM_BANNERS = ['6G8mjiTC1mzeSQ2YoUG1gB', '1DnDD02xX1liHfSTf5Vsn8', 'HQZ3mN0rR92CbNTkKTHJ5', '1OLoX8ZsvjAnn4TdGbZESD', '77jn01UGoQe2gqA7x0coQD'];
-const RANDOM_BANNER = RANDOM_BANNERS[_.random(0, 4)];
+const RANDOM_BANNER = RANDOM_BANNERS[getSecureRandomIndex(RANDOM_BANNERS.length)];
 
 class Article extends React.Component {
   componentDidMount() {

src/shared/components/Contentful/MemberTalkCloud/MemberTalkCloud.jsx

@@ -9,6 +9,7 @@ import PT from 'prop-types';
 import React from 'react';
 import { themr } from 'react-css-super-themr';
 import { fixStyle } from 'utils/contentful';
+import getSecureRandomIndex from 'utils/secureRandom';
 import defaultTheme from './themes/default.scss';
 
 const MAX_MARGIN_TOP = 0;
@@ -17,7 +18,7 @@ const MAX_MARGIN_LEFT = 30;
 
 const getRandomTranslate = () => ({
   y: MAX_MARGIN_TOP,
-  x: _.random(MIN_MARGIN_LEFT, MAX_MARGIN_LEFT, false),
+  x: getSecureRandomIndex(MIN_MARGIN_LEFT, MAX_MARGIN_LEFT),
 });
 
 export class MemberTalkCloud extends React.Component {

src/shared/components/challenge-listing/placeholders/ChallengeCard/index.jsx

@@ -36,7 +36,7 @@ const ChallengeCardPlaceholder = ({ id }) => (
 );
 
 ChallengeCardPlaceholder.defaultProps = {
-  id: Math.random(),
+  id: 0,
 };
 
 ChallengeCardPlaceholder.propTypes = {

src/shared/utils/secureRandom.js

@@ -0,0 +1,25 @@
+const getCryptoLibrary = () => {
+  if (typeof window !== 'undefined' && window.crypto) {
+    return window.crypto;
+  }
+  /* eslint-disable global-require */
+  const nodeCrypto = require('crypto');
+  return nodeCrypto;
+};
+
+export default function (min, max) {
+  const crypto = getCryptoLibrary();
+  const random = new Uint32Array(1);
+  if (typeof crypto.getRandomValues === 'function') {
+    crypto.getRandomValues(random);
+  } else if (typeof crypto.randomFillSync === 'function') {
+    crypto.randomFillSync(random);
+  }
+
+  if (!max) {
+    return random[0] % min;
+  }
+
+  const range = max - min + 1;
+  return min + (random[0] % range);
+}