Resolve TypeScript Configuration Conflicts Causing False Errors

[coderabbitai]

Description

We are encountering build-blocking TypeScript errors after updating to the latest versions of React, TypeScript, and Next.js. Temporary @ts-ignore flags have been added to suppress these errors, but this is not a sustainable solution as it masks underlying issues with the TypeScript configuration.

Affected Areas:

• Files where @ts-ignore is used, such as:
  • packages/ui/components/base/tooltip.tsx
  • packages/ui/components/base/dialog.tsx
  • apps/web/components/ui/tooltip.tsx
  • apps/web/components/ui/dialog.tsx
  • Other components interacting with React.ElementRef and React.ComponentPropsWithoutRef.

Possible Causes:

• Inconsistent tsconfig.json settings across packages, especially with compilerOptions.
• Conflicting moduleResolution settings ("node", "bundler", "NodeNext") leading to type conflicts.
• Outdated or mismatched versions of @types/react, typescript, and react.

Action Items

• Audit TypeScript Configurations:

  • Align tsconfig.json files across the project to use consistent compilerOptions.
  • Ensure that moduleResolution is set appropriately for the project's needs.

• Update Dependencies:

  • Verify and update the versions of typescript, react, next, and their corresponding type definitions.
  • Make sure that all packages reference compatible versions.

• Remove @ts-ignore Flags:

  • After resolving configuration issues, remove the @ts-ignore comments to enforce proper type checking.

• Testing:

  • Perform a full build and run the test suite to confirm that the issues have been resolved.

References

• Pull Request: #425
• Commit: c7ac4eb
• Related Comment: Link to your comment

Assignee

@AndlerRL