feat: add tailscale widget

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>
+  );
 };

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>
+  );
+};