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/calculateRank.js

@@ -57,8 +57,8 @@ function calculateRank({
     issues * ISSUES_OFFSET +
     stargazers * STARS_OFFSET +
     prs * PRS_OFFSET +
-    followers * FOLLOWERS_OFFSET + 
-    totalRepos * REPO_OFFSET 
+    followers * FOLLOWERS_OFFSET +
+    totalRepos * REPO_OFFSET
   ) / 100;
 
   const normalizedScore = normalcdf(score, TOTAL_VALUES, ALL_OFFSETS) * 100;
@@ -74,4 +74,5 @@ function calculateRank({
   return { level, score: normalizedScore };
 }
 
-module.exports = calculateRank;
+export { calculateRank };
+export default calculateRank;

src/cards/repo-card.js

@@ -1,17 +1,17 @@
 // @ts-check
-const {
-  kFormatter,
+import { Card } from "../common/Card";
+import { I18n } from "../common/I18n";
+import { icons } from "../common/icons";
+import {
   encodeHTML,
-  getCardColors,
   flexLayout,
-  wrapTextMultiline,
+  getCardColors,
+  kFormatter,
   measureText,
   parseEmojis,
-} = require("../common/utils");
-const I18n = require("../common/I18n");
-const Card = require("../common/Card");
-const icons = require("../common/icons");
-const { repoCardLocales } = require("../translations");
+  wrapTextMultiline,
+} from "../common/utils";
+import { repoCardLocales } from "../translations";
 
 /**
  * @param {string} label
@@ -185,4 +185,5 @@ const renderRepoCard = (repo, options = {}) => {
   `);
 };
 
-module.exports = renderRepoCard;
+export { renderRepoCard };
+export default renderRepoCard;

src/cards/stats-card.js

@@ -1,16 +1,16 @@
 // @ts-check
-const I18n = require("../common/I18n");
-const Card = require("../common/Card");
-const icons = require("../common/icons");
-const { getStyles } = require("../getStyles");
-const { statCardLocales } = require("../translations");
-const {
-  kFormatter,
-  flexLayout,
+import { Card } from "../common/Card";
+import { I18n } from "../common/I18n";
+import { icons } from "../common/icons";
+import {
   clampValue,
-  measureText,
+  flexLayout,
   getCardColors,
-} = require("../common/utils");
+  kFormatter,
+  measureText,
+} from "../common/utils";
+import { getStyles } from "../getStyles";
+import { statCardLocales } from "../translations";
 
 const createTextNode = ({
   icon,
@@ -300,4 +300,5 @@ const renderStatsCard = (stats = {}, options = { hide: [] }) => {
   `);
 };
 
-module.exports = renderStatsCard;
+export { renderStatsCard };
+export default renderStatsCard;

src/cards/top-languages-card.js

@@ -1,16 +1,16 @@
 // @ts-check
-const Card = require("../common/Card");
-const I18n = require("../common/I18n");
-const { langCardLocales } = require("../translations");
-const { createProgressNode } = require("../common/createProgressNode");
-const {
+import { Card } from "../common/Card";
+import { createProgressNode } from "../common/createProgressNode";
+import { I18n } from "../common/I18n";
+import {
+  chunkArray,
   clampValue,
-  getCardColors,
   flexLayout,
+  getCardColors,
   lowercaseTrim,
   measureText,
-  chunkArray,
-} = require("../common/utils");
+} from "../common/utils";
+import { langCardLocales } from "../translations";
 
 const DEFAULT_CARD_WIDTH = 300;
 const MIN_CARD_WIDTH = 230;
@@ -311,5 +311,4 @@ const renderTopLanguages = (topLangs, options = {}) => {
   `);
 };
 
-module.exports = renderTopLanguages;
-module.exports.MIN_CARD_WIDTH = MIN_CARD_WIDTH;
+export { renderTopLanguages, MIN_CARD_WIDTH };

src/cards/wakatime-card.js

@@ -1,16 +1,16 @@
 // @ts-check
-const Card = require("../common/Card");
-const I18n = require("../common/I18n");
-const { getStyles } = require("../getStyles");
-const { wakatimeCardLocales } = require("../translations");
-const languageColors = require("../common/languageColors.json");
-const { createProgressNode } = require("../common/createProgressNode");
-const {
+import { Card } from "../common/Card";
+import { createProgressNode } from "../common/createProgressNode";
+import { I18n } from "../common/I18n";
+import languageColors from "../common/languageColors.json";
+import {
   clampValue,
-  getCardColors,
   flexLayout,
+  getCardColors,
   lowercaseTrim,
-} = require("../common/utils");
+} from "../common/utils";
+import { getStyles } from "../getStyles";
+import { wakatimeCardLocales } from "../translations";
 
 /**
  * @param {{color: string, text: string}} param0
@@ -314,5 +314,5 @@ const renderWakatimeCard = (stats = {}, options = { hide: [] }) => {
   `);
 };
 
-module.exports = renderWakatimeCard;
-exports.createProgressNode = createProgressNode;
+export { renderWakatimeCard };
+export default renderWakatimeCard;

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,

src/fetchers/repo-fetcher.js

@@ -1,6 +1,6 @@
 // @ts-check
-const retryer = require("../common/retryer");
-const { request, MissingParamError } = require("../common/utils");
+import { retryer } from "../common/retryer";
+import { MissingParamError, request } from "../common/utils";
 
 /**
  * @param {import('Axios').AxiosRequestHeaders} variables
@@ -97,4 +97,5 @@ async function fetchRepo(username, reponame) {
   }
 }
 
-module.exports = fetchRepo;
+export { fetchRepo };
+export default fetchRepo;

src/fetchers/stats-fetcher.js

@@ -1,17 +1,17 @@
 // @ts-check
-const axios = require("axios").default;
-const githubUsernameRegex = require("github-username-regex");
-
-const retryer = require("../common/retryer");
-const calculateRank = require("../calculateRank");
-const {
-  request,
-  logger,
+import axios from "axios";
+import * as dotenv from "dotenv";
+import githubUsernameRegex from "github-username-regex";
+import { calculateRank } from "../calculateRank";
+import { retryer } from "../common/retryer";
+import {
   CustomError,
+  logger,
   MissingParamError,
-} = require("../common/utils");
+  request,
+} from "../common/utils";
 
-require("dotenv").config();
+dotenv.config();
 
 /**
  * @param {import('axios').AxiosRequestHeaders} variables
@@ -187,4 +187,5 @@ async function fetchStats(
   return stats;
 }
 
-module.exports = fetchStats;
+export { fetchStats };
+export default fetchStats;

src/fetchers/top-languages-fetcher.js

@@ -1,7 +1,9 @@
 // @ts-check
-const { request, logger, MissingParamError } = require("../common/utils");
-const retryer = require("../common/retryer");
-require("dotenv").config();
+import * as dotenv from "dotenv";
+import { retryer } from "../common/retryer";
+import { logger, MissingParamError, request } from "../common/utils";
+
+dotenv.config();
 
 /**
  * @param {import('Axios').AxiosRequestHeaders} variables
@@ -104,4 +106,5 @@ async function fetchTopLanguages(username, exclude_repo = []) {
   return topLangs;
 }
 
-module.exports = fetchTopLanguages;
+export { fetchTopLanguages };
+export default fetchTopLanguages;

src/fetchers/wakatime-fetcher.js

@@ -1,5 +1,5 @@
-const axios = require("axios");
-const { MissingParamError } = require("../common/utils");
+import axios from "axios";
+import { MissingParamError } from "../common/utils";
 
 /**
  * @param {{username: string, api_domain: string, range: string}} props
@@ -26,6 +26,5 @@ const fetchWakatimeStats = async ({ username, api_domain, range }) => {
   }
 };
 
-module.exports = {
-  fetchWakatimeStats,
-};
+export { fetchWakatimeStats };
+export default fetchWakatimeStats;

src/getStyles.js

@@ -81,7 +81,7 @@ const getStyles = ({
       animation: fadeInAnimation 0.3s ease-in-out forwards;
     }
     .rank-text {
-      font: 800 24px 'Segoe UI', Ubuntu, Sans-Serif; fill: ${textColor}; 
+      font: 800 24px 'Segoe UI', Ubuntu, Sans-Serif; fill: ${textColor};
       animation: scaleInAnimation 0.3s ease-in-out forwards;
     }
     
@@ -91,7 +91,7 @@ const getStyles = ({
       fill: ${iconColor};
       display: ${!!show_icons ? "block" : "none"};
     }
-    
+
     .rank-circle-rim {
       stroke: ${titleColor};
       fill: none;
@@ -113,4 +113,4 @@ const getStyles = ({
   `;
 };
 
-module.exports = { getStyles, getAnimations };
+export { getStyles, getAnimations };

src/translations.js

@@ -1,4 +1,4 @@
-const { encodeHTML } = require("./common/utils");
+import { encodeHTML } from "./common/utils";
 
 const statCardLocales = ({ name, apostrophe }) => {
   const encodedName = encodeHTML(name);
@@ -358,7 +358,7 @@ function isLocaleAvailable(locale) {
   return availableLocales.includes(locale.toLowerCase());
 }
 
-module.exports = {
+export {
   isLocaleAvailable,
   availableLocales,
   statCardLocales,