From 42c5ab642e17bd471822df53a0426537b0598f07 Mon Sep 17 00:00:00 2001
From: Prad Nukala <prad@sonr.io>
Date: Wed, 2 Oct 2024 20:23:28 -0400
Subject: [PATCH] feat: introduce Home model and refactor views

---
 pkg/nebula/components/home/footer.templ    |  2 +-
 pkg/nebula/components/home/footer_templ.go |  2 +-
 pkg/nebula/components/home/header.templ    |  2 +-
 pkg/nebula/components/home/header_templ.go |  2 +-
 pkg/nebula/components/home/view.templ      |  8 +--
 pkg/nebula/components/home/view_templ.go   |  8 +--
 pkg/nebula/models/Bento.pkl.go             | 12 ++++
 pkg/nebula/models/CallToAction.pkl.go      | 12 ++++
 pkg/nebula/models/Features.pkl.go          | 10 +++
 pkg/nebula/models/Hero.pkl.go              |  2 +
 pkg/nebula/models/Highlights.pkl.go        | 10 +++
 pkg/nebula/models/Home.pkl.go              |  2 -
 pkg/nebula/models/Lowlights.pkl.go         | 10 +++
 pkg/nebula/models/init.pkl.go              |  7 +-
 pkg/nebula/nebula.pkl                      | 30 +++++----
 pkg/nebula/pages/home.go                   |  2 +-
 pkl/uiux.pkl                               | 77 ++++++++++++++++++----
 17 files changed, 154 insertions(+), 44 deletions(-)
 create mode 100644 pkg/nebula/models/Bento.pkl.go
 create mode 100644 pkg/nebula/models/CallToAction.pkl.go
 create mode 100644 pkg/nebula/models/Features.pkl.go
 create mode 100644 pkg/nebula/models/Highlights.pkl.go
 create mode 100644 pkg/nebula/models/Lowlights.pkl.go

diff --git a/pkg/nebula/components/home/footer.templ b/pkg/nebula/components/home/footer.templ
index 58dd4d4bc..94c68ba79 100644
--- a/pkg/nebula/components/home/footer.templ
+++ b/pkg/nebula/components/home/footer.templ
@@ -1,6 +1,6 @@
 package home
 
