Added more checks to the CI pipeline (#39)

* Added better checks to validate i18n and ts

* Updated prettier check to use tools instead

* Added types for react-measure

* Removed dependencies from another PR

.husky/pre-commit

@@ -1,17 +1,9 @@
 FILES=$(git diff --cached --name-only --diff-filter=ACMR | sed 's| |\\ |g')
 [ -z "$FILES" ] && exit 0
 
-# Prettify all selected files
-echo "$FILES" | npm run prettier:write
-
-# Add back the modified/prettified files to staging
-echo "$FILES" | xargs git add
-
-if npm run prettier:check; then
-  echo "Prettier passed"
+if npm run lint; then
+  echo "Lint passed"
 else
-  echo "Prettier failed"
+  echo "Lint failed"
   exit 1
 fi
-
-npm run lint

package.json

@@ -6,9 +6,11 @@
   "scripts": {
     "test:watch": "jest --watch",
     "test": "jest",
-    "lint": "npm run eslint",
+    "lint": "npm run check:ts && npm run check:eslint && npm run check:prettier-diff && npm run check:i18n",
     "check:ts": "tsc --noEmit",
-    "eslint": "eslint -c eslint.config.mjs",
+    "check:i18n": "node ./tools/check-i18n.mjs",
+    "check:prettier-diff": "node ./tools/check-prettier-diff.mjs",
+    "check:eslint": "eslint -c eslint.config.mjs",
     "build": "npm test && npm run lint && npm run build:prod",
     "build:prod": "webpack --mode=production",
     "start": "webpack --mode=development --watch",
@@ -64,6 +66,7 @@
     "@types/jest": "^29.2.3",
     "@types/react": "18.3.12",
     "@types/react-dom": "18.3.1",
+    "@types/react-measure": "^2.0.12",
     "@types/throttle-debounce": "5.0.2",
     "@typescript-eslint/eslint-plugin": "8.12.2",
     "@typescript-eslint/parser": "8.12.2",
@@ -99,7 +102,7 @@
     "react-dom": "18.3.1",
     "react-github-contribution-calendar": "2.2.0",
     "react-tooltip": "5.28.0",
-    "tailwind-merge": "2.5.4",
+    "tailwind-merge": "^2.5.4",
     "throttle-debounce": "5.0.2",
     "utility-types": "^3.11.0"
   },

tools/check-i18n.mjs

@@ -0,0 +1,46 @@
+import fs from 'fs';
+import { createRequire } from 'module';
+import { dirname } from 'path';
+import { fileURLToPath } from 'url';
+
+const __filename = fileURLToPath(import.meta.url);
+const __dirname = dirname(__filename);
+
+const require = createRequire(import.meta.url);
+
+const manifest = require(__dirname + '/../static/manifest.json');
+const defaultLocale = manifest.default_locale;
+
+const defaultTranslations = require(
+  __dirname + `/../static/_locales/${defaultLocale}/messages.json`,
+);
+const defaultTranslationKeys = Object.keys(defaultTranslations);
+const locales = fs.readdirSync(__dirname + '/../static/_locales');
+
+let errors = [];
+locales.forEach((locale) => {
+  if (locale === defaultLocale) {
+    return;
+  }
+
+  const translations = require(
+    __dirname + `/../static/_locales/${locale}/messages.json`,
+  );
+
+  for (const key of defaultTranslationKeys) {
+    if (!translations[key]) {
+      errors.push({
+        locale,
+        key,
+      });
+    }
+  }
+});
+
+if (errors.length > 0) {
+  console.error('Missing translations:');
+  errors.forEach((error) => {
+    console.error(`- ${error.locale}: ${error.key}`);
+  });
+  process.exit(1);
+}

tools/check-prettier-diff.mjs

@@ -0,0 +1,22 @@
+// Check prettier only on changed files
+import { execSync } from 'child_process';
+
+const changedFiles = execSync('git diff --name-only HEAD')
+  .toString()
+  .split('\n');
+
+const EXTENSIONS = ['js', 'mjs', 'ts', 'tsx'];
+const prettierFiles = changedFiles.filter((file) =>
+  EXTENSIONS.some((ext) => file.endsWith(ext)),
+);
+
+if (prettierFiles.length > 0) {
+  try {
+    execSync(
+      `npx prettier --ignore-path .gitignore --check ${prettierFiles.join(' ')}`,
+    );
+  } catch (error) {
+    console.error('Prettier check failed');
+    process.exit(1);
+  }
+}

tsconfig.json

@@ -1,4 +1,5 @@
 {
+  "exclude": ["node_modules", "dist"],
   "compilerOptions": {
     "outDir": "./dist/",
     "baseUrl": "./",
@@ -17,8 +18,8 @@
     "noUncheckedIndexedAccess": true,
     "target": "ES2018",
     "lib": ["ESNext", "DOM"],
-    "module": "CommonJS",
-    "moduleResolution": "node",
+    "module": "ES2015",
+    "moduleResolution": "Bundler",
     "jsx": "react",
     "jsxFactory": "React.createElement",
     "jsxFragmentFactory": "React.Fragment",