Update Eslint and Prettier configs

[surajr10]

What's new in this PR

Removed the Calblueprint Eslint and Prettier packages along with all their peer dependencies and replaced with the Eslint and Prettier configs that are listed in the Expo docs. Also added an Eslint ignore field and removed the organizeImports field in VSCode settings fiel. Then fixed all Eslint and Prettier issues in the project.

Description

This remedy was sought after due to a version mismatch for Typscript, where Expo wanted Typescript version 5 and our Calblueprint eslint config package was using a lower version. Due to the difficulty of keeping up the Calblueprint eslint and prettier packages to match with changes in other packages and version matching with tools such as Expo and NextJS, I felt it best to just use the maintained packages that were recommended on the Expo docs for this PR as they encompassed most, if not all, the rules we were requiring.

The Eslint ignore file was added to speed up running eslint by not running it on unnecessary folders. The organizeImports field on the VSCode settings.json file was removed because it was conflicting with the Eslint import order rules.

How to review

Once devs have rebased or pulled changes from main, run npm install to get all the new packages for the project.

Try to run the following commands:

• npx eslint . (checks to see if eslint is working on your project. may output nothing if your code is clean, so you can manually try switching up some imports or writing something that shouldn't make sense to test it out)
• npx prettier --check . (checks to see if prettier is working on your project. this should output something like "All matched files use Prettier code style" even if your code is clean)

Also just check to make sure that if you're using VSCode, that saving a file with prettier errors like mis-aligned tabs, etc. get fixed upon saving a file.

Next steps

You all on your project may find that certain Eslint and Prettier rules are not ideal (usually these are on the styling end of the spectrum) or you would like to have some other ones that may be missing, so feel free to play around with the .eslintrc.js and .prettier.js or install other eslint packages to help get you to a code ruleset that feels right for you.

Relevant Links

https://docs.expo.dev/guides/using-eslint/
https://www.headway.io/blog/react-native-quick-start-expo-eslint-typescript-and-prettier

Online sources

Related PRs

CC: @stephaniewong2

[ronniebeggs]

This may be a weird instance, but some of the configurations seem to be clashing with each other here. It wants to move line 5 up, citing "./styles import should occur before import of ../../../Components/StyledButton/StyledButton," but doesn't automatically update it as it did previously. When I manually move it to the "correct" spot, eslint moves it back to this position when I save the change.

[surajr10]

Ah nice catch! The weirdness came about because we set the organizeImports field to true in vscode settings.json file which was conflicting with the eslint rule for import organization