replace examples page with v2

htmgo-site/pages/examples.go

@@ -1,139 +0,0 @@
-package pages
-
-import (
-	"github.com/maddalax/htmgo/framework/h"
-)
-
-type Example struct {
-	Title       string
-	Github      string
-	Demo        string
-	Image       string
-	Description string
-}
-
-var examples = []Example{
-	{
-		Title:       "User Authentication Example",
-		Github:      "https://github.com/maddalax/htmgo/tree/master/examples/simple-auth",
-		Description: "An example showing basic user registration and login with htmgo",
-		Demo:        "https://auth-example.htmgo.dev",
-		Image:       "public/auth-example.jpg",
-	},
-	{
-		Title:       "Hacker News Clone",
-		Github:      "https://github.com/maddalax/htmgo/tree/master/examples/hackernews",
-		Description: "A hacker news reader clone built with htmgo",
-		Demo:        "https://hn.htmgo.dev",
-		Image:       "public/hn-example.jpg",
-	},
-	{
-		Title:       "Chat App Example",
-		Github:      "https://github.com/maddalax/htmgo/tree/master/examples/chat",
-		Description: "A simple chat application built with htmgo using SSE for real-time updates",
-		Demo:        "https://chat-example.htmgo.dev",
-		Image:       "public/chat-example.jpg",
-	},
-	{
-		Title:  "Todo List MVC",
-		Github: "https://github.com/maddalax/htmgo/tree/master/examples/todo-list",
-		Demo:   "https://todo-example.htmgo.dev",
-		Image:  "public/todo-example.jpg",
-	},
-	{
-		Title:  "htmgo.dev",
-		Github: "https://github.com/maddalax/htmgo/tree/master/htmgo-site",
-		Demo:   "https://htmgo.dev",
-		Image:  "public/htmgo-site.jpg",
-	},
-	{
-		Title:       "Form With Loading State",
-		Github:      "https://github.com/maddalax/htmgo/blob/master/htmgo-site/partials/snippets/form.go",
-		Demo:        "/snippets/form",
-		Description: "A simple form submission example with a loading state",
-	},
-}
-
-func ExamplesPage(ctx *h.RequestContext) *h.Page {
-	return PageWithNav(
-		ctx,
-		h.Div(
-			h.Class("flex items-center justify-center"),
-			h.Div(
-				h.Class("w-full px-4 flex flex-col prose max-w-[95vw] md:max-w-3xl mt-6"),
-				h.Div(
-					h.Class("flex flex-col mb-6 md:mb-0 md:flex-row justify-between items-center"),
-					h.Div(
-						h.H1(
-							h.Class("text-center md:text-left"),
-							h.Text("htmgo examples"),
-						),
-						h.H3(
-							h.Class("-mt-4"),
-							h.TextF("example projects built with htmgo"),
-						),
-					),
-				),
-				h.Div(
-					h.Class("border-b border-b-slate-200 h-1"),
-					h.Div(
-						h.Class("mt-4"),
-						ExampleCards(),
-					),
-				),
-			),
-		),
-	)
-}
-
-func ExampleCards() *h.Element {
-	return h.Div(
-		h.Class("prose-h2:my-1 prose-img:my-1 grid grid-cols-1 gap-6 text-center pb-8"),
-		h.List(examples, func(example Example, index int) *h.Element {
-			return h.Div(
-				h.Class("border border-gray-200 shadow-sm rounded-md px-4 pb-4 bg-neutral-100"),
-				h.Div(
-					h.Class("flex flex-col gap-1 mt-4"),
-					h.H2(
-						h.Class("text-lg text-center mb-1"),
-						h.Text(example.Title),
-					),
-					h.If(
-						example.Image != "",
-						h.Div(
-							h.A(
-								h.Href(example.Demo),
-								h.Class("not-prose"),
-								h.Img(
-									h.Src(example.Image),
-									h.Class("w-[75%] rounded-md mx-auto"),
-								),
-							),
-						),
-					),
-					h.If(
-						example.Description != "",
-						h.Div(
-							h.Pf(example.Description),
-						),
-					),
-					h.Div(
-						h.Div(
-							h.Class("flex gap-2 justify-center mt-2"),
-							h.A(
-								h.Href(example.Github),
-								h.Class("not-prose p-2 bg-slate-900 text-white rounded-md"),
-								h.Text("Github"),
-							),
-							h.A(
-								h.Href(example.Demo),
-								h.Class("not-prose p-2 bg-slate-900 text-white rounded-md"),
-								h.Text("Demo"),
-							),
-						),
-					),
-				),
-			)
-		}),
-	)
-}

htmgo-site/pages/examples/chat.go

