base commit

client/src/features/cart/add-to-cart/ui/AddToCartButton.tsx

@@ -0,0 +1,37 @@
+import Button from '@mui/material/Button'
+import type { ButtonProps } from '@mui/material/Button'
+import { useMutation, useQueryClient } from '@tanstack/react-query'
+import { useUnit } from 'effector-react'
+import { addToCart } from '@/entities/cart/api/cart-api'
+import { $user } from '@/shared/model/auth'
+
+type Props = {
+  productId: string
+  qty?: number
+  loggedOutLabel?: string
+} & Omit<ButtonProps, 'onClick'>
+
+export function AddToCartButton(props: Props) {
+  const { productId, qty = 1, loggedOutLabel = 'Войдите, чтобы купить', disabled, children, ...rest } = props
+  const qc = useQueryClient()
+  const user = useUnit($user)
+
+  const addMut = useMutation({
+    mutationFn: () => addToCart({ productId, qty }),
+    onSuccess: () => void qc.invalidateQueries({ queryKey: ['me', 'cart'] }),
+  })
+
+  return (
+    <Button
+      {...rest}
+      disabled={Boolean(disabled) || !user || addMut.isPending}
+      onClick={(e) => {
+        e.preventDefault()
+        e.stopPropagation()
+        addMut.mutate()
+      }}
+    >
+      {user ? (children ?? 'В корзину') : loggedOutLabel}
+    </Button>
+  )
+}