feat: add eslint / prettier formatting standards

Add ESLint to docs projects
Simplify lint/format commands to format (fixes) and lint (checks) a
Update READMEs and PR templates
Fix MDX formatting issues

Author: JonathanMatthey

packages/documentation/.eslintignore

@@ -0,0 +1,15 @@
+# Dependencies
+node_modules/
+
+# Build output
+build/
+dist/
+.astro/
+
+# Generated files
+*.d.ts
+
+# GraphQL generated files
+src/pages/**/*.html
+
+

packages/documentation/.eslintrc.cjs

@@ -0,0 +1,46 @@
+module.exports = {
+  root: true,
+  env: {
+    node: true,
+    es2022: true,
+    browser: true
+  },
+  extends: [
+    'eslint:recommended',
+    'plugin:@typescript-eslint/recommended',
+    'plugin:astro/recommended'
+  ],
+  parser: '@typescript-eslint/parser',
+  parserOptions: {
+    ecmaVersion: 2022,
+    sourceType: 'module'
+  },
+  plugins: ['@typescript-eslint'],
+  overrides: [
+    {
+      files: ['*.astro'],
+      parser: 'astro-eslint-parser',
+      parserOptions: {
+        parser: '@typescript-eslint/parser',
+        extraFileExtensions: ['.astro']
+      }
+    },
+    {
+      files: ['public/**/*.js'],
+      env: {
+        browser: true,
+        node: false
+      }
+    }
+  ],
+  rules: {
+    '@typescript-eslint/no-unused-vars': [
+      'error',
+      {
+        argsIgnorePattern: '^_',
+        varsIgnorePattern: '^_'
+      }
+    ],
+    '@typescript-eslint/no-explicit-any': 'warn'
+  }
+}

packages/documentation/README.md

@@ -30,6 +30,18 @@ $ pnpm build:docs
 
 This command generates static content into the build directory and can be served using any static contents hosting service.
 
+- Format code and fix linting issues:
+
+```sh
+$ pnpm format
+```
+
+- Check formatting and linting:
+
+```sh
+$ pnpm lint
+```
+
 ## Editing Content
 
 Starlight looks for `.md` or `.mdx` files in the `src/content/docs/` directory. Each file is exposed as a route based on its file name. Due to the nature of how Starlight deals with content and their generated URLs, all docs content lives in `/src/content/docs/`. For example, the home page of the documentation lives within the `/src/content/docs/` folder and is rendered at rafiki.dev, not rafiki.dev/docs.
@@ -112,3 +124,12 @@ import Base from '../layouts/Base.astro';
 ```
 
 Refer to the Astro documentation on [pages](https://docs.astro.build/en/core-concepts/astro-pages/) for more detailed guidance.
+
+## Code Formatting
+
+This project uses [Prettier](https://prettier.io/) and [ESLint](https://eslint.org/) for code formatting and linting. Before submitting a pull request, please ensure your code is properly formatted:
+
+1. **Fix issues**: Run `pnpm format` to automatically fix formatting and linting issues
+2. **Check before pushing**: Run `pnpm lint` to verify everything passes (CI will also run this)
+
+ESLint is configured to work with TypeScript and Astro files. The configuration extends recommended rules from ESLint, TypeScript ESLint, and Astro ESLint plugins.

packages/documentation/package.json

@@ -7,7 +7,9 @@
     "build:docs": "astro build",
     "build:docs:graphql": "spectaql config-auth.yml && spectaql config-backend.yml",
     "preview": "astro preview",
-    "astro": "astro"
+    "astro": "astro",
+    "format": "prettier --write . && eslint . --ext .js,.jsx,.ts,.tsx,.astro --fix",
+    "lint": "prettier --check . && eslint . --ext .js,.jsx,.ts,.tsx,.astro"
   },
   "dependencies": {
     "@astrojs/markdown-remark": "^6.3.2",
@@ -22,5 +24,12 @@
     "starlight-fullview-mode": "^0.2.3",
     "starlight-links-validator": "^0.17.0",
     "starlight-versions": "^0.5.5"
+  },
+  "devDependencies": {
+    "@typescript-eslint/eslint-plugin": "^7.0.0",
+    "@typescript-eslint/parser": "^7.0.0",
+    "astro-eslint-parser": "^1.0.0",
+    "eslint": "^8.57.0",
+    "eslint-plugin-astro": "^0.32.0"
   }
 }