[AGS] Prepare bar

config/ags/bar/ui/Bar.tsx

@@ -1,36 +1,23 @@
-import { App, Astal, Gtk, Gdk } from "astal/gtk4"
-import { Variable } from "astal"
+import { createQuickActionsMenu } from "./QuickActions";
+import { GLib } from "astal";
+import { Astal, Gdk, Gtk } from "astal/gtk3";
 
-const time = Variable("").poll(1000, "date")
+const Bar = (gdkmonitor: Gdk.Monitor) => {
 
-export default function Bar(gdkmonitor: Gdk.Monitor) {
-    const { TOP, LEFT, RIGHT } = Astal.WindowAnchor
-
-    return <window
-        visible
-        cssClasses={["Bar"]}
-        gdkmonitor={gdkmonitor}
-        exclusivity={Astal.Exclusivity.EXCLUSIVE}
-        anchor={TOP | LEFT | RIGHT}
-        application={App}>
-        <centerbox cssName="centerbox">
-            <button
-                onClicked="echo hello"
-                hexpand
-                halign={Gtk.Align.CENTER}
-            >
-                Welcome to AGS!
-            </button>
-            <box />
-            <menubutton
-                hexpand
-                halign={Gtk.Align.CENTER}
-            >
-                <label label={time()} />
-                <popover>
-                    <Gtk.Calendar />
-                </popover>
-            </menubutton>
-        </centerbox>
-    </window>
+    return (
+        <window gdkmonitor={gdkmonitor}
+            cssClasses={["Bar"]}>
+            <box orientation={Gtk.Orientation.HORIZONTAL} spacing={10}>
+                <box>
+                </box>
+                <label>{windowTitle}</label>
+                <box>
+                    <tray />
+                    <button icon="quickaction" menu={quickActionMenu} />
+                </box>
+            </box>
+        </window>
+    );
 }
+
+export default Bar;