Use shared prettier eslint and tsconfig

.eslintrc.json

@@ -1,66 +1,7 @@
 {
-  "parser": "@typescript-eslint/parser",
-  "env": {
-    "browser": true,
-    "node": true
-  },
-  "plugins": ["@typescript-eslint", "react", "react-hooks"],
-  "extends": [
-    "eslint:recommended",
-    "plugin:@typescript-eslint/recommended",
-    "plugin:react/recommended",
-    "plugin:react/jsx-runtime",
-    "plugin:import/recommended",
-    "plugin:import/typescript",
-    "plugin:prettier/recommended"
-  ],
+  "extends": "@aboutbits/eslint-config/ts-react",
   "parserOptions": {
-    "sourceType": "module",
-    "ecmaVersion": 2018
-  },
-  "settings": {
-    "react": {
-      "version": "detect"
-    },
-    "import/resolver": {
-      "node": {
-        "paths": ["./"]
-      }
-    }
+    "project": true
   },
-  "rules": {
-    "react-hooks/rules-of-hooks": "error",
-    "react-hooks/exhaustive-deps": "error",
-    "@typescript-eslint/no-unused-vars": [
-      "error",
-      {
-        "ignoreRestSiblings": true,
-        "varsIgnorePattern": "^[iI]gnored",
-        "argsIgnorePattern": "^_",
-        "caughtErrorsIgnorePattern": "^ignore"
-      }
-    ],
-    "@typescript-eslint/member-delimiter-style": "off",
-    "@typescript-eslint/explicit-function-return-type": "off",
-    "@next/next/no-img-element": "off",
-    "import/order": [
-      "error",
-      {
-        "groups": [
-          "builtin",
-          "external",
-          "unknown",
-          "parent",
-          "sibling",
-          "index"
-        ]
-      }
-    ],
-    "no-console": [
-      "error",
-      {
-        "allow": ["warn", "error", "assert"]
-      }
-    ]
-  }
+  "ignorePatterns": ["node_modules", "dist"]
 }

.gitignore

@@ -12,3 +12,6 @@
 
 # ESLint
 .eslintcache
+
+# TypeScript
+*.tsbuildinfo

package.json

@@ -2,6 +2,7 @@
   "name": "@aboutbits/react-pagination",
   "version": "2.0.1",
   "description": "Pagination hooks for React",
+  "type": "module",
   "exports": {
     ".": {
       "types": "./dist/types/engine/index.d.ts",
@@ -48,7 +49,7 @@
     "build:esm": "tsc -p tsconfig.esm.json",
     "build:cjs": "tsc -p tsconfig.cjs.json",
     "build:types": "tsc -p tsconfig.types.json",
-    "lint": "eslint --ext js,ts,tsx --cache .",
+    "lint": "eslint --cache .",
     "lint:fix": "npm run lint -- --fix",
     "test": "vitest run --passWithNoTests",
     "test:watch": "vitest watch --passWithNoTests",
@@ -85,23 +86,24 @@
     "access": "public"
   },
   "devDependencies": {
+    "@aboutbits/eslint-config": "^2.0.12",
+    "@aboutbits/prettier-config": "^1.5.0",
+    "@aboutbits/ts-config": "^1.1.2",
     "@testing-library/jest-dom": "^5.16.5",
     "@testing-library/react": "^13.4.0",
     "@types/react": "^18.0.0",
     "@types/react-dom": "^18.0.0",
     "@types/react-router-dom": "^5.3.3",
-    "@typescript-eslint/eslint-plugin": "^5.30.0",
-    "@typescript-eslint/parser": "^5.30.0",
-    "eslint": "^8.18.0",
-    "eslint-config-prettier": "^8.5.0",
-    "eslint-plugin-import": "^2.26.0",
-    "eslint-plugin-prettier": "^4.1.0",
-    "eslint-plugin-react": "^7.32.2",
+    "@typescript-eslint/eslint-plugin": "^6.1.0",
+    "eslint": "^8.45.0",
+    "eslint-plugin-import": "^2.27.5",
+    "eslint-plugin-prettier": "^5.0.0",
+    "eslint-plugin-react": "^7.33.0",
     "eslint-plugin-react-hooks": "^4.6.0",
     "jsdom": "^22.1.0",
     "next": "^13.1.3",
     "next-router-mock": "^0.7.4",
-    "prettier": "^2.7.1",
+    "prettier": "^3.0.0",
     "react": "^18.0.0",
     "react-dom": "^18.0.0",
     "react-router-dom": "^6.7.0",
@@ -126,5 +128,6 @@
     "zod": {
       "optional": true
     }
-  }
+  },
+  "prettier": "@aboutbits/prettier-config"
 }

src/engine/pagination.ts

