Code quality checks (#3)

.github/workflows/code-quality.yml

@@ -0,0 +1,47 @@
+name: Code Quality
+
+on:
+  workflow_call:
+    outputs:
+      status:
+        description: "The status of the quality checks"
+        value: ${{ jobs.code-quality.outputs.status }}
+
+jobs:
+  code-quality:
+    runs-on: ubuntu-latest
+    outputs:
+      status: ${{ steps.quality-check.outputs.status }}
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v4
+
+      - name: Setup Node.js
+        uses: actions/setup-node@v4
+        with:
+          node-version: '22'
+
+      - name: Setup pnpm
+        uses: pnpm/action-setup@v2
+        with:
+          version: 8
+
+      - name: Install Dependencies
+        working-directory: frontend
+        run: pnpm install
+
+      - name: Type Check
+        working-directory: frontend
+        run: pnpm typecheck
+
+      - name: Lint
+        working-directory: frontend
+        run: pnpm lint
+
+      - name: Build
+        working-directory: frontend
+        run: pnpm build
+
+      - name: Set output
+        id: quality-check
+        run: echo "status=success" >> $GITHUB_OUTPUT

.github/workflows/deploy.yml

@@ -9,7 +9,11 @@ permissions:
   contents: write
 
 jobs:
-  build-and-deploy:
+  quality:
+    uses: ./.github/workflows/code-quality.yml
+
+  deploy:
+    needs: quality
     runs-on: ubuntu-latest
     steps:
       - name: Checkout
@@ -37,4 +41,4 @@ jobs:
         uses: JamesIves/github-pages-deploy-action@v4
         with:
           folder: frontend/out
-          branch: gh-pages 
+          branch: gh-pages

.github/workflows/pull-request.yml

@@ -0,0 +1,10 @@
+name: Pull Request Checks
+
+on:
+  pull_request:
+    branches:
+      - main
+
+jobs:
+  quality:
+    uses: ./.github/workflows/code-quality.yml

.husky/pre-commit

@@ -0,0 +1,4 @@
+cd frontend || exit
+
+echo "Running code quality check..."
+pnpm lint

.husky/pre-push

@@ -0,0 +1,14 @@
+# Run only if there are changes in the frontend directory
+if git diff --name-only HEAD^ HEAD | grep --quiet "frontend"; then
+
+    # Change to frontend from any path
+    git_root=$(git rev-parse --show-toplevel)
+    cd "$git_root/frontend" || exit
+
+    echo "Running code quality check..."
+    pnpm lint
+
+    echo "Running type check..."
+    pnpm typecheck
+
+fi

frontend/eslint.config.cjs

@@ -0,0 +1,55 @@
+/* eslint-disable @typescript-eslint/no-require-imports */
+/* eslint-disable @typescript-eslint/no-unused-vars */
+const reactPlugin = require('eslint-plugin-react');
+const typescriptPlugin = require('@typescript-eslint/eslint-plugin');
+const { FlatCompat } = require('@eslint/eslintrc');
+const path = require('path');
+const eslintJs = require('@eslint/js');
+
+const compat = new FlatCompat({
+  baseDirectory: __dirname,
+  recommendedConfig: eslintJs.configs.recommended
+});
+
+const config = [
+  {
+    ignores: [
+      'out/**',
+      '.next/**',
+      'build/**',
+      'dist/**',
+      'node_modules/**'
+    ]
+  },
+  ...compat.extends(
+    'eslint:recommended',
+    'plugin:react/recommended',
+    'plugin:@typescript-eslint/recommended',
+    'next/core-web-vitals'
+  ),
+  {
+    files: ['*.js', '*.jsx', '*.ts', '*.tsx'],
+    languageOptions: {
+      parserOptions: {
+        ecmaVersion: 'latest',
+        sourceType: 'module',
+      },
+    },
+    plugins: {
+      react: reactPlugin,
+      '@typescript-eslint': typescriptPlugin,
+    },
+    rules: {
+      'no-unused-vars': 'warn',
+      'no-console': 'off',
+      'eol-last': ['error', 'always'],
+    },
+    settings: {
+      react: {
+        version: 'detect',
+      },
+    },
+  },
+];
+
+module.exports = config;

frontend/next.config.js → frontend/next.config.mjs

@@ -29,4 +29,4 @@ const nextConfig = {
   }
 }
 
-module.exports = nextConfig 
+export default nextConfig 

frontend/package.json

@@ -2,29 +2,48 @@
   "name": "thegoodailab-website",
   "version": "0.1.0",
   "private": true,
+  "type": "module",
   "scripts": {
     "dev": "next dev --turbopack",
     "build": "next build",
-    "start": "next start",
-    "lint": "next lint",
-    "format": "next lint --fix",
-    "typecheck": "tsc --noEmit"
+    "lint": "eslint . --fix",
+    "typecheck": "tsc --noEmit",
+    "prepare": "cd .. && husky"
   },
   "dependencies": {
     "framer-motion": "^11.13.1",
     "next": "15.0.3",
-    "react": "^18.2.0",
-    "react-dom": "^18.2.0",
+    "react": "^18.3.1",
+    "react-dom": "^18.3.1",
     "react-icons": "^5.4.0"
   },
   "devDependencies": {
-    "@types/node": "^20",
+    "@commitlint/cli": "^19.6.0",
+    "@commitlint/config-conventional": "^19.6.0",
+    "@eslint/eslintrc": "^3.2.0",
+    "@types/node": "^22",
     "@types/react": "^18",
     "@types/react-dom": "^18",
-    "eslint": "^8",
+    "eslint": "^9.16.0",
     "eslint-config-next": "15.0.3",
+    "husky": "^9.1.7",
+    "lint-staged": "^15.2.10",
     "postcss": "^8",
-    "tailwindcss": "^3.4.1",
+    "tailwindcss": "^3.4.16",
     "typescript": "^5"
+  },
+  "lint-staged": {
+    "*.{js,jsx,ts,tsx}": [
+      "eslint --fix",
+      "prettier --write"
+    ]
+  },
+  "commitlint": {
+    "extends": [
+      "@commitlint/config-conventional"
+    ]
+  },
+  "eslintConfig": {
+    "extends": "next/core-web-vitals"
   }
 }