merges eslint-config

.eslintrc.js

@@ -1,80 +1,4 @@
 module.exports = {
   parser: "babel-eslint",
-  env: {
-    browser: true,
-    es6: true,
-    jest: true,
-  },
-  extends: 'airbnb',
-  parserOptions: {
-    ecmaFeatures: {
-      jsx: true,
-    },
-    ecmaVersion: 2018,
-    sourceType: 'module',
-  },
-  plugins: [
-    'react',
-    'react-hooks',
-  ],
-  rules: {
-    "import/no-unresolved": [
-      2,
-      {
-        ignore: [
-          'payload/config',
-          'payload/unsanitizedConfig',
-        ]
-      }],
-    "react/jsx-filename-extension": [
-      1,
-      {
-        "extensions": [
-          ".js",
-          ".jsx"
-        ]
-      }
-    ],
-    "no-console": 0,
-    "camelcase": 0,
-    "arrow-body-style": 0,
-    "jsx-a11y/anchor-is-valid": [
-      "error",
-      {
-        "aspects": [
-          "invalidHref",
-          "preferButton"
-        ]
-      }
-    ],
-    "jsx-a11y/click-events-have-key-events": 0,
-    "jsx-a11y/label-has-for": [
-      2,
-      {
-        "components": [
-          "Label"
-        ],
-        "required": {
-          "every": [
-            "id"
-          ]
-        },
-        "allowChildren": false
-      }
-    ],
-    "react-hooks/rules-of-hooks": "error",
-    "react-hooks/exhaustive-deps": "warn",
-    "react/no-array-index-key": 0,
-    "max-len": 0,
-    "react/no-danger": 0,
-    "import/prefer-default-export": 0,
-    "no-throw-literal": 0,
-    "react/jsx-max-props-per-line": [
-      1,
-      {
-        "maximum": 1
-      }
-    ],
-    "linebreak-style": ["off"]
-  },
+  extends: "@trbl",
 };

package.json

@@ -8,7 +8,7 @@
     "test:int": "cross-env PAYLOAD_CONFIG_PATH=demo/payload.config.js NODE_ENV=test jest --forceExit --runInBand",
     "cov": "npm run core:build && node ./node_modules/jest/bin/jest.js src/tests --coverage",
     "dev": "cross-env PAYLOAD_CONFIG_PATH=demo/payload.config.js nodemon demo/server.js",
-    "lint": "eslint **/*.js",
+    "lint": "eslint .",
     "debug": "nodemon --inspect demo/server.js",
     "debug:test:int": "node --inspect-brk node_modules/.bin/jest --runInBand"
   },
@@ -25,10 +25,10 @@
     "@babel/preset-react": "^7.8.3",
     "@babel/runtime": "^7.8.4",
     "@date-io/date-fns": "^1.3.13",
-    "@trbl/react-collapsibles": "^0.1.0",
-    "@trbl/react-modal": "^1.0.4",
-    "@trbl/react-scroll-info": "^1.1.1",
-    "@trbl/react-window-info": "^1.2.2",
+    "@faceless-ui/collapsibles": "^0.1.0",
+    "@faceless-ui/modal": "^1.0.4",
+    "@faceless-ui/scroll-info": "^1.1.1",
+    "@faceless-ui/window-info": "^1.2.2",
     "@udecode/slate-plugins": "^0.60.0",
     "async-some": "^1.0.2",
     "babel-loader": "^8.0.6",
@@ -104,14 +104,17 @@
   },
   "devDependencies": {
     "@babel/plugin-proposal-optional-chaining": "^7.8.3",
+    "@trbl/eslint-config": "^1.2.4",
     "autoprefixer": "^9.7.4",
     "babel-core": "^7.0.0-bridge.0",
     "babel-eslint": "^10.0.1",
     "cross-env": "^7.0.2",
     "css-loader": "^1.0.0",
     "eslint": "^6.8.0",
-    "eslint-config-airbnb": "^17.1.0",
+    "eslint-loader": "^4.0.2",
     "eslint-plugin-import": "^2.20.0",
+    "eslint-plugin-jest": "^23.16.0",
+    "eslint-plugin-jest-dom": "^3.0.1",
     "eslint-plugin-jsx-a11y": "^6.2.1",
     "eslint-plugin-react": "^7.18.0",
     "eslint-plugin-react-hooks": "^2.3.0",

src/client/components/data/User.js

@@ -5,7 +5,7 @@ import jwt from 'jsonwebtoken';
 import { useLocation, useHistory } from 'react-router-dom';
 import PropTypes from 'prop-types';
 import config from 'payload/config';
-import { useModal } from '@trbl/react-modal';
+import { useModal } from '@faceless-ui/modal';
 import { requests } from '../../api';
 import StayLoggedInModal from '../modals/StayLoggedIn';
 import useDebounce from '../../hooks/useDebounce';

src/client/components/elements/DeleteDocument/index.js

@@ -2,7 +2,7 @@ import React, { useState, useCallback } from 'react';
 import PropTypes from 'prop-types';
 import config from 'payload/config';
 import { useHistory } from 'react-router-dom';
-import { Modal, useModal } from '@trbl/react-modal';
+import { Modal, useModal } from '@faceless-ui/modal';
 import Button from '../Button';
 import MinimalTemplate from '../../templates/Minimal';
 import useTitle from '../../../hooks/useTitle';

src/client/components/elements/Popup/index.js

@@ -1,7 +1,7 @@
 import React, { useEffect, useRef, useState } from 'react';
 import PropTypes from 'prop-types';
-import { useWindowInfo } from '@trbl/react-window-info';
-import { useScrollInfo } from '@trbl/react-scroll-info';
+import { useWindowInfo } from '@faceless-ui/window-info';
+import { useScrollInfo } from '@faceless-ui/scroll-info';
 
 import useThrottledEffect from '../../../hooks/useThrottledEffect';
 import PopupButton from './PopupButton';
@@ -115,8 +115,7 @@ const Popup = (props) => {
               setActive={setActive}
               active={active}
             />
-          )
-        }
+          )}
       </div>
 
       <div

