fix(react-query): easier to know constraint @tanstack/react-query v4 …

…runtimely (#893)

# Overview

<!--
    A clear and concise description of what this pr is about.
 -->

We expect version of @tanstack/react-query's as only v4. so we warn it
with this change to promote installing correct version

## PR Checklist

- [x] I did below actions if need

1. I read the [Contributing
Guide](https://github.com/suspensive/react/blob/main/CONTRIBUTING.md)
2. I added documents and tests.

.changeset/tender-bees-wait.md

@@ -0,0 +1,5 @@
+---
+"@suspensive/react-query": patch
+---
+
+fix(react-query): easier to know constraint @tanstack/react-query v4 runtimely

packages/react-query/src/index.ts

@@ -1,3 +1,14 @@
+import TanStackReactQuery from '@tanstack/react-query/package.json'
+import { isVersion } from './utils'
+
+if (process.env.NODE_ENV === 'development') {
+  if (!isVersion(4).of(TanStackReactQuery.version)) {
+    console.warn(
+      `@suspensive/react-query: We support only @tanstack/react-query v4. but you installed @tanstack/react-query@${TanStackReactQuery.version}. Please install @tanstack/react-query v4 correctly`
+    )
+  }
+}
+
 export { queryOptions } from './queryOptions'
 export { SuspenseQuery } from './SuspenseQuery'
 export { SuspenseInfiniteQuery } from './SuspenseInfiniteQuery'

packages/react-query/src/utils/index.ts

@@ -0,0 +1 @@
+export { isVersion } from './isVersion'

packages/react-query/src/utils/isVersion.spec.ts

@@ -0,0 +1,17 @@
+import { isVersion } from './isVersion'
+
+describe('isVersion', () => {
+  it('should check the version correctly', () => {
+    expect(isVersion(4).of('4.32.1')).toBe(true)
+    expect(isVersion(4).of('5.32.1')).toBe(false)
+    expect(isVersion(4).of('3.32.1')).toBe(false)
+
+    expect(isVersion(4).of('4.32.1-beta.32')).toBe(true)
+    expect(isVersion(4).of('5.32.1-beta.32')).toBe(false)
+    expect(isVersion(4).of('3.32.1-beta.32')).toBe(false)
+
+    expect(isVersion(4).of('4')).toBe(true)
+    expect(isVersion(4).of('5')).toBe(false)
+    expect(isVersion(4).of('3')).toBe(false)
+  })
+})

packages/react-query/src/utils/isVersion.ts

@@ -0,0 +1,6 @@
+export const isVersion = (version: 0 | 1 | 2 | 3 | 4 | 5 | 6 | 7) => ({
+  of: (packageVersion: string) => {
+    const [major] = packageVersion.split('.').map(Number)
+    return major === version
+  },
+})