From 2a33edc8f6ca5eacab05fb8cd2a4dfc9b136ac5b Mon Sep 17 00:00:00 2001
From: Hayden Hargreaves <hhargreaves2006@gmail.com>
Date: Tue, 15 Jul 2025 21:19:47 -0700
Subject: [PATCH] (FEAT): Implemented API for the share engagement.

This includes user and no user routes! Now wired to the frontend,
however, it will still create an engagement even if it fails...
---
 internal/app/handlers/engagement_handler.go |  49 +++++++--
 internal/app/handlers/page_handler.go       |   2 -
 internal/app/server/server.go               |   1 +
 internal/app/service/engagement_service.go  |  28 ++++++
 internal/domain/engagement/service.go       |   2 +
 internal/domain/server/routes.go            |   1 +
 internal/templates/pages/recipe.templ       |  31 +++---
 internal/templates/pages/recipe_templ.go    | 105 +++++++++++---------
 8 files changed, 148 insertions(+), 71 deletions(-)

diff --git a/internal/app/handlers/engagement_handler.go b/internal/app/handlers/engagement_handler.go
index d57bc6b..dcca6d5 100644
--- a/internal/app/handlers/engagement_handler.go
+++ b/internal/app/handlers/engagement_handler.go
@@ -8,24 +8,55 @@ import (
 	domain "github.com/haydenhargreaves/Potion/internal/domain/server"
 )
 
