feat: switch to eslint, adjusted types to be more conformant to the c…

…urrent logic, cleanup, added better type support for batched queries

.eslintrc

@@ -0,0 +1,26 @@
+{
+  "root": true,
+  "parser": "@typescript-eslint/parser",
+  "extends": [
+    "eslint:recommended",
+    "plugin:import/recommended",
+    "plugin:@typescript-eslint/recommended",
+    "prettier",
+    "plugin:react-hooks/recommended",
+    "plugin:react-perf/recommended"
+  ],
+  "env": {
+    "node": true,
+    "es6": true
+  },
+  "settings": {
+    "import/parsers": {
+      "@typescript-eslint/parser": [
+        ".ts"
+      ]
+    },
+    "import/resolver": {
+      "typescript": {}
+    }
+  }
+}

package.json

@@ -91,9 +91,9 @@
     "build:cjs": "tsc -p tsconfig.cjs.json",
     "fix": "run-s fix:*",
     "fix:prettier": "prettier \"**/*.{ts,tsx,md}\" --write",
-    "fix:tslint": "tslint --fix --project .",
+    "fix:eslint": "eslint src --fix",
     "test": "run-s build test:*",
-    "test:lint": "tslint --project . && prettier \"src/**/*.{ts,tsx}\" --list-different",
+    "test:lint": "eslint src && prettier \"src/**/*.{ts,tsx}\" --list-different",
     "test:unit": "jest --coverage",
     "cov:send": "codecov",
     "watch": "run-s clean build:main && run-p \"build:main -- -w\" \"test:unit -- --watch\"",
@@ -116,7 +116,8 @@
     "next": ">=11",
     "react": ">=16.8",
     "react-dom": ">=16.8",
