Skip to content

Conversation

@yashhhguptaaa
Copy link

@yashhhguptaaa yashhhguptaaa commented Dec 28, 2025

Closes #615

Summary

This PR adds a centralized ESLint and Prettier configuration package to standardize linting and formatting across the monorepo. It migrates all apps and packages to use the shared configuration, ensuring consistent code style and enabling auto-formatting on save.

Changes

New Packages

  • @probo/eslint-config: Shared ESLint configuration package with:

    • ESLint 9.x flat config format
    • TypeScript strict rules (type-checked)
    • Stylistic rules for consistent code style
    • Prettier integration via eslint-plugin-prettier
    • React Hooks support (optional, via browser() helper)
    • Helper functions: createConfig(), browser(), and node()
  • @probo/prettier: Enhanced Prettier configuration that aligns with ESLint stylistic rules:

    • 4-space indentation
    • Double quotes
    • Semicolons
    • Trailing commas
    • 120 character line width
    • Unix line endings (LF)

Migration

  • Console app: Migrated to use @probo/eslint-config and @probo/prettier
  • Trust app: Migrated to use @probo/eslint-config and @probo/prettier
  • UI package: Migrated to use @probo/eslint-config and @probo/prettier
  • Root package.json: Added Prettier configuration reference

Code Quality Improvements

  • Removed duplicate ESLint dependencies from individual packages
  • Simplified ESLint config files (reduced from ~30 lines to ~3 lines per package)
  • Standardized formatting across all package.json files (4-space indentation)
  • Removed redundant eslintConfig sections from package.json files

Technical Details

ESLint Rules

The shared config includes:

  • TypeScript strict rules: no-floating-promises, no-misused-promises, await-thenable, etc.
  • Stylistic rules: Quotes, semicolons, indentation, spacing, trailing commas
  • Prettier integration: Enforces Prettier formatting via ESLint

Configuration Usage

Apps and packages now use a simple configuration:

import { browser } from "@probo/eslint-config";

export default [
    { ignores: ["dist", "eslint.config.mjs", "*.config.{js,mjs,ts}"] },
    ...browser(["./tsconfig.app.json", "./tsconfig.node.json"], import.meta.dirname),
];

Benefits

  1. Consistency: All packages use the same linting and formatting rules
  2. Maintainability: Single source of truth for code style configuration
  3. Developer Experience: Auto-formatting on save works consistently across the monorepo
  4. Type Safety: Strict TypeScript rules catch potential bugs at lint time
  5. Reduced Duplication: No need to duplicate ESLint configs in each package

Testing

  • ESLint runs successfully in all packages
  • Prettier formatting works correctly
  • TypeScript compilation passes
  • No breaking changes to existing code

Migration Notes

For future packages, add:

  1. @probo/eslint-config and @probo/prettier to devDependencies
  2. "prettier": "@probo/prettier" to package.json
  3. Create eslint.config.mjs using the browser() or node() helper

@yashhhguptaaa yashhhguptaaa marked this pull request as ready for review December 28, 2025 10:42
Copy link

@cubic-dev-ai cubic-dev-ai bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

1 issue found across 12 files

Prompt for AI agents (all issues)

Check if these issues are valid — if so, understand the root cause of each and fix them.


<file name="packages/eslint-config/eslint.config.mjs">

<violation number="1" location="packages/eslint-config/eslint.config.mjs:37">
P2: The `globals` object is replaced instead of merged when passing custom `languageOptions`. When `browser()` or `node()` helpers are used, `globals.es2021` is lost because `...languageOptions` spreads at the object level, completely replacing the `globals` key. This could cause ESLint to report &quot;undefined variable&quot; errors for standard ES2021 globals.</violation>
</file>

Reply to cubic to teach it or ask questions. Tag @cubic-dev-ai to re-run a review.

project,
...(tsconfigRootDir && { tsconfigRootDir }),
},
...languageOptions,
Copy link

@cubic-dev-ai cubic-dev-ai bot Dec 28, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

P2: The globals object is replaced instead of merged when passing custom languageOptions. When browser() or node() helpers are used, globals.es2021 is lost because ...languageOptions spreads at the object level, completely replacing the globals key. This could cause ESLint to report "undefined variable" errors for standard ES2021 globals.

