From 2dcc17cbb2ec9ac568ac766a5ff1fc974c65b743 Mon Sep 17 00:00:00 2001
From: matt1432 <matt@nelim.org>
Date: Fri, 27 Sep 2024 16:52:33 -0400
Subject: [PATCH] feat(agsV2): add clock

---
 .../ags/v2/widgets/bar/items/clock.tsx        | 31 ++++++++++++
 nixosModules/ags/v2/widgets/bar/wim.tsx       | 48 +++++++++----------
 2 files changed, 55 insertions(+), 24 deletions(-)
 create mode 100644 nixosModules/ags/v2/widgets/bar/items/clock.tsx

diff --git a/nixosModules/ags/v2/widgets/bar/items/clock.tsx b/nixosModules/ags/v2/widgets/bar/items/clock.tsx
new file mode 100644
index 00000000..9844bc42
--- /dev/null
+++ b/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>
+    );
+};
diff --git a/nixosModules/ags/v2/widgets/bar/wim.tsx b/nixosModules/ags/v2/widgets/bar/wim.tsx
index fed9fab5..75d79b27 100644
--- a/nixosModules/ags/v2/widgets/bar/wim.tsx
+++ b/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>
+);