src/client/components/forms/field-types/Upload/Add/index.js

@@ -1,6 +1,6 @@
 import React, { useState, useEffect, useCallback } from 'react';
 import PropTypes from 'prop-types';
-import { Modal, useModal } from '@trbl/react-modal';
+import { Modal, useModal } from '@faceless-ui/modal';
 import config from '../../../../../config';
 import MinimalTemplate from '../../../../templates/Minimal';
 import Form from '../../../Form';
@@ -67,7 +67,7 @@ const AddUploadModal = (props) => {
             />
           </header>
           <RenderFields
-            filter={field => (!field.position || (field.position && field.position !== 'sidebar'))}
+            filter={(field) => (!field.position || (field.position && field.position !== 'sidebar'))}
             fieldTypes={fieldTypes}
             fieldSchema={fields}
             customComponentsPath={`${collection.slug}.fields.`}

src/client/components/forms/field-types/Upload/SelectExisting/index.js

@@ -1,6 +1,6 @@
 import React, { useState, useEffect } from 'react';
 import PropTypes from 'prop-types';
-import { Modal, useModal } from '@trbl/react-modal';
+import { Modal, useModal } from '@faceless-ui/modal';
 import config from '../../../../../config';
 import MinimalTemplate from '../../../../templates/Minimal';
 import Button from '../../../../elements/Button';

src/client/components/forms/field-types/Upload/index.js

@@ -1,6 +1,6 @@
 import React, { useState, useEffect } from 'react';
 import PropTypes from 'prop-types';
-import { useModal } from '@trbl/react-modal';
+import { useModal } from '@faceless-ui/modal';
 import config from '../../../../config';
 import useFieldType from '../../useFieldType';
 import withCondition from '../../withCondition';
@@ -37,7 +37,7 @@ const Upload = (props) => {
     fieldTypes,
   } = props;
 
-  const collection = collections.find(coll => coll.slug === relationTo);
+  const collection = collections.find((coll) => coll.slug === relationTo);
 
   const path = pathFromProps || name;
   const addModalSlug = `${path}-add`;
@@ -104,7 +104,7 @@ const Upload = (props) => {
         required={required}
       />
       {collection?.upload && (
-        <>
+        <React.Fragment>
           {internalValue && (
             <FileDetails
               {...collection.upload}
@@ -157,7 +157,7 @@ const Upload = (props) => {
             addModalSlug,
           }}
           />
-        </>
+        </React.Fragment>
       )}
     </div>
   );

src/client/components/index.js

@@ -1,9 +1,9 @@
 import React from 'react';
 import { render } from 'react-dom';
 import { BrowserRouter as Router } from 'react-router-dom';
-import { ScrollInfoProvider } from '@trbl/react-scroll-info';
-import { WindowInfoProvider } from '@trbl/react-window-info';
-import { ModalProvider, ModalContainer } from '@trbl/react-modal';
+import { ScrollInfoProvider } from '@faceless-ui/scroll-info';
+import { WindowInfoProvider } from '@faceless-ui/window-info';
+import { ModalProvider, ModalContainer } from '@faceless-ui/modal';
 import { SearchParamsProvider } from './utilities/SearchParams';
 import { LocaleProvider } from './utilities/Locale';
 import StatusList, { StatusListProvider } from './elements/Status';

src/client/components/modals/StayLoggedIn/index.js

@@ -1,7 +1,7 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 import { useHistory } from 'react-router-dom';
-import { useModal, Modal } from '@trbl/react-modal';
+import { useModal, Modal } from '@faceless-ui/modal';
 import config from 'payload/config';
 import MinimalTemplate from '../../templates/Minimal';
 import Button from '../../elements/Button';

src/client/components/utilities/RenderCustomComponent/index.js

@@ -37,6 +37,7 @@ const RenderCustomComponent = (props) => {
 
 RenderCustomComponent.defaultProps = {
   path: undefined,
+  componentProps: {},
 };
 
 RenderCustomComponent.propTypes = {
@@ -47,7 +48,7 @@ RenderCustomComponent.propTypes = {
     PropTypes.node,
     PropTypes.element,
   ]).isRequired,
-  componentProps: PropTypes.shape({}).isRequired,
+  componentProps: PropTypes.shape({}),
 };
 
 export default RenderCustomComponent;

src/webpack/getWebpackDevConfig.js

@@ -34,7 +34,7 @@ module.exports = (config) => {
         {
           test: /\.js$/,
           exclude: /node_modules/,
-          use: {
+          use: [{
             loader: 'babel-loader',
             options: {
               presets: [
@@ -58,6 +58,14 @@ module.exports = (config) => {
               ],
             },
           },
+            // {
+            //   loader: 'eslint-loader',
+            //   options: {
+            //     fix: true,
+            //     emitWarning: true,
+            //   },
+            // }
+          ],
         },
         {
           // "oneOf" will traverse all following loaders until one will