using eslint flat config and some new rules

.vscode/settings.json

@@ -15,5 +15,6 @@
   "search.exclude": {
     "**/.yarn": true,
     "**/.pnp.*": true
-  }
+  },
+  "eslint.experimental.useFlatConfig": true
 }

apps/site/docs/examples/clientServer/server.ts

@@ -43,7 +43,9 @@ class Server {
       if (serializedActionCallToReplicate) {
         setTimeout(() => {
           // and distribute message, which includes new model IDs to keep them in sync
-          this.msgListeners.forEach((listener) => listener(serializedActionCallToReplicate!))
+          this.msgListeners.forEach((listener) => {
+            listener(serializedActionCallToReplicate)
+          })
         }, 500)
       }
     }, 500)

apps/site/docs/examples/todoList/app.tsx

@@ -27,8 +27,12 @@ export const TodoListView = observer(({ list }: { list: TodoList }) => {
       key={todo.id}
       done={todo.done}
       text={todo.text}
-      onClick={() => todo.setDone(!todo.done)}
-      onRemove={() => list.remove(todo)}
+      onClick={() => {
+        todo.setDone(!todo.done)
+      }}
+      onRemove={() => {
+        list.remove(todo)
+      }}
     />
   )
 

apps/site/docs/examples/todoList/store.ts

@@ -101,7 +101,6 @@ export function createRootStore(): TodoList {
   registerRootStore(rootStore)
 
   // we can also connect the store to the redux dev tools
-  // eslint-disable-next-line @typescript-eslint/no-var-requires
   const remotedev = require("remotedev")
   const connection = remotedev.connectViaExtension({
     name: "Todo List Example",

apps/site/docs/examples/yjsBinding/appInstance.tsx

@@ -80,7 +80,12 @@ export const AppInstance = observer(() => {
       <br />
 
       <div>{status.connected ? "Online (sync enabled)" : "Offline (sync disabled)"}</div>
-      <button onClick={() => toggleWebrtcProviderConnection()} style={{ width: "fit-content" }}>
+      <button
+        onClick={() => {
+          toggleWebrtcProviderConnection()
+        }}
+        style={{ width: "fit-content" }}
+      >
         {status.connected ? "Disconnect" : "Connect"}
       </button>
     </>

apps/site/package.json

@@ -36,7 +36,7 @@
     "@docusaurus/module-type-aliases": "^3.2.1",
     "@docusaurus/tsconfig": "^3.2.1",
     "@svgr/webpack": "^8.1.0",
-    "@types/react": "^18.2.74",
+    "@types/react": "^18.2.75",
     "@types/react-dom": "^18.2.24",
     "@types/uuid": "^9.0.8",
     "raw-loader": "^4.0.2",

apps/site/tsconfig.json

@@ -3,6 +3,7 @@
   "extends": "@docusaurus/tsconfig",
   "compilerOptions": {
     "baseUrl": ".",
-    "experimentalDecorators": true
+    "experimentalDecorators": true,
+    "strict": true
   }
 }

eslint.config.mjs

@@ -0,0 +1,119 @@
+import { FlatCompat } from "@eslint/eslintrc"
+import eslint from "@eslint/js"
+import eslintConfigPrettier from "eslint-config-prettier"
+import eslintPluginReactConfigsJsxRuntime from "eslint-plugin-react/configs/jsx-runtime.js"
+import eslintPluginReactConfigsRecommended from "eslint-plugin-react/configs/recommended.js"
+import globals from "globals"
+import path from "path"
+import tseslint from "typescript-eslint"
+import { fileURLToPath } from "url"
+
+const __filename = fileURLToPath(import.meta.url)
+const __dirname = path.dirname(__filename)
+
+const compat = new FlatCompat({
+  baseDirectory: __dirname,
+})
+
+export default tseslint.config(
+  {
+    ignores: [
+      "eslint.config.*",
+      "**/node_modules",
+      ".idea",
+      "*.log",
+      "**/.turbo",
+      "**/.DS_Store",
+      ".yarn/*",
+      "!.yarn/patches",
+      "!.yarn/releases",
+      "!.yarn/plugins",
+      "!.yarn/sdks",
+      "!.yarn/versions",
+      ".pnp.*",
+      "packages/lib/dist",
+      "packages/lib/coverage",
+      "packages/lib/api-docs",
+      "packages/mobx-keystone-yjs/dist",
+      "packages/mobx-keystone-yjs/coverage",
+      "apps/benchmark/dist",
+    ],
+  },
+  eslint.configs.recommended,
+  ...tseslint.configs.strictTypeChecked,
+  ...tseslint.configs.stylisticTypeChecked, // TODO: reenable?
+  eslintConfigPrettier,
+  {
+    languageOptions: {
+      parserOptions: {
+        project: true,
+        tsconfigDirName: import.meta.dirname,
+        ecmaFeatures: {
+          jsx: true,
+        },
+        ecmaVersion: "latest",
+        warnOnUnsupportedTypeScriptVersion: true,
+      },
+      globals: {
+        ...globals.browser,
+        ...globals.commonjs,
+        ...globals.es2021,
+        ...globals.jest,
+        ...globals.node,
+      },
+    },
+  },
+  // TODO: not working right now with flat configs
+  //...compat.extends("plugin:import/errors", "plugin:import/warnings", "plugin:import/typescript"),
+  eslintPluginReactConfigsRecommended,
+  eslintPluginReactConfigsJsxRuntime,
+  ...compat.extends("plugin:react-hooks/recommended"),
+  {
+    rules: {
+      // doesn't get along well with .js extensions (needed so node "type": module works)
+      "import/no-unresolved": "off",
+      // "import/no-cycle": ["error", { ignoreExternal: true }],
+      "@typescript-eslint/no-non-null-assertion": "off",
+      "@typescript-eslint/no-this-alias": "off",
+      "@typescript-eslint/no-unused-vars": [
+        "warn",
+        {
+          args: "none",
+          ignoreRestSiblings: true,
+        },
+      ],
+      "@typescript-eslint/no-empty-function": "off",
+      "@typescript-eslint/array-type": "off",
+      "@typescript-eslint/restrict-template-expressions": "off",
+      "@typescript-eslint/no-invalid-void-type": "off",
+      "@typescript-eslint/no-unnecessary-type-arguments": "off",
+      "@typescript-eslint/no-unnecessary-condition": "off", // bothers more than helps
+      "@typescript-eslint/unified-signatures": "off",
+      "@typescript-eslint/prefer-for-of": "off",
+      "@typescript-eslint/no-empty-interface": "off",
+      "@typescript-eslint/consistent-indexed-object-style": "off",
+      // perhaps we should re-enable these in the future
+      "@typescript-eslint/no-explicit-any": "off",
+      "@typescript-eslint/no-unsafe-return": "off",
+      "@typescript-eslint/no-unsafe-argument": "off",
+      "@typescript-eslint/no-unsafe-assignment": "off",
+      "@typescript-eslint/no-unsafe-member-access": "off",
+    },
+  },
+  {
+    files: ["packages/lib/test/**"],
+    rules: {
+      "@typescript-eslint/unbound-method": "off",
+    },
+  },
+  {
+    files: ["apps/site/docs/examples/**"],
+    rules: {
+      "@typescript-eslint/no-var-requires": "off",
+      "@typescript-eslint/no-unsafe-assignment": "off",
+      "@typescript-eslint/no-unsafe-member-access": "off",
+      "@typescript-eslint/no-unsafe-call": "off",
+      "@typescript-eslint/no-unused-vars": "off",
+    },
+  }
+)

package.json

@@ -28,19 +28,21 @@
     "yjs": "^13.6.14"
   },
   "devDependencies": {
-    "@typescript-eslint/eslint-plugin": "^7.5.0",
-    "@typescript-eslint/parser": "^7.5.0",
+    "@eslint/eslintrc": "^3.0.2",
+    "@eslint/js": "^9.0.0",
     "codecov": "^3.8.3",
     "eslint": "^8.57.0",
     "eslint-config-prettier": "^9.1.0",
     "eslint-plugin-import": "^2.29.1",
     "eslint-plugin-react": "^7.34.1",
     "eslint-plugin-react-hooks": "^4.6.0",
-    "netlify-cli": "^17.21.2",
+    "globals": "^15.0.0",
+    "netlify-cli": "^17.22.0",
     "prettier": "^3.2.5",
     "prettier-plugin-organize-imports": "^3.2.4",
     "turbo": "^1.13.2",
-    "typescript": "^5.4.4"
+    "typescript": "^5.4.4",
+    "typescript-eslint": "^7.6.0"
   },
   "packageManager": "yarn@4.1.1"
 }

packages/lib/package.json

@@ -72,10 +72,10 @@
     "@babel/plugin-proposal-decorators": "^7.24.1",
     "@babel/preset-env": "^7.24.4",
     "@babel/preset-typescript": "^7.24.1",
-    "@swc/core": "^1.4.12",
+    "@swc/core": "^1.4.13",
     "@swc/jest": "^0.2.36",
     "@types/jest": "^29.5.12",
-    "@types/node": "^20.12.5",
+    "@types/node": "^20.12.6",
     "babel-jest": "^29.7.0",
     "jest": "^29.7.0",
     "mobx-v4": "npm:mobx@^4.15.7",
@@ -85,7 +85,7 @@
     "spec.ts": "^1.1.3",
     "ts-jest": "^29.1.2",
     "ts-node": "^10.9.2",
-    "typedoc": "^0.25.12",
+    "typedoc": "^0.25.13",
     "typescript": "^5.4.4",
     "vite": "^5.2.8"
   },

packages/lib/src/action/applyAction.ts

@@ -41,7 +41,7 @@ export interface ActionCall {
   /**
    * Marks this action call as non-serialized.
    */
-  readonly serialized?: undefined
+  readonly serialized?: boolean
 }
 
 const builtInActionToFunction = {
@@ -87,7 +87,7 @@ export function applyAction<TRet = any>(subtreeRoot: object, call: ActionCall):
   assertTweakedObject(current, `resolved ${current}`, true)
 
   if (isBuiltInAction(call.actionName)) {
-    const fnToCall: AnyFunction = builtInActionToFunction[call.actionName]
+    const fnToCall = builtInActionToFunction[call.actionName] as AnyFunction | undefined
     if (!fnToCall) {
       throw failure(`assertion failed: unknown built-in action - ${call.actionName}`)
     }
@@ -102,6 +102,7 @@ export function applyAction<TRet = any>(subtreeRoot: object, call: ActionCall):
   const dataModelAction = getDataModelAction(call.actionName)
   if (dataModelAction) {
     const instance: any = new dataModelAction.modelClass(current)
+    // eslint-disable-next-line @typescript-eslint/no-unsafe-call
     return instance[dataModelAction.fnName](...call.args)
   }
 
@@ -110,5 +111,6 @@ export function applyAction<TRet = any>(subtreeRoot: object, call: ActionCall):
     return standaloneAction.apply(current, call.args as any)
   }
 
+  // eslint-disable-next-line @typescript-eslint/no-unsafe-call
   return (current as any)[call.actionName].apply(current, call.args)
 }

packages/lib/src/action/applyDelete.ts

@@ -21,7 +21,7 @@ export function applyDelete<O extends object, K extends keyof O>(node: O, fieldN
  * @internal
  */
 export function internalApplyDelete<O extends object>(this: O, fieldName: string | number): void {
-  remove(this, "" + fieldName)
+  remove(this, String(fieldName))
 }
 
 const wrappedInternalApplyDelete = lazy(() =>

packages/lib/src/action/applyMethodCall.ts

@@ -25,6 +25,7 @@ export function applyMethodCall<O extends object, K extends keyof O, FN extends
  * @internal
  */
 export function internalApplyMethodCall(this: any, methodName: string | number, args: any[]): any {
+  // eslint-disable-next-line @typescript-eslint/no-unsafe-call
   return this[methodName](...args)
 }