Add lint

Author: steven-steven

.github/workflows/preview-theme.yml

@@ -21,4 +21,4 @@ jobs:
       - run: npm run preview-theme
         env:
           CI: true
-          PERSONAL_TOKEN: ${{ secrets.PERSONAL_TOKEN }}
+          PERSONAL_TOKEN: ${{ secrets.PERSONAL_TOKEN }}

.github/workflows/test.yml

@@ -25,5 +25,9 @@ jobs:
           npm install
           npm run test
 
+      - name: Run Prettier
+        run: |
+          npm run prettier:check:ci
+
       - name: Code Coverage
         uses: codecov/codecov-action@v1

package.json

@@ -6,7 +6,9 @@
   "scripts": {
     "test": "jest --coverage",
     "test:watch": "jest --watch",
-    "preview-theme": "node scripts/preview-theme"
+    "preview-theme": "node scripts/preview-theme",
+    "prettier:check:ci": "./node_modules/.bin/prettier --check .",
+    "prettier:format": "./node_modules/.bin/prettier --write ."
   },
   "author": "Steven",
   "license": "MIT",

scripts/preview-theme.js

@@ -108,11 +108,12 @@ async function run() {
     const comment = await findComment(octokit, pullRequestId);
 
     const diff = parse(res.data);
-    const content1 = diff
-      .find((file) => file.to === "themes/index.js")
+    const content1 = diff.find((file) => file.to === "themes/index.js")
       .chunks[0].changes;
-    
-    const content = content1.filter((c) => c.type === "add").map((c) => c.content.replace("+", ""))
+
+    const content = content1
+      .filter((c) => c.type === "add")
+      .map((c) => c.content.replace("+", ""))
       .join("");
 
     console.log("content1 diff");
@@ -193,4 +194,4 @@ async function run() {
   }
 }
 
-run();
+run();

src/cards/stats-card.js

@@ -10,14 +10,7 @@ const {
   getCardColors,
 } = require("../common/utils");
 
-const createTextNode = ({
-  icon,
-  label,
-  value,
-  id,
-  index,
-  showIcons,
-}) => {
+const createTextNode = ({ icon, label, value, id, index, showIcons }) => {
   const kValue = isNaN(value) ? value : kFormatter(value);
   const staggerDelay = (index + 3) * 150;
 
@@ -169,7 +162,7 @@ const renderStatsCard = (stats = {}, options = { hide: [] }) => {
       </g>`;
 
   // progress over 100
-  const progress = (recentAvgWpm/150)*100;
+  const progress = (recentAvgWpm / 150) * 100;
   const cssStyles = getStyles({
     titleColor,
     textColor,
@@ -179,7 +172,9 @@ const renderStatsCard = (stats = {}, options = { hide: [] }) => {
   });
 
   const calculateTextWidth = () => {
-    return measureText(custom_title ? custom_title : `${username}'s Typeracer Stats`);
+    return measureText(
+      custom_title ? custom_title : `${username}'s Typeracer Stats`,
+    );
   };
 
   const width = hide_rank

src/fetchers/stats-fetcher.js

@@ -1,11 +1,7 @@
 // @ts-check
 const axios = require("axios").default;
 
-const {
-  logger,
-  CustomError,
-  MissingParamError,
-} = require("../common/utils");
+const { logger, CustomError, MissingParamError } = require("../common/utils");
 
 require("dotenv").config();
 
@@ -14,15 +10,15 @@ require("dotenv").config();
  */
 const fetcher = (username) => {
   return axios({
-    method: 'get',
-    url: `https://data.typeracer.com/users?id=tr:${username}`
+    method: "get",
+    url: `https://data.typeracer.com/users?id=tr:${username}`,
   }).catch((error) => {
     logger.error(`Fail to fetch TypeRacer statistics: ${error}`);
     throw new CustomError(
       error.message || "Could not fetch typeracer statistic",
       CustomError.USER_NOT_FOUND,
     );
-  })
+  });
 };
 
 /**
@@ -43,11 +39,11 @@ async function fetchStats(username) {
   };
 
   let raceResponse = await fetcher(username);
-  
+
   // @ts-ignore
   const { data } = raceResponse;
 
-  if(!data || !data.tstats || data.errors){ 
+  if (!data || !data.tstats || data.errors) {
     logger.error(data.errors);
     throw new CustomError(
       data.errors[0].message || "Could not fetch user",

src/fetchers/types.d.ts

@@ -1,9 +1,9 @@
 export type StatsData = {
-  username: string,
-  cg: number,
-  gamesWon: number,
-  bestGameWpm: number,
-  wpm: number,
-  recentAvgWpm: number,
-  recentScores: number[],
+  username: string;
+  cg: number;
+  gamesWon: number;
+  bestGameWpm: number;
+  wpm: number;
+  recentAvgWpm: number;
+  recentScores: number[];
 };

tests/api.test.js

@@ -55,7 +55,9 @@ const faker = (query, data) => {
     setHeader: jest.fn(),
     send: jest.fn(),
   };
-  mock.onGet(`https://data.typeracer.com/users?id=tr:${req.query.username}`).reply(200, data);
+  mock
+    .onGet(`https://data.typeracer.com/users?id=tr:${req.query.username}`)
+    .reply(200, data);
 
   return { req, res };
 };

tests/fetchStats.test.js

@@ -38,8 +38,9 @@ afterEach(() => {
 
 describe("Test fetchStats", () => {
   it("should fetch correct stats", async () => {
-    mock.onGet(`https://data.typeracer.com/users?id=tr:juninight`).reply(200, data);
-
+    mock
+      .onGet(`https://data.typeracer.com/users?id=tr:juninight`)
+      .reply(200, data);
 
     let stats = await fetchStats("juninight");
 

tests/renderStatsCard.test.js

@@ -32,10 +32,16 @@ describe("Test renderStatsCard", () => {
     ).toBe("255");
     expect(getByTestId(document.body, "cg").textContent).toBe("9.1k");
     expect(getByTestId(document.body, "gamesWon").textContent).toBe("1.9k");
-    expect(getByTestId(document.body, "bestGameWpm").textContent).toBe("110 WPM");
+    expect(getByTestId(document.body, "bestGameWpm").textContent).toBe(
+      "110 WPM",
+    );
     expect(getByTestId(document.body, "wpm").textContent).toBe("70 WPM");
-    expect(getByTestId(document.body, "recentAvgWpm").textContent).toBe("85 WPM");
-    expect(getByTestId(document.body, "recentScores").textContent).toBe(`[${stats.recentScores.toString()}]`);
+    expect(getByTestId(document.body, "recentAvgWpm").textContent).toBe(
+      "85 WPM",
+    );
+    expect(getByTestId(document.body, "recentScores").textContent).toBe(
+      `[${stats.recentScores.toString()}]`,
+    );
     expect(queryByTestId(document.body, "card-bg")).toBeInTheDocument();
     expect(queryByTestId(document.body, "rank-circle")).toBeInTheDocument();
   });