diff --git a/screens/recipes/Recipe.tsx b/screens/recipes/Recipe.tsx index 978da9e..bfb6734 100644 --- a/screens/recipes/Recipe.tsx +++ b/screens/recipes/Recipe.tsx @@ -1,10 +1,10 @@ import React from "react"; import { View, ScrollView, Text } from "react-native"; -import { useQuery, useMutation, useQueryClient } from "@tanstack/react-query"; -import { getNugget, updateNugget } from "@/supabase/supabase-queries"; +import { useQuery } from "@tanstack/react-query"; +import { useUpdateRecipe } from "./useUpdateRecipe"; +import { getNugget } from "@/supabase/supabase-queries"; import { gs } from "@/global-styles"; import EditableTextInputWithCancelSave from "@/components/EditableTextInputWithCancelSave"; -import { Tables } from "@/supabase/database.types"; import EditableTODOSwitch from "@/components/EditableTODOSwitch"; interface Props { @@ -12,8 +12,6 @@ interface Props { } export default function Recipe({ nugget_id }: Props) { - const queryClient = useQueryClient(); - // Query: nugget_id const { data: nugget, @@ -24,13 +22,7 @@ export default function Recipe({ nugget_id }: Props) { queryKey: ["nugget", nugget_id], }); - const updateNuggetMutation = useMutation({ - mutationFn: (new_nugget: Tables<"Nuggets">) => updateNugget(new_nugget), - onSuccess: () => { - queryClient.invalidateQueries({ queryKey: ["nugget", nugget_id] }); - queryClient.invalidateQueries({ queryKey: ["nuggets"] }); - }, - }); + const updateNuggetMutation = useUpdateRecipe(Number(nugget_id)); if (isPending) return Loading recipe...; if (error) @@ -41,6 +33,7 @@ export default function Recipe({ nugget_id }: Props) { ); return ( + Shelved { diff --git a/screens/recipes/useUpdateRecipe.tsx b/screens/recipes/useUpdateRecipe.tsx new file mode 100644 index 0000000..219e4d4 --- /dev/null +++ b/screens/recipes/useUpdateRecipe.tsx @@ -0,0 +1,16 @@ +import { useQueryClient, useMutation } from "@tanstack/react-query"; +import { updateNugget } from "@/supabase/supabase-queries"; +import { Tables } from "@/supabase/database.types"; + +export function useUpdateRecipe(nugget_id: number) { + const queryClient = useQueryClient(); + return useMutation({ + mutationFn: (new_nugget: Tables<"Nuggets">) => updateNugget(new_nugget), + onSuccess: () => { + queryClient.invalidateQueries({ + queryKey: ["nugget", nugget_id], + }); + queryClient.invalidateQueries({ queryKey: ["nuggets"] }); + }, + }); +}