Preserve widget order

MouseHatGames · Jan 2, 2021 · 62686a2 · 62686a2
1 parent 23a0ee8
commit 62686a2
Show file tree

Hide file tree

Showing 6 changed files with 57 additions and 12 deletions.
diff --git a/cmd/ui/config/config.go b/cmd/ui/config/config.go
@@ -4,6 +4,8 @@ import (
 	"fmt"
 	"io/ioutil"
 	"os"
+	"sort"
+	"strings"
 
 	"github.com/MouseHatGames/hat-ui/widget"
 	"gopkg.in/yaml.v3"
@@ -31,10 +33,29 @@ func Load(path string) (*Config, error) {
 	cfg := Config{
 		Endpoint: "127.0.0.1:4659",
 	}
+	cfg.Dashboard.Columns = 3
 
 	if err := yaml.Unmarshal(f, &cfg); err != nil {
 		return nil, fmt.Errorf("parse yaml: %w", err)
 	}
 
+	for p, v := range cfg.Widgets {
+		v.Path = p
+	}
+
 	return &cfg, nil
 }
+
+func (c *Config) OrderedWidgets() []*widget.Widget {
+	all := make([]*widget.Widget, 0, len(c.Widgets))
+
+	for _, w := range c.Widgets {
+		all = append(all, w)
+	}
+
+	sort.Slice(all, func(i, j int) bool {
+		return strings.Compare(all[i].Path, all[j].Path) > 0
+	})
+
+	return all
+}
diff --git a/cmd/ui/front/src/components/Dashboard.vue b/cmd/ui/front/src/components/Dashboard.vue
@@ -23,31 +23,29 @@ export default defineComponent({
         Widget: WidgetComponent
     },
     setup() {
-        const widgets = ref<WidgetRow[]>()
+        const widgets = ref<Widget[][]>()
         const data = ref<Record<string, any>>()
         
         function refresh() {
             widgets.value = null;
             data.value = null;
             
             axios.get<{
-                widgets: WidgetRow
+                widgets: Widget[]
                 columns: number
                 data: any
             }>("/api/data").then(resp => {
                 var rows: WidgetRow[] = []
                 var currentRow: WidgetRow = {}
                 var i = 0;
 
-                for (const path in resp.data.widgets) {
-                    const widget = resp.data.widgets[path];
-
+                for (const widget of resp.data.widgets) {
                     if (i++ == resp.data.columns) {
                         rows.push(currentRow);
                         currentRow = {};
                     }
 
-                    currentRow[path] = widget;
+                    currentRow[widget.path] = widget;
                 }
                 rows.push(currentRow);
 

diff --git a/cmd/ui/front/src/components/Widget.vue b/cmd/ui/front/src/components/Widget.vue
@@ -19,7 +19,7 @@
                     .dropdown-menu
                         .dropdown-content
                             .dropdown-item
-                                | There was an error submitting the changes to this value.
+                                | There was an error submitting the changes.
                                 | Press 'r' to reload.
 
     .card-content.p-1.pt-2(v-if="widget.type == 'group'")

diff --git a/cmd/ui/front/src/types/widget.ts b/cmd/ui/front/src/types/widget.ts
@@ -3,6 +3,7 @@ export type Widget = WidgetOnOff | WidgetText | WidgetGroup | WidgetOptions;
 export interface WidgetBase {
     title: string;
     description?: string;
+    path: string;
 }
 
 export interface WidgetOnOff extends WidgetBase {

diff --git a/cmd/ui/main.go b/cmd/ui/main.go
@@ -26,13 +26,13 @@ func main() {
 	app := iris.New()
 	app.Get("/api/data", func(ctx iris.Context) {
 		resp := &struct {
-			Widgets map[string]*widget.Widget `json:"widgets"`
-			Columns int                       `json:"columns"`
-			Data    map[string]interface{}    `json:"data"`
+			Widgets []*widget.Widget       `json:"widgets"`
+			Columns int                    `json:"columns"`
+			Data    map[string]interface{} `json:"data"`
 		}{
-			Widgets: cfg.Widgets,
+			Widgets: cfg.OrderedWidgets(),
 			Columns: cfg.Dashboard.Columns,
-			Data:    make(map[string]interface{}),
+			Data:    make(map[string]interface{}, len(cfg.Widgets)),
 		}
 
 		for path, w := range cfg.Widgets {
@@ -69,6 +69,7 @@ func main() {
 
 		if err := hat.Set(string(body), client.SplitPath(path)...); err != nil {
 			ctx.StatusCode(iris.StatusInternalServerError)
+			log.Printf("failed to set value: %s", err)
 		}
 	})
 

diff --git a/cmd/ui/widget/widget.go b/cmd/ui/widget/widget.go
@@ -10,6 +10,7 @@ import (
 )
 
 var (
+	ErrMissingType      = errors.New("missing type")
 	ErrMissingTitle     = errors.New("missing title")
 	ErrInvalidOptions   = errors.New("invalid options")
 	ErrMissingChildren  = errors.New("missing group children")
@@ -29,6 +30,9 @@ const (
 )
 
 type Widget struct {
+	// Used because map order is not preserved when marshalling to JSON
+	Path string `json:"path" yaml:"-"`
+
 	Title       string     `json:"title" yaml:"title"`
 	Type        WidgetType `json:"type" yaml:"type"`
 	Description string     `json:"description,omitempty" yaml:"description"`
@@ -65,11 +69,31 @@ func (w *Widget) UnmarshalYAML(value *yaml.Node) error {
 	return nil
 }
 
+func (w *Widget) guessType() WidgetType {
+	if w.Placeholder != "" || w.Big != false {
+		return WidgetText
+	} else if w.Children != nil {
+		return WidgetGroup
+	} else if w.Options != nil {
+		return WidgetOptions
+	}
+
+	return ""
+}
+
 func (w *Widget) isValid() (reason error) {
 	if w.Title == "" {
 		return ErrMissingTitle
 	}
 
+	if w.Type == "" {
+		if guess := w.guessType(); guess != "" {
+			w.Type = guess
+		} else {
+			return ErrMissingType
+		}
+	}
+
 	switch w.Type {
 	case WidgetOnOff:
 		if w.Placeholder != "" || w.Big || w.Children != nil || w.Options != nil {