Merge pull request #56 from nsidc/new-region-json

Teach webapp to understand the new recursive hierarchy of regions

.eslintrc.js

@@ -1,26 +1,45 @@
 module.exports = {
+  "root": true,
+
   "parser": "@typescript-eslint/parser",
   // The below config enables type-aware linting, but significantly slows down
   // eslint.
   //     https://github.com/typescript-eslint/typescript-eslint/blob/master/docs/getting-started/linting/README.md#configuration
   "parserOptions": {
     "tsconfigRootDir": __dirname,
+    // Do type-aware linting. This is expensive:
+    // https://typescript-eslint.io/linting/typed-linting/#how-is-performance
     "project": ["./tsconfig.json"],
   },
+
   "plugins": [
     "@typescript-eslint",
+    "react",
+    "import",
+    "flowtype",
+    "jsx-a11y",
     "react-hooks",
+    "jest",
+    "testing-library",
   ],
+
   "extends": [
-    "react-app",
-    "react-app/jest",
     "plugin:@typescript-eslint/recommended",
     "plugin:@typescript-eslint/recommended-requiring-type-checking",
   ],
+
+  "settings": {
+    "react": {
+      "version": "detect",
+    },
+  },
+
   "rules": {
     "eqeqeq": [
       "error",
     ],
+
+    // react
     "react/function-component-definition": [
       "error",
       {
@@ -30,6 +49,8 @@ module.exports = {
     ],
     "react-hooks/rules-of-hooks": "error",
     "react-hooks/exhaustive-deps": "warn",
+
+    // typescript
     "@typescript-eslint/ban-ts-comment": [
       "warn",
       {
@@ -38,6 +59,90 @@ module.exports = {
     ],
     "@typescript-eslint/no-explicit-any": [
       "warn",
-    ]
+    ],
+
+    // migrated from:
+    // https://github.com/facebook/create-react-app/blob/0a827f69ab0d2ee3871ba9b71350031d8a81b7ae/packages/eslint-config-react-app/base.js
+    'react/jsx-uses-vars': 'warn',
+    'react/jsx-uses-react': 'warn',
+
+    // migrated from:
+    // https://github.com/facebook/create-react-app/blob/0a827f69ab0d2ee3871ba9b71350031d8a81b7ae/packages/eslint-config-react-app/index.js
+    /// TypeScript's `noFallthroughCasesInSwitch` option is more robust (#6906)
+    'default-case': 'off',
+    /// 'tsc' already handles this (https://github.com/typescript-eslint/typescript-eslint/issues/291)
+    'no-dupe-class-members': 'off',
+    /// 'tsc' already handles this (https://github.com/typescript-eslint/typescript-eslint/issues/477)
+    'no-undef': 'off',
+
+    /// Add TypeScript specific rules (and turn off ESLint equivalents)
+    '@typescript-eslint/consistent-type-assertions': 'warn',
+    'no-array-constructor': 'off',
+    '@typescript-eslint/no-array-constructor': 'warn',
+    'no-redeclare': 'off',
+    '@typescript-eslint/no-redeclare': 'warn',
+    'no-use-before-define': 'off',
+    '@typescript-eslint/no-use-before-define': [
+      'warn',
+      {
+        functions: false,
+        classes: false,
+        variables: false,
+        typedefs: false,
+      },
+    ],
+    'no-unused-expressions': 'off',
+    '@typescript-eslint/no-unused-expressions': [
+      'error',
+      {
+        allowShortCircuit: true,
+        allowTernary: true,
+        allowTaggedTemplates: true,
+      },
+    ],
+    'no-unused-vars': 'off',
+    '@typescript-eslint/no-unused-vars': [
+      'warn',
+      {
+        args: 'none',
+        ignoreRestSiblings: true,
+      },
+    ],
+    'no-useless-constructor': 'off',
+    '@typescript-eslint/no-useless-constructor': 'warn',
+
+    // migrated from:
+    // https://github.com/facebook/create-react-app/blob/0a827f69ab0d2ee3871ba9b71350031d8a81b7ae/packages/eslint-config-react-app/jest.js
+    /// https://github.com/jest-community/eslint-plugin-jest
+    'jest/no-conditional-expect': 'error',
+    'jest/no-identical-title': 'error',
+    'jest/no-interpolation-in-snapshots': 'error',
+    'jest/no-jasmine-globals': 'error',
+    'jest/no-mocks-import': 'error',
+    'jest/valid-describe-callback': 'error',
+    'jest/valid-expect': 'error',
+    'jest/valid-expect-in-promise': 'error',
+    'jest/valid-title': 'warn',
+
+    /// https://github.com/testing-library/eslint-plugin-testing-library
+    'testing-library/await-async-queries': 'error',
+    'testing-library/await-async-utils': 'error',
+    'testing-library/no-await-sync-queries': 'error',
+    'testing-library/no-container': 'error',
+    'testing-library/no-debugging-utils': 'error',
+    'testing-library/no-dom-import': ['error', 'react'],
+    'testing-library/no-node-access': 'error',
+    'testing-library/no-promise-in-fire-event': 'error',
+    'testing-library/no-render-in-lifecycle': 'error',
+    'testing-library/no-unnecessary-act': 'error',
+    'testing-library/no-wait-for-multiple-assertions': 'error',
+    'testing-library/no-wait-for-side-effects': 'error',
+    'testing-library/no-wait-for-snapshot': 'error',
+    'testing-library/prefer-find-by': 'error',
+    'testing-library/prefer-presence-queries': 'error',
+    'testing-library/prefer-query-by-disappearance': 'error',
+    'testing-library/prefer-screen-queries': 'error',
+    'testing-library/render-result-naming-convention': 'error',
+    // end migrated config
   },
 }

.gitignore

@@ -6,3 +6,6 @@ node_modules/
 
 # Webpack ephemera
 /dist
+
+# ESLint ephemera
+.eslintcache

babel.config.js

@@ -0,0 +1,7 @@
+module.exports = {
+  presets: [
+    "@babel/preset-env",
+    ["@babel/preset-react", {runtime: 'automatic'}],
+    "@babel/preset-typescript",
+  ],
+};

doc/TODO.md

@@ -8,6 +8,12 @@
 * selectedRegionObject -> selectedRegion
 
 
+### Recoil atoms/selectors
+
+Selectors are not atoms. We should use the suffix `State` per the docs.
+
+
+
 ## Data / server-side considerations
 
 * Consider moving `variablesIndex` into Recoil state graph instead of ReactQuery, then
@@ -30,9 +36,29 @@ The codebase could be much simpler if we eliminated ReactQuery -- we're not usin
 its mutation features anyway.
 
 
+### Webpack dev server
+
+[v4.12.x-v4.15.x](https://github.com/webpack/webpack-dev-server/blob/master/CHANGELOG.md)
+added overlays for runtime errors and unhandled promise rejection. These seem to be
+triggered by errors that we are handling with error boundaries. Disabled runtime error
+overlays to work around. We need to add handling for the runtime errors, or figure out
+why webpack-dev-server isn't understanding our error boundaries.
+
+
 ## Versioning
 
 * How to keep track of compatibility between the server (data schemas) and this app
   (query types)? Can we write a utility that analyzes jsonschema files with typescript
   type definitions for compatibility? Maybe we could use `typescript-json-schema` to
   convert the Typescript interfaces to JSON schemas and diff?
+
+
+## Checks
+
+* Disallow subscript notation (`foo["bar"]`) in favor of dot notation (`foo.bar`) to get
+  stronger interface safety. (<https://eslint.org/docs/latest/rules/dot-notation>)
+
+
+## Package size
+
+* Use only one icon set, instead of 3 (Bootstrap, FontAwesome, Material)

jest/transforms/babelTransform.js

@@ -2,28 +2,6 @@
 
 const babelJest = require('babel-jest').default;
 
-const hasJsxRuntime = (() => {
-  if (process.env.DISABLE_NEW_JSX_TRANSFORM === 'true') {
-    return false;
-  }
-
-  try {
-    require.resolve('react/jsx-runtime');
-    return true;
-  } catch (e) {
-    return false;
-  }
-})();
-
 module.exports = babelJest.createTransformer({
-  presets: [
-    [
-      require.resolve('babel-preset-react-app'),
-      {
-        runtime: hasJsxRuntime ? 'automatic' : 'classic',
-      },
-    ],
-  ],
-  babelrc: false,
-  configFile: false,
+  rootMode: 'upward',
 });