feat(medusa-react): Upgrade react-query and clean up dependencies (#2969)

packages/medusa-react/.storybook/medusa-context.js

@@ -1,5 +1,5 @@
+import { QueryClient } from "@tanstack/react-query"
 import React from "react"
-import { QueryClient } from "react-query"
 import { MedusaProvider } from "../src"
 
 const queryClient = new QueryClient({

packages/medusa-react/README.md

@@ -24,7 +24,7 @@ In addition, because medusa-react is built on top of react-query, you can pass a
 // App.tsx
 
 import * as React from "react"
-import { QueryClient } from "react-query"
+import { QueryClient } from "@tanstack/react-query"
 import { MedusaProvider } from "medusa-react"
 import MyStorefront from "./my-storefront"
 
@@ -80,7 +80,7 @@ In general, the queries will return everything react-query returns from [`useQue
 So, in other words, we can express what the above query returns as the following:
 
 ```typescript
-import { UseQueryResult } from "react-query"
+import { UseQueryResult } from "@tanstack/react-query"
 
 // This is what a Medusa server returns when you hit the GET /store/products endpoint
 type ProductsResponse = {
@@ -237,7 +237,7 @@ The first step to using the `SessionCartProvider` is by inserting it somewhere u
 // App.tsx
 
 import * as React from "react"
-import { QueryClient } from "react-query"
+import { QueryClient } from "@tanstack/react-query"
 import { MedusaProvider, SessionCartProvider } from "medusa-react"
 import MyStorefront from "./my-storefront"
 
@@ -274,7 +274,7 @@ export default App
 // App.tsx
 
 import * as React from "react"
-import { QueryClient } from "react-query"
+import { QueryClient } from "@tanstack/react-query"
 import { MedusaProvider, CartProvider } from "medusa-react"
 import MyStorefront from "./my-storefront"
 

packages/medusa-react/package.json

@@ -23,8 +23,8 @@
   },
   "peerDependencies": {
     "@medusajs/medusa": "^1.7.1",
-    "react": ">=16",
-    "react-query": ">= 3.29.0"
+    "@tanstack/react-query": ">=4.22.0",
+    "react": ">=16"
   },
   "husky": {
     "hooks": {
@@ -54,6 +54,7 @@
     "@storybook/addon-links": "^6.3.12",
     "@storybook/addons": "^6.3.12",
     "@storybook/react": "^6.3.12",
+    "@tanstack/react-query": "^4.22.0",
     "@testing-library/react": "^12.1.2",
     "@testing-library/react-hooks": "^7.0.2",
     "@types/jest": "^27.0.3",
@@ -77,8 +78,7 @@
   "dependencies": {
     "@medusajs/medusa-js": "^1.3.5",
     "lodash": "^4.17.21",
-    "lodash-es": "^4.17.21",
-    "react-query": "^3.31.0"
+    "lodash-es": "^4.17.21"
   },
   "msw": {
     "workerDirectory": "public"

packages/medusa-react/src/contexts/medusa.tsx

@@ -1,6 +1,9 @@
-import React from "react"
-import { QueryClientProvider, QueryClientProviderProps } from "react-query"
 import Medusa from "@medusajs/medusa-js"
+import {
+  QueryClientProvider,
+  QueryClientProviderProps,
+} from "@tanstack/react-query"
+import React from "react"
 
 interface MedusaContextState {
   client: Medusa

packages/medusa-react/src/hooks/admin/auth/mutations.ts

@@ -1,6 +1,10 @@
 import { AdminAuthRes, AdminPostAuthReq } from "@medusajs/medusa"
 import { Response } from "@medusajs/medusa-js"
-import { useMutation, UseMutationOptions, useQueryClient } from "react-query"
+import {
+  useMutation,
+  UseMutationOptions,
+  useQueryClient,
+} from "@tanstack/react-query"
 import { adminAuthKeys } from "."
 import { useMedusa } from "../../../contexts/medusa"
 import { buildOptions } from "../../utils/buildOptions"

packages/medusa-react/src/hooks/admin/auth/queries.ts

@@ -1,6 +1,6 @@
 import { AdminAuthRes } from "@medusajs/medusa"
 import { Response } from "@medusajs/medusa-js"
-import { useQuery } from "react-query"
+import { useQuery } from "@tanstack/react-query"
 import { useMedusa } from "../../../contexts"
 import { UseQueryOptionsWrapper } from "../../../types"
 import { queryKeysFactory } from "../../utils/index"

packages/medusa-react/src/hooks/admin/batch-jobs/mutations.ts

@@ -1,6 +1,10 @@
 import { AdminBatchJobRes, AdminPostBatchesReq } from "@medusajs/medusa"
 import { Response } from "@medusajs/medusa-js"
-import { useMutation, UseMutationOptions, useQueryClient } from "react-query"
+import {
+  useMutation,
+  UseMutationOptions,
+  useQueryClient,
+} from "@tanstack/react-query"
 
 import { useMedusa } from "../../../contexts"
 import { buildOptions } from "../../utils/buildOptions"

packages/medusa-react/src/hooks/admin/batch-jobs/queries.ts

@@ -4,7 +4,7 @@ import {
   AdminGetBatchParams,
 } from "@medusajs/medusa"
 import { Response } from "@medusajs/medusa-js"
-import { useQuery } from "react-query"
+import { useQuery } from "@tanstack/react-query"
 import { useMedusa } from "../../../contexts"
 import { UseQueryOptionsWrapper } from "../../../types"
 import { queryKeysFactory } from "../../utils/index"

packages/medusa-react/src/hooks/admin/claims/mutations.ts

@@ -1,4 +1,3 @@
-import { adminOrderKeys } from "./../orders/queries"
 import {
   AdminOrdersRes,
   AdminPostOrdersOrderClaimsClaimFulfillmentsReq,
@@ -7,9 +6,14 @@ import {
   AdminPostOrdersOrderClaimsReq,
 } from "@medusajs/medusa"
 import { Response } from "@medusajs/medusa-js"
-import { useMutation, UseMutationOptions, useQueryClient } from "react-query"
+import {
+  useMutation,
+  UseMutationOptions,
+  useQueryClient,
+} from "@tanstack/react-query"
 import { useMedusa } from "../../../contexts/medusa"
 import { buildOptions } from "../../utils/buildOptions"
+import { adminOrderKeys } from "./../orders/queries"
 
 export const useAdminCreateClaim = (
   orderId: string,

packages/medusa-react/src/hooks/admin/collections/mutations.ts

@@ -7,7 +7,11 @@ import {
   AdminPostProductsToCollectionReq,
 } from "@medusajs/medusa"
 import { Response } from "@medusajs/medusa-js"
-import { useMutation, UseMutationOptions, useQueryClient } from "react-query"
+import {
+  useMutation,
+  UseMutationOptions,
+  useQueryClient,
+} from "@tanstack/react-query"
 import { adminCollectionKeys } from "."
 import { useMedusa } from "../../../contexts/medusa"
 import { buildOptions } from "../../utils/buildOptions"
@@ -65,7 +69,6 @@ export const useAdminDeleteCollection = (
   )
 }
 
-
 /**
  * Hook returns function for adding multiple products to a collection.
  *

packages/medusa-react/src/hooks/admin/collections/queries.ts

@@ -4,7 +4,7 @@ import {
   AdminGetCollectionsParams,
 } from "@medusajs/medusa"
 import { Response } from "@medusajs/medusa-js"
-import { useQuery } from "react-query"
+import { useQuery } from "@tanstack/react-query"
 import { useMedusa } from "../../../contexts"
 import { UseQueryOptionsWrapper } from "../../../types"
 import { queryKeysFactory } from "../../utils/index"

packages/medusa-react/src/hooks/admin/currencies/mutations.ts

@@ -3,7 +3,11 @@ import {
   AdminPostCurrenciesCurrencyReq,
 } from "@medusajs/medusa"
 import { Response } from "@medusajs/medusa-js"
-import { useMutation, UseMutationOptions, useQueryClient } from "react-query"
+import {
+  useMutation,
+  UseMutationOptions,
+  useQueryClient,
+} from "@tanstack/react-query"
 import { adminCurrenciesKeys } from "."
 import { useMedusa } from "../../../contexts/medusa"
 import { buildOptions } from "../../utils/buildOptions"

packages/medusa-react/src/hooks/admin/currencies/queries.ts

@@ -3,7 +3,7 @@ import {
   AdminGetCurrenciesParams,
 } from "@medusajs/medusa"
 import { Response } from "@medusajs/medusa-js"
-import { useQuery } from "react-query"
+import { useQuery } from "@tanstack/react-query"
 import { useMedusa } from "../../../contexts"
 import { UseQueryOptionsWrapper } from "../../../types"
 import { queryKeysFactory } from "../../utils/index"

packages/medusa-react/src/hooks/admin/customer-groups/mutations.ts

@@ -6,8 +6,12 @@ import {
   AdminPostCustomerGroupsGroupReq,
   AdminPostCustomerGroupsReq,
 } from "@medusajs/medusa"
-import { useMutation, UseMutationOptions, useQueryClient } from "react-query"
 import { Response } from "@medusajs/medusa-js"
+import {
+  useMutation,
+  UseMutationOptions,
+  useQueryClient,
+} from "@tanstack/react-query"
 
 import { useMedusa } from "../../../contexts"
 import { buildOptions } from "../../utils/buildOptions"

packages/medusa-react/src/hooks/admin/customer-groups/queries.ts

@@ -7,7 +7,7 @@ import {
   AdminGetCustomersParams,
 } from "@medusajs/medusa"
 import { Response } from "@medusajs/medusa-js"
-import { useQuery } from "react-query"
+import { useQuery } from "@tanstack/react-query"
 
 import { useMedusa } from "../../../contexts"
 import { UseQueryOptionsWrapper } from "../../../types"

packages/medusa-react/src/hooks/admin/customers/mutations.ts

@@ -1,4 +1,8 @@
-import { useMutation, UseMutationOptions, useQueryClient } from "react-query"
+import {
+  useMutation,
+  UseMutationOptions,
+  useQueryClient,
+} from "@tanstack/react-query"
 
 import { AdminCustomersRes, AdminPostCustomersReq } from "@medusajs/medusa"
 import { Response } from "@medusajs/medusa-js"

packages/medusa-react/src/hooks/admin/customers/queries.ts

@@ -4,7 +4,7 @@ import {
   AdminGetCustomersParams,
 } from "@medusajs/medusa"
 import { Response } from "@medusajs/medusa-js"
-import { useQuery } from "react-query"
+import { useQuery } from "@tanstack/react-query"
 import { useMedusa } from "../../../contexts"
 import { UseQueryOptionsWrapper } from "../../../types"
 import { queryKeysFactory } from "../../utils"

packages/medusa-react/src/hooks/admin/discounts/mutations.ts

@@ -11,7 +11,11 @@ import {
   AdminPostDiscountsReq,
 } from "@medusajs/medusa"
 import { Response } from "@medusajs/medusa-js"
-import { useMutation, UseMutationOptions, useQueryClient } from "react-query"
+import {
+  useMutation,
+  UseMutationOptions,
+  useQueryClient,
+} from "@tanstack/react-query"
 import { useMedusa } from "../../../contexts"
 import { buildOptions } from "../../utils/buildOptions"
 import { adminDiscountKeys } from "./queries"

packages/medusa-react/src/hooks/admin/discounts/queries.ts

@@ -7,7 +7,7 @@ import {
   AdminGetDiscountsParams,
 } from "@medusajs/medusa"
 import { Response } from "@medusajs/medusa-js"
-import { useQuery } from "react-query"
+import { useQuery } from "@tanstack/react-query"
 import { useMedusa } from "../../../contexts"
 import { UseQueryOptionsWrapper } from "../../../types"
 import { queryKeysFactory } from "../../utils"

packages/medusa-react/src/hooks/admin/draft-orders/mutations.ts

@@ -5,10 +5,14 @@ import {
   AdminPostDraftOrdersDraftOrderLineItemsReq,
   AdminPostDraftOrdersDraftOrderRegisterPaymentRes,
   AdminPostDraftOrdersDraftOrderReq,
-  AdminPostDraftOrdersReq
+  AdminPostDraftOrdersReq,
 } from "@medusajs/medusa"
 import { Response } from "@medusajs/medusa-js"
-import { useMutation, UseMutationOptions, useQueryClient } from "react-query"
+import {
+  useMutation,
+  UseMutationOptions,
+  useQueryClient,
+} from "@tanstack/react-query"
 import { useMedusa } from "../../../contexts/medusa"
 import { buildOptions } from "../../utils/buildOptions"
 import { adminDraftOrderKeys } from "./queries"

packages/medusa-react/src/hooks/admin/draft-orders/queries.ts

@@ -4,7 +4,7 @@ import {
   AdminGetDraftOrdersParams,
 } from "@medusajs/medusa"
 import { Response } from "@medusajs/medusa-js"
-import { useQuery } from "react-query"
+import { useQuery } from "@tanstack/react-query"
 import { useMedusa } from "../../../contexts"
 import { UseQueryOptionsWrapper } from "../../../types"
 import { queryKeysFactory } from "../../utils/index"

packages/medusa-react/src/hooks/admin/gift-cards/mutations.ts

@@ -4,7 +4,11 @@ import {
   AdminPostGiftCardsReq,
 } from "@medusajs/medusa"
 import { Response } from "@medusajs/medusa-js"
-import { useMutation, UseMutationOptions, useQueryClient } from "react-query"
+import {
+  useMutation,
+  UseMutationOptions,
+  useQueryClient,
+} from "@tanstack/react-query"
 import { adminGiftCardKeys } from "."
 import { useMedusa } from "../../../contexts/medusa"
 import { buildOptions } from "../../utils/buildOptions"

packages/medusa-react/src/hooks/admin/gift-cards/queries.ts

@@ -1,10 +1,10 @@
 import {
+  AdminGetGiftCardsParams,
   AdminGiftCardsListRes,
   AdminGiftCardsRes,
-  AdminGetGiftCardsParams,
 } from "@medusajs/medusa"
 import { Response } from "@medusajs/medusa-js"
-import { useQuery } from "react-query"
+import { useQuery } from "@tanstack/react-query"
 import { useMedusa } from "../../../contexts"
 import { UseQueryOptionsWrapper } from "../../../types"
 import { queryKeysFactory } from "../../utils/index"

packages/medusa-react/src/hooks/admin/invites/mutations.ts

@@ -1,11 +1,15 @@
-import { buildOptions } from "../../utils/buildOptions"
 import {
   AdminInviteDeleteRes,
   AdminPostInvitesInviteAcceptReq,
 } from "@medusajs/medusa"
-import { Response, AdminPostInvitesPayload } from "@medusajs/medusa-js"
-import { useMutation, UseMutationOptions, useQueryClient } from "react-query"
+import { AdminPostInvitesPayload, Response } from "@medusajs/medusa-js"
+import {
+  useMutation,
+  UseMutationOptions,
+  useQueryClient,
+} from "@tanstack/react-query"
 import { useMedusa } from "../../../contexts/medusa"
+import { buildOptions } from "../../utils/buildOptions"
 import { adminInviteKeys } from "./queries"
 
 export const useAdminAcceptInvite = (

packages/medusa-react/src/hooks/admin/invites/queries.ts

@@ -1,6 +1,6 @@
 import { AdminListInvitesRes } from "@medusajs/medusa"
 import { Response } from "@medusajs/medusa-js"
-import { useQuery } from "react-query"
+import { useQuery } from "@tanstack/react-query"
 import { useMedusa } from "../../../contexts"
 import { UseQueryOptionsWrapper } from "../../../types"
 import { queryKeysFactory } from "../../utils/index"

packages/medusa-react/src/hooks/admin/notes/mutations.ts

@@ -5,7 +5,11 @@ import {
   AdminPostNotesReq,
 } from "@medusajs/medusa"
 import { Response } from "@medusajs/medusa-js"
-import { useMutation, UseMutationOptions, useQueryClient } from "react-query"
+import {
+  useMutation,
+  UseMutationOptions,
+  useQueryClient,
+} from "@tanstack/react-query"
 import { adminNoteKeys } from "."
 import { useMedusa } from "../../../contexts/medusa"
 import { buildOptions } from "../../utils/buildOptions"

packages/medusa-react/src/hooks/admin/notes/queries.ts

@@ -1,10 +1,10 @@
 import {
+  AdminGetNotesParams,
   AdminNotesListRes,
   AdminNotesRes,
-  AdminGetNotesParams,
 } from "@medusajs/medusa"
 import { Response } from "@medusajs/medusa-js"
-import { useQuery } from "react-query"
+import { useQuery } from "@tanstack/react-query"
 import { useMedusa } from "../../../contexts"
 import { UseQueryOptionsWrapper } from "../../../types"
 import { queryKeysFactory } from "../../utils/index"

packages/medusa-react/src/hooks/admin/notifications/mutations.ts

@@ -3,10 +3,14 @@ import {
   AdminPostNotificationsNotificationResendReq,
 } from "@medusajs/medusa"
 import { Response } from "@medusajs/medusa-js"
-import { useMutation, UseMutationOptions, useQueryClient } from "react-query"
+import {
+  useMutation,
+  UseMutationOptions,
+  useQueryClient,
+} from "@tanstack/react-query"
 import { useMedusa } from "../../../contexts/medusa"
-import { adminNotificationKeys } from "./queries"
 import { buildOptions } from "../../utils/buildOptions"
+import { adminNotificationKeys } from "./queries"
 
 export const useAdminResendNotification = (
   id: string,

packages/medusa-react/src/hooks/admin/notifications/queries.ts

@@ -3,7 +3,7 @@ import {
   AdminNotificationsListRes,
 } from "@medusajs/medusa"
 import { Response } from "@medusajs/medusa-js"
-import { useQuery } from "react-query"
+import { useQuery } from "@tanstack/react-query"
 import { useMedusa } from "../../../contexts"
 import { UseQueryOptionsWrapper } from "../../../types"
 import { queryKeysFactory } from "../../utils/index"

packages/medusa-react/src/hooks/admin/order-edits/mutations.ts

@@ -1,20 +1,24 @@
-import { useMutation, UseMutationOptions, useQueryClient } from "react-query"
 import { Response } from "@medusajs/medusa-js"
+import {
+  useMutation,
+  UseMutationOptions,
+  useQueryClient,
+} from "@tanstack/react-query"
 
 import {
   AdminOrderEditDeleteRes,
   AdminOrderEditItemChangeDeleteRes,
   AdminOrderEditsRes,
   AdminPostOrderEditsEditLineItemsLineItemReq,
+  AdminPostOrderEditsEditLineItemsReq,
   AdminPostOrderEditsOrderEditReq,
   AdminPostOrderEditsReq,
-  AdminPostOrderEditsEditLineItemsReq,
 } from "@medusajs/medusa"
 
-import { buildOptions } from "../../utils/buildOptions"
-import { useMedusa } from "../../../contexts"
-import { adminOrderKeys } from "../orders"
 import { adminOrderEditsKeys } from "."
+import { useMedusa } from "../../../contexts"
+import { buildOptions } from "../../utils/buildOptions"
+import { adminOrderKeys } from "../orders"
 
 export const useAdminCreateOrderEdit = (
   options?: UseMutationOptions<

packages/medusa-react/src/hooks/admin/order-edits/queries.ts

@@ -4,11 +4,11 @@ import {
   GetOrderEditsOrderEditParams,
   GetOrderEditsParams,
 } from "@medusajs/medusa"
-import { queryKeysFactory } from "../../utils"
-import { UseQueryOptionsWrapper } from "../../../types"
 import { Response } from "@medusajs/medusa-js"
+import { useQuery } from "@tanstack/react-query"
 import { useMedusa } from "../../../contexts"
-import { useQuery } from "react-query"
+import { UseQueryOptionsWrapper } from "../../../types"
+import { queryKeysFactory } from "../../utils"
 
 const ADMIN_ORDER_EDITS_QUERY_KEY = `admin_order_edits` as const
 

packages/medusa-react/src/hooks/admin/orders/mutations.ts

@@ -1,4 +1,3 @@
-import { adminOrderKeys } from "./queries"
 import {
   AdminOrdersRes,
   AdminPostOrdersOrderFulfillmentsReq,
@@ -9,9 +8,14 @@ import {
   AdminPostOrdersOrderShippingMethodsReq,
 } from "@medusajs/medusa"
 import { Response } from "@medusajs/medusa-js"
-import { useMutation, UseMutationOptions, useQueryClient } from "react-query"
+import {
+  useMutation,
+  UseMutationOptions,
+  useQueryClient,
+} from "@tanstack/react-query"
 import { useMedusa } from "../../../contexts/medusa"
 import { buildOptions } from "../../utils/buildOptions"
+import { adminOrderKeys } from "./queries"
 
 export const useAdminUpdateOrder = (
   id: string,

packages/medusa-react/src/hooks/admin/orders/queries.ts

@@ -1,11 +1,11 @@
 import {
+  AdminGetOrdersParams,
   AdminOrdersListRes,
   AdminOrdersRes,
-  AdminGetOrdersParams,
 } from "@medusajs/medusa"
 import { Response } from "@medusajs/medusa-js"
 import { FindParams } from "@medusajs/medusa/dist/types/common"
-import { useQuery } from "react-query"
+import { useQuery } from "@tanstack/react-query"
 import { useMedusa } from "../../../contexts"
 import { UseQueryOptionsWrapper } from "../../../types"
 import { queryKeysFactory } from "../../utils/index"
@@ -16,7 +16,7 @@ export const adminOrderKeys = {
   ...queryKeysFactory(ADMIN_ORDERS_QUERY_KEY),
   detailOrder(id: string, query?: FindParams) {
     return [...this.detail(id), { ...(query || {}) }]
-  }
+  },
 }
 
 type OrderQueryKeys = typeof adminOrderKeys

packages/medusa-react/src/hooks/admin/payment-collections/mutations.ts

@@ -1,5 +1,9 @@
-import { useMutation, UseMutationOptions, useQueryClient } from "react-query"
 import { Response } from "@medusajs/medusa-js"
+import {
+  useMutation,
+  UseMutationOptions,
+  useQueryClient,
+} from "@tanstack/react-query"
 
 import {
   AdminPaymentCollectionDeleteRes,
@@ -7,9 +11,9 @@ import {
   AdminUpdatePaymentCollectionsReq,
 } from "@medusajs/medusa"
 
-import { buildOptions } from "../../utils/buildOptions"
-import { useMedusa } from "../../../contexts"
 import { adminPaymentCollectionQueryKeys } from "."
+import { useMedusa } from "../../../contexts"
+import { buildOptions } from "../../utils/buildOptions"
 
 export const useAdminDeletePaymentCollection = (
   id: string,

packages/medusa-react/src/hooks/admin/payment-collections/queries.ts

@@ -1,9 +1,9 @@
-import { queryKeysFactory } from "../../utils"
 import { AdminPaymentCollectionsRes } from "@medusajs/medusa"
-import { useQuery } from "react-query"
+import { Response } from "@medusajs/medusa-js"
+import { useQuery } from "@tanstack/react-query"
 import { useMedusa } from "../../../contexts"
 import { UseQueryOptionsWrapper } from "../../../types"
-import { Response } from "@medusajs/medusa-js"
+import { queryKeysFactory } from "../../utils"
 
 const PAYMENT_COLLECTION_QUERY_KEY = `paymentCollection` as const
 

packages/medusa-react/src/hooks/admin/payments/mutations.ts

@@ -1,5 +1,9 @@
-import { useMutation, UseMutationOptions, useQueryClient } from "react-query"
 import { Response } from "@medusajs/medusa-js"
+import {
+  useMutation,
+  UseMutationOptions,
+  useQueryClient,
+} from "@tanstack/react-query"
 
 import {
   AdminPaymentRes,
@@ -7,9 +11,9 @@ import {
   AdminRefundRes,
 } from "@medusajs/medusa"
 
-import { buildOptions } from "../../utils/buildOptions"
-import { useMedusa } from "../../../contexts"
 import { adminPaymentQueryKeys } from "."
+import { useMedusa } from "../../../contexts"
+import { buildOptions } from "../../utils/buildOptions"
 
 export const useAdminPaymentsCapturePayment = (
   id: string,

packages/medusa-react/src/hooks/admin/payments/queries.ts

@@ -1,9 +1,9 @@
-import { queryKeysFactory } from "../../utils"
 import { AdminPaymentRes } from "@medusajs/medusa"
-import { useQuery } from "react-query"
+import { Response } from "@medusajs/medusa-js"
+import { useQuery } from "@tanstack/react-query"
 import { useMedusa } from "../../../contexts"
 import { UseQueryOptionsWrapper } from "../../../types"
-import { Response } from "@medusajs/medusa-js"
+import { queryKeysFactory } from "../../utils"
 
 const PAYMENT_QUERY_KEY = `payment` as const
 

packages/medusa-react/src/hooks/admin/price-lists/mutations.ts

@@ -1,21 +1,25 @@
 import {
-  AdminPriceListRes,
+  AdminDeletePriceListPricesPricesReq,
+  AdminPostPriceListPricesPricesReq,
   AdminPostPriceListsPriceListPriceListReq,
   AdminPostPriceListsPriceListReq,
-  AdminPostPriceListPricesPricesReq,
-  AdminDeletePriceListPricesPricesReq,
-  AdminPriceListDeleteRes,
   AdminPriceListDeleteBatchRes,
   AdminPriceListDeleteProductPricesRes,
+  AdminPriceListDeleteRes,
   AdminPriceListDeleteVariantPricesRes,
+  AdminPriceListRes,
 } from "@medusajs/medusa"
 import { Response } from "@medusajs/medusa-js"
-import { useMutation, UseMutationOptions, useQueryClient } from "react-query"
+import {
+  useMutation,
+  UseMutationOptions,
+  useQueryClient,
+} from "@tanstack/react-query"
 import { useMedusa } from "../../../contexts/medusa"
 import { buildOptions } from "../../utils/buildOptions"
-import { adminPriceListKeys } from "./queries"
 import { adminProductKeys } from "../products"
 import { adminVariantKeys } from "../variants"
+import { adminPriceListKeys } from "./queries"
 
 export const useAdminCreatePriceList = (
   options?: UseMutationOptions<
@@ -141,7 +145,7 @@ export const useAdminDeletePriceListProductPrices = (
       [
         adminPriceListKeys.detail(id),
         adminPriceListKeys.lists(),
-        adminProductKeys.detail(productId)
+        adminProductKeys.detail(productId),
       ],
       options
     )
@@ -166,7 +170,7 @@ export const useAdminDeletePriceListVariantPrices = (
       [
         adminPriceListKeys.detail(id),
         adminPriceListKeys.lists(),
-        adminVariantKeys.detail(variantId)
+        adminVariantKeys.detail(variantId),
       ],
       options
     )

packages/medusa-react/src/hooks/admin/price-lists/queries.ts

@@ -1,12 +1,12 @@
 import {
-  AdminGetPriceListsPriceListProductsParams,
   AdminGetPriceListPaginationParams,
-  AdminPriceListsListRes,
+  AdminGetPriceListsPriceListProductsParams,
   AdminPriceListRes,
+  AdminPriceListsListRes,
   AdminProductsListRes,
 } from "@medusajs/medusa"
 import { Response } from "@medusajs/medusa-js"
-import { useQuery } from "react-query"
+import { useQuery } from "@tanstack/react-query"
 import { useMedusa } from "../../../contexts"
 import { UseQueryOptionsWrapper } from "../../../types"
 import { queryKeysFactory } from "../../utils/index"
@@ -21,7 +21,7 @@ export const adminPriceListKeys = {
       "products" as const,
       { ...(query || {}) },
     ] as const
-  }
+  },
 }
 
 type PriceListQueryKeys = typeof adminPriceListKeys

packages/medusa-react/src/hooks/admin/product-tags/queries.ts

@@ -1,9 +1,9 @@
 import {
-  AdminProductTagsListRes,
   AdminGetProductTagsParams,
+  AdminProductTagsListRes,
 } from "@medusajs/medusa"
 import { Response } from "@medusajs/medusa-js"
-import { useQuery } from "react-query"
+import { useQuery } from "@tanstack/react-query"
 import { useMedusa } from "../../../contexts"
 import { UseQueryOptionsWrapper } from "../../../types"
 import { queryKeysFactory } from "../../utils/index"

packages/medusa-react/src/hooks/admin/product-types/queries.ts

@@ -1,9 +1,9 @@
 import {
-  AdminProductTypesListRes,
   AdminGetProductTypesParams,
+  AdminProductTypesListRes,
 } from "@medusajs/medusa"
 import { Response } from "@medusajs/medusa-js"
-import { useQuery } from "react-query"
+import { useQuery } from "@tanstack/react-query"
 import { useMedusa } from "../../../contexts"
 import { UseQueryOptionsWrapper } from "../../../types"
 import { queryKeysFactory } from "../../utils/index"

packages/medusa-react/src/hooks/admin/products/mutations.ts

@@ -11,7 +11,11 @@ import {
   AdminProductsRes,
 } from "@medusajs/medusa"
 import { Response } from "@medusajs/medusa-js"
-import { useMutation, UseMutationOptions, useQueryClient } from "react-query"
+import {
+  useMutation,
+  UseMutationOptions,
+  useQueryClient,
+} from "@tanstack/react-query"
 import { useMedusa } from "../../../contexts"
 import { buildOptions } from "../../utils/buildOptions"
 import { adminProductKeys } from "./queries"

packages/medusa-react/src/hooks/admin/products/queries.ts

@@ -1,11 +1,11 @@
 import {
-  AdminProductsListRes,
-  AdminProductsRes,
   AdminGetProductsParams,
+  AdminProductsListRes,
   AdminProductsListTagsRes,
+  AdminProductsRes,
 } from "@medusajs/medusa"
 import { Response } from "@medusajs/medusa-js"
-import { useQuery } from "react-query"
+import { useQuery } from "@tanstack/react-query"
 import { useMedusa } from "../../../contexts"
 import { UseQueryOptionsWrapper } from "../../../types"
 import { queryKeysFactory } from "../../utils/index"

packages/medusa-react/src/hooks/admin/publishable-api-keys/mutations.ts

@@ -1,17 +1,21 @@
-import { useMutation, UseMutationOptions, useQueryClient } from "react-query"
 import { Response } from "@medusajs/medusa-js"
+import {
+  useMutation,
+  UseMutationOptions,
+  useQueryClient,
+} from "@tanstack/react-query"
 
 import {
-  AdminPublishableApiKeyDeleteRes,
-  AdminPublishableApiKeysRes,
+  AdminPostPublishableApiKeySalesChannelsBatchReq,
   AdminPostPublishableApiKeysPublishableApiKeyReq,
   AdminPostPublishableApiKeysReq,
-  AdminPostPublishableApiKeySalesChannelsBatchReq,
+  AdminPublishableApiKeyDeleteRes,
+  AdminPublishableApiKeysRes,
 } from "@medusajs/medusa"
 
-import { buildOptions } from "../../utils/buildOptions"
-import { useMedusa } from "../../../contexts"
 import { adminPublishableApiKeysKeys } from "."
+import { useMedusa } from "../../../contexts"
+import { buildOptions } from "../../utils/buildOptions"
 
 export const useAdminCreatePublishableApiKey = (
   options?: UseMutationOptions<

packages/medusa-react/src/hooks/admin/publishable-api-keys/queries.ts

@@ -5,12 +5,12 @@ import {
   GetPublishableApiKeySalesChannelsParams,
   GetPublishableApiKeysParams,
 } from "@medusajs/medusa"
-import { useQuery } from "react-query"
 import { Response } from "@medusajs/medusa-js"
+import { useQuery } from "@tanstack/react-query"
 
-import { queryKeysFactory } from "../../utils"
 import { useMedusa } from "../../../contexts"
 import { UseQueryOptionsWrapper } from "../../../types"
+import { queryKeysFactory } from "../../utils"
 
 const ADMIN_PUBLISHABLE_API_KEYS_QUERY_KEY =
   `admin_publishable_api_keys` as const

packages/medusa-react/src/hooks/admin/regions/mutations.ts

@@ -1,17 +1,21 @@
-import { adminRegionKeys } from "./queries"
 import {
-  AdminRegionsDeleteRes,
-  AdminRegionsRes,
-  AdminPostRegionsRegionReq,
-  AdminPostRegionsReq,
   AdminPostRegionsRegionCountriesReq,
   AdminPostRegionsRegionFulfillmentProvidersReq,
   AdminPostRegionsRegionPaymentProvidersReq,
+  AdminPostRegionsRegionReq,
+  AdminPostRegionsReq,
+  AdminRegionsDeleteRes,
+  AdminRegionsRes,
 } from "@medusajs/medusa"
 import { Response } from "@medusajs/medusa-js"
-import { useMutation, UseMutationOptions, useQueryClient } from "react-query"
+import {
+  useMutation,
+  UseMutationOptions,
+  useQueryClient,
+} from "@tanstack/react-query"
 import { useMedusa } from "../../../contexts/medusa"
 import { buildOptions } from "../../utils/buildOptions"
+import { adminRegionKeys } from "./queries"
 
 export const useAdminCreateRegion = (
   options?: UseMutationOptions<

packages/medusa-react/src/hooks/admin/regions/queries.ts

@@ -1,11 +1,11 @@
 import {
-  AdminRegionsListRes,
-  AdminRegionsRes,
   AdminGetRegionsParams,
   AdminGetRegionsRegionFulfillmentOptionsRes,
+  AdminRegionsListRes,
+  AdminRegionsRes,
 } from "@medusajs/medusa"
 import { Response } from "@medusajs/medusa-js"
-import { useQuery } from "react-query"
+import { useQuery } from "@tanstack/react-query"
 import { useMedusa } from "../../../contexts"
 import { UseQueryOptionsWrapper } from "../../../types"
 import { queryKeysFactory } from "../../utils/index"

packages/medusa-react/src/hooks/admin/return-reasons/mutations.ts

@@ -4,7 +4,11 @@ import {
   AdminReturnReasonsRes,
 } from "@medusajs/medusa"
 import { Response } from "@medusajs/medusa-js"
-import { useMutation, UseMutationOptions, useQueryClient } from "react-query"
+import {
+  useMutation,
+  UseMutationOptions,
+  useQueryClient,
+} from "@tanstack/react-query"
 import { adminReturnReasonKeys } from "."
 import { useMedusa } from "../../../contexts/medusa"
 import { buildOptions } from "../../utils/buildOptions"

packages/medusa-react/src/hooks/admin/return-reasons/queries.ts

@@ -3,7 +3,7 @@ import {
   AdminReturnReasonsRes,
 } from "@medusajs/medusa"
 import { Response } from "@medusajs/medusa-js"
-import { useQuery } from "react-query"
+import { useQuery } from "@tanstack/react-query"
 import { useMedusa } from "../../../contexts"
 import { UseQueryOptionsWrapper } from "../../../types"
 import { queryKeysFactory } from "../../utils/index"

packages/medusa-react/src/hooks/admin/returns/mutations.ts

@@ -4,7 +4,11 @@ import {
   AdminReturnsRes,
 } from "@medusajs/medusa"
 import { Response } from "@medusajs/medusa-js"
-import { useMutation, UseMutationOptions, useQueryClient } from "react-query"
+import {
+  useMutation,
+  UseMutationOptions,
+  useQueryClient,
+} from "@tanstack/react-query"
 import { useMedusa } from "../../../contexts/medusa"
 import { buildOptions } from "../../utils/buildOptions"
 import { adminReturnKeys } from "./queries"
@@ -21,7 +25,7 @@ export const useAdminReceiveReturn = (
   const queryClient = useQueryClient()
 
   return useMutation(
-    payload => client.admin.returns.receive(id, payload),
+    (payload) => client.admin.returns.receive(id, payload),
     buildOptions(
       queryClient,
       [adminReturnKeys.detail(id), adminReturnKeys.list()],

packages/medusa-react/src/hooks/admin/returns/queries.ts

@@ -1,6 +1,6 @@
 import { AdminReturnsListRes } from "@medusajs/medusa"
 import { Response } from "@medusajs/medusa-js"
-import { useQuery } from "react-query"
+import { useQuery } from "@tanstack/react-query"
 import { useMedusa } from "../../../contexts"
 import { UseQueryOptionsWrapper } from "../../../types"
 import { queryKeysFactory } from "../../utils/index"

packages/medusa-react/src/hooks/admin/sales-channels/mutations.ts

@@ -1,13 +1,17 @@
 import {
-  AdminPostSalesChannelsReq,
-  AdminSalesChannelsRes,
-  AdminPostSalesChannelsSalesChannelReq,
-  AdminSalesChannelsDeleteRes,
   AdminDeleteSalesChannelsChannelProductsBatchReq,
   AdminPostSalesChannelsChannelProductsBatchReq,
+  AdminPostSalesChannelsReq,
+  AdminPostSalesChannelsSalesChannelReq,
+  AdminSalesChannelsDeleteRes,
+  AdminSalesChannelsRes,
 } from "@medusajs/medusa"
 import { Response } from "@medusajs/medusa-js"
-import { useMutation, UseMutationOptions, useQueryClient } from "react-query"
+import {
+  useMutation,
+  UseMutationOptions,
+  useQueryClient,
+} from "@tanstack/react-query"
 
 import { useMedusa } from "../../../contexts"
 import { buildOptions } from "../../utils/buildOptions"

packages/medusa-react/src/hooks/admin/sales-channels/queries.ts

@@ -1,10 +1,10 @@
 import {
-  AdminSalesChannelsRes,
-  AdminSalesChannelsListRes,
   AdminGetSalesChannelsParams,
+  AdminSalesChannelsListRes,
+  AdminSalesChannelsRes,
 } from "@medusajs/medusa"
 import { Response } from "@medusajs/medusa-js"
-import { useQuery } from "react-query"
+import { useQuery } from "@tanstack/react-query"
 import { useMedusa } from "../../../contexts"
 import { UseQueryOptionsWrapper } from "../../../types"
 import { queryKeysFactory } from "../../utils"

packages/medusa-react/src/hooks/admin/shipping-options/mutations.ts

@@ -1,13 +1,17 @@
-import { adminShippingOptionKeys } from "./queries"
 import {
   AdminPostShippingOptionsOptionReq,
   AdminPostShippingOptionsReq,
   AdminShippingOptionsRes,
 } from "@medusajs/medusa"
 import { Response } from "@medusajs/medusa-js"
-import { useMutation, UseMutationOptions, useQueryClient } from "react-query"
+import {
+  useMutation,
+  UseMutationOptions,
+  useQueryClient,
+} from "@tanstack/react-query"
 import { useMedusa } from "../../../contexts/medusa"
 import { buildOptions } from "../../utils/buildOptions"
+import { adminShippingOptionKeys } from "./queries"
 
 export const useAdminCreateShippingOption = (
   options?: UseMutationOptions<

packages/medusa-react/src/hooks/admin/shipping-options/queries.ts

@@ -4,7 +4,7 @@ import {
   AdminShippingOptionsRes,
 } from "@medusajs/medusa"
 import { Response } from "@medusajs/medusa-js"
-import { useQuery } from "react-query"
+import { useQuery } from "@tanstack/react-query"
 import { useMedusa } from "../../../contexts"
 import { UseQueryOptionsWrapper } from "../../../types"
 import { queryKeysFactory } from "../../utils/index"

packages/medusa-react/src/hooks/admin/shipping-profiles/mutations.ts

@@ -1,13 +1,17 @@
-import { adminShippingProfileKeys } from "./queries"
 import {
   AdminDeleteShippingProfileRes,
   AdminPostShippingProfilesReq,
   AdminShippingProfilesRes,
 } from "@medusajs/medusa"
 import { Response } from "@medusajs/medusa-js"
-import { useMutation, UseMutationOptions, useQueryClient } from "react-query"
+import {
+  useMutation,
+  UseMutationOptions,
+  useQueryClient,
+} from "@tanstack/react-query"
 import { useMedusa } from "../../../contexts/medusa"
 import { buildOptions } from "../../utils/buildOptions"
+import { adminShippingProfileKeys } from "./queries"
 
 export const useAdminCreateShippingProfile = (
   options?: UseMutationOptions<

packages/medusa-react/src/hooks/admin/shipping-profiles/queries.ts

@@ -3,7 +3,7 @@ import {
   AdminShippingProfilesRes,
 } from "@medusajs/medusa"
 import { Response } from "@medusajs/medusa-js"
-import { useQuery } from "react-query"
+import { useQuery } from "@tanstack/react-query"
 import { useMedusa } from "../../../contexts"
 import { UseQueryOptionsWrapper } from "../../../types"
 import { queryKeysFactory } from "../../utils/index"

packages/medusa-react/src/hooks/admin/store/mutations.ts

@@ -1,9 +1,13 @@
-import { adminStoreKeys } from "./queries"
 import { AdminPostStoreReq, AdminStoresRes } from "@medusajs/medusa"
 import { Response } from "@medusajs/medusa-js"
-import { useMutation, UseMutationOptions, useQueryClient } from "react-query"
+import {
+  useMutation,
+  UseMutationOptions,
+  useQueryClient,
+} from "@tanstack/react-query"
 import { useMedusa } from "../../../contexts/medusa"
 import { buildOptions } from "../../utils/buildOptions"
+import { adminStoreKeys } from "./queries"
 
 export const useAdminUpdateStore = (
   options?: UseMutationOptions<

packages/medusa-react/src/hooks/admin/store/queries.ts

@@ -1,10 +1,10 @@
 import {
-  AdminTaxProvidersList,
   AdminPaymentProvidersList,
   AdminStoresRes,
+  AdminTaxProvidersList,
 } from "@medusajs/medusa"
 import { Response } from "@medusajs/medusa-js"
-import { useQuery } from "react-query"
+import { useQuery } from "@tanstack/react-query"
 import { useMedusa } from "../../../contexts"
 import { UseQueryOptionsWrapper } from "../../../types"
 import { queryKeysFactory } from "../../utils/index"

packages/medusa-react/src/hooks/admin/swaps/mutations.ts

@@ -5,7 +5,11 @@ import {
   AdminPostOrdersOrderSwapsSwapShipmentsReq,
 } from "@medusajs/medusa"
 import { Response } from "@medusajs/medusa-js"
-import { useMutation, UseMutationOptions, useQueryClient } from "react-query"
+import {
+  useMutation,
+  UseMutationOptions,
+  useQueryClient,
+} from "@tanstack/react-query"
 import { adminOrderKeys } from ".."
 import { useMedusa } from "../../../contexts/medusa"
 import { buildOptions } from "../../utils/buildOptions"

packages/medusa-react/src/hooks/admin/swaps/queries.ts

@@ -1,10 +1,10 @@
 import {
+  AdminGetSwapsParams,
   AdminSwapsListRes,
   AdminSwapsRes,
-  AdminGetSwapsParams,
 } from "@medusajs/medusa"
 import { Response } from "@medusajs/medusa-js"
-import { useQuery } from "react-query"
+import { useQuery } from "@tanstack/react-query"
 import { useMedusa } from "../../../contexts"
 import { UseQueryOptionsWrapper } from "../../../types"
 import { queryKeysFactory } from "../../utils/index"

packages/medusa-react/src/hooks/admin/tax-rates/mutations.ts

@@ -1,20 +1,24 @@
-import { adminTaxRateKeys } from "./queries"
 import {
-  AdminTaxRatesRes,
-  AdminTaxRatesDeleteRes,
   AdminDeleteTaxRatesTaxRateProductsReq,
   AdminDeleteTaxRatesTaxRateProductTypesReq,
   AdminDeleteTaxRatesTaxRateShippingOptionsReq,
   AdminPostTaxRatesReq,
-  AdminPostTaxRatesTaxRateReq,
   AdminPostTaxRatesTaxRateProductsReq,
   AdminPostTaxRatesTaxRateProductTypesReq,
+  AdminPostTaxRatesTaxRateReq,
   AdminPostTaxRatesTaxRateShippingOptionsReq,
+  AdminTaxRatesDeleteRes,
+  AdminTaxRatesRes,
 } from "@medusajs/medusa"
 import { Response } from "@medusajs/medusa-js"
-import { useMutation, UseMutationOptions, useQueryClient } from "react-query"
+import {
+  useMutation,
+  UseMutationOptions,
+  useQueryClient,
+} from "@tanstack/react-query"
 import { useMedusa } from "../../../contexts/medusa"
 import { buildOptions } from "../../utils/buildOptions"
+import { adminTaxRateKeys } from "./queries"
 
 export const useAdminCreateTaxRate = (
   options?: UseMutationOptions<

packages/medusa-react/src/hooks/admin/tax-rates/queries.ts

@@ -1,10 +1,10 @@
 import {
-  AdminTaxRatesRes,
-  AdminTaxRatesListRes,
   AdminGetTaxRatesParams,
+  AdminTaxRatesListRes,
+  AdminTaxRatesRes,
 } from "@medusajs/medusa"
 import { Response } from "@medusajs/medusa-js"
-import { useQuery } from "react-query"
+import { useQuery } from "@tanstack/react-query"
 import { useMedusa } from "../../../contexts"
 import { UseQueryOptionsWrapper } from "../../../types"
 import { queryKeysFactory } from "../../utils/index"

packages/medusa-react/src/hooks/admin/uploads/mutations.ts

@@ -1,13 +1,17 @@
 import {
   AdminDeleteUploadsReq,
-  IAdminPostUploadsFileReq,
   AdminDeleteUploadsRes,
   AdminPostUploadsDownloadUrlReq,
   AdminUploadsDownloadUrlRes,
   AdminUploadsRes,
+  IAdminPostUploadsFileReq,
 } from "@medusajs/medusa"
 import { Response } from "@medusajs/medusa-js"
-import { useMutation, UseMutationOptions, useQueryClient } from "react-query"
+import {
+  useMutation,
+  UseMutationOptions,
+  useQueryClient,
+} from "@tanstack/react-query"
 import { useMedusa } from "../../../contexts"
 import { buildOptions } from "../../utils/buildOptions"
 

packages/medusa-react/src/hooks/admin/users/mutations.ts

@@ -9,7 +9,11 @@ import {
   AdminUpdateUserPayload,
   Response,
 } from "@medusajs/medusa-js"
-import { useMutation, UseMutationOptions, useQueryClient } from "react-query"
+import {
+  useMutation,
+  UseMutationOptions,
+  useQueryClient,
+} from "@tanstack/react-query"
 import { adminCustomerKeys } from ".."
 import { useMedusa } from "../../../contexts/medusa"
 import { buildOptions } from "../../utils/buildOptions"

packages/medusa-react/src/hooks/admin/users/queries.ts

@@ -1,6 +1,6 @@
-import { AdminUsersListRes, AdminUserRes } from "@medusajs/medusa"
+import { AdminUserRes, AdminUsersListRes } from "@medusajs/medusa"
 import { Response } from "@medusajs/medusa-js"
-import { useQuery } from "react-query"
+import { useQuery } from "@tanstack/react-query"
 import { useMedusa } from "../../../contexts"
 import { UseQueryOptionsWrapper } from "../../../types"
 import { queryKeysFactory } from "../../utils/index"

packages/medusa-react/src/hooks/admin/variants/queries.ts

@@ -1,6 +1,6 @@
-import { AdminVariantsListRes, AdminGetVariantsParams } from "@medusajs/medusa"
+import { AdminGetVariantsParams, AdminVariantsListRes } from "@medusajs/medusa"
 import { Response } from "@medusajs/medusa-js"
-import { useQuery } from "react-query"
+import { useQuery } from "@tanstack/react-query"
 import { useMedusa } from "../../../contexts"
 import { UseQueryOptionsWrapper } from "../../../types"
 import { queryKeysFactory } from "../../utils/index"

packages/medusa-react/src/hooks/store/carts/mutations.ts

@@ -7,7 +7,7 @@ import {
   StorePostCartsCartReq,
   StorePostCartsCartShippingMethodReq,
 } from "@medusajs/medusa"
-import { useMutation, UseMutationOptions } from "react-query"
+import { useMutation, UseMutationOptions } from "@tanstack/react-query"
 import { useMedusa } from "../../../contexts/medusa"
 
 export const useCreateCart = (

packages/medusa-react/src/hooks/store/carts/queries.ts

@@ -1,9 +1,9 @@
-import { queryKeysFactory } from "../../utils/index"
 import { StoreCartsRes } from "@medusajs/medusa"
 import { Response } from "@medusajs/medusa-js"
-import { useQuery } from "react-query"
+import { useQuery } from "@tanstack/react-query"
 import { useMedusa } from "../../../contexts/medusa"
 import { UseQueryOptionsWrapper } from "../../../types"
+import { queryKeysFactory } from "../../utils/index"
 
 const CARTS_QUERY_KEY = `carts` as const
 

packages/medusa-react/src/hooks/store/collections/queries.ts

@@ -4,7 +4,7 @@ import {
   StoreGetCollectionsParams,
 } from "@medusajs/medusa"
 import { Response } from "@medusajs/medusa-js"
-import { useQuery } from "react-query"
+import { useQuery } from "@tanstack/react-query"
 import { useMedusa } from "../../../contexts/medusa"
 import { UseQueryOptionsWrapper } from "../../../types"
 import { queryKeysFactory } from "../../utils/index"

packages/medusa-react/src/hooks/store/customers/mutations.ts

@@ -3,7 +3,7 @@ import {
   StorePostCustomersCustomerReq,
   StorePostCustomersReq,
 } from "@medusajs/medusa"
-import { useMutation, UseMutationOptions } from "react-query"
+import { useMutation, UseMutationOptions } from "@tanstack/react-query"
 import { useMedusa } from "../../../contexts/medusa"
 
 export const useCreateCustomer = (

packages/medusa-react/src/hooks/store/customers/queries.ts

@@ -3,8 +3,8 @@ import {
   StoreCustomersRes,
   StoreGetCustomersCustomerOrdersParams,
 } from "@medusajs/medusa"
-import { useQuery } from "react-query"
 import { Response } from "@medusajs/medusa-js"
+import { useQuery } from "@tanstack/react-query"
 import { useMedusa } from "../../../contexts"
 import { UseQueryOptionsWrapper } from "../../../types"
 import { queryKeysFactory } from "../../utils/index"

packages/medusa-react/src/hooks/store/gift-cards/queries.ts

@@ -1,9 +1,9 @@
-import { queryKeysFactory } from "../../utils/index"
 import { StoreGiftCardsRes } from "@medusajs/medusa"
 import { Response } from "@medusajs/medusa-js"
-import { useQuery } from "react-query"
+import { useQuery } from "@tanstack/react-query"
 import { useMedusa } from "../../../contexts"
 import { UseQueryOptionsWrapper } from "../../../types"
+import { queryKeysFactory } from "../../utils/index"
 
 const GIFT_CARDS_QUERY_KEY = `gift_cards` as const
 

packages/medusa-react/src/hooks/store/line-items/mutations.ts

@@ -1,9 +1,9 @@
 import {
   StoreCartsRes,
-  StorePostCartsCartLineItemsReq,
   StorePostCartsCartLineItemsItemReq,
+  StorePostCartsCartLineItemsReq,
 } from "@medusajs/medusa"
-import { useMutation, UseMutationOptions } from "react-query"
+import { useMutation, UseMutationOptions } from "@tanstack/react-query"
 import { useMedusa } from "../../../contexts"
 
 export const useCreateLineItem = (

packages/medusa-react/src/hooks/store/order-edits/mutations.ts

@@ -1,14 +1,18 @@
-import { useMutation, UseMutationOptions, useQueryClient } from "react-query"
 import { Response } from "@medusajs/medusa-js"
+import {
+  useMutation,
+  UseMutationOptions,
+  useQueryClient,
+} from "@tanstack/react-query"
 
 import {
   StoreOrderEditsRes,
   StorePostOrderEditsOrderEditDecline,
 } from "@medusajs/medusa"
 
-import { buildOptions } from "../../utils/buildOptions"
-import { useMedusa } from "../../../contexts"
 import { orderEditQueryKeys } from "."
+import { useMedusa } from "../../../contexts"
+import { buildOptions } from "../../utils/buildOptions"
 
 export const useDeclineOrderEdit = (
   id: string,

packages/medusa-react/src/hooks/store/order-edits/queries.ts

@@ -1,9 +1,9 @@
-import { queryKeysFactory } from "../../utils"
 import { StoreOrderEditsRes } from "@medusajs/medusa"
-import { useQuery } from "react-query"
+import { Response } from "@medusajs/medusa-js"
+import { useQuery } from "@tanstack/react-query"
 import { useMedusa } from "../../../contexts"
 import { UseQueryOptionsWrapper } from "../../../types"
-import { Response } from "@medusajs/medusa-js"
+import { queryKeysFactory } from "../../utils"
 
 const ORDER_EDITS_QUERY_KEY = `orderEdit` as const
 

packages/medusa-react/src/hooks/store/orders/mutations.ts

@@ -1,14 +1,18 @@
-import { useMutation, UseMutationOptions, useQueryClient } from "react-query"
 import { Response } from "@medusajs/medusa-js"
+import {
+  useMutation,
+  UseMutationOptions,
+  useQueryClient,
+} from "@tanstack/react-query"
 
 import {
   StorePostCustomersCustomerAcceptClaimReq,
   StorePostCustomersCustomerOrderClaimReq,
 } from "@medusajs/medusa"
 
-import { buildOptions } from "../../utils/buildOptions"
-import { useMedusa } from "../../../contexts"
 import { orderKeys } from "."
+import { useMedusa } from "../../../contexts"
+import { buildOptions } from "../../utils/buildOptions"
 
 export const useRequestOrderAccess = (
   options?: UseMutationOptions<

packages/medusa-react/src/hooks/store/orders/queries.ts

@@ -1,9 +1,9 @@
-import { queryKeysFactory } from "../../utils/index"
-import { StoreOrdersRes, StoreGetOrdersParams } from "@medusajs/medusa"
-import { useQuery } from "react-query"
+import { StoreGetOrdersParams, StoreOrdersRes } from "@medusajs/medusa"
+import { Response } from "@medusajs/medusa-js"
+import { useQuery } from "@tanstack/react-query"
 import { useMedusa } from "../../../contexts"
 import { UseQueryOptionsWrapper } from "../../../types"
-import { Response } from "@medusajs/medusa-js"
+import { queryKeysFactory } from "../../utils/index"
 
 const ORDERS_QUERY_KEY = `orders` as const
 

packages/medusa-react/src/hooks/store/payment-collections/mutations.ts

@@ -1,17 +1,21 @@
-import { useMutation, UseMutationOptions, useQueryClient } from "react-query"
 import { Response } from "@medusajs/medusa-js"
+import {
+  useMutation,
+  UseMutationOptions,
+  useQueryClient,
+} from "@tanstack/react-query"
 
 import {
-  StorePaymentCollectionsRes,
-  StorePostPaymentCollectionsBatchSessionsReq,
-  StorePostPaymentCollectionsBatchSessionsAuthorizeReq,
   StorePaymentCollectionSessionsReq,
+  StorePaymentCollectionsRes,
   StorePaymentCollectionsSessionRes,
+  StorePostPaymentCollectionsBatchSessionsAuthorizeReq,
+  StorePostPaymentCollectionsBatchSessionsReq,
 } from "@medusajs/medusa"
 
-import { buildOptions } from "../../utils/buildOptions"
-import { useMedusa } from "../../../contexts"
 import { paymentCollectionQueryKeys } from "."
+import { useMedusa } from "../../../contexts"
+import { buildOptions } from "../../utils/buildOptions"
 
 export const useManageMultiplePaymentSessions = (
   id: string,

packages/medusa-react/src/hooks/store/payment-collections/queries.ts

@@ -1,9 +1,9 @@
-import { queryKeysFactory } from "../../utils"
 import { StorePaymentCollectionsRes } from "@medusajs/medusa"
-import { useQuery } from "react-query"
+import { Response } from "@medusajs/medusa-js"
+import { useQuery } from "@tanstack/react-query"
 import { useMedusa } from "../../../contexts"
 import { UseQueryOptionsWrapper } from "../../../types"
-import { Response } from "@medusajs/medusa-js"
+import { queryKeysFactory } from "../../utils"
 
 const PAYMENT_COLLECTION_QUERY_KEY = `paymentCollection` as const
 

packages/medusa-react/src/hooks/store/product-types/queries.ts

@@ -3,7 +3,7 @@ import {
   StoreProductTypesListRes,
 } from "@medusajs/medusa"
 import { Response } from "@medusajs/medusa-js"
-import { useQuery } from "react-query"
+import { useQuery } from "@tanstack/react-query"
 import { useMedusa } from "../../../contexts"
 import { UseQueryOptionsWrapper } from "../../../types"
 import { queryKeysFactory } from "../../utils"

packages/medusa-react/src/hooks/store/products/queries.ts

@@ -1,10 +1,10 @@
-import { Response } from "@medusajs/medusa-js"
 import {
   StoreGetProductsParams,
   StoreProductsListRes,
   StoreProductsRes,
 } from "@medusajs/medusa"
-import { useQuery } from "react-query"
+import { Response } from "@medusajs/medusa-js"
+import { useQuery } from "@tanstack/react-query"
 import { useMedusa } from "../../../contexts"
 import { UseQueryOptionsWrapper } from "../../../types"
 import { queryKeysFactory } from "../../utils/index"

packages/medusa-react/src/hooks/store/regions/queries.ts

@@ -1,9 +1,9 @@
-import { queryKeysFactory } from "../../utils/index"
-import { UseQueryOptionsWrapper } from "../../../types"
-import { useQuery } from "react-query"
-import { useMedusa } from "../../../contexts"
-import { StoreRegionsRes, StoreRegionsListRes } from "@medusajs/medusa"
+import { StoreRegionsListRes, StoreRegionsRes } from "@medusajs/medusa"
 import { Response } from "@medusajs/medusa-js"
+import { useQuery } from "@tanstack/react-query"
+import { useMedusa } from "../../../contexts"
+import { UseQueryOptionsWrapper } from "../../../types"
+import { queryKeysFactory } from "../../utils/index"
 
 const REGIONS_QUERY_KEY = `regions` as const
 

packages/medusa-react/src/hooks/store/return-reasons/queries.ts

@@ -1,12 +1,12 @@
-import { queryKeysFactory } from "../../utils/index"
 import {
   StoreReturnReasonsListRes,
   StoreReturnReasonsRes,
 } from "@medusajs/medusa"
 import { Response } from "@medusajs/medusa-js"
-import { useQuery } from "react-query"
+import { useQuery } from "@tanstack/react-query"
 import { useMedusa } from "../../../contexts"
 import { UseQueryOptionsWrapper } from "../../../types"
+import { queryKeysFactory } from "../../utils/index"
 
 const RETURNS_REASONS_QUERY_KEY = `return_reasons` as const
 

packages/medusa-react/src/hooks/store/returns/mutations.ts

@@ -1,5 +1,5 @@
-import { StoreReturnsRes, StorePostReturnsReq } from "@medusajs/medusa"
-import { useMutation, UseMutationOptions } from "react-query"
+import { StorePostReturnsReq, StoreReturnsRes } from "@medusajs/medusa"
+import { useMutation, UseMutationOptions } from "@tanstack/react-query"
 import { useMedusa } from "../../../contexts"
 
 export const useCreateReturn = (

packages/medusa-react/src/hooks/store/shipping-options/queries.ts

@@ -1,12 +1,12 @@
-import { queryKeysFactory } from "../../utils/index"
-import { UseQueryOptionsWrapper } from "../../../types"
-import { useQuery } from "react-query"
-import { useMedusa } from "../../../contexts"
 import {
-  StoreShippingOptionsListRes,
   StoreGetShippingOptionsParams,
+  StoreShippingOptionsListRes,
 } from "@medusajs/medusa"
 import { Response } from "@medusajs/medusa-js"
+import { useQuery } from "@tanstack/react-query"
+import { useMedusa } from "../../../contexts"
+import { UseQueryOptionsWrapper } from "../../../types"
+import { queryKeysFactory } from "../../utils/index"
 
 const SHIPPING_OPTION_QUERY_KEY = `shipping_options` as const
 

packages/medusa-react/src/hooks/store/swaps/mutations.ts

@@ -1,5 +1,5 @@
-import { StoreSwapsRes, StorePostSwapsReq } from "@medusajs/medusa"
-import { useMutation, UseMutationOptions } from "react-query"
+import { StorePostSwapsReq, StoreSwapsRes } from "@medusajs/medusa"
+import { useMutation, UseMutationOptions } from "@tanstack/react-query"
 import { useMedusa } from "../../../contexts"
 
 export const useCreateSwap = (

packages/medusa-react/src/hooks/store/swaps/queries.ts

@@ -1,9 +1,9 @@
-import { queryKeysFactory } from "../../utils/index"
 import { StoreSwapsRes } from "@medusajs/medusa"
 import { Response } from "@medusajs/medusa-js"
-import { useQuery } from "react-query"
+import { useQuery } from "@tanstack/react-query"
 import { useMedusa } from "../../../contexts"
 import { UseQueryOptionsWrapper } from "../../../types"
+import { queryKeysFactory } from "../../utils/index"
 
 const SWAPS_QUERY_KEY = `swaps` as const
 

packages/medusa-react/src/hooks/utils/buildOptions.ts

@@ -1,14 +1,18 @@
-import { QueryClient, QueryKey, UseMutationOptions } from "react-query"
+import {
+  QueryClient,
+  QueryKey,
+  UseMutationOptions,
+} from "@tanstack/react-query"
 
 export const buildOptions = <
   TData,
   TError,
   TVariables,
   TContext,
-  TKey extends Array<QueryKey>
+  TKey extends QueryKey
 >(
   queryClient: QueryClient,
-  queryKey?: TKey[] | TKey,
+  queryKey?: TKey,
   options?: UseMutationOptions<TData, TError, TVariables, TContext>
 ): UseMutationOptions<TData, TError, TVariables, TContext> => {
   return {
@@ -19,11 +23,7 @@ export const buildOptions = <
       }
 
       if (queryKey !== undefined) {
-        if (queryKey.filter(Array.isArray).length > 0) {
-          queryKey.forEach(key => queryClient.invalidateQueries(key))
-        } else {
-          queryClient.invalidateQueries(queryKey)
-        }
+        queryClient.invalidateQueries(queryKey)
       }
     },
   }

packages/medusa-react/src/types.ts

@@ -3,7 +3,7 @@ import {
   Region,
   StoreCartsRes,
 } from "@medusajs/medusa"
-import { QueryKey, UseQueryOptions } from "react-query"
+import { QueryKey, UseQueryOptions } from "@tanstack/react-query"
 
 export type UseQueryOptionsWrapper<
   // Return type of queryFn

packages/medusa-react/test/utils.tsx

@@ -1,10 +1,10 @@
+import { QueryClient } from "@tanstack/react-query"
 import * as React from "react"
-import { QueryClient } from "react-query"
 import {
-  SessionCartProvider,
-  SessionCartState,
   CartProvider,
   MedusaProvider,
+  SessionCartProvider,
+  SessionCartState,
 } from "../src"
 import { Cart } from "../src/types"