Adds website linting workflow#186
Conversation
Adds ESLint, Prettier, and a GitHub Actions workflow to lint the website codebase. This ensures consistent code formatting and helps to identify potential issues early in the development process.
|
Caution Review failedThe pull request is closed. WalkthroughA comprehensive code quality system is established for the website directory. This includes new configuration files for ESLint and Prettier, updates to package scripts and dependencies, a GitHub Actions workflow for automated linting and formatting, a minor indentation adjustment in a TypeScript config file, and a refinement of the test workflow to restrict runs to relevant directory changes. Changes
Sequence Diagram(s)sequenceDiagram
participant Developer
participant GitHub
participant GitHubActions
participant Node
participant ESLint
participant Prettier
Developer->>GitHub: Push or PR to website/
GitHub->>GitHubActions: Trigger website-lint workflow
GitHubActions->>Node: Setup Node.js environment
GitHubActions->>Node: Install dependencies (npm ci)
GitHubActions->>Prettier: Run format:check on codebase
GitHubActions->>ESLint: Run lint on codebase
Prettier-->>GitHubActions: Report formatting status
ESLint-->>GitHubActions: Report linting status
GitHubActions-->>GitHub: Post results to PR/checks
Poem
📜 Recent review detailsConfiguration used: .coderabbit.yaml 📒 Files selected for processing (1)
✨ Finishing Touches🧪 Generate Unit Tests
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. 🪧 TipsChatThere are 3 ways to chat with CodeRabbit:
SupportNeed help? Create a ticket on our support page for assistance with any issues or questions. Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments. CodeRabbit Commands (Invoked using PR comments)
Other keywords and placeholders
Documentation and Community
|
There was a problem hiding this comment.
Actionable comments posted: 2
📜 Review details
Configuration used: .coderabbit.yaml
Review profile: ASSERTIVE
Plan: Pro
Cache: Disabled due to data retention organization setting
Knowledge Base: Disabled due to data retention organization setting
⛔ Files ignored due to path filters (1)
website/package-lock.jsonis excluded by!**/package-lock.json
📒 Files selected for processing (5)
.github/workflows/website-lint.yml(1 hunks)website/.eslintrc.cjs(1 hunks)website/.prettierrc(1 hunks)website/package.json(1 hunks)website/src/content.config.ts(1 hunks)
⏰ Context from checks skipped due to timeout of 90000ms (2)
- GitHub Check: tests (macos-latest)
- GitHub Check: tests (ubuntu-latest)
🔇 Additional comments (4)
website/.prettierrc (1)
1-10: Prettier configuration is correct and comprehensive. Settings enforce consistent formatting across the website codebase.website/src/content.config.ts (1)
6-6: Indentation aligned per Prettier rules. The 2-space indent now matches the project’s style guidelines..github/workflows/website-lint.yml (1)
1-36: CI workflow for website linting is well-structured. It correctly triggers on changes underwebsite/, configures Node.js with caching, and runs both Prettier and ESLint checks.website/package.json (1)
10-14: New linting and formatting scripts are properly added. Developers can now runnpm run lint,lint:fix,format, andformat:checklocally.
| module.exports = { | ||
| root: true, | ||
| extends: [ | ||
| 'eslint:recommended', | ||
| 'plugin:@typescript-eslint/recommended', | ||
| 'plugin:astro/recommended' | ||
| ], | ||
| parser: '@typescript-eslint/parser', | ||
| plugins: ['@typescript-eslint'], | ||
| parserOptions: { | ||
| ecmaVersion: 'latest', | ||
| sourceType: 'module', | ||
| project: './tsconfig.json' | ||
| }, | ||
| env: { | ||
| browser: true, | ||
| node: true | ||
| }, | ||
| overrides: [ | ||
| { | ||
| files: ['*.astro'], | ||
| parser: 'astro-eslint-parser', | ||
| parserOptions: { | ||
| parser: '@typescript-eslint/parser', | ||
| extraFileExtensions: ['.astro'] | ||
| } | ||
| } | ||
| ] | ||
| }; No newline at end of file |
There was a problem hiding this comment.
🧹 Nitpick (assertive)
Integrate Prettier with ESLint to prevent rule conflicts. Consider adding plugin:prettier/recommended (or eslint-config-prettier) to the extends array so formatting rules from Prettier don’t clash with ESLint.
🤖 Prompt for AI Agents
In website/.eslintrc.cjs lines 1 to 29, the ESLint configuration lacks
integration with Prettier, which can cause conflicts between ESLint and Prettier
formatting rules. To fix this, add 'plugin:prettier/recommended' to the extends
array in the ESLint config. This will enable Prettier's recommended settings and
disable conflicting ESLint rules, ensuring smooth coexistence of both tools.
| "devDependencies": { | ||
| "@typescript-eslint/eslint-plugin": "^8.34.1", | ||
| "@typescript-eslint/parser": "^8.34.1", | ||
| "eslint": "^8.56.0", | ||
| "eslint-plugin-astro": "^1.3.1", | ||
| "prettier": "^3.5.3" | ||
| } |
There was a problem hiding this comment.
Missing Prettier plugin for Astro files. Without prettier-plugin-astro installed, Prettier will error on .astro files. Add it to devDependencies to enable formatting for Astro components.
Apply this diff:
"devDependencies": {
- "prettier": "^3.5.3"
+ "prettier": "^3.5.3",
+ "prettier-plugin-astro": "^1.0.0"
}📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| "devDependencies": { | |
| "@typescript-eslint/eslint-plugin": "^8.34.1", | |
| "@typescript-eslint/parser": "^8.34.1", | |
| "eslint": "^8.56.0", | |
| "eslint-plugin-astro": "^1.3.1", | |
| "prettier": "^3.5.3" | |
| } | |
| "devDependencies": { | |
| "@typescript-eslint/eslint-plugin": "^8.34.1", | |
| "@typescript-eslint/parser": "^8.34.1", | |
| "eslint": "^8.56.0", | |
| "eslint-plugin-astro": "^1.3.1", | |
| "prettier": "^3.5.3", | |
| "prettier-plugin-astro": "^1.0.0" | |
| } |
🤖 Prompt for AI Agents
In website/package.json around lines 21 to 27, the devDependencies are missing
the prettier-plugin-astro package, which is required for Prettier to format
.astro files correctly. Add "prettier-plugin-astro" with an appropriate version
to the devDependencies section to enable proper formatting of Astro components.
Updates `@typescript-eslint/*`, `eslint`, `eslint-plugin-astro`, and `typescript` dev dependencies. This brings in the latest features and bug fixes from these packages.
There was a problem hiding this comment.
Actionable comments posted: 1
♻️ Duplicate comments (1)
website/package.json (1)
21-27: Missing Prettier plugin for Astro files.
Withoutprettier-plugin-astroindevDependencies, Prettier will error on.astrofiles. Add it right afterprettier:"devDependencies": { - "prettier": "^3.5.3", + "prettier": "^3.5.3", + "prettier-plugin-astro": "^1.0.0", "typescript": "^5.4.3" }
📜 Review details
Configuration used: .coderabbit.yaml
Review profile: ASSERTIVE
Plan: Pro
Cache: Disabled due to data retention organization setting
Knowledge Base: Disabled due to data retention organization setting
⛔ Files ignored due to path filters (1)
website/package-lock.jsonis excluded by!**/package-lock.json
📒 Files selected for processing (1)
website/package.json(1 hunks)
⏰ Context from checks skipped due to timeout of 90000ms (2)
- GitHub Check: tests (macos-latest)
- GitHub Check: tests (ubuntu-latest)
🔇 Additional comments (1)
website/package.json (1)
10-14: Impressive new lint & format scripts!
These commands will enforce ESLint across.js/.jsx/.ts/.tsx/.astroand Prettier over all key file types.
| "devDependencies": { | ||
| "@typescript-eslint/eslint-plugin": "^7.0.0", | ||
| "@typescript-eslint/parser": "^7.0.0", | ||
| "eslint": "^8.56.0", | ||
| "eslint-plugin-astro": "^0.31.0", | ||
| "prettier": "^3.5.3", | ||
| "typescript": "^5.4.3" |
There was a problem hiding this comment.
🧹 Nitpick (assertive)
Consider integrating Prettier into ESLint.
Adding eslint-config-prettier (and optionally eslint-plugin-prettier) will disable conflicting ESLint rules and surface formatting issues directly in your lint step:
"devDependencies": {
"eslint": "^8.56.0",
+ "eslint-config-prettier": "^8.8.0",
"@typescript-eslint/parser": "^7.0.0",
"@typescript-eslint/eslint-plugin": "^7.0.0",
"eslint-plugin-astro": "^0.31.0",
"prettier": "^3.5.3",
"prettier-plugin-astro": "^1.0.0",
"typescript": "^5.4.3"
}Committable suggestion skipped: line range outside the PR's diff.
🤖 Prompt for AI Agents
In website/package.json around lines 21 to 27, Prettier is listed as a
devDependency but is not integrated with ESLint. To fix this, add
eslint-config-prettier to the devDependencies to disable ESLint rules that
conflict with Prettier, and optionally add eslint-plugin-prettier to run
Prettier as an ESLint rule. Then update the ESLint configuration to extend
eslint-config-prettier and include eslint-plugin-prettier in the plugins section
to surface formatting issues during linting.
Limits CI execution to changes within the core, CLI, and Nix directories. This improves CI efficiency by preventing unnecessary test runs for unrelated changes.
|
@allcontributors please add @verogarp for doc |
|
I've put up a pull request to add @verogarp! 🎉 |
Adds ESLint, Prettier, and a GitHub Actions workflow to lint the website
codebase.
This ensures consistent code formatting and helps to identify potential
issues early in the development process.
Summary by CodeRabbit