Add footer buttons

ui/app-window.slint

@@ -2,25 +2,20 @@ import { AboutSlint, Button, Palette, HorizontalBox, ScrollView } from "std-widg
 import { Timeline } from "timeline.slint";
 import { ImageViewer } from "image-viewer.slint";
 import { LoginView } from "login.slint";
+import { Header } from "header.slint";
+import { Footer, FooterButton } from "footer.slint";
 
 import { Global } from "global.slint";
 export { Global }
 
-component Header inherits Rectangle {
-    width: 100%;
-    height: 48px;
-    background: Palette.alternate-background;
-
-    HorizontalBox {
-        height: parent.height;
-        Text {
-            text: "immich";
-        }
-    }
+enum View {
+    Timeline,
+    Albums
 }
 
 export component AppWindow inherits Window {
     out property <length> window-height: self.height;
+    out property <View> view: View.Timeline;
 
     // Do not base preferred-width on children
     preferred-width: 480px;
@@ -36,7 +31,28 @@ export component AppWindow inherits Window {
         Header {}
         
         if !Global.logged-in: LoginView {}
-        if Global.logged-in: Timeline {}
+        if Global.logged-in && view == View.Timeline: Timeline {}
+
+        Footer {
+            FooterButton {
+                title: "Photos";
+                icon: @image-url("../assets/photos.svg");
+                clicked => { view = View.Timeline }
+            }
+            FooterButton {
+                title: "Search";
+                icon: @image-url("../assets/search.svg");
+            }
+            FooterButton {
+                title: "Album";
+                icon: @image-url("../assets/album.svg");
+                clicked => { view = View.Albums}
+            }
+            FooterButton {
+                title: "Library";
+                icon: @image-url("../assets/album.svg"); // TODO
+            }
+        }
     }
 
     if Global.viewed-image.asset-id != "" : ImageViewer {