diff --git a/client/src/entities/cart/lib/use-cart-query.ts b/client/src/entities/cart/lib/use-cart-query.ts new file mode 100644 index 0000000..614d1e1 --- /dev/null +++ b/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), + }) +} diff --git a/client/src/features/cart/toggle-cart-icon/ui/ToggleCartIcon.tsx b/client/src/features/cart/toggle-cart-icon/ui/ToggleCartIcon.tsx index fe51801..1d13fc4 100644 --- a/client/src/features/cart/toggle-cart-icon/ui/ToggleCartIcon.tsx +++ b/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({ - queryKey: ['me', 'cart'], - queryFn: fetchMyCart, - enabled: Boolean(user), - }) + const cartQuery = useCartQuery() const existing = cartQuery.data?.items.find((x) => x.product.id === productId) ?? null const inCart = Boolean(existing) diff --git a/client/src/pages/cart/ui/CartPage.tsx b/client/src/pages/cart/ui/CartPage.tsx index 5f8ff40..0b7bc63 100644 --- a/client/src/pages/cart/ui/CartPage.tsx +++ b/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({ - queryKey: ['me', 'cart'], - queryFn: fetchMyCart, - enabled: Boolean(user), - }) + const cartQuery = useCartQuery() const qtyMut = useMutation({ mutationFn: (params: { id: string; qty: number }) => setCartQty(params.id, params.qty), diff --git a/client/src/pages/checkout/ui/CheckoutPage.tsx b/client/src/pages/checkout/ui/CheckoutPage.tsx index fa0edb2..03eb7ab 100644 --- a/client/src/pages/checkout/ui/CheckoutPage.tsx +++ b/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({ - queryKey: ['me', 'cart'], - queryFn: fetchMyCart, - enabled: Boolean(user), - }) + const cartQuery = useCartQuery() const addressesQuery = useQuery({ queryKey: ['me', 'addresses'],