-templ MarketingFooter() {
+templ Footer() {
 	<!-- Site footer -->
 	<footer>
 		<div class="max-w-5xl mx-auto px-4 sm:px-6">
diff --git a/pkg/nebula/components/home/footer_templ.go b/pkg/nebula/components/home/footer_templ.go
index f11f607f2..b036f4ece 100644
--- a/pkg/nebula/components/home/footer_templ.go
+++ b/pkg/nebula/components/home/footer_templ.go
@@ -8,7 +8,7 @@ package home
 import "github.com/a-h/templ"
 import templruntime "github.com/a-h/templ/runtime"
 
-func MarketingFooter() templ.Component {
+func Footer() 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 {
diff --git a/pkg/nebula/components/home/header.templ b/pkg/nebula/components/home/header.templ
index cfafb61c7..bccdb5961 100644
--- a/pkg/nebula/components/home/header.templ
+++ b/pkg/nebula/components/home/header.templ
@@ -1,6 +1,6 @@
 package home
 
-templ MarketingHeader() {
+templ Header() {
 	<!-- Site header -->
 	<header class="absolute top-2 md:top-6 w-full z-30">
 		<div class="px-4 sm:px-6">
diff --git a/pkg/nebula/components/home/header_templ.go b/pkg/nebula/components/home/header_templ.go
index 86a37e577..e100d6552 100644
--- a/pkg/nebula/components/home/header_templ.go
+++ b/pkg/nebula/components/home/header_templ.go
@@ -8,7 +8,7 @@ package home
 import "github.com/a-h/templ"
 import templruntime "github.com/a-h/templ/runtime"
 
-func MarketingHeader() templ.Component {
+func Header() 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 {
diff --git a/pkg/nebula/components/home/view.templ b/pkg/nebula/components/home/view.templ
index 8e5d5d2d6..1d83c9808 100644
--- a/pkg/nebula/components/home/view.templ
+++ b/pkg/nebula/components/home/view.templ
@@ -5,15 +5,15 @@ import (
 	"github.com/onsonr/sonr/pkg/nebula/models"
 )
 
-templ View(hero *models.Hero) {
+templ View(home *models.Home) {
 	@blocks.LayoutNoBody("Sonr.ID", true) {
-		@MarketingHeader()
-		@SectionHero(hero)
+		@Header()
+		@SectionHero(home.Hero)
 		@Highlights()
 		@Features()
 		@Bento()
 		@Lowlights()
 		@CallToAction()
-		@MarketingFooter()
+		@Footer()
 	}
 }
diff --git a/pkg/nebula/components/home/view_templ.go b/pkg/nebula/components/home/view_templ.go
index 97190de17..93fd6732e 100644
--- a/pkg/nebula/components/home/view_templ.go
+++ b/pkg/nebula/components/home/view_templ.go
@@ -13,7 +13,7 @@ import (
 	"github.com/onsonr/sonr/pkg/nebula/models"
 )
 
-func View(hero *models.Hero) templ.Component {
+func View(home *models.Home) 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 {
@@ -46,7 +46,7 @@ func View(hero *models.Hero) templ.Component {
 				}()
 			}
 			ctx = templ.InitializeContext(ctx)
-			templ_7745c5c3_Err = MarketingHeader().Render(ctx, templ_7745c5c3_Buffer)
+			templ_7745c5c3_Err = Header().Render(ctx, templ_7745c5c3_Buffer)
 			if templ_7745c5c3_Err != nil {
 				return templ_7745c5c3_Err
 			}
@@ -54,7 +54,7 @@ func View(hero *models.Hero) templ.Component {
 			if templ_7745c5c3_Err != nil {
 				return templ_7745c5c3_Err
 			}
-			templ_7745c5c3_Err = SectionHero(hero).Render(ctx, templ_7745c5c3_Buffer)
+			templ_7745c5c3_Err = SectionHero(home.Hero).Render(ctx, templ_7745c5c3_Buffer)
 			if templ_7745c5c3_Err != nil {
 				return templ_7745c5c3_Err
 			}
@@ -102,7 +102,7 @@ func View(hero *models.Hero) templ.Component {
 			if templ_7745c5c3_Err != nil {
 				return templ_7745c5c3_Err
 			}
-			templ_7745c5c3_Err = MarketingFooter().Render(ctx, templ_7745c5c3_Buffer)
+			templ_7745c5c3_Err = Footer().Render(ctx, templ_7745c5c3_Buffer)
 			if templ_7745c5c3_Err != nil {
 				return templ_7745c5c3_Err
 			}
diff --git a/pkg/nebula/models/Bento.pkl.go b/pkg/nebula/models/Bento.pkl.go
new file mode 100644
index 000000000..524e9781c
--- /dev/null
+++ b/pkg/nebula/models/Bento.pkl.go
@@ -0,0 +1,12 @@
+// Code generated from Pkl module `models`. DO NOT EDIT.
+package models
+
+type Bento struct {
+	Title string `pkl:"title"`
+
+	Description string `pkl:"description"`
+
+	PrimaryButton *Button `pkl:"primaryButton"`
+
+	SecondaryButton *Button `pkl:"secondaryButton"`
+}
diff --git a/pkg/nebula/models/CallToAction.pkl.go b/pkg/nebula/models/CallToAction.pkl.go
new file mode 100644
index 000000000..00da5cd7c
--- /dev/null
+++ b/pkg/nebula/models/CallToAction.pkl.go
@@ -0,0 +1,12 @@
+// Code generated from Pkl module `models`. DO NOT EDIT.
+package models
+
+type CallToAction struct {
+	Title string `pkl:"title"`
+
+	Description string `pkl:"description"`
+
+	PrimaryButton *Button `pkl:"primaryButton"`
+
+	SecondaryButton *Button `pkl:"secondaryButton"`
+}
diff --git a/pkg/nebula/models/Features.pkl.go b/pkg/nebula/models/Features.pkl.go
new file mode 100644
index 000000000..2bb3e1fe7
--- /dev/null
+++ b/pkg/nebula/models/Features.pkl.go
@@ -0,0 +1,10 @@
+// Code generated from Pkl module `models`. DO NOT EDIT.
+package models
+
+type Features struct {
+	Title string `pkl:"title"`
+
+	Description string `pkl:"description"`
+
+	Image *Image `pkl:"image"`
+}
diff --git a/pkg/nebula/models/Hero.pkl.go b/pkg/nebula/models/Hero.pkl.go
index b85c72959..1001dc4a6 100644
--- a/pkg/nebula/models/Hero.pkl.go
+++ b/pkg/nebula/models/Hero.pkl.go
@@ -15,4 +15,6 @@ type Hero struct {
 	SecondaryButton *Button `pkl:"secondaryButton"`
 
 	Image *Image `pkl:"image"`
+
+	Stats []*Stat `pkl:"stats"`
 }
diff --git a/pkg/nebula/models/Highlights.pkl.go b/pkg/nebula/models/Highlights.pkl.go
new file mode 100644
index 000000000..9a45560c3
--- /dev/null
+++ b/pkg/nebula/models/Highlights.pkl.go
@@ -0,0 +1,10 @@
+// Code generated from Pkl module `models`. DO NOT EDIT.
+package models
+
+type Highlights struct {
+	Title string `pkl:"title"`
+
+	Description string `pkl:"description"`
+
+	Image *Image `pkl:"image"`
+}
diff --git a/pkg/nebula/models/Home.pkl.go b/pkg/nebula/models/Home.pkl.go
index 5b6bb46e8..9842d8afc 100644
--- a/pkg/nebula/models/Home.pkl.go
+++ b/pkg/nebula/models/Home.pkl.go
@@ -3,6 +3,4 @@ package models
 
 type Home struct {
 	Hero *Hero `pkl:"hero"`
-
-	Stats *Stats `pkl:"stats"`
 }
diff --git a/pkg/nebula/models/Lowlights.pkl.go b/pkg/nebula/models/Lowlights.pkl.go
new file mode 100644
index 000000000..8f160bb14
--- /dev/null
+++ b/pkg/nebula/models/Lowlights.pkl.go
@@ -0,0 +1,10 @@
+// Code generated from Pkl module `models`. DO NOT EDIT.
+package models
+
+type Lowlights struct {
+	Title string `pkl:"title"`
+
+	Description string `pkl:"description"`
+
+	Image *Image `pkl:"image"`
+}
diff --git a/pkg/nebula/models/init.pkl.go b/pkg/nebula/models/init.pkl.go
index d1b320a15..881069d3f 100644
--- a/pkg/nebula/models/init.pkl.go
+++ b/pkg/nebula/models/init.pkl.go
@@ -9,10 +9,15 @@ func init() {
 	pkl.RegisterMapping("models#Hero", Hero{})
 	pkl.RegisterMapping("models#Button", Button{})
 	pkl.RegisterMapping("models#Image", Image{})
-	pkl.RegisterMapping("models#Stats", Stats{})
+	pkl.RegisterMapping("models#Stat", Stat{})
 	pkl.RegisterMapping("models#Link", Link{})
 	pkl.RegisterMapping("models#SocialLink", SocialLink{})
 	pkl.RegisterMapping("models#Input", Input{})
+	pkl.RegisterMapping("models#Highlights", Highlights{})
+	pkl.RegisterMapping("models#Features", Features{})
+	pkl.RegisterMapping("models#Bento", Bento{})
+	pkl.RegisterMapping("models#Lowlights", Lowlights{})
+	pkl.RegisterMapping("models#CallToAction", CallToAction{})
 	pkl.RegisterMapping("models#Footer", Footer{})
 	pkl.RegisterMapping("models#RegistrationForm", RegistrationForm{})
 }
diff --git a/pkg/nebula/nebula.pkl b/pkg/nebula/nebula.pkl
index f37044ab8..df207120a 100644
--- a/pkg/nebula/nebula.pkl
+++ b/pkg/nebula/nebula.pkl
@@ -1,6 +1,7 @@
 amends "https://pkl.sh/uiux.pkl";
 
-hero = new Hero {
+home = new Home {
+	hero = new Hero {
 	titleFirst = "Simplified";
 	titleEmphasis = "self-custody";
 	titleSecond = "for everyone";
@@ -18,18 +19,19 @@ hero = new Hero {
 		width = "500";
 		height = "500";
 	};
+	stats {
+		new Stat {
+			value = "476K";
+			label = "Assets packed with power beyond your imagination.";
+		};
+		new Stat {
+			value = "1.44K";
+			label = "Assets packed with power beyond your imagination.";
+		};
+		new Stat {
+			value = "1.5M+";
+			label = "Assets packed with power beyond your imagination.";
+		}
+	};
 };
-
-stats = new Stats {
-	firstValue = "476K";
-	firstLabel = "Assets packed with power beyond your imagination.";
-	secondValue = "1.44K";
-	secondLabel = "Assets packed with power beyond your imagination.";
-	thirdValue = "1.5M+";
-	thirdLabel = "Assets packed with power beyond your imagination.";
-};
-
-home = new Home {
-	hero = hero;
-	stats = stats;
 };
diff --git a/pkg/nebula/pages/home.go b/pkg/nebula/pages/home.go
index 3c1b1e77b..fa112f367 100644
--- a/pkg/nebula/pages/home.go
+++ b/pkg/nebula/pages/home.go
@@ -12,5 +12,5 @@ func Home(c echo.Context) error {
 	if err != nil {
 		return err
 	}
-	return echoResponse(c, home.View(mdls.Home.Hero))
+	return echoResponse(c, home.View(mdls.Home))
 }
diff --git a/pkl/uiux.pkl b/pkl/uiux.pkl
index 4686dccf0..1ae9db528 100644
--- a/pkl/uiux.pkl
+++ b/pkl/uiux.pkl
@@ -5,7 +5,7 @@ module models
 import "package://pkg.pkl-lang.org/pkl-go/pkl.golang@0.5.0#/go.pkl"
 
 // ╭───────────────────────────────────────────────────────────╮
-// │                  General Components                       │
+// │                      General State                        │
 // ╰───────────────────────────────────────────────────────────╯
 
 typealias FormState = "initial" | "error" | "success" | "warning"
@@ -42,18 +42,24 @@ class Input {
 }
 
 // ╭───────────────────────────────────────────────────────────╮
-// │                  Homepage Components                      │
+// │                         Data Models                       │
 // ╰───────────────────────────────────────────────────────────╯
 
-class Stats {
-	firstValue: String	
-	firstLabel: String
-	secondValue: String
-	secondLabel: String
-	thirdValue: String
-	thirdLabel: String
+class Highlight {
+	title: String
+	description: String
+	image: Image
 }
 
+class Stat {
+	value: String	
+	label: String
+}
+
+// ╭───────────────────────────────────────────────────────────╮
+// │                  Homepage View Model                      │
+// ╰───────────────────────────────────────────────────────────╯
+
 class Hero {
 	titleFirst: String
 	titleEmphasis: String
@@ -62,6 +68,39 @@ class Hero {
   primaryButton: Button
   secondaryButton: Button
   image: Image
+  stats: Listing<Stat>
+}
+
+class Highlights {
+	title: String
+	description: String
+	image: Image
+}
+
+class Features {
+	title: String
+	description: String
+	image: Image
+}
+
+class Bento {
+	title: String
+	description: String
+	primaryButton: Button
+	secondaryButton: Button
+}
+
+class Lowlights {
+	title: String
+	description: String
+	image: Image
+}
+
+class CallToAction {
+	title: String
+	description: String
+	primaryButton: Button
+	secondaryButton: Button
 }
 
 class Footer {
@@ -70,19 +109,17 @@ class Footer {
 	twitterLink: SocialLink
 	discordLink: SocialLink
 	githubLink: SocialLink
-	companyLinks: List<Link>
-	resourcesLinks: List<Link>
+	companyLinks: Listing<Link>
+	resourcesLinks: Listing<Link>
 }
 
 class Home {
 	hero: Hero
-	stats: Stats
 }
 
-home : Home
 
 // ╭───────────────────────────────────────────────────────────╮
-// │                  Registration Components                  │
+// │                  Registration View Model                  │
 // ╰───────────────────────────────────────────────────────────╯
 
 class RegistrationForm {
@@ -92,3 +129,15 @@ class RegistrationForm {
 	inputs: List<Input>
 }
 
+// ╭───────────────────────────────────────────────────────────╮
+// │                    Login View Model                       │
+// ╰───────────────────────────────────────────────────────────╯
+
+
+
+// ╭───────────────────────────────────────────────────────────╮
+// │                    FINAL INPUTS                           │
+// ╰───────────────────────────────────────────────────────────╯
+
+// Pages
+home : Home