-    "zustand": ">=4.4.0"
+    "zustand": ">=4.4.0",
+    "type-fest": ">=4"
   },
   "peerDependenciesMeta": {
     "next": {
@@ -127,6 +128,12 @@
     }
   },
   "devDependencies": {
+    "eslint-plugin-import": "^2.28.1",
+    "eslint-config-prettier": "^9.0.0",
+    "eslint-plugin-react-perf": "^3.3.1",
+    "eslint-plugin-react-hooks": "^4.6.0",
+    "eslint-import-resolver-typescript": "^3.6.0",
+    "type-fest": "^4.3.1",
     "@babel/core": "^7.20.12",
     "@bitjson/npm-scripts-info": "^1.0.0",
     "@storybook/addon-actions": "^6.5.15",
@@ -170,9 +177,10 @@
     "trash-cli": "^5.0.0",
     "ts-jest": "^29.0.5",
     "ts-loader": "^9.4.2",
-    "tslint": "^6.1.3",
-    "tslint-config-prettier": "^1.18.0",
-    "tslint-immutable": "^6.0.1",
+    "eslint": "^8.48.0",
+    "eslint-plugin-react": "^7.33.2",
+    "@typescript-eslint/parser": "^6.5.0",
+    "@typescript-eslint/eslint-plugin": "^6.5.0",
     "typedoc": "^0.23.24",
     "typescript": "^4.9.4",
     "webpack": "^5.75.0",

src/__tests__/defaults.tsx

@@ -1,4 +1,4 @@
-/* tslint:disable:no-expression-statement no-object-mutation */
+/* eslint-disable react-perf/jsx-no-new-function-as-prop */
 import { render, cleanup, screen, act } from '@testing-library/react'
 import userEventImport from '@testing-library/user-event'
 import { createMemoryHistory } from 'history'

src/__tests__/index.tsx

@@ -1,10 +1,12 @@
-/* tslint:disable:no-expression-statement no-object-mutation */
+/* eslint-disable react-perf/jsx-no-new-function-as-prop */
 import { render, cleanup, screen, act } from '@testing-library/react'
 import userEventImport from '@testing-library/user-event'
 import { createMemoryHistory } from 'history'
 import React from 'react'
 import { factoryParameters, pm, serializers, useBatchQuery } from '../index.js'
 import Geschichte from '../lib/adapters/historyjs/index.js'
+import { InferNamespaceValues } from '../lib/store.js'
+
 afterEach(cleanup)
 
 const userEvent = userEventImport.default || userEventImport
@@ -23,7 +25,7 @@ describe('<Geschichte />', () => {
 
     const { useQuery: secondNamespaceUseQuery } = factoryParameters(
       {
-        someParameter: pm('wow', serializers.string),
+        other: pm('wow', serializers.string),
       },
       { someParameter: 'test' },
       'test2'
@@ -35,9 +37,14 @@ describe('<Geschichte />', () => {
         pushState,
         resetPush,
       } = useQuery()
-      const { values: secondValues } = secondNamespaceUseQuery()
-      // tslint:disable-next-line:readonly-keyword
-      const { batchPushState } = useBatchQuery<{ someParameter: string }>()
+      // eslint-disable-next-line @typescript-eslint/no-unused-vars
+      const { values: secondValues } = secondNamespaceUseQuery() // we have to use the other query so it's registered
+
+      type FullStore = {
+        test: InferNamespaceValues<typeof useQuery>
+        test2: InferNamespaceValues<typeof secondNamespaceUseQuery>
+      }
+      const { batchPushState } = useBatchQuery<FullStore>()
       return (
         <>
           <p role="content">{someParameter}</p>
@@ -51,8 +58,12 @@ describe('<Geschichte />', () => {
             title="pushBatch"
             onClick={() =>
               batchPushState(['test', 'test2'], (stateFirst, stateSecond) => {
-                stateFirst.someParameter = 'wasBatch'
-                stateSecond.someParameter = 'anotherOne'
+                if (stateFirst && stateSecond) {
+                  stateFirst.someParameter = 'wasBatch'
+                  if ('other' in stateSecond) {
+                    stateSecond.other = 'anotherOne'
+                  }
+                }
               })
             }
           />

src/__tests__/skip.ts

@@ -1,10 +1,8 @@
-/* tslint:disable:no-expression-statement no-object-mutation */
-
 import { factoryParameters } from '../lib/store.js'
 import { defaultSkipValue, pm } from '../lib/utils.js'
 import { Serializer, serializers } from '../lib/serializers.js'
 
-export const nullableBooleanSerializer: Serializer = {
+export const nullableBooleanSerializer: Serializer<boolean> = {
   deserialize: (value: string | null) => {
     if (value === '1') {
       return true

src/__tests__/static-render.tsx

@@ -1,3 +1,4 @@
+/* eslint-disable react-perf/jsx-no-new-function-as-prop */
 /* tslint:disable:no-expression-statement no-object-mutation */
 
 import { render, cleanup, screen, act } from '@testing-library/react'

src/__tests__/static.ts

@@ -1,9 +1,29 @@
-/* tslint:disable:no-expression-statement no-object-mutation */
-
 import { factoryParameters } from '../lib/store.js'
 import { pm } from '../lib/utils.js'
 import { serializers } from '../lib/serializers.js'
 
+describe('deep partial createQueryString', () => {
+  const initialValues = {
+    some: {
+      parameter: 'hello',
+      otherValue: 'world',
+    },
+  }
+  const { createQueryString } = factoryParameters(
+    {
+      some: {
+        parameter: pm('foo', serializers.string),
+        otherValue: pm('bar', serializers.string),
+      },
+    },
+    initialValues
+  )
+
+  it('should allow deep partial values', () => {
+    expect(createQueryString({ some: { parameter: 'wow' } })).toEqual('foo=wow')
+  })
+})
+
 describe('static parseQueryString', () => {
   const initialValues = { someParameter: 'test' }
   const { parseQueryString } = factoryParameters(

src/examples/defaults.tsx

@@ -10,7 +10,7 @@ const defaultValues = () => ({
   someParameter: 'test',
 })
 
-interface Props<T = {}> {
+interface Props<T = Record<string, unknown>> {
   readonly defaultValues: T
 }
 

src/examples/index.tsx

@@ -1,4 +1,4 @@
-/* tslint:disable:no-expression-statement no-object-mutation */
+/* eslint-disable react-perf/jsx-no-new-function-as-prop */
 import { createBrowserHistory } from 'history'
 import React, { useCallback, useState } from 'react'
 import { factoryParameters, pm, serializers } from '../index.js'

src/index.tsx

@@ -9,13 +9,14 @@ export {
 export { type StoreState } from './lib/middleware.js'
 export {
   type HistoryManagement,
-  useGeschichte,
+  createGeschichte,
   factoryParameters,
   useBatchQuery,
   useStore,
   DEFAULT_NAMESPACE,
   StoreContext,
   type Config,
+  type InferNamespaceValues,
 } from './lib/store.js'
 export {
   pm,

src/lib/__tests__/serializers.ts

@@ -1,4 +1,3 @@
-/* tslint:disable:no-expression-statement */
 import { serializers } from '../serializers.js'
 
 describe('serializers', () => {

src/lib/__tests__/utils.ts

@@ -1,4 +1,3 @@
-/* tslint:disable:no-expression-statement */
 import { Patch } from 'immer'
 import { serializers } from '../serializers.js'
 import { DEFAULT_NAMESPACE } from '../store.js'

src/lib/adapters/historyjs/index.tsx

@@ -1,4 +1,3 @@
-/* tslint:disable:no-expression-statement readonly-array */
 import type { Action, History, Location } from 'history'
 import React, {
   forwardRef,
@@ -7,10 +6,13 @@ import React, {
   useImperativeHandle,
   useMemo,
 } from 'react'
-// tslint:disable-next-line:no-submodule-imports
 import { shallow } from 'zustand/shallow'
 import { StoreState } from '../../middleware.js'
-import { HistoryManagement, StoreContext, useGeschichte } from '../../store.js'
+import {
+  HistoryManagement,
+  StoreContext,
+  createGeschichte,
+} from '../../store.js'
 import { createSearch } from '../../utils.js'
 
 export interface Props {
@@ -43,7 +45,6 @@ const handleHistoryV5 = ({
   }
 }
 
-// tslint:disable-next-line
 let handler: typeof handleHistoryV4 | typeof handleHistoryV5
 
 export const handleHistoryEvent = (action?: Action) => {
@@ -82,18 +83,22 @@ export const GeschichteWithHistory = forwardRef<Refs, Props>(
     }, [history])
 
     const value = useMemo(
-      () => useGeschichte(historyInstance),
+      () => createGeschichte(historyInstance),
       [historyInstance]
     )
     const state = value(
-      ({ unregister, updateFromQuery }: StoreState<any>) => ({
+      ({
+        unregister,
+        updateFromQuery,
+      }: StoreState<Record<string, unknown>>) => ({
         unregister,
         updateFromQuery,
       }),
       shallow
     )
 
     useEffect(() => {
+      // eslint-disable-next-line @typescript-eslint/ban-ts-comment
       // @ts-ignore
       return history.listen((update, maybeAction) => {
         const { location, action } = (
@@ -103,13 +108,15 @@ export const GeschichteWithHistory = forwardRef<Refs, Props>(
         if (
           (action === 'REPLACE' || action === 'PUSH') &&
           location.state &&
+          // eslint-disable-next-line @typescript-eslint/ban-ts-comment
           // @ts-ignore
           location.state.__g__
         ) {
           return
         }
         state.updateFromQuery(location.search)
       })
+      // eslint-disable-next-line react-hooks/exhaustive-deps
     }, [history, state.updateFromQuery])
 
     useImperativeHandle(

src/lib/adapters/nextjs-app-router/index.tsx

@@ -1,9 +1,11 @@
-/* tslint:disable:no-expression-statement no-object-mutation no-submodule-imports */
-
 'use client'
 
 import { useSearchParams, useRouter, usePathname } from 'next/navigation.js'
-import { HistoryManagement, StoreContext, useGeschichte } from '../../store.js'
+import {
+  HistoryManagement,
+  StoreContext,
+  createGeschichte,
+} from '../../store.js'
 import React, { memo, ReactNode, useEffect, useMemo, useRef } from 'react'
 import { StoreState } from '../../middleware.js'
 import { shallow } from 'zustand/shallow'
@@ -21,7 +23,6 @@ const GeschichteForNextAppRouter = ({ children }: Props) => {
   const router = useRef({ push, replace, searchParams, pathname })
 
   const historyInstance: HistoryManagement = useMemo(() => {
-    // tslint:disable-next-line:no-shadowed-variable
     const { searchParams, push, replace, pathname } = router.current
     return {
       initialSearch: () => searchParams,
@@ -35,13 +36,12 @@ const GeschichteForNextAppRouter = ({ children }: Props) => {
   }, [])
 
   const useStore = useMemo(
-    () => useGeschichte(historyInstance),
+    () => createGeschichte(historyInstance),
     [historyInstance]
   )
 
   const state = useStore(
-    // tslint:disable-next-line:no-shadowed-variable
-    ({ unregister, updateFromQuery }: StoreState<object>) => ({
+    ({ unregister, updateFromQuery }: StoreState<Record<string, unknown>>) => ({
       unregister,
       updateFromQuery,
     }),