Add automatic generation of favourite buttons

favourite buttons are based on how often a good i added to list
finished implementing setting category
made number of days until button an environment variable

rebase on main and fix

ran cargo fmt

gui/ui/app.slint

@@ -7,13 +7,14 @@ import {
     CheckBox,
     ScrollView,
     GridBox,
+    HorizontalBox,
+    ComboBox,
     Palette, Spinner, SpinBox,
 } from "std-widgets.slint";
 import { SettingsView } from "settings.slint";
-import { ConnectionStatus, State, SItem } from "state.slint";
+import { ConnectionStatus, State, SItem, SButtonItem } from "state.slint";
 export { ConnectionStatus, State, SItem }
 
-
 component GoodListItem inherits Rectangle {
     in-out property <SItem> item;
     background: Palette.alternate-background;
@@ -178,43 +179,25 @@ component GoodsListAdd {
 }
 
 component GoodButtons inherits ScrollView {
-    in property <[string]> favorites: [
-        "Balsam",
-        "Broccolli",
-        "Bröd",
-        "Bullens",
-        "Krossade Tomater",
-        "Kyckling",
-        "Matgrädde",
-        "Mjölk",
-        "Nästejp",
-        "Ost",
-        "Schampo",
-        "Smör",
-        "Spenat",
-        "Tandkräm",
-        "Toalettpapper",
-        "Ägg",
-    ];
     in property <length> button-min-width: 100pt;
     in property <length> button-height: 60pt;
     in property <length> button-spacing: 10pt;
 
     property <int> count-x: floor(root.width / (button-min-width + button-spacing));
-    property <int> count-y: ceil(favorites.length / count-x);
+    property <int> count-y: ceil(State.favorites.length / count-x);
     property <length> button-width: ((self.width + button-spacing ) / count-x) - button-spacing;
 
     viewport-height: (count-y * (button-height + button-spacing));
     mouse-drag-pan-enabled: true;
 
-    for item[idx] in favorites: Button {
+    for item[idx] in State.favorites: Button {
         x: floor(mod(idx, count-x)) * (root.button-width + root.button-spacing);
         y: floor(idx / count-x) * (root.button-height + root.button-spacing);
         width: root.button-width;
         height: root.button-height;
-        text: item;
+        text: item.name;
         clicked => {
-            State.add-to-list(item);
+            State.add-to-list(item.name);
         }
     }
 }
@@ -321,6 +304,32 @@ component ShopView inherits VerticalLayout {
     }
 }
 
+component CatItem inherits HorizontalBox {
+    in-out property <SButtonItem> item;
+
+    Text {
+        text: item.name;
+        vertical-alignment: center;
+        font-size: 16px;
+    }
+
+    ComboBox {
+        model: ["kyl", "skafferi", "frys", "övrigt"];
+        current-value: item.category;
+        width: 60%;
+        selected(category) => { State.set-cat(item.name, category) }
+    }
+}
+
+
+component CatView inherits VerticalLayout {
+    in-out property <[SButtonItem]> cats;
+
+    for item in cats: CatItem {
+        item: item;
+    }
+}
+
 export component App inherits Window {
 
     title: "Inköpslista";
@@ -344,6 +353,13 @@ export component App inherits Window {
             }
         }
 
+        Tab {
+            title: "Categories";
+            CatView {
+                cats <=> State.favorites;
+            }
+        }
+
         Tab {
             title: "Settings";
             SettingsView { }