From e328b64043a6b477bad2e3de07a6b26958f05be6 Mon Sep 17 00:00:00 2001
From: Jesse Brault <jbrault@mac.com>
Date: Wed, 14 Aug 2024 20:50:24 -0500
Subject: [PATCH] Explicitly annotated type of router in main.tsx. Added recipe
 edit route.

---
 src/main.tsx                                  |  6 +++---
 src/routeTree.gen.ts                          | 20 ++++++++++++++++++-
 src/routes/recipes_/$username.$slug_/edit.tsx |  5 +++++
 3 files changed, 27 insertions(+), 4 deletions(-)
 create mode 100644 src/routes/recipes_/$username.$slug_/edit.tsx

diff --git a/src/main.tsx b/src/main.tsx
index aff3b6c..9569bfb 100644
--- a/src/main.tsx
+++ b/src/main.tsx
@@ -1,6 +1,6 @@
 import { library } from '@fortawesome/fontawesome-svg-core'
 import { fas } from '@fortawesome/free-solid-svg-icons'
-import { RouterProvider, createRouter } from '@tanstack/react-router'
+import { Router, RouterProvider, createRouter } from '@tanstack/react-router'
 import React from 'react'
 import ReactDOM from 'react-dom/client'
 import { AuthProvider, useAuth } from './auth'
@@ -12,8 +12,8 @@ import { routeTree } from './routeTree.gen'
 library.add(fas)
 
 // Create router
-// Must be `any` because TS complains otherwise
-const router: any = createRouter({
+// Type must be explicitly annotated otherwise TS complains
+const router: Router<typeof routeTree, 'preserve'> = createRouter({
     context: {
         auth: undefined!
     },
diff --git a/src/routeTree.gen.ts b/src/routeTree.gen.ts
index 597c851..20d2604 100644
--- a/src/routeTree.gen.ts
+++ b/src/routeTree.gen.ts
@@ -16,6 +16,7 @@ import { Route as LoginImport } from './routes/login'
 import { Route as AuthImport } from './routes/_auth'
 import { Route as AuthIndexImport } from './routes/_auth/index'
 import { Route as RecipesUsernameSlugImport } from './routes/recipes_/$username.$slug'
+import { Route as RecipesUsernameSlugEditImport } from './routes/recipes_/$username.$slug_/edit'
 
 // Create/Update Routes
 
@@ -44,6 +45,11 @@ const RecipesUsernameSlugRoute = RecipesUsernameSlugImport.update({
   getParentRoute: () => rootRoute,
 } as any)
 
+const RecipesUsernameSlugEditRoute = RecipesUsernameSlugEditImport.update({
+  path: '/recipes/$username/$slug/edit',
+  getParentRoute: () => rootRoute,
+} as any)
+
 // Populate the FileRoutesByPath interface
 
 declare module '@tanstack/react-router' {
@@ -83,6 +89,13 @@ declare module '@tanstack/react-router' {
       preLoaderRoute: typeof RecipesUsernameSlugImport
       parentRoute: typeof rootRoute
     }
+    '/recipes/$username/$slug/edit': {
+      id: '/recipes/$username/$slug/edit'
+      path: '/recipes/$username/$slug/edit'
+      fullPath: '/recipes/$username/$slug/edit'
+      preLoaderRoute: typeof RecipesUsernameSlugEditImport
+      parentRoute: typeof rootRoute
+    }
   }
 }
 
@@ -93,6 +106,7 @@ export const routeTree = rootRoute.addChildren({
   LoginRoute,
   RecipesRoute,
   RecipesUsernameSlugRoute,
+  RecipesUsernameSlugEditRoute,
 })
 
 /* prettier-ignore-end */
@@ -106,7 +120,8 @@ export const routeTree = rootRoute.addChildren({
         "/_auth",
         "/login",
         "/recipes",
-        "/recipes/$username/$slug"
+        "/recipes/$username/$slug",
+        "/recipes/$username/$slug/edit"
       ]
     },
     "/_auth": {
@@ -127,6 +142,9 @@ export const routeTree = rootRoute.addChildren({
     },
     "/recipes/$username/$slug": {
       "filePath": "recipes_/$username.$slug.tsx"
+    },
+    "/recipes/$username/$slug/edit": {
+      "filePath": "recipes_/$username.$slug_/edit.tsx"
     }
   }
 }
diff --git a/src/routes/recipes_/$username.$slug_/edit.tsx b/src/routes/recipes_/$username.$slug_/edit.tsx
new file mode 100644
index 0000000..0bf3b6d
--- /dev/null
+++ b/src/routes/recipes_/$username.$slug_/edit.tsx
@@ -0,0 +1,5 @@
+import { createFileRoute } from '@tanstack/react-router'
+
+export const Route = createFileRoute('/recipes/$username/$slug/edit')({
+    component: () => <div>Hello /recipes/$username/$slug/edit!</div>
+})