-
-
 func EngagementViewRecipe(ctx *gin.Context) {
 	deps := ctx.MustGet("deps").(*domain.InjectedDependencies)
-	id := ctx.Param("id")
+	recipeId, _ := strconv.Atoi(ctx.Param("id"))
 
 	if !domain.IsLoggedIn(ctx) {
-		// TODO: Anon view
-		ctx.Status(http.StatusNoContent)
+		if _, err := deps.EngagementService.ViewRecipe(recipeId); err != nil {
+			ctx.JSON(http.StatusInternalServerError, gin.H{
+				"status":  http.StatusInternalServerError,
+				"message": err.Error(),
+			})
+		} else {
+			ctx.Status(http.StatusNoContent)
+		}
 		return
 	}
 
-	recipeId, _ := strconv.Atoi(id)
 	userId := ctx.MustGet("userId").(int)
 
 	if _, err := deps.EngagementService.UserViewRecipe(userId, recipeId); err != nil {
 		ctx.JSON(http.StatusInternalServerError, gin.H{
-			"status": http.StatusInternalServerError,
+			"status":  http.StatusInternalServerError,
+			"message": err.Error(),
+		})
+	} else {
+		ctx.Status(http.StatusNoContent)
+	}
+}
+
+func EngagementShareRecipe(ctx *gin.Context) {
+	deps := ctx.MustGet("deps").(*domain.InjectedDependencies)
+	recipeId, _ := strconv.Atoi(ctx.Param("id"))
+
+	if !domain.IsLoggedIn(ctx) {
+		if _, err := deps.EngagementService.ShareRecipe(recipeId); err != nil {
+			ctx.JSON(http.StatusInternalServerError, gin.H{
+				"status":  http.StatusInternalServerError,
+				"message": err.Error(),
+			})
+		} else {
+			ctx.Status(http.StatusNoContent)
+		}
+		return
+	}
+
+	userId := ctx.MustGet("userId").(int)
+
+	if _, err := deps.EngagementService.UserShareRecipe(userId, recipeId); err != nil {
+		ctx.JSON(http.StatusInternalServerError, gin.H{
+			"status":  http.StatusInternalServerError,
 			"message": err.Error(),
 		})
 	} else {
@@ -48,7 +79,7 @@ func EngagementFavoriteRecipe(ctx *gin.Context) {
 
 	if _, err := deps.EngagementService.UserFavoriteRecipe(userId, recipeId); err != nil {
 		ctx.JSON(http.StatusInternalServerError, gin.H{
-			"status": http.StatusInternalServerError,
+			"status":  http.StatusInternalServerError,
 			"message": err.Error(),
 		})
 	} else {
@@ -71,7 +102,7 @@ func EngagementMakeRecipe(ctx *gin.Context) {
 
 	if _, err := deps.EngagementService.UserMakeRecipe(userId, recipeId); err != nil {
 		ctx.JSON(http.StatusInternalServerError, gin.H{
-			"status": http.StatusInternalServerError,
+			"status":  http.StatusInternalServerError,
 			"message": err.Error(),
 		})
 	} else {
diff --git a/internal/app/handlers/page_handler.go b/internal/app/handlers/page_handler.go
index 7c5c48d..3b36eb4 100644
--- a/internal/app/handlers/page_handler.go
+++ b/internal/app/handlers/page_handler.go
@@ -130,14 +130,12 @@ func RecipePage(ctx *gin.Context) {
 
 	// Add engagement
 	if loggedIn {
-		fmt.Println("CALLING USER VIEW")
 		if _, err = deps.EngagementService.UserViewRecipe(*userId, recipe.Id); err != nil {
 			fmt.Printf("ERROR: %s\n", err.Error())
 			ctx.JSON(400, err.Error())
 			return
 		}
 	} else {
-		fmt.Println("CALLING VIEW")
 		if _, err = deps.EngagementService.ViewRecipe(recipe.Id); err != nil {
 			fmt.Printf("ERROR: %s\n", err.Error())
 			ctx.JSON(400, err.Error())
diff --git a/internal/app/server/server.go b/internal/app/server/server.go
index 226aa43..091e464 100644
--- a/internal/app/server/server.go
+++ b/internal/app/server/server.go
@@ -188,6 +188,7 @@ func (s *Server) Setup() *Server {
 
 	// Engagement endpoints
 	router_api.POST("/engagement/view/:id", handlers.EngagementViewRecipe)
+	router_api.POST("/engagement/share/:id", handlers.EngagementShareRecipe)
 	router_api.POST("/engagement/favorite/:id", handlers.EngagementFavoriteRecipe)
 	router_api.POST("/engagement/make/:id", handlers.EngagementMakeRecipe)
 
diff --git a/internal/app/service/engagement_service.go b/internal/app/service/engagement_service.go
index 9e7bf92..54ec6a9 100644
--- a/internal/app/service/engagement_service.go
+++ b/internal/app/service/engagement_service.go
@@ -39,6 +39,20 @@ func (s *EngagementService) ViewRecipe(recipeId int) (domain.Engagement, error)
 	return s.engagementRepository.AddEntityEngagement(recipeId, message, domain.EngagementViewed)
 }
 
+// ShareRecipe requires a user ID and a recipe ID to create an engagement record in the database.
+// A message will be generated using the recipe data and then used to add a view engagement to the
+// database.
+func (s *EngagementService) ShareRecipe(recipeId int) (domain.Engagement, error) {
+	recipe, err := s.recipeRepository.GetRecipe(recipeId, nil)
+	if err != nil {
+		return domain.Engagement{}, err
+	}
+
+	message := fmt.Sprintf("Shared \"%s\"", recipe.Title)
+
+	return s.engagementRepository.AddEntityEngagement(recipeId, message, domain.EngagementShared)
+}
+
 // UserViewRecipe requires a user ID and a recipe ID to create an engagement record in the database.
 // A message will be generated using the recipe data and then used to add a view engagement to the
 // database.
@@ -94,6 +108,20 @@ func (s *EngagementService) UserMakeRecipe(userId, recipeId int) (domain.Engagem
 	return s.engagementRepository.AddUserEntityEngagement(userId, recipeId, message, domain.EngagementMade)
 }
 
+// UserShareRecipe requires a user ID and a recipe ID to create an engagement record in the database.
+// A message will be generated using the recipe data and then used to add a make engagement to the
+// database.
+func (s *EngagementService) UserShareRecipe(userId, recipeId int) (domain.Engagement, error) {
+	recipe, err := s.recipeRepository.GetRecipe(recipeId, &userId)
+	if err != nil {
+		return domain.Engagement{}, err
+	}
+
+	message := fmt.Sprintf("Shared \"%s\"", recipe.Title)
+
+	return s.engagementRepository.AddUserEntityEngagement(userId, recipeId, message, domain.EngagementShared)
+}
+
 // GetUserEngagement returns a list of the users most recent engagement entries. The number of records
 // is determined by the limit passed into this function. The results are sorted, newest-to-oldest.
 func (s *EngagementService) GetUserEngagement(userId, limit int) ([]domain.Engagement, error) {
diff --git a/internal/domain/engagement/service.go b/internal/domain/engagement/service.go
index a4dd0fc..4c3a0ff 100644
--- a/internal/domain/engagement/service.go
+++ b/internal/domain/engagement/service.go
@@ -2,8 +2,10 @@ package domain
 
 type EngagementService interface {
 	ViewRecipe(recipeId int) (Engagement, error)
+	ShareRecipe(recipeId int) (Engagement, error)
 	UserViewRecipe(userId, recipeId int) (Engagement, error)
 	UserFavoriteRecipe(userId, recipeId int) (Engagement, error)
 	UserMakeRecipe(userId, recipeId int) (Engagement, error)
+	UserShareRecipe(userId, recipeId int) (Engagement, error)
 	GetUserEngagement(userId, limit int) ([]Engagement, error)
 }
diff --git a/internal/domain/server/routes.go b/internal/domain/server/routes.go
index a6f2fab..b6823da 100644
--- a/internal/domain/server/routes.go
+++ b/internal/domain/server/routes.go
@@ -26,6 +26,7 @@ const API_CREATE_RECIPE = VERSION + API + "/recipe"
 const API_SEARCH_RECIPES = VERSION + API + "/recipe/search"
 
 const API_ENGAGEMENT_VIEW = VERSION + API + "/engagement/view/%d"
+const API_ENGAGEMENT_SHARE = VERSION + API + "/engagement/share/%d"
 const API_ENGAGEMENT_FAVORITE = VERSION + API + "/engagement/favorite/%d"
 const API_ENGAGEMENT_MAKE = VERSION + API + "/engagement/make/%d"
 
diff --git a/internal/templates/pages/recipe.templ b/internal/templates/pages/recipe.templ
index f853b55..3ce0723 100644
--- a/internal/templates/pages/recipe.templ
+++ b/internal/templates/pages/recipe.templ
@@ -189,11 +189,11 @@ templ favoriteButton(favorited bool, id int, loggedIn bool) {
 			hx-post={ fmt.Sprintf(domainServer.API_ENGAGEMENT_FAVORITE, id) }
 			hx-trigger="click"
 			hx-swap="none"
-      if loggedIn { 
-        hx-on:click="favoriteButtonHandler();"
-      }
+			if loggedIn {
+				hx-on:click="favoriteButtonHandler();"
+			}
 			class="flex items-center justify-center gap-x-1 rounded-lg border border-blue-300 bg-blue-50 text-gray-800 px-6 py-3 flex-grow hover:bg-blue-100 hover:border-blue-500 duration-300"
-      id="favorite-button"
+			id="favorite-button"
 		>
 			<svg class="h-6 text-red-500" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
 				<path
@@ -208,11 +208,11 @@ templ favoriteButton(favorited bool, id int, loggedIn bool) {
 			hx-post={ fmt.Sprintf(domainServer.API_ENGAGEMENT_FAVORITE, id) }
 			hx-trigger="click"
 			hx-swap="none"
-      if loggedIn { 
-        hx-on:click="favoriteButtonHandler();"
-      }
+			if loggedIn {
+				hx-on:click="favoriteButtonHandler();"
+			}
 			class="flex items-center justify-center gap-x-1 rounded-lg border border-gray-300 text-gray-800 px-6 py-3 flex-grow hover:bg-gray-50 hover:border-blue-300 duration-300"
-      id="favorite-button"
+			id="favorite-button"
 		>
 			<svg class="h-6" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
 				<path
@@ -236,9 +236,9 @@ templ madeButton(id int, loggedIn bool) {
 		hx-trigger="click"
 		hx-swap="none"
 		id="make-button"
-    if loggedIn {
-      hx-on:click="makeButtonHandler();"
-    }
+		if loggedIn {
+			hx-on:click="makeButtonHandler();"
+		}
 		class="flex items-center justify-center gap-x-1 rounded-lg border border-gray-300 text-gray-800 px-6 py-3 flex-grow hover:bg-gray-50 hover:border-blue-300 duration-300"
 	>
 		<svg
@@ -262,10 +262,13 @@ templ madeButton(id int, loggedIn bool) {
 	</button>
 }
 
-templ shareButton() {
+templ shareButton(id int) {
 	<button
 		id="share-button"
-		onclick="shareButtonHandler();"
+		hx-post={ fmt.Sprintf(domainServer.API_ENGAGEMENT_SHARE, id) }
+		hx-trigger="click"
+		hx-swap="none"
+		hx-on:click="shareButtonHandler();"
 		class="flex items-center justify-center gap-x-1 rounded-lg border border-gray-300 text-gray-800 px-6 py-3 flex-grow hover:bg-gray-50 hover:border-blue-300 duration-300"
 	>
 		<svg class="h-7" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
@@ -284,7 +287,7 @@ templ buttonSection(favorited bool, id int, loggedIn bool) {
 	<section class="w-full flex flex-col md:flex-row gap-x-4 gap-y-2 py-8 px-4 md:px-8">
 		@favoriteButton(favorited, id, loggedIn)
 		@madeButton(id, loggedIn)
-		@shareButton()
+		@shareButton(id)
 	</section>
 }
 
diff --git a/internal/templates/pages/recipe_templ.go b/internal/templates/pages/recipe_templ.go
index e26ba3f..3f81041 100644
--- a/internal/templates/pages/recipe_templ.go
+++ b/internal/templates/pages/recipe_templ.go
@@ -691,7 +691,7 @@ func madeButton(id int, loggedIn bool) templ.Component {
 	})
 }
 
-func shareButton() templ.Component {
+func shareButton(id int) templ.Component {
 	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
 		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
 		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
@@ -712,7 +712,20 @@ func shareButton() templ.Component {
 			templ_7745c5c3_Var26 = templ.NopComponent
 		}
 		ctx = templ.ClearChildren(ctx)
-		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 50, "<button id=\"share-button\" onclick=\"shareButtonHandler();\" class=\"flex items-center justify-center gap-x-1 rounded-lg border border-gray-300 text-gray-800 px-6 py-3 flex-grow hover:bg-gray-50 hover:border-blue-300 duration-300\"><svg class=\"h-7\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M13.803 5.33333C13.803 3.49238 15.3022 2 17.1515 2C19.0008 2 20.5 3.49238 20.5 5.33333C20.5 7.17428 19.0008 8.66667 17.1515 8.66667C16.2177 8.66667 15.3738 8.28596 14.7671 7.67347L10.1317 10.8295C10.1745 11.0425 10.197 11.2625 10.197 11.4872C10.197 11.9322 10.109 12.3576 9.94959 12.7464L15.0323 16.0858C15.6092 15.6161 16.3473 15.3333 17.1515 15.3333C19.0008 15.3333 20.5 16.8257 20.5 18.6667C20.5 20.5076 19.0008 22 17.1515 22C15.3022 22 13.803 20.5076 13.803 18.6667C13.803 18.1845 13.9062 17.7255 14.0917 17.3111L9.05007 13.9987C8.46196 14.5098 7.6916 14.8205 6.84848 14.8205C4.99917 14.8205 3.5 13.3281 3.5 11.4872C3.5 9.64623 4.99917 8.15385 6.84848 8.15385C7.9119 8.15385 8.85853 8.64725 9.47145 9.41518L13.9639 6.35642C13.8594 6.03359 13.803 5.6896 13.803 5.33333Z\" fill=\"currentColor\"></path></svg> Share</button>")
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 50, "<button id=\"share-button\" hx-post=\"")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		var templ_7745c5c3_Var27 string
+		templ_7745c5c3_Var27, templ_7745c5c3_Err = templ.JoinStringErrs(fmt.Sprintf(domainServer.API_ENGAGEMENT_SHARE, id))
+		if templ_7745c5c3_Err != nil {
+			return templ.Error{Err: templ_7745c5c3_Err, FileName: `internal/templates/pages/recipe.templ`, Line: 268, Col: 62}
+		}
+		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var27))
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 51, "\" hx-trigger=\"click\" hx-swap=\"none\" hx-on:click=\"shareButtonHandler();\" class=\"flex items-center justify-center gap-x-1 rounded-lg border border-gray-300 text-gray-800 px-6 py-3 flex-grow hover:bg-gray-50 hover:border-blue-300 duration-300\"><svg class=\"h-7\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M13.803 5.33333C13.803 3.49238 15.3022 2 17.1515 2C19.0008 2 20.5 3.49238 20.5 5.33333C20.5 7.17428 19.0008 8.66667 17.1515 8.66667C16.2177 8.66667 15.3738 8.28596 14.7671 7.67347L10.1317 10.8295C10.1745 11.0425 10.197 11.2625 10.197 11.4872C10.197 11.9322 10.109 12.3576 9.94959 12.7464L15.0323 16.0858C15.6092 15.6161 16.3473 15.3333 17.1515 15.3333C19.0008 15.3333 20.5 16.8257 20.5 18.6667C20.5 20.5076 19.0008 22 17.1515 22C15.3022 22 13.803 20.5076 13.803 18.6667C13.803 18.1845 13.9062 17.7255 14.0917 17.3111L9.05007 13.9987C8.46196 14.5098 7.6916 14.8205 6.84848 14.8205C4.99917 14.8205 3.5 13.3281 3.5 11.4872C3.5 9.64623 4.99917 8.15385 6.84848 8.15385C7.9119 8.15385 8.85853 8.64725 9.47145 9.41518L13.9639 6.35642C13.8594 6.03359 13.803 5.6896 13.803 5.33333Z\" fill=\"currentColor\"></path></svg> Share</button>")
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
@@ -736,12 +749,12 @@ func buttonSection(favorited bool, id int, loggedIn bool) templ.Component {
 			}()
 		}
 		ctx = templ.InitializeContext(ctx)
-		templ_7745c5c3_Var27 := templ.GetChildren(ctx)
-		if templ_7745c5c3_Var27 == nil {
-			templ_7745c5c3_Var27 = templ.NopComponent
+		templ_7745c5c3_Var28 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var28 == nil {
+			templ_7745c5c3_Var28 = templ.NopComponent
 		}
 		ctx = templ.ClearChildren(ctx)
-		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 51, "<section class=\"w-full flex flex-col md:flex-row gap-x-4 gap-y-2 py-8 px-4 md:px-8\">")
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 52, "<section class=\"w-full flex flex-col md:flex-row gap-x-4 gap-y-2 py-8 px-4 md:px-8\">")
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
@@ -753,11 +766,11 @@ func buttonSection(favorited bool, id int, loggedIn bool) templ.Component {
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
-		templ_7745c5c3_Err = shareButton().Render(ctx, templ_7745c5c3_Buffer)
+		templ_7745c5c3_Err = shareButton(id).Render(ctx, templ_7745c5c3_Buffer)
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
-		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 52, "</section>")
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 53, "</section>")
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
@@ -781,55 +794,55 @@ func RecipePage(recipe domain.Recipe, user domainUser.User, loggedIn bool) templ
 			}()
 		}
 		ctx = templ.InitializeContext(ctx)
-		templ_7745c5c3_Var28 := templ.GetChildren(ctx)
-		if templ_7745c5c3_Var28 == nil {
-			templ_7745c5c3_Var28 = templ.NopComponent
+		templ_7745c5c3_Var29 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var29 == nil {
+			templ_7745c5c3_Var29 = templ.NopComponent
 		}
 		ctx = templ.ClearChildren(ctx)
 		templ_7745c5c3_Err = components.Navbar("").Render(ctx, templ_7745c5c3_Buffer)
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
-		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 53, "<div class=\"w-full flex justify-center\"><div class=\"mx-2 md:mx-0 w-full md:w-1/2 md:pt-14 h-full border-l border-r border-gray-300 bg-white\"><img class=\"bg-gray-100 w-full h-96 mx-auto mb-8\" src=\"\" alt=\"\"><div class=\"px-4 py-8 md:px-8\"><h1 class=\"text-3xl md:text-4xl font-bold text-gray-800\">")
-		if templ_7745c5c3_Err != nil {
-			return templ_7745c5c3_Err
-		}
-		var templ_7745c5c3_Var29 string
-		templ_7745c5c3_Var29, templ_7745c5c3_Err = templ.JoinStringErrs(recipe.Title)
-		if templ_7745c5c3_Err != nil {
-			return templ.Error{Err: templ_7745c5c3_Err, FileName: `internal/templates/pages/recipe.templ`, Line: 297, Col: 75}
-		}
-		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var29))
-		if templ_7745c5c3_Err != nil {
-			return templ_7745c5c3_Err
-		}
-		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 54, "</h1><p class=\"text-sm mt-2 mb-1 text-gray-700\">Author: ")
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 54, "<div class=\"w-full flex justify-center\"><div class=\"mx-2 md:mx-0 w-full md:w-1/2 md:pt-14 h-full border-l border-r border-gray-300 bg-white\"><img class=\"bg-gray-100 w-full h-96 mx-auto mb-8\" src=\"\" alt=\"\"><div class=\"px-4 py-8 md:px-8\"><h1 class=\"text-3xl md:text-4xl font-bold text-gray-800\">")
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
 		var templ_7745c5c3_Var30 string
-		templ_7745c5c3_Var30, templ_7745c5c3_Err = templ.JoinStringErrs(user.Name)
+		templ_7745c5c3_Var30, templ_7745c5c3_Err = templ.JoinStringErrs(recipe.Title)
 		if templ_7745c5c3_Err != nil {
-			return templ.Error{Err: templ_7745c5c3_Err, FileName: `internal/templates/pages/recipe.templ`, Line: 298, Col: 66}
+			return templ.Error{Err: templ_7745c5c3_Err, FileName: `internal/templates/pages/recipe.templ`, Line: 300, Col: 75}
 		}
 		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var30))
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
-		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 55, "</p><p class=\"text-sm mb-2 text-gray-700\">Category: ")
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 55, "</h1><p class=\"text-sm mt-2 mb-1 text-gray-700\">Author: ")
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
 		var templ_7745c5c3_Var31 string
