Big dependency update (#1095)

* update root deps

* backend patch, minor, non-semver

* backend major

* frontend patch

* frontend minor, non-semver

* frontend major/next images/fonts

* fix type errors and some images

* remove unused frontend deps; update mui stuff; debug slow forms

* store non-working frontend build for debugging

* fixed build; common page for all installation instructions; mui codemods

* upgrade apollo server; update snapshots

* static to public

* update TS, override graphql again in frontend

* installation images to webp

* fix themes; add breakpoints etc.

* fix mdx links

* fix small stuff found in code review

* fix production build

* fix mdx pages; small changes here and there

.circleci/config.yml

@@ -43,9 +43,16 @@ jobs:
     steps:
       - checkout
       - setup_remote_docker
+      - restore_cache:
+          key: dependency-cache-{{ checksum "frontend/package-lock.json" }}
       - run:
           name: "Build frontend image"
           command: "bin/build-docker-frontend.sh"
+      - save-cache:
+          key: dependency-cache-{{ checksum "frontend/package-lock.json" }}
+          paths:
+            - ./frontend/node_modules
+            - ./frontend/.next/cache
       - run:
           name: "Push image if on master/staging"
           command: "bin/push-docker-frontend-image.sh"

.eslintrc.js

@@ -6,15 +6,18 @@ const esLintConfig = {
     "@typescript-eslint",
     "eslint-custom-rules",
     "react-hooks",
-    "jsx-a11y",
+    // "jsx-a11y",
+    "styled-components-a11y",
   ],
   parserOptions: {
     ecmaVersion: 2018, // Allows for the parsing of modern ECMAScript features
     sourceType: "module", // Allows for the use of imports
     ecmaFeatures: {
       jsx: true, // Allows for the parsing of JSX
     },
-    project: "./tsconfig.json",
+    parser: "@typescript-eslint/parser",
+    project: ["./tsconfig.json"],
+    tsconfigRootDir: __dirname,
   },
   ignorePatterns: ["node_modules/", "generated/", "dist/", "sourcemap/"],
   rules: {
@@ -42,6 +45,13 @@ const esLintConfig = {
             message: "Don't use Grid from @mui/material",
           },
         ],
+        patterns: [
+          {
+            group: ["@mui/*/*/*"],
+            message:
+              "Don't use deep @mui imports - prevents module duplication",
+          },
+        ],
       },
     ],
     "eslint-custom-rules/no-emotion-styled-import": "error",
@@ -67,11 +77,12 @@ const esLintConfig = {
     complexity: "warn",
   },
   extends: [
+    // "plugin:jsx-a11y/recommended",
+    "plugin:@next/next/recommended",
+    "plugin:styled-components-a11y/recommended",
     "plugin:@typescript-eslint/recommended",
     // "plugin:@typescript-eslint/recommended-requiring-type-checking", // these are a bit too strict for now
-    "plugin:jsx-a11y/recommended",
     "prettier",
-    "plugin:@next/next/recommended",
     "plugin:@next/next/core-web-vitals",
   ],
   settings: {

.vscode/launch.json

@@ -0,0 +1,32 @@
+{
+  "version": "0.2.0",
+  "configurations": [
+    {
+      "name": "Next.js: debug server-side",
+      "type": "node-terminal",
+      "request": "launch",
+      "command": "npx next dev",
+      "cwd": "frontend"
+    },
+    {
+      "name": "Next.js: debug client-side",
+      "type": "chrome",
+      "request": "launch",
+      "url": "http://localhost:3000",
+      "cwd": "frontend"
+    },
+    {
+      "name": "Next.js: debug full stack",
+      "type": "node-terminal",
+      "request": "launch",
+      "command": "NODE_OPTIONS='inspect' npx next dev",
+      "cwd": "frontend",
+      "console": "integratedTerminal",
+      "serverReadyAction": {
+        "pattern": "started server on .+, url: (https?://.+)",
+        "uriFormat": "%s",
+        "action": "debugWithChrome"
+      }
+    }
+  ]
+}

backend/.gitignore

@@ -9,4 +9,5 @@ env.json
 coverage/
 sourcemap/
 config/*.pem
+.idea
 .env.*