Prompt for AI agents
Check if this issue is valid — if so, understand the root cause and fix it. At packages/eslint-config/eslint.config.mjs, line 37:

<comment>The `globals` object is replaced instead of merged when passing custom `languageOptions`. When `browser()` or `node()` helpers are used, `globals.es2021` is lost because `...languageOptions` spreads at the object level, completely replacing the `globals` key. This could cause ESLint to report &quot;undefined variable&quot; errors for standard ES2021 globals.</comment>

<file context>
@@ -0,0 +1,133 @@
+                    project,
+                    ...(tsconfigRootDir &amp;&amp; { tsconfigRootDir }),
+                },
+                ...languageOptions,
+            },
+            plugins: {
</file context>

✅ Addressed in 3cef924

Copy link
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

3cef924

Fixed

Copy link
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@yashhhguptaaa I have started the AI code review. It will take a few minutes to complete.

@yashhhguptaaa
Copy link
Author

@codenem

Formatting Strategy

This PR includes only the configuration changes (ESLint/Prettier setup). No source code formatting has been applied yet.

Rationale:

  • Allows you to review the configuration logic first
  • Keeps the PR focused and easier to review (config vs. formatting changes)
  • Formatting can be applied in a follow-up PR or after approval

Current state:

  • ✅ ESLint configs are set up and working
  • ✅ Prettier config is ready
  • ✅ All packages reference the shared configs
  • ⏳ Source code formatting will be done after review

After approval, I'll run:
npm run format This will format all files according to the new Prettier configuration.

Please review the configuration changes, and once approved, I'll apply the formatting.

Copy link

@cubic-dev-ai cubic-dev-ai bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

1 issue found across 12 files

Prompt for AI agents (all issues)

Check if these issues are valid — if so, understand the root cause of each and fix them.


<file name="packages/eslint-config/package.json">

<violation number="1" location="packages/eslint-config/package.json:15">
P2: Redundant dependencies: `@typescript-eslint/eslint-plugin` and `@typescript-eslint/parser` are not needed when using `typescript-eslint`. The unified `typescript-eslint` package (v8+) already bundles the parser and plugin together, and the implementation only imports from `typescript-eslint`. These redundant packages increase install size and may cause version conflicts.</violation>
</file>

Reply to cubic to teach it or ask questions. Tag @cubic-dev-ai to re-run a review.

"dependencies": {
"@eslint/js": "^9.25.0",
"@stylistic/eslint-plugin": "^4.2.0",
"@typescript-eslint/eslint-plugin": "^8.30.1",
Copy link

@cubic-dev-ai cubic-dev-ai bot Dec 28, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

P2: Redundant dependencies: @typescript-eslint/eslint-plugin and @typescript-eslint/parser are not needed when using typescript-eslint. The unified typescript-eslint package (v8+) already bundles the parser and plugin together, and the implementation only imports from typescript-eslint. These redundant packages increase install size and may cause version conflicts.

Prompt for AI agents
Check if this issue is valid — if so, understand the root cause and fix it. At packages/eslint-config/package.json, line 15:

<comment>Redundant dependencies: `@typescript-eslint/eslint-plugin` and `@typescript-eslint/parser` are not needed when using `typescript-eslint`. The unified `typescript-eslint` package (v8+) already bundles the parser and plugin together, and the implementation only imports from `typescript-eslint`. These redundant packages increase install size and may cause version conflicts.</comment>

<file context>
@@ -0,0 +1,27 @@
+    &quot;dependencies&quot;: {
+        &quot;@eslint/js&quot;: &quot;^9.25.0&quot;,
+        &quot;@stylistic/eslint-plugin&quot;: &quot;^4.2.0&quot;,
+        &quot;@typescript-eslint/eslint-plugin&quot;: &quot;^8.30.1&quot;,
+        &quot;@typescript-eslint/parser&quot;: &quot;^8.30.1&quot;,
+        &quot;eslint-config-prettier&quot;: &quot;^9.1.0&quot;,
</file context>

✅ Addressed in 0a45502

Copy link
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Update lint / format config

1 participant