added more randomness in headertyper

Author: bennobuilder

src/_pages/LandingPage/components/HeaderView/index.tsx

@@ -7,21 +7,23 @@ import GithubButton from '../../../../components/buttons/GithubButton';
 import styles from './styles.module.css';
 import { useWindowSize } from '../../../../hooks/useWindowSize';
 import MouseScroller from './components/MouseScroller';
-import { animated, useSpring } from 'react-spring';
 import Astronaut from './components/Astronaut';
+import { shuffle } from '../../../../utils';
 
 const HeaderView: React.FC = () => {
   const { siteConfig } = useDocusaurusContext();
   const { windowHeight } = useWindowSize();
-  const [toTypeWords] = useState([
-    'simple',
-    'straightforward',
-    'fast',
-    'understandable',
-    'boilerplate free',
-    'spacy',
-    'fun',
-  ]);
+  const [toTypeWords] = useState(
+    shuffle([
+      'simple',
+      'straightforward',
+      'fast',
+      'understandable',
+      'boilerplate free',
+      'spacy',
+      'fun',
+    ])
+  );
 
   return (
     <div className={styles.Container}>

src/utils.ts

@@ -0,0 +1,19 @@
+export function shuffle<X extends Array<any>>(array: X) {
+  let currentIndex = array.length;
+  let temporaryValue = null;
+  let randomIndex = 0;
+
+  // While there remain elements to shuffle...
+  while (0 !== currentIndex) {
+    // Pick a remaining element...
+    randomIndex = Math.floor(Math.random() * currentIndex);
+    currentIndex -= 1;
+
+    // And swap it with the current element.
+    temporaryValue = array[currentIndex];
+    array[currentIndex] = array[randomIndex];
+    array[randomIndex] = temporaryValue;
+  }
+
+  return array;
+}