From ece15c40d191cd5ddd6eb0f4df02f9bf6c97bb5d Mon Sep 17 00:00:00 2001
From: tux <t@tux.rs>
Date: Sat, 31 May 2025 17:36:47 +0530
Subject: [PATCH] feat: add tailscale widget

---
 widget/bar/index.tsx     |  8 +++++++-
 widget/bar/tailscale.tsx | 20 ++++++++++++++++++++
 2 files changed, 27 insertions(+), 1 deletion(-)
 create mode 100644 widget/bar/tailscale.tsx

diff --git a/widget/bar/index.tsx b/widget/bar/index.tsx
index 914d8ea..5c45a77 100644
--- a/widget/bar/index.tsx
+++ b/widget/bar/index.tsx
@@ -2,6 +2,7 @@ import { App, Astal, Gdk } from "astal/gtk4";
 import { FocusedClient, WorkspaceButton } from "./workspace";
 import { Battery } from "./battery";
 import { Launcher } from "./launcher";
+import { Tailscale } from "./tailscale";
 
 export const WINDOW_NAME = "bar";
 
@@ -41,5 +42,10 @@ const Center = () => {
 };
 
 const End = () => {
-  return <Battery />;
+  return (
+    <box spacing={15}>
+      <Tailscale />
+      <Battery />
+    </box>
+  );
 };
diff --git a/widget/bar/tailscale.tsx b/widget/bar/tailscale.tsx
new file mode 100644
index 0000000..d1ce343
--- /dev/null
+++ b/widget/bar/tailscale.tsx
@@ -0,0 +1,20 @@
+import { bind, Variable } from "astal";
+
+export const Tailscale = () => {
+  const tailscale = Variable("").poll(5000, [
+    "bash",
+    "-c",
+    "tailscale ping vega",
+  ]);
+
+  return (
+    <box cssClasses={["tailscale"]}>
+      <label
+        label={bind(tailscale).as((val) => {
+          const data = val.split(" ");
+          return data[data.length - 1];
+        })}
+      />
+    </box>
+  );
+};