improve eslint config and fix some lint errors

.eslintrc.js

@@ -1,14 +1,57 @@
 module.exports = {
+  root: true,
+
+  env: {
+    browser: true,
+    commonjs: true,
+    es6: true,
+    jest: true,
+    node: true,
+  },
+
+  settings: {
+    react: {
+      version: "detect",
+    },
+  },
+
+  parser: "@typescript-eslint/parser",
+  parserOptions: {
+    ecmaFeatures: {
+      jsx: true,
+    },
+    ecmaVersion: "latest",
+    sourceType: "module",
+    warnOnUnsupportedTypeScriptVersion: true,
+  },
+
+  plugins: ["@typescript-eslint", "import", "react", "react-hooks"],
+
   extends: [
-    "react-app",
-    "prettier",
+    "eslint:recommended",
+    "plugin:@typescript-eslint/eslint-recommended", // disables eslint:recommended rules that conflict with typescript
+    "plugin:@typescript-eslint/recommended",
+    "prettier", // disables rules that conflict with prettier
     "plugin:import/errors",
     "plugin:import/warnings",
     "plugin:import/typescript",
   ],
+
   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-empty-function": "off",
+    "@typescript-eslint/no-non-null-assertion": "off",
+    "@typescript-eslint/no-empty-interface": "off",
+    "@typescript-eslint/no-this-alias": "off",
+    "@typescript-eslint/no-explicit-any": "off", // perhaps we should re-enable this in the future
+    "@typescript-eslint/no-unused-vars": [
+      "warn",
+      {
+        args: "none",
+        ignoreRestSiblings: true,
+      },
+    ],
   },
 }

apps/site/docs/integrations/reduxCompatibility.mdx

@@ -41,4 +41,4 @@ This function also accepts an optional options object with the following propert
 
 - `logArgsNearName` - if it should show the arguments near the action name (default is `true`).
 
-If you want to see it in action feel free to check the [Todo List Example](./examples/todoList/todoList.mdx), open the Redux DevTools and perform some actions.
+If you want to see it in action feel free to check the [Todo List Example](../examples/todoList/todoList.mdx), open the Redux DevTools and perform some actions.

package.json

@@ -28,10 +28,15 @@
     "yjs": "^13.6.14"
   },
   "devDependencies": {
+    "@typescript-eslint/eslint-plugin": "^7.2.0",
+    "@typescript-eslint/parser": "^7.2.0",
     "codecov": "^3.8.3",
     "eslint": "^8.57.0",
     "eslint-config-prettier": "^9.1.0",
-    "eslint-config-react-app": "^7.0.1",
+    "eslint-plugin-import": "^2.29.1",
+    "eslint-plugin-prettier": "^5.1.3",
+    "eslint-plugin-react": "^7.34.1",
+    "eslint-plugin-react-hooks": "^4.6.0",
     "netlify-cli": "^17.19.3",
     "prettier": "^3.2.5",
     "prettier-plugin-organize-imports": "^3.2.4",

packages/lib/src/action/applyAction.ts

@@ -1,3 +1,4 @@
+import { AnyFunction } from "../utils/AnyFunction"
 import { getDataModelAction } from "../dataModel/actions"
 import { detach } from "../parent/detach"
 import { resolvePathCheckingIds } from "../parent/path"
@@ -86,7 +87,7 @@ export function applyAction<TRet = any>(subtreeRoot: object, call: ActionCall):
   assertTweakedObject(current, `resolved ${current}`, true)
 
   if (isBuiltInAction(call.actionName)) {
-    const fnToCall: (...args: any[]) => any = builtInActionToFunction[call.actionName]
+    const fnToCall: AnyFunction = builtInActionToFunction[call.actionName]
     if (!fnToCall) {
       throw failure(`assertion failed: unknown built-in action - ${call.actionName}`)
     }
@@ -101,7 +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)
-    return instance[dataModelAction.fnName].apply(instance, call.args)
+    return instance[dataModelAction.fnName](...call.args)
   }
 
   const standaloneAction = getStandaloneAction(call.actionName)

packages/lib/src/action/applyMethodCall.ts

@@ -1,11 +1,10 @@
+import { AnyFunction } from "../utils/AnyFunction"
 import { assertTweakedObject } from "../tweaker/core"
 import { lazy } from "../utils"
 import { BuiltInAction } from "./builtInActions"
 import { ActionContextActionType } from "./context"
 import { wrapInAction } from "./wrapInAction"
 
-type AnyFunction = (...args: any[]) => any
-
 /**
  * Calls an object method wrapped in an action.
  *

packages/lib/src/action/context.ts

@@ -1,5 +1,3 @@
-import type { AnyModel } from "../model/BaseModel"
-
 /**
  * Low level action context.
  */
