diff --git a/src/api/getRecipe.ts b/src/api/getRecipe.ts
index 6d687b8..b18aa2b 100644
--- a/src/api/getRecipe.ts
+++ b/src/api/getRecipe.ts
@@ -3,6 +3,13 @@ import { ApiError } from './ApiError'
 import FullRecipeView, { RawFullRecipeView } from './types/FullRecipeView'
 import { toImageView } from './types/ImageView'
 
+export interface GetRecipeDeps {
+    token: string | null
+    username: string
+    slug: string
+    abortController: AbortController
+}
+
 const getRecipe = async (
     token: string | null,
     ownerUsername: string,
diff --git a/src/routes/recipes_/$username.$slug.tsx b/src/routes/recipes_/$username.$slug.tsx
index 7417d2e..044fb76 100644
--- a/src/routes/recipes_/$username.$slug.tsx
+++ b/src/routes/recipes_/$username.$slug.tsx
@@ -7,11 +7,16 @@ import getRecipe from '../../api/getRecipe'
 import Recipe from '../../pages/recipe/Recipe'
 
 export const Route = createFileRoute('/recipes/$username/$slug')({
-    loader: ({ context, params }) =>
+    loader: ({ abortController, context, params }) =>
         context.queryClient.ensureQueryData({
             queryKey: ['recipe', params.username, params.slug],
             queryFn: () =>
-                getRecipe(context.auth.token, params.username, params.slug)
+                getRecipe({
+                    abortController,
+                    token: context.auth.token,
+                    username: params.username,
+                    slug: params.slug
+                })
         }),
     component() {
         const recipe = useLoaderData({