-		templ_7745c5c3_Var31, templ_7745c5c3_Err = templ.JoinStringErrs(recipe.Category)
+		templ_7745c5c3_Var31, templ_7745c5c3_Err = templ.JoinStringErrs(user.Name)
 		if templ_7745c5c3_Err != nil {
-			return templ.Error{Err: templ_7745c5c3_Err, FileName: `internal/templates/pages/recipe.templ`, Line: 299, Col: 69}
+			return templ.Error{Err: templ_7745c5c3_Err, FileName: `internal/templates/pages/recipe.templ`, Line: 301, Col: 66}
 		}
 		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var31))
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
-		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 56, "</p></div>")
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 56, "</p><p class=\"text-sm mb-2 text-gray-700\">Category: ")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		var templ_7745c5c3_Var32 string
+		templ_7745c5c3_Var32, templ_7745c5c3_Err = templ.JoinStringErrs(recipe.Category)
+		if templ_7745c5c3_Err != nil {
+			return templ.Error{Err: templ_7745c5c3_Err, FileName: `internal/templates/pages/recipe.templ`, Line: 302, Col: 69}
+		}
+		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var32))
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 57, "</p></div>")
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
@@ -841,20 +854,20 @@ func RecipePage(recipe domain.Recipe, user domainUser.User, loggedIn bool) templ
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
-		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 57, "<div class=\"px-4 py-8 md:px-8\"><h3 class=\"text-xl text-gray-800 font-semibold mb-2\">About this recipe</h3><p class=\"text-gray-700\">")
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 58, "<div class=\"px-4 py-8 md:px-8\"><h3 class=\"text-xl text-gray-800 font-semibold mb-2\">About this recipe</h3><p class=\"text-gray-700\">")
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
-		var templ_7745c5c3_Var32 string
-		templ_7745c5c3_Var32, templ_7745c5c3_Err = templ.JoinStringErrs(recipe.Description)
+		var templ_7745c5c3_Var33 string
+		templ_7745c5c3_Var33, templ_7745c5c3_Err = templ.JoinStringErrs(recipe.Description)
 		if templ_7745c5c3_Err != nil {
-			return templ.Error{Err: templ_7745c5c3_Err, FileName: `internal/templates/pages/recipe.templ`, Line: 305, Col: 49}
+			return templ.Error{Err: templ_7745c5c3_Err, FileName: `internal/templates/pages/recipe.templ`, Line: 308, Col: 49}
 		}