@@ -15,7 +13,7 @@ export interface ActionContext {
   /**
    * Action target object.
    */
-  readonly target: AnyModel
+  readonly target: object
   /**
    * Array of action arguments.
    */

packages/lib/src/action/isModelAction.ts

@@ -1,3 +1,5 @@
+import { AnyFunction } from "../utils/AnyFunction"
+
 /**
  * @internal
  */
@@ -9,6 +11,6 @@ export const modelActionSymbol = Symbol("modelAction")
  * @param fn Function to check.
  * @returns
  */
-export function isModelAction(fn: (...args: any[]) => any): boolean {
+export function isModelAction(fn: AnyFunction): boolean {
   return typeof fn === "function" && modelActionSymbol in fn
 }

packages/lib/src/action/middleware.ts

@@ -87,7 +87,7 @@ export function getActionMiddlewares(obj: object): ActionMiddlewaresIterator {
               return { value: undefined, done: true }
             }
 
-            let result = iter.next()
+            const result = iter.next()
             if (!result.done) {
               return result
             }
@@ -117,7 +117,8 @@ export function getActionMiddlewares(obj: object): ActionMiddlewaresIterator {
 export function addActionMiddleware(mware: ActionMiddleware): ActionMiddlewareDisposer {
   assertIsObject(mware, "middleware")
 
-  let { middleware, filter, subtreeRoot } = mware
+  const { middleware, subtreeRoot } = mware
+  let { filter } = mware
 
   assertTweakedObject(subtreeRoot, "middleware.subtreeRoot")
   assertIsFunction(middleware, "middleware.middleware")

packages/lib/src/action/wrapInAction.ts

@@ -12,15 +12,17 @@ import { isModelAction, modelActionSymbol } from "./isModelAction"
 import { getActionMiddlewares } from "./middleware"
 import type { FlowFinisher } from "./modelFlow"
 import { tryRunPendingActions } from "./pendingActions"
+import { AnyFunction } from "../utils/AnyFunction"
 
 /**
  * @internal
  */
-export type WrapInActionOverrideContextFn = (ctx: O.Writable<ActionContext>, self: any) => void
+export type WrapInActionOverrideContextFn = (ctx: O.Writable<ActionContext>, self: AnyModel) => void
 
 /**
  * @internal
  */
+// eslint-disable-next-line @typescript-eslint/ban-types
 export function wrapInAction<T extends Function>({
   nameOrNameFn,
   fn,
@@ -36,7 +38,7 @@ export function wrapInAction<T extends Function>({
 }): T {
   let fnInAction = false
 
-  const wrappedAction = function (this: any) {
+  const wrappedAction = function (this: AnyModel, ...args: unknown[]) {
     const name = typeof nameOrNameFn === "function" ? nameOrNameFn() : nameOrNameFn
 
     if (!fnInAction) {
@@ -56,10 +58,10 @@ export function wrapInAction<T extends Function>({
       actionName: name,
       type: actionType,
       target,
-      args: Array.from(arguments),
+      args,
       parentContext,
       data: {},
-      rootContext: undefined as any, // will be set after the override
+      rootContext: undefined as never, // will be set after the override
     }
     if (overrideContext) {
       overrideContext(context, this)
@@ -76,7 +78,7 @@ export function wrapInAction<T extends Function>({
 
     setCurrentActionContext(context)
 
-    let mwareFn: () => any = fn.bind(target, ...arguments)
+    let mwareFn: () => unknown = fn.bind(target, ...args)
     const mwareIter = getActionMiddlewares(context.target)[Symbol.iterator]()
     let mwareCur = mwareIter.next()
     while (!mwareCur.done) {
@@ -111,9 +113,9 @@ export function wrapInAction<T extends Function>({
       tryRunPendingActions()
     }
   }
-  ;(wrappedAction as any)[modelActionSymbol] = true
+  ;(wrappedAction as unknown as { [modelActionSymbol]: true })[modelActionSymbol] = true
 
-  return wrappedAction as any
+  return wrappedAction as unknown as T
 }
 
 /**
@@ -124,7 +126,7 @@ export function wrapModelMethodInActionIfNeeded<M extends AnyModel | AnyDataMode
   propertyKey: keyof M,
   name: string
 ): void {
-  const fn = model[propertyKey] as any
+  const fn = model[propertyKey] as AnyFunction
   if (isModelAction(fn)) {
     return
   }
@@ -139,6 +141,6 @@ export function wrapModelMethodInActionIfNeeded<M extends AnyModel | AnyDataMode
   if (protoFn === fn) {
     proto[propertyKey] = wrappedFn
   } else {
-    model[propertyKey] = wrappedFn
+    model[propertyKey] = wrappedFn as M[typeof propertyKey]
   }
 }

packages/lib/src/actionMiddlewares/actionTrackingMiddleware.ts

@@ -159,7 +159,7 @@ export function actionTrackingMiddleware(
   }
 
   function setCtxData(ctx: ActionContext | SimpleActionContext, partialData: Partial<Data>) {
-    let currentData = ctx.data[dataSymbol]
+    const currentData = ctx.data[dataSymbol]
     if (!currentData) {
       ctx.data[dataSymbol] = partialData
     } else {
@@ -190,7 +190,7 @@ export function actionTrackingMiddleware(
       return accepted
     } else {
       switch (ctx.asyncStepType) {
-        case ActionContextAsyncStepType.Spawn:
+        case ActionContextAsyncStepType.Spawn: {
           const accepted = userFilter(ctx)
           if (accepted) {
             setCtxData(ctx, {
@@ -199,12 +199,14 @@ export function actionTrackingMiddleware(
             })
           }
           return accepted
+        }
 
         case ActionContextAsyncStepType.Return:
-        case ActionContextAsyncStepType.Throw:
+        case ActionContextAsyncStepType.Throw: {
           // depends if the spawn one was accepted or not
           const data = getCtxData(ctx.spawnAsyncStepContext!)
           return data ? data.startAccepted : false
+        }
 
         case ActionContextAsyncStepType.Resume:
         case ActionContextAsyncStepType.ResumeError:

packages/lib/src/actionMiddlewares/undoMiddleware.ts

@@ -664,6 +664,7 @@ export function undoMiddleware<S>(
 ): UndoManager {
   assertTweakedObject(subtreeRoot, "subtreeRoot")
 
+  // eslint-disable-next-line prefer-const
   let manager: UndoManager
 
   interface PatchRecorderData {

packages/lib/src/dataModel/BaseDataModel.ts

@@ -67,6 +67,7 @@ export abstract class BaseDataModel<TProps extends ModelProps> {
       throw failure("data models can only work over data objects")
     }
 
+    // eslint-disable-next-line prefer-rest-params
     const { modelClass: _modelClass }: DataModelConstructorOptions = arguments[1] as any
     const modelClass = _modelClass!
 

packages/lib/src/model/BaseModel.ts

@@ -32,7 +32,7 @@ export const modelIdPropertyNameSymbol = Symbol("modelIdPropertyName")
  * @ignore
  */
 export type ModelIdPropertyType<TProps extends ModelProps, ModelIdPropertyName extends string> = [
-  ModelIdPropertyName
+  ModelIdPropertyName,
 ] extends [never]
   ? never
   : ModelPropsToUntransformedData<Pick<TProps, ModelIdPropertyName>>[ModelIdPropertyName]
@@ -50,7 +50,7 @@ export abstract class BaseModel<
   TProps extends ModelProps,
   FromSnapshotOverride extends Record<string, any>,
   ToSnapshotOverride extends Record<string, any>,
-  ModelIdPropertyName extends string = never
+  ModelIdPropertyName extends string = never,
 > {
   // just to make typing work properly
   [propsTypeSymbol]!: TProps;
@@ -128,8 +128,9 @@ export abstract class BaseModel<
    * Creates an instance of a model.
    */
   constructor(data: ModelPropsToTransformedCreationData<TProps>) {
-    let initialData = data as any
+    const initialData = data as any
     const { snapshotInitialData, modelClass, generateNewIds }: ModelConstructorOptions =
+      // eslint-disable-next-line prefer-rest-params
       arguments[1] as any
 
     Object.setPrototypeOf(this, modelClass!.prototype)
@@ -204,6 +205,7 @@ export interface AnyModel extends BaseModel<any, any, any, any> {}
  * @param type Abstract model class.
  * @returns
  */
+// eslint-disable-next-line @typescript-eslint/ban-types
 export function abstractModelClass<T>(type: T): T & Object {
   return type as any
 }

packages/lib/src/modelShared/modelDecorator.ts

@@ -1,3 +1,4 @@
+import { AnyFunction } from "../utils/AnyFunction"
 import { HookAction } from "../action/hookActions"
 import { wrapModelMethodInActionIfNeeded } from "../action/wrapInAction"
 import type { AnyDataModel } from "../dataModel/BaseDataModel"
@@ -179,6 +180,7 @@ const internalModel = <MC extends ModelClass<AnyModel | AnyDataModel>>(
 }
 
 // basically taken from TS
+/* eslint-disable */
 function tsDecorate(decorators: any, target: any, key: any, desc: any) {
   var c = arguments.length,
     r =
@@ -192,6 +194,7 @@ function tsDecorate(decorators: any, target: any, key: any, desc: any) {
   // eslint-disable-next-line no-sequences
   return c > 3 && r && Object.defineProperty(target, key, r), r
 }
+/* eslint-enable */
 
 /**
  * Marks a class (which MUST inherit from the `Model` abstract class)
@@ -207,7 +210,7 @@ export function decoratedModel<M, MC extends abstract new (...ags: any) => M>(
   name: string | undefined,
   clazz: MC,
   decorators: {
-    [k in keyof M]?: ((...args: any[]) => any) | ReadonlyArray<(...args: any[]) => any>
+    [k in keyof M]?: AnyFunction | ReadonlyArray<AnyFunction>
   }
 ): MC {
   // decorate class members

packages/lib/src/parent/onChildAttachedTo.ts

@@ -56,7 +56,7 @@ export function onChildAttachedTo(
 
   const getChildrenObjectOpts = { deep: opts.deep }
   const getCurrentChildren = () => {
-    let t = target()
+    const t = target()
     assertTweakedObject(t, "target()")
 
     const children = getChildrenObjects(t, getChildrenObjectOpts)