mirror of
https://github.com/FranP-code/create-better-t-stack.git
synced 2025-10-12 23:52:15 +00:00
fix(todos): trpc v11 (#93)
* fix(todos): trpc v11 * Create chilly-owls-flash.md --------- Co-authored-by: Aman Varshney <amanvarshney.work@gmail.com>
This commit is contained in:
5
.changeset/chilly-owls-flash.md
Normal file
5
.changeset/chilly-owls-flash.md
Normal file
@@ -0,0 +1,5 @@
|
|||||||
|
---
|
||||||
|
"create-better-t-stack": patch
|
||||||
|
---
|
||||||
|
|
||||||
|
fix(todos): trpc v11
|
||||||
@@ -9,6 +9,7 @@ import {
|
|||||||
import { Checkbox } from "@/components/ui/checkbox";
|
import { Checkbox } from "@/components/ui/checkbox";
|
||||||
import { Input } from "@/components/ui/input";
|
import { Input } from "@/components/ui/input";
|
||||||
import { trpc } from "@/utils/trpc";
|
import { trpc } from "@/utils/trpc";
|
||||||
|
import { useMutation, useQuery } from "@tanstack/react-query";
|
||||||
import { createFileRoute } from "@tanstack/react-router";
|
import { createFileRoute } from "@tanstack/react-router";
|
||||||
import { Loader2, Trash2 } from "lucide-react";
|
import { Loader2, Trash2 } from "lucide-react";
|
||||||
import { useState } from "react";
|
import { useState } from "react";
|
||||||
@@ -20,19 +21,25 @@ export const Route = createFileRoute("/todos")({
|
|||||||
function TodosRoute() {
|
function TodosRoute() {
|
||||||
const [newTodoText, setNewTodoText] = useState("");
|
const [newTodoText, setNewTodoText] = useState("");
|
||||||
|
|
||||||
const todos = trpc.todo.getAll.useQuery();
|
const todos = useQuery(trpc.todo.getAll.queryOptions());
|
||||||
const createMutation = trpc.todo.create.useMutation({
|
const createMutation = useMutation(
|
||||||
|
trpc.todo.create.mutationOptions({
|
||||||
onSuccess: () => {
|
onSuccess: () => {
|
||||||
todos.refetch();
|
todos.refetch();
|
||||||
setNewTodoText("");
|
setNewTodoText("");
|
||||||
},
|
},
|
||||||
});
|
})
|
||||||
const toggleMutation = trpc.todo.toggle.useMutation({
|
);
|
||||||
|
const toggleMutation = useMutation(
|
||||||
|
trpc.todo.toggle.mutationOptions({
|
||||||
onSuccess: () => todos.refetch(),
|
onSuccess: () => todos.refetch(),
|
||||||
});
|
})
|
||||||
const deleteMutation = trpc.todo.delete.useMutation({
|
);
|
||||||
|
const deleteMutation = useMutation(
|
||||||
|
trpc.todo.delete.mutationOptions({
|
||||||
onSuccess: () => todos.refetch(),
|
onSuccess: () => todos.refetch(),
|
||||||
});
|
})
|
||||||
|
);
|
||||||
|
|
||||||
const handleAddTodo = (e: React.FormEvent) => {
|
const handleAddTodo = (e: React.FormEvent) => {
|
||||||
e.preventDefault();
|
e.preventDefault();
|
||||||
|
|||||||
Reference in New Issue
Block a user