More progress

"YoUR ComMIt meSsAgeS aRE BaD anD NOn-dEScRiPTIve!!!"

Shut up, I'm lazy and so were you.

src/internal/ui/layout.go

@@ -3,14 +3,11 @@ package ui
 import (
 	"icdb/internal/ui/styling"
 	"icdb/pkg/layouts"
-	t_ui "icdb/pkg/types/ui"
 
 	"gioui.org/app"
 	"gioui.org/op"
 )
 
-var currentView t_ui.UIView = t_ui.UIViewHome
-
 // run takes a window as parameter and runs the UI on it.
 func run(window *app.Window) error {
 	theme := styling.GlobalTheme()

src/internal/ui/routing/routing.go

@@ -0,0 +1,27 @@
+package routing
+
+import (
+	t_ui "icdb/pkg/types/ui"
+)
+
+var currentView t_ui.UIView = t_ui.UIViewHome
+var previousView t_ui.UIView
+
+// Next changes the current view to the specified view.
+// It sets the previous view to the current view before changing the view.
+func Next(view t_ui.UIView) {
+	previousView = currentView
+	currentView = view
+}
+
+// Previous changes the current view to the previous view.
+func Previous() {
+	current := currentView
+	currentView = previousView
+	previousView = current
+}
+
+// Current returns the currently active view.
+func Current() t_ui.UIView {
+	return currentView
+}

src/internal/ui/sidebar.go

@@ -1,6 +1,8 @@
 package ui
 
 import (
+	"icdb/internal/ui/routing"
+	"icdb/internal/ui/widgets"
 	t_ui "icdb/pkg/types/ui"
 	"image"
 	"image/color"
@@ -15,9 +17,11 @@ import (
 )
 
 var (
-	mainButton     widget.Clickable
+	mainButton       widget.Clickable
-	partsButton    widget.Clickable
+	partsButton      widget.Clickable
-	settingsButton widget.Clickable
+	categoriesButton widget.Clickable
+	locationsButton  widget.Clickable
+	settingsButton   widget.Clickable
 )
 
 var sidebarWidth = unit.Dp(200)
@@ -36,6 +40,14 @@ func renderSidebar(th *material.Theme) layout.Widget {
 					Max: gtx.Constraints.Max,
 				}
 				paint.FillShape(gtx.Ops, sidebarBackground, rect.Op())
+
+				widgets.DrawLine(
+					gtx.Ops,
+					image.Pt(gtx.Constraints.Max.X, 0),
+					image.Pt(0, gtx.Constraints.Max.Y),
+					2,
+					color.NRGBA{R: 204, G: 204, B: 204, A: 255},
+				)
 				return layout.Dimensions{Size: gtx.Constraints.Max}
 			}),
 			// Stacked: Lay out the navigation buttons.
@@ -53,7 +65,9 @@ func renderSidebar(th *material.Theme) layout.Widget {
 						Alignment: layout.Start,
 					}.Layout(gtx,
 						layout.Rigid(renderNavButton(th, icons.ActionHome, "Main", &mainButton, t_ui.UIViewHome)),
-						layout.Rigid(renderNavButton(th, icons.ActionBuild, "Parts", &partsButton, t_ui.UIViewParts)),
+						layout.Rigid(renderNavButton(th, icons.ActionList, "Parts", &partsButton, t_ui.UIViewParts)),
+						layout.Rigid(renderNavButton(th, icons.ActionClass, "Categories", &categoriesButton, t_ui.UIViewCategories)),
+						layout.Rigid(renderNavButton(th, icons.ContentInbox, "Locations", &locationsButton, t_ui.UIViewLocations)),
 						layout.Rigid(renderNavButton(th, icons.ActionSettings, "Settings", &settingsButton, t_ui.UIViewSettings)),
 					)
 				})
