From 367a3d670c42315844f565db37312c35ced1a335 Mon Sep 17 00:00:00 2001 From: Sean Cassiere <33615041+SeanCassiere@users.noreply.github.com> Date: Fri, 27 Sep 2024 08:12:20 +1200 Subject: [PATCH] fix: broken types on the `PaginationLink` + bump tanstack/router (#423) * tanstack router * tanstack router plugin * fix: types on the pagination `` --- package.json | 6 ++--- pnpm-lock.yaml | 34 +++++++++++------------ src/components/ui/pagination.tsx | 46 +++++--------------------------- 3 files changed, 26 insertions(+), 60 deletions(-) diff --git a/package.json b/package.json index 30195b98..ecf02e27 100644 --- a/package.json +++ b/package.json @@ -48,10 +48,10 @@ "@tanstack/query-broadcast-client-experimental": "^5.56.2", "@tanstack/react-query": "^5.56.2", "@tanstack/react-query-devtools": "^5.56.2", - "@tanstack/react-router": "^1.58.3", + "@tanstack/react-router": "^1.58.9", "@tanstack/react-table": "^8.20.5", "@tanstack/react-virtual": "^3.10.7", - "@tanstack/router-devtools": "^1.58.3", + "@tanstack/router-devtools": "^1.58.9", "@ts-rest/core": "^3.51.0", "class-variance-authority": "^0.7.0", "clsx": "^2.1.1", @@ -86,7 +86,7 @@ "@tailwindcss/forms": "^0.5.9", "@tailwindcss/typography": "^0.5.15", "@tanstack/eslint-plugin-router": "^1.58.6", - "@tanstack/router-plugin": "^1.58.4", + "@tanstack/router-plugin": "^1.58.10", "@types/node": "^22.5.4", "@types/react": "^18.3.5", "@types/react-dom": "^18.3.0", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 50f8a2c2..8e6356f4 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -90,8 +90,8 @@ importers: specifier: ^5.56.2 version: 5.56.2(@tanstack/react-query@5.56.2(react@18.3.1))(react@18.3.1) '@tanstack/react-router': - specifier: ^1.58.3 - version: 1.58.3(@tanstack/router-generator@1.58.1)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) + specifier: ^1.58.9 + version: 1.58.9(@tanstack/router-generator@1.58.1)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) '@tanstack/react-table': specifier: ^8.20.5 version: 8.20.5(react-dom@18.3.1(react@18.3.1))(react@18.3.1) @@ -99,8 +99,8 @@ importers: specifier: ^3.10.7 version: 3.10.7(react-dom@18.3.1(react@18.3.1))(react@18.3.1) '@tanstack/router-devtools': - specifier: ^1.58.3 - version: 1.58.3(@tanstack/react-router@1.58.3(@tanstack/router-generator@1.58.1)(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(csstype@3.1.3)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) + specifier: ^1.58.9 + version: 1.58.9(@tanstack/react-router@1.58.9(@tanstack/router-generator@1.58.1)(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(csstype@3.1.3)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) '@ts-rest/core': specifier: ^3.51.0 version: 3.51.0(@types/node@22.5.4)(zod@3.23.8) @@ -199,8 +199,8 @@ importers: specifier: ^1.58.6 version: 1.58.6(eslint@9.9.1(jiti@1.21.0))(typescript@5.5.4) '@tanstack/router-plugin': - specifier: ^1.58.4 - version: 1.58.4(vite@5.4.7(@types/node@22.5.4)) + specifier: ^1.58.10 + version: 1.58.10(vite@5.4.7(@types/node@22.5.4)) '@types/node': specifier: ^22.5.4 version: 22.5.4 @@ -1736,8 +1736,8 @@ packages: peerDependencies: react: ^18 || ^19 - '@tanstack/react-router@1.58.3': - resolution: {integrity: sha512-cHpuzrNvRJ/FFDX+dWEw+w+NHp1eYn8j6WJlFs4nIyo6IJBJeL5DQgS5wdto+pOkqMEGAjzqTbJRU+zTcsVaSQ==} + '@tanstack/react-router@1.58.9': + resolution: {integrity: sha512-ODKOo8bUo8nIPGZmJHa7zNul9U3XAMmohnwZLl2A/A3suU03Q+0R5oOfhUKw+qArPIdIcec1VtqYpNk6y7qfrQ==} engines: {node: '>=12'} peerDependencies: '@tanstack/router-generator': 1.58.1 @@ -1766,11 +1766,11 @@ packages: react: ^16.8.0 || ^17.0.0 || ^18.0.0 react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0 - '@tanstack/router-devtools@1.58.3': - resolution: {integrity: sha512-S3uLervhvPQL/7M0HTacTlZzg8joaHhCXnFTcLNOkWQtcST+YzJtJz4xQ2XyfaEjm87VrdoTMZuB3bnTgWbAfQ==} + '@tanstack/router-devtools@1.58.9': + resolution: {integrity: sha512-caaompIgBaAoGnmz8cn4w/c3DtkvKBPv717hDYoN+nW/oHJgxSgnOyL/QEwGNv1XNtlMHjwEfhlGHnjqorjHKQ==} engines: {node: '>=12'} peerDependencies: - '@tanstack/react-router': ^1.58.3 + '@tanstack/react-router': ^1.58.9 react: '>=18' react-dom: '>=18' @@ -1778,8 +1778,8 @@ packages: resolution: {integrity: sha512-oj/97KWi8EHFx/w07fAuXXyhWi5xgSMCfzbB9q42c1ZdLbv8wzBo4a6PO1fCi01tpKKHUopA8dSlGIOeJDhBAA==} engines: {node: '>=12'} - '@tanstack/router-plugin@1.58.4': - resolution: {integrity: sha512-Ypoy+HrHwpv9A41bj7dpHhtLYavu7CU8WyuJnuFBY3SI5ZKWF7s/hMYUtVmEVwwT7fJCVQ8gcTkbfAag4uy/pA==} + '@tanstack/router-plugin@1.58.10': + resolution: {integrity: sha512-Jc7ks7vC8H4yCU74kc0YM4zO5KK2hJlncaTMPB9muZoeMgbk/3QaliNXr6JrpnnO9JQ1bUIslTdgNVCWJa0Hdw==} engines: {node: '>=12'} peerDependencies: '@rsbuild/core': '>=1.0.2' @@ -5139,7 +5139,7 @@ snapshots: '@tanstack/query-core': 5.56.2 react: 18.3.1 - '@tanstack/react-router@1.58.3(@tanstack/router-generator@1.58.1)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)': + '@tanstack/react-router@1.58.9(@tanstack/router-generator@1.58.1)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)': dependencies: '@tanstack/history': 1.57.6 '@tanstack/react-store': 0.5.5(react-dom@18.3.1(react@18.3.1))(react@18.3.1) @@ -5169,9 +5169,9 @@ snapshots: react: 18.3.1 react-dom: 18.3.1(react@18.3.1) - '@tanstack/router-devtools@1.58.3(@tanstack/react-router@1.58.3(@tanstack/router-generator@1.58.1)(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(csstype@3.1.3)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)': + '@tanstack/router-devtools@1.58.9(@tanstack/react-router@1.58.9(@tanstack/router-generator@1.58.1)(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(csstype@3.1.3)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)': dependencies: - '@tanstack/react-router': 1.58.3(@tanstack/router-generator@1.58.1)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) + '@tanstack/react-router': 1.58.9(@tanstack/router-generator@1.58.1)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) clsx: 2.1.1 goober: 2.1.14(csstype@3.1.3) react: 18.3.1 @@ -5186,7 +5186,7 @@ snapshots: tsx: 4.19.1 zod: 3.23.8 - '@tanstack/router-plugin@1.58.4(vite@5.4.7(@types/node@22.5.4))': + '@tanstack/router-plugin@1.58.10(vite@5.4.7(@types/node@22.5.4))': dependencies: '@babel/core': 7.25.2 '@babel/generator': 7.25.6 diff --git a/src/components/ui/pagination.tsx b/src/components/ui/pagination.tsx index 4c870167..497c8f62 100644 --- a/src/components/ui/pagination.tsx +++ b/src/components/ui/pagination.tsx @@ -48,30 +48,12 @@ const PaginationItem = React.forwardRef< )); PaginationItem.displayName = "PaginationItem"; -type PaginationLinkProps< - TRouter extends AnyRouter = RegisteredRouter, - TFrom extends RoutePaths | string = string, - TTo extends string = "", - TMaskFrom extends RoutePaths | string = TFrom, - TMaskTo extends string = "", -> = Pick & { isActive?: boolean } & LinkProps< - TRouter, - TFrom, - TTo, - TMaskFrom, - TMaskTo - > & +type PaginationLinkProps = Pick & { + isActive?: boolean; +} & LinkProps & LinkComponentProps<"a">; -const PaginationLink = < - TRouter extends AnyRouter = RegisteredRouter, - TFrom extends RoutePaths | string = string, - TTo extends string = "", - TMaskFrom extends RoutePaths | string = TFrom, - TMaskTo extends string = "", ->( - props: PaginationLinkProps -) => { +const PaginationLink = (props: PaginationLinkProps) => { const { size, className, isActive = false, ...rest } = props; return ( @@ -117,15 +99,7 @@ const PaginationButton = ({ ); PaginationButton.displayName = "PaginationButton"; -const PaginationLinkPrevious = < - TRouter extends AnyRouter = RegisteredRouter, - TFrom extends RoutePaths | string = string, - TTo extends string = "", - TMaskFrom extends RoutePaths | string = TFrom, - TMaskTo extends string = "", ->( - props: PaginationLinkProps -) => { +const PaginationLinkPrevious = (props: PaginationLinkProps) => { const { className, ...rest } = props; return ( | string = string, - TTo extends string = "", - TMaskFrom extends RoutePaths | string = TFrom, - TMaskTo extends string = "", ->( - props: PaginationLinkProps -) => { +const PaginationLinkNext = (props: PaginationLinkProps) => { const { className, ...rest } = props; return (