@@ -51,7 +51,7 @@ export const useAbstractQueryAndPagination = <T extends AbstractQuery>(
   parseQuery: ParseQuery<T>,
   router: Router,
   defaultPagination?: PaginationQuery,
-  options?: Partial<AbstractQueryOptions>
+  options?: Partial<AbstractQueryOptions>,
 ) => {
   const mergedDefaultPagination = {
     ...DEFAULT_PAGINATION,
@@ -66,7 +66,7 @@ export const useAbstractQueryAndPagination = <T extends AbstractQuery>(
     mergedDefaultQueryAndPagination,
     parseQuery,
     router,
-    options
+    options,
   )
 
   const {
@@ -77,7 +77,7 @@ export const useAbstractQueryAndPagination = <T extends AbstractQuery>(
     mergedDefaultPagination,
     parsePagination,
     router,
-    options
+    options,
   )
 
   return {
@@ -102,10 +102,16 @@ export const useAbstractQueryAndPagination = <T extends AbstractQuery>(
     },
     page: pagination.page,
     size: pagination.size,
-    setPage: (page: PaginationQuery['page']) => setPagination({ page }),
-    setSize: (size: PaginationQuery['size']) => setPagination({ size }),
+    setPage: (page: PaginationQuery['page']) => {
+      setPagination({ page })
+    },
+    setSize: (size: PaginationQuery['size']) => {
+      setPagination({ size })
+    },
     setPagination,
     resetPagination,
-    resetQueryAndPagination: () => setQuery(mergedDefaultQueryAndPagination),
+    resetQueryAndPagination: () => {
+      setQuery(mergedDefaultQueryAndPagination)
+    },
   }
 }

src/engine/query.ts

@@ -35,16 +35,17 @@ export type Router = {
 }
 
 export const useQuery = <T extends Query>(defaultQuery: T, router: Router) => {
-  const resetQuery = useCallback(
-    () => router.setQuery(defaultQuery, defaultQuery),
-    [router, defaultQuery]
-  )
+  const resetQuery = useCallback(() => {
+    router.setQuery(defaultQuery, defaultQuery)
+  }, [router, defaultQuery])
 
   const query = router.getQuery(defaultQuery)
 
   return {
     query,
-    setQuery: (query: Partial<T>) => router.setQuery(query, defaultQuery),
+    setQuery: (query: Partial<T>) => {
+      router.setQuery(query, defaultQuery)
+    },
     resetQuery,
   }
 }
@@ -74,21 +75,21 @@ export const useAbstractQuery = <T extends AbstractQuery>(
   defaultQuery: T,
   parseQuery: ParseQuery<T>,
   router: Router,
-  options?: Partial<AbstractQueryOptions>
+  options?: Partial<AbstractQueryOptions>,
 ) => {
   const mergedOptions = useMemo(
     () => ({ ...DEFAULT_ABSTRACT_QUERY_OPTIONS, ...options }),
-    [options]
+    [options],
   )
 
   const convertedDefaultQuery = useMemo(
     () => mergedOptions.convertToQuery(defaultQuery),
-    [mergedOptions, defaultQuery]
+    [mergedOptions, defaultQuery],
   )
 
   const { query, setQuery, resetQuery } = useQuery(
     convertedDefaultQuery,
-    router
+    router,
   )
 
   const parsedQuery: T = useMemo(() => {
@@ -105,8 +106,10 @@ export const useAbstractQuery = <T extends AbstractQuery>(
   }, [defaultQuery, parseQuery, query])
 
   const setAbstractQuery = useCallback(
-    (query: Partial<T>) => setQuery(mergedOptions.convertToQuery(query)),
-    [setQuery, mergedOptions]
+    (query: Partial<T>) => {
+      setQuery(mergedOptions.convertToQuery(query))
+    },
+    [setQuery, mergedOptions],
   )
 
   return {

src/routers/__test__/inMemory.test.ts

@@ -10,7 +10,7 @@ describe('InMemory', () => {
   })
 
   const useInMemoryQueryWithSearch = (
-    defaultQuery: NonNullableRecord<z.infer<typeof searchSchema>>
+    defaultQuery: NonNullableRecord<z.infer<typeof searchSchema>>,
   ) => useQuery(defaultQuery, searchSchema)
 
   test('should set default page and size', () => {
@@ -38,22 +38,22 @@ describe('InMemory', () => {
     const search = 'Max'
 
     const { result } = renderHook(() =>
-      useInMemoryQueryWithSearch({ search: '' })
+      useInMemoryQueryWithSearch({ search: '' }),
     )
 
     act(() => {
       result.current.setQuery({ search })
     })
 
-    expect(result.current.query?.search).toBe(search)
+    expect(result.current.query.search).toBe(search)
   })
 
   test('changing pagination should not reset the remaining query', () => {
     const search = 'Max'
     const page = 2
 
     const { result } = renderHook(() =>
-      useQueryAndPagination({ search: '' }, searchSchema)
+      useQueryAndPagination({ search: '' }, searchSchema),
     )
 
     act(() => {
@@ -90,7 +90,7 @@ describe('InMemory', () => {
     const page = 2
 
     const { result } = renderHook(() =>
-      useQueryAndPagination({ search: defaultSearch }, searchSchema)
+      useQueryAndPagination({ search: defaultSearch }, searchSchema),
     )
 
     act(() => {
@@ -125,7 +125,7 @@ describe('InMemory', () => {
     const page = 2
 
     const { result } = renderHook(() =>
-      useQueryAndPagination({ search: defaultSearch }, searchSchema)
+      useQueryAndPagination({ search: defaultSearch }, searchSchema),
     )
 
     act(() => {
@@ -159,7 +159,7 @@ describe('InMemory', () => {
     })
 
     const { result } = renderHook(() =>
-      useQuery({ search: '', department: '' }, schema)
+      useQuery({ search: '', department: '' }, schema),
     )
 
     act(() => {
@@ -178,7 +178,7 @@ describe('InMemory', () => {
     const search = ''
 
     const { result } = renderHook(() =>
-      useQuery({ search: 'Default search' }, searchSchema)
+      useQuery({ search: 'Default search' }, searchSchema),
     )
 
     act(() => {