@@ -1,4 +1,4 @@
-package snippets
+package examples
 
 import (
 	"github.com/maddalax/htmgo/framework/h"

htmgo-site/pages/examples/code.go

@@ -1,4 +1,4 @@
-package snippets
+package examples
 
 import (
 	"bytes"
@@ -8,14 +8,17 @@ import (
 	"io"
 	"log/slog"
 	"net/http"
+	"strings"
 	"time"
 )
 
 func GetGithubPath(path string) string {
+	path = strings.ReplaceAll(path, "/partials/examples/", "/partials/snippets/")
 	return fmt.Sprintf("https://github.com/maddalax/htmgo/tree/master/htmgo-site/partials%s.go", path)
 }
 
 func GetGithubRawPath(path string) string {
+	path = strings.ReplaceAll(path, "/examples/", "/snippets/")
 	return fmt.Sprintf("https://raw.githubusercontent.com/maddalax/htmgo/master/htmgo-site/partials%s.go", path)
 }
 

htmgo-site/pages/examples/data.go

@@ -1,4 +1,4 @@
-package snippets
+package examples
 
 import "github.com/maddalax/htmgo/framework/h"
 

htmgo-site/pages/examples/examples.go

@@ -1,14 +1,12 @@
-package snippets
+package examples
 
-import (
+import "htmgo-site/partials/snippets"
-	"htmgo-site/partials/snippets"
-)
 
 var FormWithLoadingStateSnippet = Snippet{
 	name:        "Form",
 	description: "A simple form submission example with a loading state",
 	sidebarName: "Form with loading state",
-	path:        "/snippets/form",
+	path:        "/examples/form",
 	partial:     snippets.FormExample,
 }
 
@@ -16,16 +14,16 @@ var UserAuthSnippet = Snippet{
 	name:           "User Authentication",
 	description:    "An example showing basic user registration and login with htmgo",
 	sidebarName:    "User Authentication",
-	path:           "/snippets/user-auth",
+	path:           "/examples/user-auth",
 	externalRoute:  "https://auth-example.htmgo.dev",
 	sourceCodePath: "https://github.com/maddalax/htmgo/tree/master/examples/simple-auth",
 }
 
 var ChatSnippet = Snippet{
 	name:           "Chat App",
-	description:    "A simple chat application built with htmgo",
+	description:    "A simple chat application built with htmgo using SSE for real-time updates",
 	sidebarName:    "Chat App",
-	path:           "/snippets/chat",
+	path:           "/examples/chat",
 	externalRoute:  "https://chat-example.htmgo.dev",
 	sourceCodePath: "https://github.com/maddalax/htmgo/tree/master/examples/chat",
 }
@@ -34,14 +32,34 @@ var HackerNewsSnippet = Snippet{
 	name:           "Hacker News Clone",
 	description:    "A hacker news reader clone built with htmgo",
 	sidebarName:    "Hacker News Clone",
-	path:           "/snippets/hackernews",
+	path:           "/examples/hackernews",
 	externalRoute:  "https://hn.htmgo.dev",
 	sourceCodePath: "https://github.com/maddalax/htmgo/tree/master/examples/hackernews",
 }
 
-var Snippets = []Snippet{
+var HtmgoSiteSnippet = Snippet{
+	name:           "Htmgo Doc Site",
+	description:    "The htmgo site built with htmgo, recursion am I right?",
+	sidebarName:    "Htmgo Doc Site",
+	path:           "/examples/htmgo-site",
+	externalRoute:  "https://htmgo.dev",
+	sourceCodePath: "https://github.com/maddalax/htmgo/tree/master/htmgo-site",
+}
+
+var TodoListSnippet = Snippet{
+	name:           "Todo List",
+	description:    "A todo list built with htmgo",
+	sidebarName:    "Todo List",
+	path:           "/examples/todolist",
+	externalRoute:  "https://todo-example.htmgo.dev",
+	sourceCodePath: "https://github.com/maddalax/htmgo/tree/master/examples/todo-list",
+}
+
+var examples = []Snippet{
 	FormWithLoadingStateSnippet,
 	UserAuthSnippet,
 	ChatSnippet,
 	HackerNewsSnippet,
+	TodoListSnippet,
+	HtmgoSiteSnippet,
 }

htmgo-site/pages/examples/form.go

@@ -1,4 +1,4 @@
-package snippets
+package examples
 
 import (
 	"github.com/maddalax/htmgo/framework/h"

htmgo-site/pages/examples/hackernews.go

@@ -1,4 +1,4 @@
-package snippets
+package examples
 
 import "github.com/maddalax/htmgo/framework/h"
 

htmgo-site/pages/examples/htmgo-site.go

@@ -0,0 +1,10 @@
+package examples
+
+import (
+	"github.com/maddalax/htmgo/framework/h"
+)
+
+func HtmgoSiteExample(ctx *h.RequestContext) *h.Page {
+	SetSnippet(ctx, &HtmgoSiteSnippet)
+	return Index(ctx)
+}

htmgo-site/pages/examples/index.go

@@ -1,4 +1,4 @@
-package snippets
+package examples
 
 import (
 	"github.com/maddalax/htmgo/framework/h"

htmgo-site/pages/examples/sidebar.go

@@ -1,4 +1,4 @@
-package snippets
+package examples
 
 import (
 	"github.com/maddalax/htmgo/framework/h"
@@ -18,7 +18,7 @@ func SnippetSidebar() *h.Element {
 			),
 			h.Div(
 				h.Class("flex flex-col gap-2"),
-				h.List(Snippets, func(entry Snippet, index int) *h.Element {
+				h.List(examples, func(entry Snippet, index int) *h.Element {
 					return h.A(
 						h.Href(entry.path),
 						h.Text(entry.sidebarName),

htmgo-site/pages/examples/todolist.go

@@ -0,0 +1,10 @@
+package examples
+
+import (
+	"github.com/maddalax/htmgo/framework/h"
+)
+
+func TodoListExample(ctx *h.RequestContext) *h.Page {
+	SetSnippet(ctx, &TodoListSnippet)
+	return Index(ctx)
+}

htmgo-site/pages/examples/user-auth.go

@@ -1,4 +1,4 @@
-package snippets
+package examples
 
 import (
 	"github.com/maddalax/htmgo/framework/h"