-		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var32))
+		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var33))
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
-		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 58, "</p></div>")
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 59, "</p></div>")
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
@@ -870,7 +883,7 @@ func RecipePage(recipe domain.Recipe, user domainUser.User, loggedIn bool) templ
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
-		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 59, "</div></div>")
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 60, "</div></div>")
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
@@ -898,24 +911,24 @@ func scripts(id int) templ.Component {
 			}()
 		}
 		ctx = templ.InitializeContext(ctx)
-		templ_7745c5c3_Var33 := templ.GetChildren(ctx)
-		if templ_7745c5c3_Var33 == nil {
-			templ_7745c5c3_Var33 = templ.NopComponent
+		templ_7745c5c3_Var34 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var34 == nil {
+			templ_7745c5c3_Var34 = templ.NopComponent
 		}
 		ctx = templ.ClearChildren(ctx)
-		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 60, "<script>\n  function shareButtonHandler() {\n    const button = document.getElementById(\"share-button\");\n    const before = button.outerHTML;\n\n    if (navigator.clipboard && navigator.clipboard.writeText) {\n      const url = \"http://localhost:7331/v1/web/recipe/")
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 61, "<script>\n  function shareButtonHandler() {\n    const button = document.getElementById(\"share-button\");\n    const before = button.outerHTML;\n\n    if (navigator.clipboard && navigator.clipboard.writeText) {\n      const url = \"http://localhost:7331/v1/web/recipe/")
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
-		templ_7745c5c3_Var34, templ_7745c5c3_Err := templruntime.ScriptContentInsideStringLiteral(id)
+		templ_7745c5c3_Var35, templ_7745c5c3_Err := templruntime.ScriptContentInsideStringLiteral(id)
 		if templ_7745c5c3_Err != nil {
-			return templ.Error{Err: templ_7745c5c3_Err, FileName: `internal/templates/pages/recipe.templ`, Line: 322, Col: 60}
+			return templ.Error{Err: templ_7745c5c3_Err, FileName: `internal/templates/pages/recipe.templ`, Line: 325, Col: 60}
 		}
