/
MariaTsys
/
courseworkPP
Обзор
Документация
Войти
/
MariaTsys
/
courseworkPP
Код
Запросы
0
Задачи
Вики
Пакеты
0
Релизы
0
CI/CD
Аналитика
Безопасность
master
src/app/_components/book/AddToCollectionButton.tsx
57 строк
1 KB
Maria
first_commit
09 май 2025, 12:17
09 май 2025, 12:17
af55308
Код
Авторство
О чём код?
"use client"; import { useState, useEffect } from "react"; import { api } from "~/trpc/react"; type Props = { bookId: string; }; export const AddToCollectionButton = ({ bookId }: Props) => { const [added, setAdded] = useState(false); const utils = api.useUtils(); const { data: isInCollection, isLoading } = api.bookStatus.isInCollection.useQuery( { bookId }, { refetchOnWindowFocus: false } ); const add = api.bookStatus.addToCollection.useMutation({ onSuccess: () => { setAdded(true); utils.bookStatus.isInCollection.invalidate({ bookId }); }, }); const remove = api.bookStatus.removeFromCollection.useMutation({ onSuccess: () => { setAdded(false); utils.bookStatus.isInCollection.invalidate({ bookId }); }, }); useEffect(() => { if (isInCollection !== undefined) { setAdded(isInCollection); } }, [isInCollection]); const handleClick = () => { if (added) { remove.mutate({ bookId }); } else { add.mutate({ bookId }); } }; return ( <button onClick={handleClick} disabled={isLoading} className={`btn ${added ? "btn-outline" : "btn-primary"}`} > {added ? "Удалить из коллекции" : "Добавить в коллекцию"} </button> ); };