Implement react query

Author: owjs3901

.changepacks/changepack_log_MZUjkFzEPm0xEZstNHS2P.json

@@ -0,0 +1 @@
+{"changes":{"packages/fetch/package.json":"Patch","packages/react-query/package.json":"Minor"},"note":"Implement react-query","date":"2025-12-02T03:13:38.013730100Z"}

bun.lock

@@ -2,3 +2,4 @@
 coverage = true
 coveragePathIgnorePatterns = ["node_modules", "**/dist/**"]
 coverageSkipTestFiles = true
+preload = ["./packages/react-query/setup.ts"]

bunfig.toml

@@ -4,9 +4,13 @@
   "type": "module",
   "private": true,
   "devDependencies": {
-    "@types/bun": "latest",
     "@biomejs/biome": "^2.3",
-    "husky": "^9"
+    "@testing-library/react": "^16.3.0",
+    "@testing-library/react-hooks": "^8.0.1",
+    "@types/bun": "latest",
+    "husky": "^9",
+    "react": "^19.2.0",
+    "react-dom": "^19.2.0"
   },
   "author": "JeongMin Oh",
   "license": "Apache-2.0",

package.json

@@ -28,8 +28,10 @@
     "@tanstack/react-query": "*"
   },
   "devDependencies": {
+    "@testing-library/react-hooks": "^8.0.1",
     "@types/node": "^24.10",
     "@types/react": "^19.2",
+    "happy-dom": "^20.0.11",
     "typescript": "^5.9"
   }
 }

packages/react-query/package.json

@@ -0,0 +1,27 @@
+import { beforeAll } from 'bun:test'
+
+// Setup DOM environment for React testing
+if (typeof globalThis.document === 'undefined') {
+  // @ts-expect-error - happy-dom types
+  const { Window } = await import('happy-dom')
+  const window = new Window()
+  const document = window.document
+
+  // @ts-expect-error - setting global document
+  globalThis.window = window
+  // @ts-expect-error - setting global document
+  globalThis.document = document
+  // @ts-expect-error - setting global navigator
+  globalThis.navigator = window.navigator
+  // @ts-expect-error - setting global HTMLElement
+  globalThis.HTMLElement = window.HTMLElement
+}
+
+beforeAll(() => {
+  // Ensure DOM is ready
+  if (globalThis.document) {
+    const root = globalThis.document.createElement('div')
+    root.id = 'root'
+    globalThis.document.body.appendChild(root)
+  }
+})

packages/react-query/setup.ts

@@ -0,0 +1,50 @@
+/** biome-ignore-all lint/suspicious/noExplicitAny: any is used to allow for flexibility in the type */
+import { expect, test } from 'bun:test'
+import { createApi } from '@devup-api/fetch'
+import { createQueryClient } from '../create-query-client'
+import { DevupQueryClient } from '../query-client'
+
+test.each([
+  ['https://api.example.com'],
+  ['https://api.example.com/'],
+  ['http://localhost:3000'],
+  ['http://localhost:3000/'],
+] as const)('createQueryClient returns DevupQueryClient instance: %s', (baseUrl) => {
+  const api = createApi({ baseUrl })
+  const queryClient = createQueryClient(api)
+  expect(queryClient).toBeInstanceOf(DevupQueryClient)
+})
+
+test.each([
+  ['https://api.example.com', undefined],
+  ['https://api.example.com', {}],
+  ['https://api.example.com', { headers: { Authorization: 'Bearer token' } }],
+] as const)('createQueryClient accepts api with defaultOptions: %s', (baseUrl, defaultOptions) => {
+  const api = createApi({ baseUrl, ...defaultOptions })
+  const queryClient = createQueryClient(api)
+  expect(queryClient).toBeInstanceOf(DevupQueryClient)
+})
+
+test.each([
+  ['openapi.json'],
+  ['openapi2.json'],
+] as const)('createQueryClient accepts api with serverName: %s', (serverName) => {
+  const api = createApi({
+    baseUrl: 'https://api.example.com',
+    serverName: serverName as any,
+  })
+  const queryClient = createQueryClient(api)
+  expect(queryClient).toBeInstanceOf(DevupQueryClient)
+})
+
+test('createQueryClient uses default serverName when not provided', () => {
+  const api = createApi({ baseUrl: 'https://api.example.com' })
+  const queryClient = createQueryClient(api)
+  expect(queryClient).toBeInstanceOf(DevupQueryClient)
+})
+
+test('createQueryClient uses empty baseUrl when not provided', () => {
+  const api = createApi({})
+  const queryClient = createQueryClient(api)
+  expect(queryClient).toBeInstanceOf(DevupQueryClient)
+})

packages/react-query/src/__tests__/create-query-client.test.ts

@@ -0,0 +1,11 @@
+import { expect, test } from 'bun:test'
+import * as indexModule from '../index'
+
+// Type imports to verify types are exported (compile-time check)
+
+test('index.ts exports', () => {
+  expect({ ...indexModule }).toEqual({
+    createQueryClient: expect.any(Function),
+    DevupQueryClient: expect.any(Function),
+  })
+})