@@ -66,7 +80,7 @@ func renderSidebar(th *material.Theme) layout.Widget {
 func renderNavButton(th *material.Theme, icon *widget.Icon, label string, btn *widget.Clickable, target t_ui.UIView) layout.Widget {
 	return func(gtx layout.Context) layout.Dimensions {
 		if btn.Clicked(gtx) {
-			currentView = target
+			routing.Next(target)
 		}
 
 		// Padding for each button, to add spacing between them.

src/internal/ui/styling/theme.go

@@ -1,17 +1,16 @@
 package styling
 
 import (
-	"image/color"
+	"icdb/pkg/types/ui/colors"
 
 	"gioui.org/widget/material"
-	"golang.org/x/image/colornames"
 )
 
 // GlobalTheme returns an instance of the global application theme.
 func GlobalTheme() *material.Theme {
 	theme := material.NewTheme()
-	theme.Palette.Bg = color.NRGBA(colornames.White)
+	theme.Palette.Bg = colors.White
-	theme.Palette.Fg = color.NRGBA(colornames.Black)
+	theme.Palette.Fg = colors.Black
-	theme.ContrastBg = color.NRGBA(colornames.Orange)
+	theme.ContrastBg = colors.Blue
 	return theme
 }

src/internal/ui/ui.go

@@ -15,6 +15,7 @@ func Init() {
 		window.Option(app.Title("ICDB"))
 		window.Option(app.MinSize(unit.Dp(700), unit.Dp(400)))
 		window.Option(app.Size(unit.Dp(800), unit.Dp(600)))
+		window.Option(app.Orientation.Option(app.LandscapeOrientation))
 		err := run(window)
 		if err != nil {
 			log.Fatal().Err(err).Msg("UI loop exited with error")

src/internal/ui/views.go

@@ -1,6 +1,7 @@
 package ui
 
 import (
+	"icdb/internal/ui/routing"
 	"icdb/internal/ui/views"
 	t_ui "icdb/pkg/types/ui"
 
@@ -11,11 +12,15 @@ import (
 // renderView dynamically loads the selected view
 func renderView(th *material.Theme) layout.Widget {
 	return func(gtx layout.Context) layout.Dimensions {
-		switch currentView {
+		switch routing.Current() {
 		case t_ui.UIViewHome:
 			return views.HomeView(gtx, th)
 		case t_ui.UIViewParts:
 			return views.PartsView(gtx, th)
+		case t_ui.UIViewCategories:
+			return views.CategoriesView(gtx, th)
+		case t_ui.UIViewLocations:
+			return views.LocationsView(gtx, th)
 		case t_ui.UIViewSettings:
 			return views.SettingsView(gtx, th)
 		default:

src/internal/ui/views/categories.go

@@ -0,0 +1,13 @@
+package views
+
+import (
+	"gioui.org/layout"
+	"gioui.org/text"
+	"gioui.org/widget/material"
+)
+
+func CategoriesView(gtx layout.Context, th *material.Theme) layout.Dimensions {
+	title := material.H4(th, "Categories")
+	title.Alignment = text.Middle
+	return title.Layout(gtx)
+}

src/internal/ui/views/locations.go

@@ -0,0 +1,13 @@
+package views
+
+import (
+	"gioui.org/layout"
+	"gioui.org/text"
+	"gioui.org/widget/material"
+)
+
+func LocationsView(gtx layout.Context, th *material.Theme) layout.Dimensions {
+	title := material.H4(th, "Locations")
+	title.Alignment = text.Middle
+	return title.Layout(gtx)
+}

src/internal/ui/views/parts.go

@@ -1,13 +1,99 @@
 package views
 
 import (
+	"icdb/internal/ui/widgets"
+	"icdb/pkg/layouts"
+	"image/color"
+
 	"gioui.org/layout"
 	"gioui.org/text"
+	"gioui.org/unit"
+	"gioui.org/widget"
 	"gioui.org/widget/material"
 )
 
+var (
+	searchInput  widget.Editor
+	searchButton widget.Clickable
+	clearButton  widget.Clickable
+)
+
+// PartsView returns the widget for the parts view.
 func PartsView(gtx layout.Context, th *material.Theme) layout.Dimensions {
-	title := material.H2(th, "Parts")
+	return layout.Flex{
-	title.Alignment = text.Middle
+		Axis:    layout.Vertical,
-	return title.Layout(gtx)
+		Spacing: layout.SpaceEnd,
+	}.Layout(gtx,
+		layout.Rigid(func(gtx layout.Context) layout.Dimensions {
+			title := material.H4(th, "Part Database")
+			title.Alignment = text.Middle
+			return title.Layout(gtx)
+		}),
+		layout.Rigid(layouts.FixedMaxSize(func(gtx layout.Context) layout.Dimensions {
+			return layout.Flex{
+				Alignment: layout.Alignment(layout.Center),
+				Axis:      layout.Horizontal,
+				Spacing:   layout.SpaceAround,
+			}.Layout(gtx,
+				layout.Rigid(renderSearchBar(th)),
+			)
+		}, gtx.Constraints.Max.X, 100)),
+		layout.Rigid(func(gtx layout.Context) layout.Dimensions {
+			return widgets.SeparatorHorizontal(gtx)
+		}),
+	)
+}
+
+// renderSearchBar returns the widget for the parts view search bar.
+func renderSearchBar(th *material.Theme) layout.Widget {
+	return func(gtx layout.Context) layout.Dimensions {
+		return layout.Flex{
+			Axis:    layout.Horizontal,
+			Spacing: layout.SpaceBetween,
+		}.Layout(gtx,
+			// Clear button
+			layout.Rigid(func(gtx layout.Context) layout.Dimensions {
+				margins := layout.UniformInset(unit.Dp(10))
+				btn := material.Button(th, &clearButton, "Clear")
+
+				return margins.Layout(gtx,
+					func(gtx layout.Context) layout.Dimensions {
+						return btn.Layout(gtx)
+					},
+				)
+			}),
+			// Search bar input
+			layout.Rigid(func(gtx layout.Context) layout.Dimensions {
+				ed := material.Editor(th, &searchInput, "search")
+
+				searchInput.SingleLine = true
+				searchInput.Alignment = text.Middle
+
+				margins := layout.UniformInset(unit.Dp(10))
+
+				border := widget.Border{
+					Color:        color.NRGBA{R: 204, G: 204, B: 204, A: 255},
+					CornerRadius: unit.Dp(3),
+					Width:        unit.Dp(2),
+				}
+
+				return margins.Layout(gtx,
+					func(gtx layout.Context) layout.Dimensions {
+						return border.Layout(gtx, layouts.FixedSize(ed.Layout, 300, 37))
+					},
+				)
+			}),
+			// Search button
+			layout.Rigid(func(gtx layout.Context) layout.Dimensions {
+				margins := layout.UniformInset(unit.Dp(10))
+				btn := material.Button(th, &searchButton, "Search")
+
+				return margins.Layout(gtx,
+					func(gtx layout.Context) layout.Dimensions {
+						return btn.Layout(gtx)
+					},
+				)
+			}),
+		)
+	}
 }

src/internal/ui/views/settings.go

@@ -7,7 +7,7 @@ import (
 )
 
 func SettingsView(gtx layout.Context, th *material.Theme) layout.Dimensions {
-	title := material.H2(th, "Settings")
+	title := material.H4(th, "Settings")
 	title.Alignment = text.Middle
 	return title.Layout(gtx)
 }

src/internal/ui/widgets/line.go

@@ -0,0 +1,25 @@
+package widgets
+
+import (
+	"image"
+	"image/color"
+
+	"gioui.org/f32"
+	"gioui.org/op"
+	"gioui.org/op/clip"
+	"gioui.org/op/paint"
+)
+
+// DrawLine draws a line between two points.
+func DrawLine(ops *op.Ops, start image.Point, end image.Point, width int, color color.NRGBA) {
+	var path clip.Path
+	min := f32.Pt(float32(start.X), float32(start.Y))
+	max := f32.Pt(float32(end.X), float32(end.Y))
+	path.Begin(ops)
+	path.Move(min)
+	path.Line(max)
+	paint.FillShape(ops, color, clip.Stroke{
+		Path:  path.End(),
+		Width: float32(width),
+	}.Op())
+}

src/internal/ui/widgets/separators.go

@@ -0,0 +1,21 @@
+package widgets
+
+import (
+	"image"
+	"image/color"
+
+	"gioui.org/layout"
+)
+
+var (
+	lineColor color.NRGBA = color.NRGBA{R: 204, G: 204, B: 204, A: 255}
+)
+
+func SeparatorHorizontal(gtx layout.Context) layout.Dimensions {
+	min := image.Pt(0, 0)
+	max := image.Pt(gtx.Constraints.Max.X, gtx.Constraints.Min.Y)
+	DrawLine(gtx.Ops, min, max, 2, lineColor)
+	return layout.Dimensions{
+		Size: image.Pt(max.X, max.Y),
+	}
+}

src/pkg/layouts/size.go

@@ -0,0 +1,32 @@
+package layouts
+
+import (
+	"image"
+
+	"gioui.org/layout"
+)
+
+// FixedMinSize returns a wrapper widget around the provided widget with a fixed minimum constraint.
+func FixedMinSize(w layout.Widget, width, height int) layout.Widget {
+	return func(gtx layout.Context) layout.Dimensions {
+		gtx.Constraints.Min = image.Pt(width, height)
+		return w(gtx)
+	}
+}
+
+// FixedMaxSize returns a wrapper widget around the provided widget with a fixed maximum constraint.
+func FixedMaxSize(w layout.Widget, width, height int) layout.Widget {
+	return func(gtx layout.Context) layout.Dimensions {
+		gtx.Constraints.Max = image.Pt(width, height)
+		return w(gtx)
+	}
+}
+
+// FixedSize returns a wrapper widget around the provided widget with a fixed constraint.
+func FixedSize(w layout.Widget, width, height int) layout.Widget {
+	return func(gtx layout.Context) layout.Dimensions {
+		gtx.Constraints.Min = image.Pt(width, height)
+		gtx.Constraints.Min = image.Pt(width, height)
+		return w(gtx)
+	}
+}

src/pkg/types/ui/colors/colors.go

@@ -0,0 +1,29 @@
+package colors
+
+import "image/color"
+
+// These colors are based on the '700' shade of the material UI color palette.
+// There is a package for it here: https://pkg.go.dev/golang.org/x/exp/shiny@v0.0.0-20250128182459-e0ece0dbea4c/materialdesign/colornames
+var (
+	Red        = color.NRGBA{211, 47, 47, 255}
+	Pink       = color.NRGBA{194, 24, 91, 255}
+	Purple     = color.NRGBA{123, 31, 162, 255}
+	DeepPurple = color.NRGBA{81, 45, 168, 255}
+	Indigo     = color.NRGBA{48, 63, 159, 255}
+	Blue       = color.NRGBA{25, 118, 210, 255}
+	LightBlue  = color.NRGBA{2, 136, 209, 255}
+	Cyan       = color.NRGBA{0, 151, 167, 255}
+	Teal       = color.NRGBA{0, 121, 107, 255}
+	Green      = color.NRGBA{56, 142, 60, 255}
+	LightGreen = color.NRGBA{104, 159, 56, 255}
+	Lime       = color.NRGBA{175, 180, 43, 255}
+	Yellow     = color.NRGBA{251, 192, 45, 255}
+	Amber      = color.NRGBA{255, 160, 0, 255}
+	Orange     = color.NRGBA{245, 124, 0, 255}
+	DeepOrange = color.NRGBA{230, 74, 25, 255}
+	Brown      = color.NRGBA{93, 64, 55, 255}
+	Grey       = color.NRGBA{97, 97, 97, 255}
+	BlueGrey   = color.NRGBA{69, 90, 100, 255}
+	Black      = color.NRGBA{0, 0, 0, 255}
+	White      = color.NRGBA{255, 255, 255, 255}
+)