feat(agsV2): add clock

nixosModules/ags/v2/widgets/bar/items/clock.tsx

@@ -0,0 +1,31 @@
+import { bind, Variable } from 'astal';
+
+import GLib from 'gi://GLib?version=2.0';
+
+
+export default () => {
+    const timeVar = Variable<string>('').poll(1000, (prev) => {
+        const time = GLib.DateTime.new_now_local();
+
+        const dayName = time.format('%a. ');
+        const dayNum = time.get_day_of_month();
+        const date = time.format(' %b. ');
+        const hour = (new Date().toLocaleString([], {
+            hour: 'numeric',
+            minute: 'numeric',
+            hour12: true,
+        }) ?? '')
+            .replace('a.m.', 'AM')
+            .replace('p.m.', 'PM');
+
+        return (dayNum && dayName && date) ?
+            (dayName + dayNum + date + hour) :
+            prev;
+    });
+
+    return (
+        <box className="bar-item">
+            <label label={bind(timeVar)} />
+        </box>
+    );
+};

nixosModules/ags/v2/widgets/bar/wim.tsx

@@ -1,38 +1,38 @@
 import { Astal, Gtk } from 'astal';
 
 import Battery from './items/battery';
+import Clock from './items/clock';
 import CurrentClient from './items/current-client';
 
 import BarRevealer from './fullscreen';
 import Separator from '../misc/separator';
 
 
-export default () => {
-    return (
-        <BarRevealer
-            exclusivity={Astal.Exclusivity.EXCLUSIVE}
-            anchor={
-                Astal.WindowAnchor.TOP |
-                Astal.WindowAnchor.LEFT |
-                Astal.WindowAnchor.RIGHT
-            }
-        >
+export default () => (
+    <BarRevealer
+        exclusivity={Astal.Exclusivity.EXCLUSIVE}
+        anchor={
+            Astal.WindowAnchor.TOP |
+            Astal.WindowAnchor.LEFT |
+            Astal.WindowAnchor.RIGHT
+        }
+    >
 
-            <centerbox className="bar widget">
-                <box hexpand halign={Gtk.Align.START}>
-                    <CurrentClient />
-                </box>
+        <centerbox className="bar widget">
+            <box hexpand halign={Gtk.Align.START}>
+                <CurrentClient />
+            </box>
 
-                <box>
-                </box>
+            <box>
+                <Clock />
+            </box>
 
-                <box hexpand halign={Gtk.Align.END}>
-                    <Battery />
+            <box hexpand halign={Gtk.Align.END}>
+                <Battery />
 
-                    <Separator size={2} />
-                </box>
-            </centerbox>
+                <Separator size={2} />
+            </box>
+        </centerbox>
 
-        </BarRevealer>
-    );
-};
+    </BarRevealer>
+);