meta: add Prettier (#4707)

JS files are ignored for now because we want to migrate them to TS
anyway.
MD files are also ignored to minimize the diff.

ESLint is run twice twice on TS files in case it conflicts with Prettier.

.eslintrc.js

@@ -8,7 +8,7 @@ const svgPresentationAttributes = [
 
 module.exports = {
   root: true,
-  extends: ['transloadit'],
+  extends: ['transloadit', 'prettier'],
   env: {
     es6: true,
     jest: true,
@@ -63,7 +63,6 @@ module.exports = {
     // rules we want to enforce
     'array-callback-return': 'error',
     'func-names': 'error',
-    'implicit-arrow-linebreak': 'error',
     'import/no-dynamic-require': 'error',
     'import/no-extraneous-dependencies': 'error',
     'max-len': 'error',
@@ -142,6 +141,7 @@ module.exports = {
     {
       files: [
         '*.jsx',
+        '*.tsx',
         'packages/@uppy/react-native/**/*.js',
       ],
       parser: 'espree',
@@ -358,6 +358,7 @@ module.exports = {
         'test/**/*.ts',
         '*.test.js',
         '*.test-d.ts',
+        '*.test-d.tsx',
         'postcss.config.js',
         '.eslintrc.js',
         'private/**/*.js',
@@ -474,11 +475,23 @@ module.exports = {
       },
     },
     {
-      files: ['**/react/*.md/*.js', '**/react.md/*.js', '**/react-*.md/*.js'],
+      files: ['**/react/*.md/*.js', '**/react.md/*.js', '**/react-*.md/*.js', '**/react/**/*.test-d.tsx'],
       settings: {
         react: { pragma: 'React' },
       },
     },
+    {
+      files: ['**/react/**/*.test-d.tsx'],
+      rules: {
+        'import/extensions': 'off',
+        'import/no-useless-path-segments': 'off',
+        'no-alert': 'off',
+        'no-inner-declarations': 'off',
+        'no-lone-blocks': 'off',
+        'no-unused-expressions': 'off',
+        'no-unused-vars': 'off',
+      },
+    },
     {
       files: ['e2e/**/*.ts'],
       extends: ['plugin:cypress/recommended'],

.prettierignore

@@ -0,0 +1,7 @@
+node_modules/
+*.js
+*.jsx
+*.cjs
+*.mjs
+*.md
+*.lock

.prettierrc.js

@@ -0,0 +1,14 @@
+module.exports = {
+  proseWrap: 'always',
+  singleQuote: true,
+  trailingComma: 'all',
+  semi: false,
+  overrides: [
+    {
+      files: 'packages/@uppy/angular/**',
+      options: {
+        semi: true,
+      },
+    },
+  ],
+}

e2e/clients/index.html

@@ -18,6 +18,6 @@
         <li><a href="dashboard-ui/index.html">dashboard-ui</a></li>
         <li><a href="dashboard-vue/index.html">dashboard-vue</a></li>
       </ul>
-    <nav>
+    </nav>
   </body>
 </html>

examples/transloadit/index.html

@@ -56,7 +56,7 @@
             <strong id="uppy-form-selected-files"></strong>
             <button type="button" id="uppy-select-files">Select Files</button>
           </label>
-          <div class="progress"></div>
+          <span class="progress"></span>
         </p>
         <p>
           <button type="submit">

package.json

@@ -5,7 +5,12 @@
   "description": "Extensible JavaScript file upload widget with support for drag&drop, resumable uploads, previews, restrictions, file processing/encoding, remote providers like Instagram, Dropbox, Google Drive, S3 and more :dog:",
   "lint-staged": {
     "*.{js,mjs,cjs,jsx}": "eslint --fix",
-    "*.{ts,mts,cts,tsx}": "eslint --fix",
+    "*.{ts,mts,cts,tsx}": [
+      "eslint --fix",
+      "prettier -w",
+      "eslint"
+    ],
+    "*.{css,html,json,scss,vue,yaml,yml}": "prettier -w",
     "*.md": [
       "remark --silently-ignore -i .remarkignore -foq",
       "eslint --fix"
@@ -62,6 +67,7 @@
     "esbuild": "^0.17.1",
     "esbuild-plugin-babel": "^0.2.3",
     "eslint": "^8.0.0",
+    "eslint-config-prettier": "^9.0.0",
     "eslint-config-transloadit": "^2.0.0",
     "eslint-plugin-compat": "^4.0.0",
     "eslint-plugin-cypress": "^2.12.1",
@@ -91,6 +97,7 @@
     "postcss-dir-pseudo-class": "^6.0.0",
     "postcss-logical": "^5.0.0",
     "pre-commit": "^1.2.2",
+    "prettier": "^3.0.3",
     "remark-cli": "^11.0.0",
     "resolve": "^1.17.0",
     "sass": "^1.29.0",

yarn.lock

@@ -9045,6 +9045,7 @@ __metadata:
     esbuild: ^0.17.1
     esbuild-plugin-babel: ^0.2.3
     eslint: ^8.0.0
+    eslint-config-prettier: ^9.0.0
     eslint-config-transloadit: ^2.0.0
     eslint-plugin-compat: ^4.0.0
     eslint-plugin-cypress: ^2.12.1
@@ -9074,6 +9075,7 @@ __metadata:
     postcss-dir-pseudo-class: ^6.0.0
     postcss-logical: ^5.0.0
     pre-commit: ^1.2.2
+    prettier: ^3.0.3
     remark-cli: ^11.0.0
     resolve: ^1.17.0
     sass: ^1.29.0
@@ -15778,6 +15780,17 @@ __metadata:
   languageName: node
   linkType: hard
 
+"eslint-config-prettier@npm:^9.0.0":
+  version: 9.0.0
+  resolution: "eslint-config-prettier@npm:9.0.0"
+  peerDependencies:
+    eslint: ">=7.0.0"
+  bin:
+    eslint-config-prettier: bin/cli.js
+  checksum: 362e991b6cb343f79362bada2d97c202e5303e6865888918a7445c555fb75e4c078b01278e90be98aa98ae22f8597d8e93d48314bec6824f540f7efcab3ce451
+  languageName: node
+  linkType: hard
+
 "eslint-config-transloadit@npm:^2.0.0":
   version: 2.0.0
   resolution: "eslint-config-transloadit@npm:2.0.0"
@@ -26290,6 +26303,15 @@ __metadata:
   languageName: node
   linkType: hard
 
+"prettier@npm:^3.0.3":
+  version: 3.0.3
+  resolution: "prettier@npm:3.0.3"
+  bin:
+    prettier: bin/prettier.cjs
+  checksum: e10b9af02b281f6c617362ebd2571b1d7fc9fb8a3bd17e371754428cda992e5e8d8b7a046e8f7d3e2da1dcd21aa001e2e3c797402ebb6111b5cd19609dd228e0
+  languageName: node
+  linkType: hard
+
 "pretty-bytes@npm:^5.3.0, pretty-bytes@npm:^5.6.0":
   version: 5.6.0
   resolution: "pretty-bytes@npm:5.6.0"