Swap Bulma for DaisyUI (Tailwind) (#111)

pkg/ui/components/alerts.go

@@ -3,62 +3,64 @@ package components
 import (
 	"github.com/mikestefanello/pagoda/pkg/msg"
 	"github.com/mikestefanello/pagoda/pkg/ui"
+	"github.com/mikestefanello/pagoda/pkg/ui/icons"
 	. "maragu.dev/gomponents"
 	. "maragu.dev/gomponents/html"
 )
 
 func FlashMessages(r *ui.Request) Node {
 	var g Group
+	var color Color
+
 	for _, typ := range []msg.Type{
 		msg.TypeSuccess,
 		msg.TypeInfo,
 		msg.TypeWarning,
-		msg.TypeDanger,
+		msg.TypeError,
 	} {
 		for _, str := range msg.Get(r.Context, typ) {
-			g = append(g, Notification(typ, str))
+			switch typ {
+			case msg.TypeSuccess:
+				color = ColorSuccess
+			case msg.TypeInfo:
+				color = ColorInfo
+			case msg.TypeWarning:
+				color = ColorWarning
+			case msg.TypeError:
+				color = ColorError
+			}
+
+			g = append(g, Alert(color, str))
 		}
 	}
 
 	return g
 }
 
-func Notification(typ msg.Type, text string) Node {
+func Alert(color Color, text string) Node {
 	var class string
 
-	switch typ {
-	case msg.TypeSuccess:
-		class = "success"
-	case msg.TypeInfo:
-		class = "info"
-	case msg.TypeWarning:
-		class = "warning"
-	case msg.TypeDanger:
-		class = "danger"
+	switch color {
+	case ColorSuccess:
+		class = "alert-success"
+	case ColorInfo:
+		class = "alert-info"
+	case ColorWarning:
+		class = "alert-warning"
+	case ColorError:
+		class = "alert-error"
 	}
 
 	return Div(
-		Class("notification is-"+class),
+		Role("alert"),
+		Class("alert mb-2 "+class),
 		Attr("x-data", "{show: true}"),
 		Attr("x-show", "show"),
-		Button(
-			Class("delete"),
+		Span(
 			Attr("@click", "show = false"),
+			Class("cursor-pointer"),
+			icons.XCircle(),
 		),
-		Text(text),
-	)
-}
-
-func Message(class, header string, body Node) Node {
-	return Article(
-		Class("message "+class),
-		If(header != "", Div(
-			Class("message-header"),
-			P(Text(header)),
-		)),
-		Div(
-			Class("message-body"),
-			body,
-		),
+		Span(Text(text)),
 	)
 }