Feature/grs 1955 change commonjs imports (#1995)

* GRS-1955: Using ES6 import/export in src files

* GRS-1955: Using ES6 import/export in test files

* GRS-1955: Using ES6 import/export in themes index.js

* GRS-1955: Readding blank line at end of top-languages-card.js

* feat: fix test es6 import errors

This commit makes sure jest is set-up to support es6. It also fixes
several test errors and sorts the imports.

* test: update test node version

This commit makes sure node 16 is used in the github actions.

* refactor: run prettier

Co-authored-by: rickstaa <rick.staa@outlook.com>

src/common/Card.js

@@ -1,5 +1,5 @@
-const { getAnimations } = require("../getStyles");
-const { flexLayout, encodeHTML } = require("../common/utils");
+import { encodeHTML, flexLayout } from "../common/utils";
+import { getAnimations } from "../getStyles";
 
 class Card {
   /**
@@ -216,4 +216,5 @@ class Card {
   }
 }
 
-module.exports = Card;
+export { Card };
+export default Card;

src/common/I18n.js

@@ -18,4 +18,5 @@ class I18n {
   }
 }
 
-module.exports = I18n;
+export { I18n };
+export default I18n;

src/common/blacklist.js

@@ -1,3 +1,4 @@
 const blacklist = ["renovate-bot", "technote-space", "sw-yx"];
 
-module.exports = blacklist;
+export { blacklist };
+export default blacklist;

src/common/createProgressNode.js

@@ -1,4 +1,4 @@
-const { clampValue } = require("../common/utils");
+import { clampValue } from "../common/utils";
 
 const createProgressNode = ({
   x,
@@ -16,7 +16,7 @@ const createProgressNode = ({
       <rect
           height="8"
           fill="${color}"
-          rx="5" ry="5" x="0" y="0" 
+          rx="5" ry="5" x="0" y="0"
           data-testid="lang-progress"
           width="${progressPercentage}%"
       >
@@ -25,4 +25,5 @@ const createProgressNode = ({
   `;
 };
 
-exports.createProgressNode = createProgressNode;
+export { createProgressNode };
+export default createProgressNode;

src/common/icons.js

@@ -8,4 +8,5 @@ const icons = {
   fork: `<path fill-rule="evenodd" d="M5 3.25a.75.75 0 11-1.5 0 .75.75 0 011.5 0zm0 2.122a2.25 2.25 0 10-1.5 0v.878A2.25 2.25 0 005.75 8.5h1.5v2.128a2.251 2.251 0 101.5 0V8.5h1.5a2.25 2.25 0 002.25-2.25v-.878a2.25 2.25 0 10-1.5 0v.878a.75.75 0 01-.75.75h-4.5A.75.75 0 015 6.25v-.878zm3.75 7.378a.75.75 0 11-1.5 0 .75.75 0 011.5 0zm3-8.75a.75.75 0 100-1.5.75.75 0 000 1.5z"></path>`,
 };
 
-module.exports = icons;
+export { icons };
+export default icons;

src/common/languageColors.json

@@ -499,4 +499,4 @@
     "wdl": "#42f1f4",
     "wisp": "#7582D1",
     "xBase": "#403a40"
-}
+}

src/common/retryer.js

@@ -1,4 +1,4 @@
-const { logger, CustomError } = require("../common/utils");
+import { CustomError, logger } from "../common/utils";
 
 const retryer = async (fetcher, variables, retries = 0) => {
   if (retries > 7) {
@@ -40,4 +40,5 @@ const retryer = async (fetcher, variables, retries = 0) => {
   }
 };
 
-module.exports = retryer;
+export { retryer };
+export default retryer;

src/common/utils.js

@@ -1,8 +1,8 @@
 // @ts-check
-const axios = require("axios");
-const wrap = require("word-wrap");
-const themes = require("../../themes");
-const toEmoji = require("emoji-name-map");
+import axios from "axios";
+import toEmoji from "emoji-name-map";
+import wrap from "word-wrap";
+import { themes } from "../../themes";
 
 /**
  * @param {string} message
@@ -370,7 +370,7 @@ function parseEmojis(str) {
   });
 }
 
-module.exports = {
+export {
   renderError,
   kFormatter,
   encodeHTML,