-		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ_7745c5c3_Var34)
+		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ_7745c5c3_Var35)
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}
-		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 61, "\"\n      navigator.clipboard.writeText(url).then(() => {\n        button.outerHTML = `\n          <button id=\"share-button\"\n            class=\"flex items-center justify-center gap-x-1 rounded-lg border border-green-500 text-green-500 px-6 py-3 flex-grow hover:bg-gray-50 hover:border-blue-300 duration-300\">\n            <svg class=\"h-7\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n              <path fill-rule=\"evenodd\" clip-rule=\"evenodd\"\n                d=\"M13.803 5.33333C13.803 3.49238 15.3022 2 17.1515 2C19.0008 2 20.5 3.49238 20.5 5.33333C20.5 7.17428 19.0008 8.66667 17.1515 8.66667C16.2177 8.66667 15.3738 8.28596 14.7671 7.67347L10.1317 10.8295C10.1745 11.0425 10.197 11.2625 10.197 11.4872C10.197 11.9322 10.109 12.3576 9.94959 12.7464L15.0323 16.0858C15.6092 15.6161 16.3473 15.3333 17.1515 15.3333C19.0008 15.3333 20.5 16.8257 20.5 18.6667C20.5 20.5076 19.0008 22 17.1515 22C15.3022 22 13.803 20.5076 13.803 18.6667C13.803 18.1845 13.9062 17.7255 14.0917 17.3111L9.05007 13.9987C8.46196 14.5098 7.6916 14.8205 6.84848 14.8205C4.99917 14.8205 3.5 13.3281 3.5 11.4872C3.5 9.64623 4.99917 8.15385 6.84848 8.15385C7.9119 8.15385 8.85853 8.64725 9.47145 9.41518L13.9639 6.35642C13.8594 6.03359 13.803 5.6896 13.803 5.33333Z\"\n                fill=\"currentColor\"></path>\n            </svg>\n            Link Copied!\n          </button>\n        `;\n\n        setTimeout(() => {\n          const newButton = document.getElementById(\"share-button\");\n          newButton.outerHTML = before;\n        }, 2000);\n      });\n    } else {\n      console.warn(\"Clipboard API not available.\");\n\n      button.outerHTML = `\n          <button id=\"share-button\"\n            class=\"flex items-center justify-center gap-x-1 rounded-lg border border-red-500 text-red-500 px-6 py-3 flex-grow hover:bg-gray-50 hover:border-blue-300 duration-300\">\n            <svg class=\"h-7\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n              <path fill-rule=\"evenodd\" clip-rule=\"evenodd\"\n                d=\"M13.803 5.33333C13.803 3.49238 15.3022 2 17.1515 2C19.0008 2 20.5 3.49238 20.5 5.33333C20.5 7.17428 19.0008 8.66667 17.1515 8.66667C16.2177 8.66667 15.3738 8.28596 14.7671 7.67347L10.1317 10.8295C10.1745 11.0425 10.197 11.2625 10.197 11.4872C10.197 11.9322 10.109 12.3576 9.94959 12.7464L15.0323 16.0858C15.6092 15.6161 16.3473 15.3333 17.1515 15.3333C19.0008 15.3333 20.5 16.8257 20.5 18.6667C20.5 20.5076 19.0008 22 17.1515 22C15.3022 22 13.803 20.5076 13.803 18.6667C13.803 18.1845 13.9062 17.7255 14.0917 17.3111L9.05007 13.9987C8.46196 14.5098 7.6916 14.8205 6.84848 14.8205C4.99917 14.8205 3.5 13.3281 3.5 11.4872C3.5 9.64623 4.99917 8.15385 6.84848 8.15385C7.9119 8.15385 8.85853 8.64725 9.47145 9.41518L13.9639 6.35642C13.8594 6.03359 13.803 5.6896 13.803 5.33333Z\"\n                fill=\"currentColor\"></path>\n            </svg>\n            Failed!\n          </button>\n        `;\n\n      setTimeout(() => {\n        const newButton = document.getElementById(\"share-button\");\n        newButton.outerHTML = before;\n      }, 2000);\n    }\n  }\n\n  function makeButtonHandler() {\n    const button = document.getElementById(\"make-button\");\n\n    button.outerHTML = `\n      <button\n        id=\"make-button\"\n          class=\"flex items-center justify-center gap-x-1 rounded-lg border border-blue-500 text-blue-500 px-6 py-3 flex-grow hover:bg-gray-50 hover:border-blue-300 duration-300\"\n      >\n        <svg\n          class=\"h-6\"\n          fill=\"currentColor\"\n          viewBox=\"0 -3.84 122.88 122.88\"\n          version=\"1.1\"\n          id=\"Layer_1\"\n          xmlns=\"http://www.w3.org/2000/svg\"\n          xmlns:xlink=\"http://www.w3.org/1999/xlink\"\n          style=\"enable-background:new 0 0 122.88 115.21\"\n          xml:space=\"preserve\"\n        >\n          <g>\n            <path\n              d=\"M29.03,100.46l20.79-25.21l9.51,12.13L41,110.69C33.98,119.61,20.99,110.21,29.03,100.46L29.03,100.46z M53.31,43.05 c1.98-6.46,1.07-11.98-6.37-20.18L28.76,1c-2.58-3.03-8.66,1.42-6.12,5.09L37.18,24c2.75,3.34-2.36,7.76-5.2,4.32L16.94,9.8 c-2.8-3.21-8.59,1.03-5.66,4.7c4.24,5.1,10.8,13.43,15.04,18.53c2.94,2.99-1.53,7.42-4.43,3.69L6.96,18.32 c-2.19-2.38-5.77-0.9-6.72,1.88c-1.02,2.97,1.49,5.14,3.2,7.34L20.1,49.06c5.17,5.99,10.95,9.54,17.67,7.53 c1.03-0.31,2.29-0.94,3.64-1.77l44.76,57.78c2.41,3.11,7.06,3.44,10.08,0.93l0.69-0.57c3.4-2.83,3.95-8,1.04-11.34L50.58,47.16 C51.96,45.62,52.97,44.16,53.31,43.05L53.31,43.05z M65.98,55.65l7.37-8.94C63.87,23.21,99-8.11,116.03,6.29 C136.72,23.8,105.97,66,84.36,55.57l-8.73,11.09L65.98,55.65L65.98,55.65z\"\n            ></path>\n          </g>\n        </svg>\n        Made This!\n      </button>\n    `;\n  }\n\n  function favoriteButtonHandler() {\n    const button = document.getElementById(\"favorite-button\");\n\n    console.log(button.classList);\n    console.log(button.classList.contains(\"border-blue-300\"));\n\n    const toggleClasses = [\n      \"border-gray-300\", \"hover:bg-gray-50\", \"hover:border-blue-300\",\n      \"border-blue-300\", \"bg-blue-50\", \"hover:bg-blue-100\", \"hover:border-blue-500\"\n    ];\n\n    for (const cls of toggleClasses) {\n      console.log(\"toggling class \" + cls);\n      button.classList.toggle(cls);\n    }\n\n    if (!button.classList.contains(\"border-blue-300\")) {\n      button.innerHTML = `\n        <svg class=\"h-6\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n          <path\n            fill-rule=\"evenodd\"\n            clip-rule=\"evenodd\"\n            d=\"M12 6.00019C10.2006 3.90317 7.19377 3.2551 4.93923 5.17534C2.68468 7.09558 2.36727 10.3061 4.13778 12.5772C5.60984 14.4654 10.0648 18.4479 11.5249 19.7369C11.6882 19.8811 11.7699 19.9532 11.8652 19.9815C11.9483 20.0062 12.0393 20.0062 12.1225 19.9815C12.2178 19.9532 12.2994 19.8811 12.4628 19.7369C13.9229 18.4479 18.3778 14.4654 19.8499 12.5772C21.6204 10.3061 21.3417 7.07538 19.0484 5.17534C16.7551 3.2753 13.7994 3.90317 12 6.00019Z\"\n            stroke=\"currentColor\"\n            stroke-width=\"2\"\n            stroke-linecap=\"round\"\n            stroke-linejoin=\"round\"\n          ></path>\n        </svg>\n        Favorite\n      `;\n\n    } else {\n      button.innerHTML = `\n        <svg class=\"h-6 text-red-500\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n          <path\n            d=\"M2 9.1371C2 14 6.01943 16.5914 8.96173 18.9109C10 19.7294 11 20.5 12 20.5C13 20.5 14 19.7294 15.0383 18.9109C17.9806 16.5914 22 14 22 9.1371C22 4.27416 16.4998 0.825464 12 5.50063C7.50016 0.825464 2 4.27416 2 9.1371Z\"\n            fill=\"currentColor\"\n          ></path>\n        </svg>\n        Unfavorite\n      `;\n    }\n\n  }\n\n</script>")
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 62, "\"\n      navigator.clipboard.writeText(url).then(() => {\n        button.outerHTML = `\n          <button id=\"share-button\"\n            class=\"flex items-center justify-center gap-x-1 rounded-lg border border-green-500 text-green-500 px-6 py-3 flex-grow hover:bg-gray-50 hover:border-blue-300 duration-300\">\n            <svg class=\"h-7\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n              <path fill-rule=\"evenodd\" clip-rule=\"evenodd\"\n                d=\"M13.803 5.33333C13.803 3.49238 15.3022 2 17.1515 2C19.0008 2 20.5 3.49238 20.5 5.33333C20.5 7.17428 19.0008 8.66667 17.1515 8.66667C16.2177 8.66667 15.3738 8.28596 14.7671 7.67347L10.1317 10.8295C10.1745 11.0425 10.197 11.2625 10.197 11.4872C10.197 11.9322 10.109 12.3576 9.94959 12.7464L15.0323 16.0858C15.6092 15.6161 16.3473 15.3333 17.1515 15.3333C19.0008 15.3333 20.5 16.8257 20.5 18.6667C20.5 20.5076 19.0008 22 17.1515 22C15.3022 22 13.803 20.5076 13.803 18.6667C13.803 18.1845 13.9062 17.7255 14.0917 17.3111L9.05007 13.9987C8.46196 14.5098 7.6916 14.8205 6.84848 14.8205C4.99917 14.8205 3.5 13.3281 3.5 11.4872C3.5 9.64623 4.99917 8.15385 6.84848 8.15385C7.9119 8.15385 8.85853 8.64725 9.47145 9.41518L13.9639 6.35642C13.8594 6.03359 13.803 5.6896 13.803 5.33333Z\"\n                fill=\"currentColor\"></path>\n            </svg>\n            Link Copied!\n          </button>\n        `;\n\n        setTimeout(() => {\n          const newButton = document.getElementById(\"share-button\");\n          newButton.outerHTML = before;\n        }, 2000);\n      });\n    } else {\n      console.warn(\"Clipboard API not available.\");\n\n      button.outerHTML = `\n          <button id=\"share-button\"\n            class=\"flex items-center justify-center gap-x-1 rounded-lg border border-red-500 text-red-500 px-6 py-3 flex-grow hover:bg-gray-50 hover:border-blue-300 duration-300\">\n            <svg class=\"h-7\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n              <path fill-rule=\"evenodd\" clip-rule=\"evenodd\"\n                d=\"M13.803 5.33333C13.803 3.49238 15.3022 2 17.1515 2C19.0008 2 20.5 3.49238 20.5 5.33333C20.5 7.17428 19.0008 8.66667 17.1515 8.66667C16.2177 8.66667 15.3738 8.28596 14.7671 7.67347L10.1317 10.8295C10.1745 11.0425 10.197 11.2625 10.197 11.4872C10.197 11.9322 10.109 12.3576 9.94959 12.7464L15.0323 16.0858C15.6092 15.6161 16.3473 15.3333 17.1515 15.3333C19.0008 15.3333 20.5 16.8257 20.5 18.6667C20.5 20.5076 19.0008 22 17.1515 22C15.3022 22 13.803 20.5076 13.803 18.6667C13.803 18.1845 13.9062 17.7255 14.0917 17.3111L9.05007 13.9987C8.46196 14.5098 7.6916 14.8205 6.84848 14.8205C4.99917 14.8205 3.5 13.3281 3.5 11.4872C3.5 9.64623 4.99917 8.15385 6.84848 8.15385C7.9119 8.15385 8.85853 8.64725 9.47145 9.41518L13.9639 6.35642C13.8594 6.03359 13.803 5.6896 13.803 5.33333Z\"\n                fill=\"currentColor\"></path>\n            </svg>\n            Failed!\n          </button>\n        `;\n\n      setTimeout(() => {\n        const newButton = document.getElementById(\"share-button\");\n        newButton.outerHTML = before;\n      }, 2000);\n    }\n  }\n\n  function makeButtonHandler() {\n    const button = document.getElementById(\"make-button\");\n\n    button.outerHTML = `\n      <button\n        id=\"make-button\"\n          class=\"flex items-center justify-center gap-x-1 rounded-lg border border-blue-500 text-blue-500 px-6 py-3 flex-grow hover:bg-gray-50 hover:border-blue-300 duration-300\"\n      >\n        <svg\n          class=\"h-6\"\n          fill=\"currentColor\"\n          viewBox=\"0 -3.84 122.88 122.88\"\n          version=\"1.1\"\n          id=\"Layer_1\"\n          xmlns=\"http://www.w3.org/2000/svg\"\n          xmlns:xlink=\"http://www.w3.org/1999/xlink\"\n          style=\"enable-background:new 0 0 122.88 115.21\"\n          xml:space=\"preserve\"\n        >\n          <g>\n            <path\n              d=\"M29.03,100.46l20.79-25.21l9.51,12.13L41,110.69C33.98,119.61,20.99,110.21,29.03,100.46L29.03,100.46z M53.31,43.05 c1.98-6.46,1.07-11.98-6.37-20.18L28.76,1c-2.58-3.03-8.66,1.42-6.12,5.09L37.18,24c2.75,3.34-2.36,7.76-5.2,4.32L16.94,9.8 c-2.8-3.21-8.59,1.03-5.66,4.7c4.24,5.1,10.8,13.43,15.04,18.53c2.94,2.99-1.53,7.42-4.43,3.69L6.96,18.32 c-2.19-2.38-5.77-0.9-6.72,1.88c-1.02,2.97,1.49,5.14,3.2,7.34L20.1,49.06c5.17,5.99,10.95,9.54,17.67,7.53 c1.03-0.31,2.29-0.94,3.64-1.77l44.76,57.78c2.41,3.11,7.06,3.44,10.08,0.93l0.69-0.57c3.4-2.83,3.95-8,1.04-11.34L50.58,47.16 C51.96,45.62,52.97,44.16,53.31,43.05L53.31,43.05z M65.98,55.65l7.37-8.94C63.87,23.21,99-8.11,116.03,6.29 C136.72,23.8,105.97,66,84.36,55.57l-8.73,11.09L65.98,55.65L65.98,55.65z\"\n            ></path>\n          </g>\n        </svg>\n        Made This!\n      </button>\n    `;\n  }\n\n  function favoriteButtonHandler() {\n    const button = document.getElementById(\"favorite-button\");\n\n    console.log(button.classList);\n    console.log(button.classList.contains(\"border-blue-300\"));\n\n    const toggleClasses = [\n      \"border-gray-300\", \"hover:bg-gray-50\", \"hover:border-blue-300\",\n      \"border-blue-300\", \"bg-blue-50\", \"hover:bg-blue-100\", \"hover:border-blue-500\"\n    ];\n\n    for (const cls of toggleClasses) {\n      console.log(\"toggling class \" + cls);\n      button.classList.toggle(cls);\n    }\n\n    if (!button.classList.contains(\"border-blue-300\")) {\n      button.innerHTML = `\n        <svg class=\"h-6\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n          <path\n            fill-rule=\"evenodd\"\n            clip-rule=\"evenodd\"\n            d=\"M12 6.00019C10.2006 3.90317 7.19377 3.2551 4.93923 5.17534C2.68468 7.09558 2.36727 10.3061 4.13778 12.5772C5.60984 14.4654 10.0648 18.4479 11.5249 19.7369C11.6882 19.8811 11.7699 19.9532 11.8652 19.9815C11.9483 20.0062 12.0393 20.0062 12.1225 19.9815C12.2178 19.9532 12.2994 19.8811 12.4628 19.7369C13.9229 18.4479 18.3778 14.4654 19.8499 12.5772C21.6204 10.3061 21.3417 7.07538 19.0484 5.17534C16.7551 3.2753 13.7994 3.90317 12 6.00019Z\"\n            stroke=\"currentColor\"\n            stroke-width=\"2\"\n            stroke-linecap=\"round\"\n            stroke-linejoin=\"round\"\n          ></path>\n        </svg>\n        Favorite\n      `;\n\n    } else {\n      button.innerHTML = `\n        <svg class=\"h-6 text-red-500\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n          <path\n            d=\"M2 9.1371C2 14 6.01943 16.5914 8.96173 18.9109C10 19.7294 11 20.5 12 20.5C13 20.5 14 19.7294 15.0383 18.9109C17.9806 16.5914 22 14 22 9.1371C22 4.27416 16.4998 0.825464 12 5.50063C7.50016 0.825464 2 4.27416 2 9.1371Z\"\n            fill=\"currentColor\"\n          ></path>\n        </svg>\n        Unfavorite\n      `;\n    }\n\n  }\n\n</script>")
 		if templ_7745c5c3_Err != nil {
 			return templ_7745c5c3_Err
 		}