Upgrade to Eslint v9
#10102
Upgrade to Eslint v9
#10102
Conversation
|
Caution Review failedThe pull request is closed. WalkthroughThis pull request introduces a comprehensive upgrade of the ESLint configuration from version 8 to version 9, involving significant changes to the project's linting setup. The modifications include replacing the legacy Changes
Assessment against linked issues
Possibly related PRs
Suggested labels
Suggested reviewers
Poem
📜 Recent review detailsConfiguration used: CodeRabbit UI 📒 Files selected for processing (10)
✨ Finishing Touches
Thank you for using CodeRabbit. We offer it for free to the OSS community and would appreciate your support in helping us grow. If you find it useful, would you consider giving us a shout-out on your favorite social media? 🪧 TipsChatThere are 3 ways to chat with CodeRabbit:
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
CodeRabbit Configuration File (
|
✅ Deploy Preview for care-ohc ready!
To edit notification comments on pull requests, go to your Netlify site configuration. |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 3
🔭 Outside diff range comments (1)
src/Utils/useSegmentedRecorder.ts (1)
Line range hint
15-52: Add cleanup for event listeners in useEffect.The first useEffect should clean up event listeners and stop the recorder when the component unmounts.
useEffect(() => { if (!isRecording && recorder && audioBlobs.length > 0) { setRecorder(null); } + return () => { + if (recorder) { + recorder.stream?.getTracks()?.forEach((i) => i?.stop()); + if (recorder.state === "recording") { + recorder.stop(); + } + } + }; }, [isRecording, recorder, audioBlobs]);
🧹 Nitpick comments (3)
eslint.config.mjs (3)
58-60: Update ECMAVersion to latest.The
ecmaVersionis set to 12 (ES2021). Consider updating to the latest version (14/ES2023) to support newer JavaScript features.- ecmaVersion: 12, + ecmaVersion: 14,
75-88: Consider adding stricter TypeScript rules.The current TypeScript configuration could be enhanced with additional strict rules for better type safety.
Add these rules to strengthen type checking:
"@typescript-eslint/no-explicit-any": "warn", + "@typescript-eslint/strict-boolean-expressions": "error", + "@typescript-eslint/no-non-null-assertion": "error", + "@typescript-eslint/explicit-function-return-type": ["error", { + "allowExpressions": true, + "allowTypedFunctionExpressions": true + }],
106-112: Enhance import path rules configuration.The current import path configuration could be more specific about the base directory structure.
Consider adding these options for better import control:
"no-relative-import-paths/no-relative-import-paths": [ "error", { allowSameFolder: true, prefix: "@", + rootDir: "src", + ignorePatterns: ["**/tests/**", "**/__tests__/**"] }, ],
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (16)
.eslintrc.json(0 hunks)eslint.config.mjs(1 hunks)package.json(2 hunks)src/CAREUI/interactive/SlideOver.tsx(1 hunks)src/Locale/update_locale.js(1 hunks)src/Utils/useSegmentedRecorder.ts(2 hunks)src/components/Common/DateInputV2.tsx(1 hunks)src/components/Common/ExcelFIleDragAndDrop.tsx(3 hunks)src/components/Common/UpdatableApp.tsx(1 hunks)src/components/Files/AudioCaptureDialog.tsx(1 hunks)src/components/Resource/ResourceCreate.tsx(1 hunks)src/components/ui/textarea.tsx(1 hunks)src/hooks/useFileManager.tsx(3 hunks)src/hooks/useFileUpload.tsx(3 hunks)src/hooks/useToast.ts(2 hunks)src/pages/Appointments/BookAppointment.tsx(1 hunks)
💤 Files with no reviewable changes (1)
- .eslintrc.json
✅ Files skipped from review due to trivial changes (4)
- src/components/Common/DateInputV2.tsx
- src/Locale/update_locale.js
- src/pages/Appointments/BookAppointment.tsx
- src/hooks/useToast.ts
🧰 Additional context used
🪛 GitHub Actions: Deploy Care Fe
package.json
[error] Dependency conflict: [email protected] is incompatible with @eslint/compat@^1.2.5 which requires eslint@^9.10.0
🔇 Additional comments (14)
src/components/ui/textarea.tsx (1)
5-19: LGTM! Clean type definition improvement.The change simplifies the component's type system by directly using React's built-in
TextareaHTMLAttributestype instead of a separate interface, while maintaining type safety.src/CAREUI/interactive/SlideOver.tsx (1)
119-119: LGTM! Improved callback safety.The explicit check for
onCloseClickexistence before invocation is a good practice that aligns with stricter ESLint rules.src/components/Common/UpdatableApp.tsx (1)
1-1: Verify the necessity of the ESLint directive.The ESLint directive to disable
@typescript-eslint/no-unused-expressionshas been added. This rule is typically needed when using the logical AND operator for side effects, but the code doesn't show any such usage.✅ Verification successful
ESLint directive is correctly used for React conditional patterns
The directive is necessary as the file uses logical AND operators for React's conditional rendering and dynamic class names, which would trigger the
@typescript-eslint/no-unused-expressionsrule.🏁 Scripts executed
The following scripts were executed for the analysis:
Script:
#!/bin/bash # Search for logical AND operators used for side effects rg -A 2 "&&\s*[^&]" src/components/Common/UpdatableApp.tsxLength of output: 320
src/components/Files/AudioCaptureDialog.tsx (2)
91-91: LGTM! Improved error handling clarity.Good practice using
_errorto explicitly indicate the error parameter is intentionally unused.
96-96: LGTM! Enhanced conditional check readability.The explicit
if (show)condition improves code clarity compared to using the logical AND operator.src/components/Common/ExcelFIleDragAndDrop.tsx (1)
50-50: LGTM! Consistent improvement in conditional checks.The changes from logical AND operators to explicit if statements improve code clarity and maintainability. This pattern is consistently applied across the file.
Also applies to: 99-99, 200-200
src/hooks/useFileUpload.tsx (4)
43-46: LGTM! Type definition improvement.Converting from interface to type is appropriate here as this is a simple type composition using intersection types.
178-180: LGTM! Improved callback handling.The explicit check for onUpload callback existence improves code safety and readability.
281-281: LGTM! Consistent error handling pattern.Using
_errorfor unused error parameter maintains consistency with the error handling pattern seen in other files.
Line range hint
1-1: Overall PR Assessment: High Quality ChangesThe changes demonstrate a systematic approach to improving code quality through:
- Consistent error handling patterns
- Enhanced type safety
- Better conditional check readability
- Alignment with ESLint v9 requirements
The modifications are well-structured and maintain consistency across all files.
src/hooks/useFileManager.tsx (3)
170-170: LGTM! Improved callback handling.The change from short-circuit evaluation to an explicit if condition improves code clarity and aligns with ESLint v9's stricter rules.
220-220: LGTM! Improved callback handling.Similar to the previous change, using an explicit if condition for the onEdit callback improves code clarity.
510-510: LGTM! Proper error handling.Renaming the error parameter to '_err' explicitly indicates that the error is intentionally unused in the catch block.
src/components/Resource/ResourceCreate.tsx (1)
88-88: LGTM! Fixed phone number validation logic.The removal of the negation operator corrects the validation logic, ensuring that phone numbers are properly validated.
|
Hey Team, how to fix lock-file errors |
|
@coderabbitai, how to solve lock-file error causing checks fail ? |
|
Tip For best results, initiate chat on the files or code changes. @AdityaJ2305 To resolve the lock-file errors, please try these steps:
rm package-lock.json
rm -rf node_modules
npm cache clean --force
npm install
git add package-lock.json
git commit -m "chore: update package-lock.json for ESLint v9 upgrade"This should resolve the lock file inconsistencies. Let me know if you still face any issues! (_/)< 🔗 Analysis chain🏁 Scripts executedThe following scripts were executed for the analysis: Script: Length of output: 234 |
There was a problem hiding this comment.
Actionable comments posted: 1
🧹 Nitpick comments (3)
eslint.config.mjs (3)
80-80: Remove unnecessary override of the 'no-undef' ruleDisabling the
no-undefrule is redundant in TypeScript files, as this rule is already handled by the TypeScript compiler. The@typescript-eslintplugin manages undefined variables, and disablingno-undefcan prevent potential conflicts.Apply this diff to remove the unnecessary rule:
- "no-undef": "off",
30-30: Update 'ecmaVersion' to the latest versionThe
ecmaVersionis currently set to12(ES2021). Consider updating it to"latest"to ensure compatibility with the most recent ECMAScript features your project may be using.Apply this diff to update the ECMAScript version:
- ecmaVersion: 12, + ecmaVersion: "latest",
68-74: Add comments to clarify unused variable patternsThe configuration for
@typescript-eslint/no-unused-varsuses ignore patterns like"^_"to allow certain unused variables. Adding a comment to explain this convention can improve readability and help other developers understand the rationale.Consider adding:
"@typescript-eslint/no-unused-vars": [ "error", { + // Ignore variables and arguments prefixed with an underscore argsIgnorePattern: "^_", varsIgnorePattern: "^_", caughtErrorsIgnorePattern: "^_", }, ],
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (3)
eslint.config.mjs(1 hunks)src/components/ui/tooltip.tsx(1 hunks)src/types/facility/facility.ts(0 hunks)
💤 Files with no reviewable changes (1)
- src/types/facility/facility.ts
✅ Files skipped from review due to trivial changes (1)
- src/components/ui/tooltip.tsx
🔇 Additional comments (2)
eslint.config.mjs (2)
60-63: Verify the TypeScript parser project configurationThe
parserOptionsspecify aprojectfield pointing to"./tsconfig.json". Ensure that this path is correct and that thetsconfig.jsonfile exists and is properly configured. Incorrect project references can lead to linting errors or degraded performance.
145-145: Ensure the correct path for Cypress TypeScript configurationThe
parserOptions.projectis set to"./cypress/tsconfig.json"for Cypress files. Verify that this path is accurate and that thetsconfig.jsonfile within thecypressdirectory is properly configured. This is crucial for correct linting of your Cypress tests.
|
👋 Hi, @AdityaJ2305, This message is automatically generated by prince-chrismc/label-merge-conflicts-action so don't hesitate to report issues/improvements there. |
There was a problem hiding this comment.
Actionable comments posted: 0
🧹 Nitpick comments (10)
src/components/Patient/symptoms/SymptomTable.tsx (1)
57-58: Consider using a stable unique key from the data object instead of the array index.Relying on the index as a key may lead to potential rendering issues when list items get reordered or removed. If each symptom has a unique ID, using that as the key is a best practice.
src/components/Patient/diagnosis/DiagnosisTable.tsx (1)
57-58: Prefer a unique data-derived key over the index.Using the index as a key can cause unexpected UI re-rendering and performance concerns if items change order. If the
diagnosisobject contains a unique identifier, please leverage that.src/components/Patient/allergy/AllergyTable.tsx (1)
56-57: Use a stable unique key instead of the index if possible.If the allergy object includes a unique ID field, using that as the key will provide a more consistent reconciliation in React than using the array index.
src/components/Patient/MedicationStatementList.tsx (1)
100-101: Leverage a data-specific ID as the table row key rather than the array index.Relying on array indices can hamper React’s re-rendering optimizations, especially if the order of
medications.resultschanges. A unique identifier from the statement object is preferred.src/components/Form/AutoCompleteAsync.tsx (1)
200-202: Consider using a unique field instead of the index for thekeyprop.
Relying on the array index can lead to subtle bugs, especially if the list's order changes, and can hamper React's reconciliation. If eachoptionobject has a unique identifier (e.g.,option.id), it is a best practice to use that as thekeyprop for more stable and predictable renders.- key={index} + key={option.id}src/pages/Appointments/AppointmentDetail.tsx (1)
461-464: Use a more stable key in mapped status items.
Similar to the recommendation above, prefer a unique identifier if available (e.g.,statusstring) instead of relying onindex. This helps React accurately manage the list without potential misalignment when items are inserted or reordered.- <SelectItem key={index} value={status}> + <SelectItem key={status} value={status}>src/Utils/pubsubContext.tsx (2)
4-4: Consider removing underscore prefix or using a more descriptive name.
Typically, underscores are used to denote private or internal usage. If this context type is intended for broader use, renaming_PubSubContextto something without an underscore can improve clarity.
14-14: Ensure consistency between type and variable names.
Here, the context variable is calledPubSubContextwhile the type is named_PubSubContext. Aligning these names will help maintain a predictable naming convention throughout the codebase.src/components/ui/sidebar.tsx (2)
32-32: Maintain naming consistency.
RenamingSidebarContextto_SidebarContext(or vice versa) helps avoid confusion between type and variable names. Using a descriptive term instead of the underscore can also improve clarity.
112-112: Consider relying on inferred type for memo.
Specifying<_SidebarContext>inReact.useMemo<_SidebarContext>(...)is correct but may be redundant if TypeScript can infer it. Omitting the explicit type parameter might simplify the code.
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
⛔ Files ignored due to path filters (1)
package-lock.jsonis excluded by!**/package-lock.json
📒 Files selected for processing (18)
package.json(2 hunks)src/Locale/update_locale.js(1 hunks)src/Utils/pubsubContext.tsx(2 hunks)src/components/Common/Avatar.tsx(1 hunks)src/components/Common/ExcelFIleDragAndDrop.tsx(4 hunks)src/components/Form/AutoCompleteAsync.tsx(1 hunks)src/components/Form/FormFields/PhoneNumberFormField.tsx(1 hunks)src/components/Form/FormFields/TextAreaFormField.tsx(1 hunks)src/components/Form/FormFields/TextFormField.tsx(1 hunks)src/components/Patient/MedicationStatementList.tsx(1 hunks)src/components/Patient/allergy/AllergyTable.tsx(1 hunks)src/components/Patient/diagnosis/DiagnosisTable.tsx(1 hunks)src/components/Patient/symptoms/SymptomTable.tsx(1 hunks)src/components/Resource/ResourceCreate.tsx(1 hunks)src/components/ui/command.tsx(1 hunks)src/components/ui/sidebar.tsx(3 hunks)src/hooks/useFileManager.tsx(3 hunks)src/pages/Appointments/AppointmentDetail.tsx(1 hunks)
✅ Files skipped from review due to trivial changes (5)
- src/components/Form/FormFields/TextAreaFormField.tsx
- src/components/ui/command.tsx
- src/components/Form/FormFields/PhoneNumberFormField.tsx
- src/components/Form/FormFields/TextFormField.tsx
- src/components/Common/Avatar.tsx
🚧 Files skipped from review as they are similar to previous changes (5)
- src/Locale/update_locale.js
- src/components/Resource/ResourceCreate.tsx
- src/hooks/useFileManager.tsx
- src/components/Common/ExcelFIleDragAndDrop.tsx
- package.json
🔇 Additional comments (1)
src/components/ui/sidebar.tsx (1)
42-42: Verify references to the old type.
Confirm there are no lingering references to the previousSidebarContexttype across the project. Inconsistent references could lead to type-check or runtime issues.✅ Verification successful
No external references found to
SidebarContexttypes
All references toSidebarContextand_SidebarContextare properly contained withinsrc/components/ui/sidebar.tsx. No type inconsistencies detected.🏁 Scripts executed
The following scripts were executed for the analysis:
Script:
#!/bin/bash # Searching for any old references to `SidebarContext` or `_SidebarContext` outside of this file rg -A 3 'SidebarContext' rg -A 3 '_SidebarContext'Length of output: 2124
…J2305/care_fe into eslint_version_upgrade_v9
|
👋 Hi, @AdityaJ2305, This message is automatically generated by prince-chrismc/label-merge-conflicts-action so don't hesitate to report issues/improvements there. |
There was a problem hiding this comment.
Actionable comments posted: 1
🧹 Nitpick comments (4)
eslint.config.mjs (4)
14-22: Consider adding more common ignore patternsConsider adding these common patterns to the ignore list:
coverage/for test coverage reportsnode_modules/for dependencies.next/if using Next.js*.min.jsfor minified filesignores: [ "**/dist", "**/public", "**/lib", "**/build", "**/*.css", "**/*.csv", "**/Dockerfile", + "**/coverage", + "**/node_modules", + "**/.next", + "**/*.min.js", ],
30-30: Update ECMAScript versionConsider updating to the latest ECMAScript version (2024) for access to newer JavaScript features.
- ecmaVersion: 12, + ecmaVersion: 2024,
65-81: Enhance TypeScript type-checking rulesConsider adding these essential TypeScript rules for better type safety:
rules: { ...tseslint.configs.recommended.rules, + "@typescript-eslint/strict-boolean-expressions": "error", + "@typescript-eslint/no-floating-promises": "error", + "@typescript-eslint/await-thenable": "error", + "@typescript-eslint/no-misused-promises": "error", "@typescript-eslint/no-unused-vars": [ "error", { argsIgnorePattern: "^_", varsIgnorePattern: "^_", caughtErrorsIgnorePattern: "^_", }, ],
132-134: Refine i18next callee exclusionsThe current configuration excludes all callees with
".*". Consider explicitly listing allowed callees instead of excluding everything.callees: { - exclude: [".*"], + include: ["t", "i18next.t", "i18n.t"], },
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
⛔ Files ignored due to path filters (1)
package-lock.jsonis excluded by!**/package-lock.json
📒 Files selected for processing (1)
eslint.config.mjs(1 hunks)
🔇 Additional comments (3)
eslint.config.mjs (3)
6-6: Correct the Prettier plugin importThe import statement for the Prettier plugin is incorrect.
94-96: Document reasons for disabled React rulesPlease add comments explaining why these rules are disabled:
react/prop-typesreact/no-children-propreact/no-unescaped-entitiesThis helps future maintainers understand the decisions.
106-112: Verify the import paths configurationEnsure that the
@prefix matches your TypeScript path aliases configuration.✅ Verification successful
Import paths configuration is correctly aligned ✅
The
@prefix in ESLint'sno-relative-import-pathsrule matches your TypeScript path aliases configuration, which uses@/*,@core/*, and@careConfigas aliases.🏁 Scripts executed
The following scripts were executed for the analysis:
Script:
#!/bin/bash # Description: Verify TypeScript path aliases configuration matches ESLint import paths prefix # Check tsconfig.json for path aliases echo "Checking TypeScript path aliases configuration..." if [ -f tsconfig.json ]; then jq '.compilerOptions.paths' tsconfig.json else echo "tsconfig.json not found" fiLength of output: 289
|
Hey Team, ready for review and testing |
There was a problem hiding this comment.
Actionable comments posted: 1
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
⛔ Files ignored due to path filters (1)
package-lock.jsonis excluded by!**/package-lock.json
📒 Files selected for processing (1)
src/components/Patient/PatientDetailsTab/Demography.tsx(1 hunks)
rithviknishad
added
needs review
and removed
question
|
👋 Hi, @AdityaJ2305, This message is automatically generated by prince-chrismc/label-merge-conflicts-action so don't hesitate to report issues/improvements there. |
|
@AdityaJ2305 Your efforts have helped advance digital healthcare and TeleICU systems. 🚀 Thank you for taking the time out to make CARE better. We hope you continue to innovate and contribute; your impact is immense! 🙌 |
Proposed Changes
@ohcnetwork/care-fe-code-reviewers
Merge Checklist
Summary by CodeRabbit
Here are the updated release notes based on the provided summary:
Linting and Configuration
UI and Component Improvements
Type and Interface Updates
Microphone and Permission Handling
Validation and Form Handling
New Features
These changes focus on code quality, performance optimization, and minor functional improvements across the project.