refactor: extract useCartQuery hook

client/src/entities/cart/lib/use-cart-query.ts

@@ -0,0 +1,14 @@
+import { useQuery } from '@tanstack/react-query'
+import { useUnit } from 'effector-react'
+import { fetchMyCart } from '../api/cart-api'
+import { $user } from '@/shared/model/auth'
+
+export function useCartQuery() {
+  const user = useUnit($user)
+
+  return useQuery({
+    queryKey: ['me', 'cart'],
+    queryFn: fetchMyCart,
+    enabled: Boolean(user),
+  })
+}

client/src/features/cart/toggle-cart-icon/ui/ToggleCartIcon.tsx

@@ -1,10 +1,11 @@
 import IconButton from '@mui/material/IconButton'
 import Tooltip from '@mui/material/Tooltip'
-import { useMutation, useQuery, useQueryClient } from '@tanstack/react-query'
+import { useMutation, useQueryClient } from '@tanstack/react-query'
 import { useUnit } from 'effector-react'
 import { ShoppingCart } from 'lucide-react'
 import { useNavigate } from 'react-router-dom'
-import { addToCart, fetchMyCart, removeCartItem } from '@/entities/cart/api/cart-api'
+import { addToCart, removeCartItem } from '@/entities/cart/api/cart-api'
+import { useCartQuery } from '@/entities/cart/lib/use-cart-query'
 import { $user } from '@/shared/model/auth'
 import { addNotification } from '@/shared/model/notification'
 
@@ -18,11 +19,7 @@ export function ToggleCartIcon(props: {
   const qc = useQueryClient()
   const navigate = useNavigate()
 
-  const cartQuery = useQuery({
+  const cartQuery = useCartQuery()
-    queryKey: ['me', 'cart'],
-    queryFn: fetchMyCart,
-    enabled: Boolean(user),
-  })
 
   const existing = cartQuery.data?.items.find((x) => x.product.id === productId) ?? null
   const inCart = Boolean(existing)

client/src/pages/cart/ui/CartPage.tsx

@@ -6,11 +6,12 @@ import IconButton from '@mui/material/IconButton'
 import Stack from '@mui/material/Stack'
 import Tooltip from '@mui/material/Tooltip'
 import Typography from '@mui/material/Typography'
-import { useMutation, useQuery, useQueryClient } from '@tanstack/react-query'
+import { useMutation, useQueryClient } from '@tanstack/react-query'
 import { useUnit } from 'effector-react'
 import { Minus, Plus, Trash2 } from 'lucide-react'
 import { Link as RouterLink } from 'react-router-dom'
-import { fetchMyCart, removeCartItem, setCartQty } from '@/entities/cart/api/cart-api'
+import { removeCartItem, setCartQty } from '@/entities/cart/api/cart-api'
+import { useCartQuery } from '@/entities/cart/lib/use-cart-query'
 import { formatPriceRub } from '@/shared/lib/format-price'
 import { usePageTitle } from '@/shared/lib/use-page-title'
 import { $user } from '@/shared/model/auth'
@@ -20,11 +21,7 @@ export function CartPage() {
   const user = useUnit($user)
   const qc = useQueryClient()
 
-  const cartQuery = useQuery({
+  const cartQuery = useCartQuery()
-    queryKey: ['me', 'cart'],
-    queryFn: fetchMyCart,
-    enabled: Boolean(user),
-  })
 
   const qtyMut = useMutation({
     mutationFn: (params: { id: string; qty: number }) => setCartQty(params.id, params.qty),

client/src/pages/checkout/ui/CheckoutPage.tsx

@@ -16,8 +16,8 @@ import Typography from '@mui/material/Typography'
 import { useMutation, useQuery, useQueryClient } from '@tanstack/react-query'
 import { useUnit } from 'effector-react'
 import { Link as RouterLink, useNavigate } from 'react-router-dom'
-import { fetchMyCart } from '@/entities/cart/api/cart-api'
 import { createOrder } from '@/entities/order/api/order-api'
+import { useCartQuery } from '@/entities/cart/lib/use-cart-query'
 import { fetchMyAddresses } from '@/entities/user/api/address-api'
 import { DELIVERY_CARRIER_OPTIONS, type DeliveryCarrierCode } from '@/shared/constants/delivery-carrier'
 import { formatPriceRub } from '@/shared/lib/format-price'
@@ -34,11 +34,7 @@ export function CheckoutPage() {
   const [addressId, setAddressId] = useState('')
   const [comment, setComment] = useState('')
 
-  const cartQuery = useQuery({
+  const cartQuery = useCartQuery()
-    queryKey: ['me', 'cart'],
-    queryFn: fetchMyCart,
-    enabled: Boolean(user),
-  })
 
   const addressesQuery = useQuery({
     queryKey: ['me', 'addresses'],