Merge pull request #1030 from EyeSeeTea/development

Release 2.24.0

Author: Ramon-Jimenez

.env

@@ -1,7 +1,6 @@
 BROWSER=false
 PORT=8081
-SKIP_PREFLIGHT_CHECK=true
-REACT_APP_DHIS2_BASE_URL=https://dev.eyeseetea.com/play
+VITE_DHIS2_BASE_URL=https://dev.eyeseetea.com/play
 
 CYPRESS_DHIS2_AUTH='admin:district'
 CYPRESS_EXTERNAL_API="https://dev.eyeseetea.com/play"

.eslintrc.js

@@ -1,20 +1,25 @@
-/** @format */
+const reactAppConfig = require("eslint-config-react-app");
+
+const reactAppRestrictedGlobals = reactAppConfig.rules["no-restricted-globals"] || [];
+// Override no-restricted-globals to exclude 'name'. Review this rule if causes new issues
+const restrictedGlobals = reactAppRestrictedGlobals.filter(global => global !== "name");
 
 module.exports = {
-    extends: [
-        "react-app",
-        "eslint:recommended",
-        "plugin:react/recommended",
-        "plugin:cypress/recommended",
-        "plugin:@typescript-eslint/recommended",
-    ],
+    extends: ["react-app", "plugin:cypress/recommended"],
     parser: "@typescript-eslint/parser",
+    ignorePatterns: ["src/**/snapshots/*.ts", ".eslintrc.js"],
     rules: {
         "no-console": ["warn", { allow: ["debug", "warn", "error"] }],
         "@typescript-eslint/camelcase": "off",
-        "@typescript-eslint/explicit-function-return-type": ["off"],
+        "@typescript-eslint/explicit-function-return-type": "off",
+        "@typescript-eslint/no-unused-vars": [
+            "warn",
+            {
+                argsIgnorePattern: "^_",
+                varsIgnorePattern: "^_",
+            },
+        ],
         "unused-imports/no-unused-imports": "warn",
-        "@typescript-eslint/no-unused-vars": ["warn", { argsIgnorePattern: "^_", varsIgnorePattern: "^_" }],
         "react/prop-types": "off",
         "react/display-name": "off",
         "react/react-in-jsx-scope": "off",
@@ -35,20 +40,71 @@ module.exports = {
         "@typescript-eslint/indent": "off",
         "@typescript-eslint/member-delimiter-style": "off",
         "@typescript-eslint/type-annotation-spacing": "off",
-        "@typescript-eslint/explicit-function-return-type": "off",
         "no-use-before-define": "off",
         "no-debugger": "warn",
         "no-extra-semi": "off",
         "no-mixed-spaces-and-tabs": "off",
+        "no-useless-rename": "off",
         "react-hooks/rules-of-hooks": "error",
         "react-hooks/exhaustive-deps": "warn",
+        "testing-library/await-async-query": "off",
+        "testing-library/no-await-sync-query": "off",
+        "testing-library/prefer-screen-queries": "off",
+        "testing-library/no-debugging-utils": "off",
+        "testing-library/no-dom-import": "off",
+        "no-restricted-globals": restrictedGlobals,
     },
-    plugins: ["cypress", "@typescript-eslint", "react-hooks", "unused-imports"],
+    plugins: ["cypress", "unused-imports"],
     env: { "cypress/globals": true },
+    parserOptions: {
+        project: "./tsconfig.json",
+    },
     settings: {
         react: {
             pragma: "React",
-            version: "16.6.0",
+            version: "17.0.2",
         },
     },
+    overrides: [
+        {
+            files: ["cypress/**/*"],
+            plugins: ["cypress"],
+            env: { "cypress/globals": true },
+            parser: "espree",
+            parserOptions: {
+                ecmaVersion: 2018,
+                sourceType: "module",
+            },
+            rules: {
+                "@typescript-eslint/no-misused-promises": "off",
+                "@typescript-eslint/no-unused-vars": "off",
+                "@typescript-eslint/no-unused-expressions": "off",
+                "@typescript-eslint/no-use-before-define": "off",
+                "@typescript-eslint/no-explicit-any": "off",
+                "@typescript-eslint/no-empty-interface": "off",
+                "@typescript-eslint/ban-ts-ignore": "off",
+                "@typescript-eslint/no-empty-function": "off",
+                "@typescript-eslint/explicit-module-boundary-types": "off",
+                "@typescript-eslint/ban-types": "off",
+                "@typescript-eslint/ban-ts-comment": "off",
+                "@typescript-eslint/no-var-requires": "off",
+                "@typescript-eslint/indent": "off",
+                "@typescript-eslint/member-delimiter-style": "off",
+                "@typescript-eslint/type-annotation-spacing": "off",
+                "@typescript-eslint/camelcase": "off",
+                "@typescript-eslint/explicit-function-return-type": "off",
+                "@typescript-eslint/no-this-alias": "off",
+                "@typescript-eslint/no-unnecessary-type-constraint": "off",
+            },
+        },
+        {
+            files: ["**/*.test.ts", "**/*.test.tsx", "**/*.spec.ts", "**/*.spec.tsx"],
+            extends: ["plugin:testing-library/react"],
+            rules: {
+                "testing-library/prefer-screen-queries": "off",
+                "testing-library/no-debugging-utils": "off",
+                "testing-library/no-dom-import": "off",
+            },
+        },
+    ],
 };

.gitignore

@@ -47,3 +47,6 @@ cypress/fixtures/
 
 # Configuration
 /**/app-config.json
+
+# Variant-specific assets (copied to public/ during build/dev)
+/public/wmr

.nvmrc

@@ -1 +1 @@
-v16.14.0
+v20.19.4

README.md

@@ -54,13 +54,11 @@ Notes:
 
 -   Requests to DHIS2 will be transparently proxied (see `src/setupProxy.js`) from `http://localhost:8081/dhis2/path` to `http://localhost:8080/path` to avoid CORS and cross-domain problems.
 
--   The optional environment variable `REACT_APP_DHIS2_AUTH=USERNAME:PASSWORD` forces some credentials to be used by the proxy. This variable is usually not set, so the app has the same user logged in at `REACT_APP_DHIS2_BASE_URL`.
-
--   The optional environment variable `REACT_APP_PROXY_LOG_LEVEL` can be helpful to debug the proxyfied requests (accepts: "warn" | "debug" | "info" | "error" | "silent")
+-   The optional environment variable `VITE_DHIS2_AUTH=USERNAME:PASSWORD` forces some credentials to be used by the proxy. This variable is usually not set, so the app has the same user logged in at `VITE_DHIS2_BASE_URL`.
 
 -   Create a file `.env.local` (copy it from `.env`) to customize environment variables so you can simply run `yarn start`.
 
--   [why-did-you-render](https://github.com/welldone-software/why-did-you-render) is installed, but it does not work when using standard react scripts (`yarn start`). Instead, use `yarn craco-start` to debug re-renders with WDYR. Note that hot reloading does not work out-of-the-box with [craco](https://github.com/gsoft-inc/craco).
+-   [why-did-you-render](https://github.com/welldone-software/why-did-you-render) is installed and runs in development mode by default. Edit `src/presentation/utils/wdyr.ts` to customize or disable it.
 
 ### Customization of the development server:
 
@@ -73,7 +71,7 @@ This will open the development server for the given front-end at port 8082 and w
 ### Customize DHIS2 instance url
 
 ```
-REACT_APP_DHIS2_BASE_URL=http://localhost:8080
+VITE_DHIS2_BASE_URL=http://localhost:8080
 ```
 
 To use a different DHIS2 instance url set this environment variable before running a `start` command.
@@ -98,7 +96,7 @@ $ yarn cy:e2e:run # non-interactive
 $ yarn cy:e2e:open # interactive UI
 ```
 
-Application should be running at CYPRESS_ROOT_URL with as the environment variable REACT_APP_CYPRESS set to True.
+Application should be running at CYPRESS_ROOT_URL with as the environment variable VITE_CYPRESS set to True.
 
 For this to work in Travis CI, you will have to create an environment variables (Settings -> Environment Variables) CYPRESS_DHIS2_AUTH with the password used in your testing DHIS2 instance and CYPRESS_ENCRYPTION_KEY used to encrypt passwords of receiver instances.
 
@@ -115,7 +113,7 @@ $ yarn build
 To build a given front-end:
 
 ```
-$ yarn build [all|core-app|data-metadata-app|module-package-app|modules-list|package-exporter|msf-aggregate-data-app|sp-emergency-responses]
+$ yarn build [all|core-app|data-metadata-app|module-package-app|modules-list|package-exporter|msf-aggregate-data-app|sp-emergency-responses|wmr]
 ```
 
 To build the scheduler:
@@ -135,3 +133,11 @@ $ yarn update-po
 # ... add/edit translations in po files ...
 $ yarn localize
 ```
+
+## depcheck
+
+Check for unused or missing dependencies:
+
+```
+$ yarn run depcheck
+```

craco.config.js

@@ -27,7 +27,7 @@ const dhis2Auth = _(dhis2AuthEnvValue)
     .value();
 
 Cypress.Cookies.defaults({
-    whitelist: "JSESSIONID",
+    preserve: "JSESSIONID",
 });
 
 const timeout = ms => {