Add Tailscale panel connection controls
This commit is contained in:
David Heinemeier Hansson
@@ -0,0 +1,149 @@
|
|||||||
|
function filterIPv4(ips) {
|
||||||
|
var result = []
|
||||||
|
if (!ips || typeof ips.length !== "number") return result
|
||||||
|
for (var i = 0; i < ips.length; i++) {
|
||||||
|
var ip = String(ips[i] || "")
|
||||||
|
if (/^100\./.test(ip)) result.push(ip)
|
||||||
|
}
|
||||||
|
return result
|
||||||
|
}
|
||||||
|
|
||||||
|
function filterIPv6(ips) {
|
||||||
|
var result = []
|
||||||
|
if (!ips || typeof ips.length !== "number") return result
|
||||||
|
for (var i = 0; i < ips.length; i++) {
|
||||||
|
var ip = String(ips[i] || "")
|
||||||
|
if (/^fd7a:115c:a1e0:/i.test(ip)) result.push(ip)
|
||||||
|
}
|
||||||
|
return result
|
||||||
|
}
|
||||||
|
|
||||||
|
function cleanDnsName(name) {
|
||||||
|
var value = String(name || "")
|
||||||
|
return value.charAt(value.length - 1) === "." ? value.slice(0, -1) : value
|
||||||
|
}
|
||||||
|
|
||||||
|
function shortDnsName(name) {
|
||||||
|
var clean = cleanDnsName(name)
|
||||||
|
if (clean === "") return ""
|
||||||
|
return clean.split(".")[0] || clean
|
||||||
|
}
|
||||||
|
|
||||||
|
function displayHostName(hostName, dnsName) {
|
||||||
|
var host = String(hostName || "")
|
||||||
|
if (host !== "" && host.toLowerCase() !== "localhost") return host
|
||||||
|
return shortDnsName(dnsName) || host || "Unknown"
|
||||||
|
}
|
||||||
|
|
||||||
|
function osIcon(os) {
|
||||||
|
var value = String(os || "").toLowerCase()
|
||||||
|
if (value === "linux") return ""
|
||||||
|
if (value === "macos" || value === "ios") return ""
|
||||||
|
if (value === "windows") return ""
|
||||||
|
if (value === "android") return ""
|
||||||
|
return ""
|
||||||
|
}
|
||||||
|
|
||||||
|
function accountLabel(account) {
|
||||||
|
if (!account) return "Unknown account"
|
||||||
|
if (account.nickname) return String(account.nickname)
|
||||||
|
if (account.tailnet) return String(account.tailnet)
|
||||||
|
if (account.account) return String(account.account)
|
||||||
|
return String(account.id || "Unknown account")
|
||||||
|
}
|
||||||
|
|
||||||
|
function parseStatus(raw) {
|
||||||
|
var text = String(raw || "").trim()
|
||||||
|
if (text === "") return { ok: true, unavailable: true, message: "Disconnected" }
|
||||||
|
|
||||||
|
try {
|
||||||
|
var data = JSON.parse(text)
|
||||||
|
var backendState = String(data.BackendState || "Unknown")
|
||||||
|
var self = data.Self || {}
|
||||||
|
var selfIps = filterIPv4(self.TailscaleIPs || data.TailscaleIPs || [])
|
||||||
|
var peers = []
|
||||||
|
var rawPeers = data.Peer || {}
|
||||||
|
|
||||||
|
for (var id in rawPeers) {
|
||||||
|
var peer = rawPeers[id] || {}
|
||||||
|
if (peer.Online !== true) continue
|
||||||
|
peers.push({
|
||||||
|
id: id,
|
||||||
|
HostName: displayHostName(peer.HostName, peer.DNSName),
|
||||||
|
DNSName: cleanDnsName(peer.DNSName),
|
||||||
|
TailscaleIPs: filterIPv4(peer.TailscaleIPs || []),
|
||||||
|
TailscaleIPv6: filterIPv6(peer.TailscaleIPs || []),
|
||||||
|
Online: true,
|
||||||
|
OS: String(peer.OS || ""),
|
||||||
|
Tags: peer.Tags || [],
|
||||||
|
ExitNodeOption: peer.ExitNodeOption === true,
|
||||||
|
ExitNode: peer.ExitNode === true
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
peers.sort(function(a, b) {
|
||||||
|
return String(a.HostName).localeCompare(String(b.HostName))
|
||||||
|
})
|
||||||
|
|
||||||
|
return {
|
||||||
|
ok: true,
|
||||||
|
unavailable: false,
|
||||||
|
backendState: backendState,
|
||||||
|
running: backendState === "Running",
|
||||||
|
needsLogin: backendState === "NeedsLogin",
|
||||||
|
authUrl: String(data.AuthURL || ""),
|
||||||
|
selfName: displayHostName(self.HostName, self.DNSName),
|
||||||
|
selfDnsName: cleanDnsName(self.DNSName),
|
||||||
|
selfIp: selfIps.length > 0 ? selfIps[0] : "",
|
||||||
|
peers: peers
|
||||||
|
}
|
||||||
|
} catch (e) {
|
||||||
|
return { ok: false, unavailable: true, message: "Status error", error: "Failed to parse tailscale status" }
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function parseAccounts(raw) {
|
||||||
|
var text = String(raw || "").trim()
|
||||||
|
if (text === "") return { accounts: [], selectedAccountId: "", selectedAccountLabel: "" }
|
||||||
|
|
||||||
|
try {
|
||||||
|
var parsed = JSON.parse(text)
|
||||||
|
var next = []
|
||||||
|
var selected = null
|
||||||
|
if (parsed && typeof parsed.length === "number") {
|
||||||
|
for (var i = 0; i < parsed.length; i++) {
|
||||||
|
var rawAccount = parsed[i] || {}
|
||||||
|
var account = {
|
||||||
|
id: String(rawAccount.id || rawAccount.ID || ""),
|
||||||
|
nickname: String(rawAccount.nickname || rawAccount.Nickname || rawAccount.name || rawAccount.Name || ""),
|
||||||
|
tailnet: String(rawAccount.tailnet || rawAccount.Tailnet || ""),
|
||||||
|
account: String(rawAccount.account || rawAccount.Account || rawAccount.loginName || rawAccount.LoginName || rawAccount.user || rawAccount.User || ""),
|
||||||
|
selected: rawAccount.selected === true || rawAccount.Selected === true
|
||||||
|
}
|
||||||
|
next.push(account)
|
||||||
|
if (account.selected === true) selected = account
|
||||||
|
}
|
||||||
|
}
|
||||||
|
return {
|
||||||
|
accounts: next,
|
||||||
|
selectedAccountId: selected ? String(selected.id || "") : "",
|
||||||
|
selectedAccountLabel: selected ? accountLabel(selected) : ""
|
||||||
|
}
|
||||||
|
} catch (e) {
|
||||||
|
return { accounts: [], selectedAccountId: "", selectedAccountLabel: "" }
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
if (typeof module !== "undefined") {
|
||||||
|
module.exports = {
|
||||||
|
filterIPv4: filterIPv4,
|
||||||
|
filterIPv6: filterIPv6,
|
||||||
|
cleanDnsName: cleanDnsName,
|
||||||
|
shortDnsName: shortDnsName,
|
||||||
|
displayHostName: displayHostName,
|
||||||
|
osIcon: osIcon,
|
||||||
|
accountLabel: accountLabel,
|
||||||
|
parseStatus: parseStatus,
|
||||||
|
parseAccounts: parseAccounts
|
||||||
|
}
|
||||||
|
}
|
||||||
@@ -0,0 +1,919 @@
|
|||||||
|
import QtQuick
|
||||||
|
import QtQuick.Controls
|
||||||
|
import QtQuick.Layouts
|
||||||
|
import Quickshell
|
||||||
|
import Quickshell.Io
|
||||||
|
import qs.Commons
|
||||||
|
import qs.Ui
|
||||||
|
|
||||||
|
Panel {
|
||||||
|
id: root
|
||||||
|
moduleName: "omarchy.tailscale"
|
||||||
|
ipcTarget: "omarchy.tailscale"
|
||||||
|
manageIpc: false
|
||||||
|
|
||||||
|
property string focusSection: "header"
|
||||||
|
property int headerIndex: 0
|
||||||
|
property int accountIndex: 0
|
||||||
|
property int peerIndex: 0
|
||||||
|
property int exitNodeIndex: 0
|
||||||
|
property bool cursorActive: false
|
||||||
|
property int phraseIndex: 0
|
||||||
|
readonly property var activePhrases: [
|
||||||
|
"Encrypting connections",
|
||||||
|
"Sending secrets",
|
||||||
|
"Guarding wires",
|
||||||
|
"Braiding packets",
|
||||||
|
"Polishing tunnels",
|
||||||
|
"Hiding routes",
|
||||||
|
"Sealing ports",
|
||||||
|
"Sorting tailnets",
|
||||||
|
"Shuffling keys",
|
||||||
|
"Watching machines"
|
||||||
|
]
|
||||||
|
readonly property string heroPhraseText: activePhrases[phraseIndex % activePhrases.length]
|
||||||
|
|
||||||
|
readonly property color foreground: bar ? bar.foreground : Color.foreground
|
||||||
|
readonly property color urgent: bar ? bar.urgent : Color.urgent
|
||||||
|
readonly property color dim: Qt.darker(foreground, 1.55)
|
||||||
|
readonly property string fontFamily: bar ? bar.fontFamily : Style.font.family
|
||||||
|
readonly property bool showConnections: tailscale.accounts.length > 1 || tailscale.accountsAccessDenied
|
||||||
|
readonly property bool showPeers: tailscale.running && tailscale.peers.length > 0
|
||||||
|
readonly property var exitNodes: {
|
||||||
|
var nodes = []
|
||||||
|
for (var i = 0; i < tailscale.peers.length; i++) {
|
||||||
|
var peer = tailscale.peers[i]
|
||||||
|
if (peer && peer.ExitNodeOption === true) nodes.push(peer)
|
||||||
|
}
|
||||||
|
return nodes
|
||||||
|
}
|
||||||
|
readonly property bool showExitNodes: tailscale.running && exitNodes.length > 0
|
||||||
|
readonly property color iconColor: tailscale.running ? foreground : dim
|
||||||
|
readonly property color hoverFill: bar ? Style.hoverFillFor(bar.foreground, Color.accent) : "transparent"
|
||||||
|
readonly property color selectedFill: bar ? Style.selectedFillFor(bar.foreground, Color.accent) : "transparent"
|
||||||
|
|
||||||
|
function selectedPeer() {
|
||||||
|
if (tailscale.peers.length === 0) return null
|
||||||
|
return tailscale.peers[Math.max(0, Math.min(peerIndex, tailscale.peers.length - 1))]
|
||||||
|
}
|
||||||
|
|
||||||
|
function selectedExitNode() {
|
||||||
|
if (exitNodes.length === 0) return null
|
||||||
|
return exitNodes[Math.max(0, Math.min(exitNodeIndex, exitNodes.length - 1))]
|
||||||
|
}
|
||||||
|
|
||||||
|
function selectedAccount() {
|
||||||
|
if (tailscale.accounts.length === 0) return null
|
||||||
|
return tailscale.accounts[Math.max(0, Math.min(accountIndex, tailscale.accounts.length - 1))]
|
||||||
|
}
|
||||||
|
|
||||||
|
function ensureCursor() {
|
||||||
|
if (headerIndex < 0) headerIndex = 0
|
||||||
|
if (headerIndex > 0) headerIndex = 0
|
||||||
|
if (accountIndex >= tailscale.accounts.length) accountIndex = Math.max(0, tailscale.accounts.length - 1)
|
||||||
|
if (peerIndex >= tailscale.peers.length) peerIndex = Math.max(0, tailscale.peers.length - 1)
|
||||||
|
if (exitNodeIndex >= exitNodes.length) exitNodeIndex = Math.max(0, exitNodes.length - 1)
|
||||||
|
if (focusSection === "auth" && !tailscale.accountsAccessDenied) focusSection = tailscale.accounts.length > 1 ? "accounts" : (showExitNodes ? "exitNodes" : (showPeers ? "peers" : "header"))
|
||||||
|
if (focusSection === "accounts" && tailscale.accounts.length <= 1) focusSection = tailscale.accountsAccessDenied ? "auth" : (showExitNodes ? "exitNodes" : (showPeers ? "peers" : "header"))
|
||||||
|
if (focusSection === "peers" && !showPeers) focusSection = showExitNodes ? "exitNodes" : (tailscale.accountsAccessDenied ? "auth" : (tailscale.accounts.length > 1 ? "accounts" : "header"))
|
||||||
|
if (focusSection === "exitNodes" && !showExitNodes) focusSection = showPeers ? "peers" : (tailscale.accountsAccessDenied ? "auth" : (tailscale.accounts.length > 1 ? "accounts" : "header"))
|
||||||
|
}
|
||||||
|
|
||||||
|
function moveCursor(dx, dy) {
|
||||||
|
cursorActive = true
|
||||||
|
ensureCursor()
|
||||||
|
if (dy !== 0) {
|
||||||
|
if (focusSection === "header") {
|
||||||
|
if (dy > 0) {
|
||||||
|
if (tailscale.accountsAccessDenied) focusSection = "auth"
|
||||||
|
else if (tailscale.accounts.length > 1) focusSection = "accounts"
|
||||||
|
else if (showExitNodes) focusSection = "exitNodes"
|
||||||
|
else if (showPeers) focusSection = "peers"
|
||||||
|
}
|
||||||
|
} else if (focusSection === "auth") {
|
||||||
|
if (dy < 0) focusSection = "header"
|
||||||
|
else if (tailscale.accounts.length > 1) focusSection = "accounts"
|
||||||
|
else if (showExitNodes) focusSection = "exitNodes"
|
||||||
|
else if (showPeers) focusSection = "peers"
|
||||||
|
} else if (focusSection === "accounts") {
|
||||||
|
if (dy < 0) {
|
||||||
|
if (accountIndex <= 0) focusSection = tailscale.accountsAccessDenied ? "auth" : "header"
|
||||||
|
else accountIndex--
|
||||||
|
} else {
|
||||||
|
if (accountIndex < tailscale.accounts.length - 1) accountIndex++
|
||||||
|
else if (showExitNodes) focusSection = "exitNodes"
|
||||||
|
else if (showPeers) focusSection = "peers"
|
||||||
|
}
|
||||||
|
} else if (focusSection === "peers") {
|
||||||
|
if (dy < 0) {
|
||||||
|
if (peerIndex <= 0) focusSection = showExitNodes ? "exitNodes" : (tailscale.accounts.length > 1 ? "accounts" : (tailscale.accountsAccessDenied ? "auth" : "header"))
|
||||||
|
else peerIndex--
|
||||||
|
} else if (peerIndex < tailscale.peers.length - 1) {
|
||||||
|
peerIndex++
|
||||||
|
}
|
||||||
|
} else if (focusSection === "exitNodes") {
|
||||||
|
if (dy < 0) {
|
||||||
|
if (exitNodeIndex <= 0) focusSection = tailscale.accounts.length > 1 ? "accounts" : (tailscale.accountsAccessDenied ? "auth" : "header")
|
||||||
|
else exitNodeIndex--
|
||||||
|
} else if (exitNodeIndex < exitNodes.length - 1) {
|
||||||
|
exitNodeIndex++
|
||||||
|
} else if (showPeers) {
|
||||||
|
focusSection = "peers"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
ensureCursor()
|
||||||
|
scrollCursorIntoView()
|
||||||
|
}
|
||||||
|
|
||||||
|
function activateCursor() {
|
||||||
|
ensureCursor()
|
||||||
|
if (focusSection === "header") {
|
||||||
|
tailscale.toggleTailscale()
|
||||||
|
} else if (focusSection === "auth") {
|
||||||
|
tailscale.authorizeProfileSwitching()
|
||||||
|
} else if (focusSection === "accounts") {
|
||||||
|
var account = selectedAccount()
|
||||||
|
if (account) tailscale.switchAccount(account.id)
|
||||||
|
} else if (focusSection === "peers") {
|
||||||
|
tailscale.copyPeerIp(selectedPeer())
|
||||||
|
} else if (focusSection === "exitNodes") {
|
||||||
|
tailscale.setExitNode(selectedExitNode())
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function scrollItemIntoView(item) {
|
||||||
|
if (!panelFlick || !item) return
|
||||||
|
Qt.callLater(function() {
|
||||||
|
if (!item) return
|
||||||
|
var margin = Style.space(6)
|
||||||
|
var point = item.mapToItem(panelFlick.contentItem, 0, 0)
|
||||||
|
var top = point.y
|
||||||
|
var bottom = top + item.height
|
||||||
|
var viewTop = panelFlick.contentY
|
||||||
|
var viewBottom = viewTop + panelFlick.height
|
||||||
|
var maxY = Math.max(0, panelFlick.contentHeight - panelFlick.height)
|
||||||
|
if (top < viewTop + margin) panelFlick.contentY = Math.max(0, top - margin)
|
||||||
|
else if (bottom > viewBottom - margin) panelFlick.contentY = Math.min(maxY, bottom + margin - panelFlick.height)
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
function scrollCursorIntoView() {
|
||||||
|
if (focusSection === "peers" && peerColumn && peerIndex >= 0 && peerIndex < peerColumn.children.length) scrollItemIntoView(peerColumn.children[peerIndex])
|
||||||
|
else if (focusSection === "exitNodes" && exitNodeColumn && exitNodeIndex >= 0 && exitNodeIndex < exitNodeColumn.children.length) scrollItemIntoView(exitNodeColumn.children[exitNodeIndex])
|
||||||
|
}
|
||||||
|
|
||||||
|
function setPeerCursor(index) {
|
||||||
|
cursorActive = true
|
||||||
|
focusSection = "peers"
|
||||||
|
peerIndex = index
|
||||||
|
scrollCursorIntoView()
|
||||||
|
}
|
||||||
|
|
||||||
|
function setExitNodeCursor(index) {
|
||||||
|
cursorActive = true
|
||||||
|
focusSection = "exitNodes"
|
||||||
|
exitNodeIndex = index
|
||||||
|
scrollCursorIntoView()
|
||||||
|
}
|
||||||
|
|
||||||
|
function setAccountCursor(index) {
|
||||||
|
cursorActive = true
|
||||||
|
focusSection = "accounts"
|
||||||
|
accountIndex = index
|
||||||
|
}
|
||||||
|
|
||||||
|
function setAuthCursor() {
|
||||||
|
cursorActive = true
|
||||||
|
focusSection = "auth"
|
||||||
|
}
|
||||||
|
|
||||||
|
implicitWidth: button.implicitWidth
|
||||||
|
implicitHeight: button.implicitHeight
|
||||||
|
|
||||||
|
onOpenedChanged: if (opened) {
|
||||||
|
cursorActive = false
|
||||||
|
if (panelFlick) panelFlick.contentY = 0
|
||||||
|
tailscale.refresh()
|
||||||
|
Qt.callLater(function() { keyCatcher.forceActiveFocus() })
|
||||||
|
}
|
||||||
|
onPeerIndexChanged: scrollCursorIntoView()
|
||||||
|
onExitNodeIndexChanged: scrollCursorIntoView()
|
||||||
|
onShowConnectionsChanged: ensureCursor()
|
||||||
|
onShowPeersChanged: ensureCursor()
|
||||||
|
onShowExitNodesChanged: ensureCursor()
|
||||||
|
|
||||||
|
Service {
|
||||||
|
id: tailscale
|
||||||
|
settings: root.settings
|
||||||
|
}
|
||||||
|
|
||||||
|
Connections {
|
||||||
|
target: tailscale
|
||||||
|
function onPeersChanged() { root.ensureCursor() }
|
||||||
|
function onAccountsChanged() { root.ensureCursor() }
|
||||||
|
function onAccountsAccessDeniedChanged() { root.ensureCursor() }
|
||||||
|
}
|
||||||
|
|
||||||
|
IpcHandler {
|
||||||
|
target: root.ipcTarget
|
||||||
|
function open(): void { root.open() }
|
||||||
|
function close(): void { root.close() }
|
||||||
|
function show(): void { root.open() }
|
||||||
|
function hide(): void { root.close() }
|
||||||
|
function toggle(): void { root.toggle() }
|
||||||
|
function refresh(): string { tailscale.refresh(); return "ok" }
|
||||||
|
function up(): string { tailscale.loginOrUp(); return "ok" }
|
||||||
|
function down(): string { tailscale.runAction(["tailscale", "down"], "Turning Tailscale off…"); return "ok" }
|
||||||
|
function status(): string { return tailscale.statusText }
|
||||||
|
}
|
||||||
|
|
||||||
|
Item {
|
||||||
|
id: button
|
||||||
|
anchors.fill: parent
|
||||||
|
implicitWidth: root.bar && root.bar.vertical ? root.bar.barSize : Style.space(26)
|
||||||
|
implicitHeight: root.bar && root.bar.vertical ? Style.space(26) : (root.bar ? root.bar.barSize : Style.space(26))
|
||||||
|
|
||||||
|
property var registeredBar: null
|
||||||
|
|
||||||
|
function triggerPress(buttonCode) {
|
||||||
|
if (buttonCode === Qt.RightButton) tailscale.toggleTailscale()
|
||||||
|
else if (buttonCode === Qt.MiddleButton) tailscale.refresh()
|
||||||
|
else root.toggle()
|
||||||
|
}
|
||||||
|
|
||||||
|
function syncClickRegistration() {
|
||||||
|
if (registeredBar && registeredBar.unregisterClickTarget) registeredBar.unregisterClickTarget(button)
|
||||||
|
registeredBar = root.bar
|
||||||
|
if (registeredBar && registeredBar.registerClickTarget) registeredBar.registerClickTarget(button)
|
||||||
|
}
|
||||||
|
|
||||||
|
Component.onCompleted: syncClickRegistration()
|
||||||
|
Component.onDestruction: if (registeredBar && registeredBar.unregisterClickTarget) registeredBar.unregisterClickTarget(button)
|
||||||
|
|
||||||
|
Connections {
|
||||||
|
target: root
|
||||||
|
function onBarChanged() { button.syncClickRegistration() }
|
||||||
|
}
|
||||||
|
|
||||||
|
TailscaleIcon {
|
||||||
|
anchors.centerIn: parent
|
||||||
|
iconSize: Style.space(12)
|
||||||
|
color: root.iconColor
|
||||||
|
badgeColor: root.urgent
|
||||||
|
crossed: !tailscale.running && !tailscale.needsLogin
|
||||||
|
warning: tailscale.needsLogin
|
||||||
|
}
|
||||||
|
|
||||||
|
MouseArea {
|
||||||
|
id: mouseArea
|
||||||
|
anchors.fill: parent
|
||||||
|
acceptedButtons: Qt.LeftButton | Qt.RightButton | Qt.MiddleButton
|
||||||
|
hoverEnabled: true
|
||||||
|
cursorShape: Qt.PointingHandCursor
|
||||||
|
onClicked: function(mouse) { button.triggerPress(mouse.button) }
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
KeyboardPanel {
|
||||||
|
id: panel
|
||||||
|
anchorItem: button
|
||||||
|
owner: root
|
||||||
|
bar: root.bar
|
||||||
|
open: root.opened
|
||||||
|
focusTarget: keyCatcher
|
||||||
|
contentWidth: panel.fittedContentWidth(Style.space(380))
|
||||||
|
contentHeight: panel.fittedContentHeight(column.implicitHeight, Style.space(560))
|
||||||
|
|
||||||
|
PanelKeyCatcher {
|
||||||
|
id: keyCatcher
|
||||||
|
anchors.fill: parent
|
||||||
|
onMoveRequested: function(dx, dy) {
|
||||||
|
if (!root.cursorActive) { root.cursorActive = true; return }
|
||||||
|
root.moveCursor(dx, dy)
|
||||||
|
}
|
||||||
|
onActivateRequested: if (root.cursorActive) root.activateCursor()
|
||||||
|
onCloseRequested: root.close()
|
||||||
|
onTextKey: function(t) {
|
||||||
|
if (t === "t" || t === "T") tailscale.toggleTailscale()
|
||||||
|
else if (t === "c" || t === "C") tailscale.copyPeerIp(root.selectedPeer())
|
||||||
|
else if (t === "n" || t === "N") tailscale.copyPeerName(root.selectedPeer())
|
||||||
|
else if (t === "d" || t === "D") tailscale.copyPeerDnsName(root.selectedPeer())
|
||||||
|
}
|
||||||
|
|
||||||
|
Flickable {
|
||||||
|
id: panelFlick
|
||||||
|
anchors.fill: parent
|
||||||
|
contentWidth: width
|
||||||
|
contentHeight: column.implicitHeight
|
||||||
|
clip: true
|
||||||
|
boundsBehavior: Flickable.StopAtBounds
|
||||||
|
flickableDirection: Flickable.VerticalFlick
|
||||||
|
ScrollBar.vertical: ScrollBar { policy: ScrollBar.AsNeeded }
|
||||||
|
|
||||||
|
Column {
|
||||||
|
id: column
|
||||||
|
width: panelFlick.width
|
||||||
|
spacing: Style.space(12)
|
||||||
|
|
||||||
|
Item {
|
||||||
|
id: header
|
||||||
|
width: parent.width
|
||||||
|
implicitHeight: hero.implicitHeight
|
||||||
|
|
||||||
|
PanelHero {
|
||||||
|
id: hero
|
||||||
|
width: parent.width
|
||||||
|
title: tailscale.installed ? (tailscale.selfName || "Tailscale") : "Tailscale"
|
||||||
|
meta: root.heroPhraseText
|
||||||
|
foreground: root.foreground
|
||||||
|
fontFamily: root.fontFamily
|
||||||
|
iconOpacity: tailscale.running ? 1.0 : 0.5
|
||||||
|
iconComponent: Component {
|
||||||
|
Item {
|
||||||
|
implicitWidth: icon.implicitWidth
|
||||||
|
implicitHeight: icon.implicitHeight
|
||||||
|
|
||||||
|
TailscaleIcon {
|
||||||
|
id: icon
|
||||||
|
iconSize: Style.font.display
|
||||||
|
color: root.iconColor
|
||||||
|
badgeColor: root.urgent
|
||||||
|
crossed: !tailscale.running && !tailscale.needsLogin
|
||||||
|
warning: tailscale.needsLogin
|
||||||
|
anchors.centerIn: parent
|
||||||
|
}
|
||||||
|
|
||||||
|
MouseArea {
|
||||||
|
id: heroIconMouse
|
||||||
|
anchors.fill: parent
|
||||||
|
hoverEnabled: true
|
||||||
|
enabled: tailscale.installed && !tailscale.busy
|
||||||
|
cursorShape: enabled ? Qt.PointingHandCursor : Qt.ArrowCursor
|
||||||
|
onContainsMouseChanged: if (containsMouse) {
|
||||||
|
root.focusSection = "header"
|
||||||
|
root.headerIndex = 0
|
||||||
|
}
|
||||||
|
onClicked: tailscale.toggleTailscale()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
Text {
|
||||||
|
visible: tailscale.actionStatus !== "" || tailscale.lastError !== ""
|
||||||
|
width: parent.width
|
||||||
|
text: tailscale.actionStatus !== "" ? tailscale.actionStatus : tailscale.lastError
|
||||||
|
color: tailscale.lastError !== "" && tailscale.actionStatus === "" ? root.urgent : root.dim
|
||||||
|
font.family: root.fontFamily
|
||||||
|
font.pixelSize: Style.font.bodySmall
|
||||||
|
wrapMode: Text.WordWrap
|
||||||
|
}
|
||||||
|
|
||||||
|
CursorSurface {
|
||||||
|
visible: !tailscale.installed
|
||||||
|
width: parent.width
|
||||||
|
implicitHeight: missingText.implicitHeight + Style.spacing.rowPaddingX
|
||||||
|
foreground: root.foreground
|
||||||
|
|
||||||
|
Text {
|
||||||
|
id: missingText
|
||||||
|
anchors.left: parent.left
|
||||||
|
anchors.right: parent.right
|
||||||
|
anchors.verticalCenter: parent.verticalCenter
|
||||||
|
anchors.margins: Style.space(12)
|
||||||
|
text: "Tailscale CLI is not installed or not on PATH."
|
||||||
|
color: root.dim
|
||||||
|
font.family: root.fontFamily
|
||||||
|
font.pixelSize: Style.font.body
|
||||||
|
wrapMode: Text.WordWrap
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
PanelSeparator {
|
||||||
|
visible: root.showConnections
|
||||||
|
foreground: root.foreground
|
||||||
|
}
|
||||||
|
|
||||||
|
Column {
|
||||||
|
visible: root.showConnections
|
||||||
|
width: parent.width
|
||||||
|
spacing: Style.space(10)
|
||||||
|
|
||||||
|
PanelSectionHeader {
|
||||||
|
text: "CONNECTIONS"
|
||||||
|
foreground: root.foreground
|
||||||
|
fontFamily: root.fontFamily
|
||||||
|
}
|
||||||
|
|
||||||
|
AuthRow {
|
||||||
|
visible: tailscale.accountsAccessDenied
|
||||||
|
width: parent.width
|
||||||
|
}
|
||||||
|
|
||||||
|
Repeater {
|
||||||
|
model: tailscale.accounts
|
||||||
|
AccountRow {
|
||||||
|
required property var modelData
|
||||||
|
required property int index
|
||||||
|
width: parent.width
|
||||||
|
account: modelData
|
||||||
|
rowIndex: index
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
PanelSeparator {
|
||||||
|
visible: root.showExitNodes
|
||||||
|
foreground: root.foreground
|
||||||
|
}
|
||||||
|
|
||||||
|
Column {
|
||||||
|
visible: root.showExitNodes
|
||||||
|
width: parent.width
|
||||||
|
spacing: Style.space(10)
|
||||||
|
|
||||||
|
PanelSectionHeader {
|
||||||
|
text: "EXIT NODES"
|
||||||
|
foreground: root.foreground
|
||||||
|
fontFamily: root.fontFamily
|
||||||
|
}
|
||||||
|
|
||||||
|
Column {
|
||||||
|
id: exitNodeColumn
|
||||||
|
width: parent.width
|
||||||
|
spacing: Style.space(6)
|
||||||
|
|
||||||
|
Repeater {
|
||||||
|
model: root.exitNodes
|
||||||
|
ExitNodeRow {
|
||||||
|
required property var modelData
|
||||||
|
required property int index
|
||||||
|
width: exitNodeColumn.width
|
||||||
|
peer: modelData
|
||||||
|
rowIndex: index
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
PanelSeparator {
|
||||||
|
visible: tailscale.installed && tailscale.running
|
||||||
|
foreground: root.foreground
|
||||||
|
}
|
||||||
|
|
||||||
|
Column {
|
||||||
|
visible: tailscale.installed && tailscale.running
|
||||||
|
width: parent.width
|
||||||
|
spacing: Style.space(10)
|
||||||
|
|
||||||
|
PanelSectionHeader {
|
||||||
|
text: "MACHINES"
|
||||||
|
foreground: root.foreground
|
||||||
|
fontFamily: root.fontFamily
|
||||||
|
}
|
||||||
|
|
||||||
|
Text {
|
||||||
|
visible: tailscale.installed && tailscale.running && tailscale.peers.length === 0
|
||||||
|
width: parent.width
|
||||||
|
text: "No machines found on this tailnet."
|
||||||
|
color: root.dim
|
||||||
|
font.family: root.fontFamily
|
||||||
|
font.pixelSize: Style.font.body
|
||||||
|
horizontalAlignment: Text.AlignHCenter
|
||||||
|
}
|
||||||
|
|
||||||
|
Column {
|
||||||
|
id: peerColumn
|
||||||
|
visible: root.showPeers
|
||||||
|
width: parent.width
|
||||||
|
spacing: Style.space(6)
|
||||||
|
|
||||||
|
Repeater {
|
||||||
|
model: tailscale.peers
|
||||||
|
PeerRow {
|
||||||
|
required property var modelData
|
||||||
|
required property int index
|
||||||
|
width: peerColumn.width
|
||||||
|
peer: modelData
|
||||||
|
rowIndex: index
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
Timer {
|
||||||
|
id: phraseTimer
|
||||||
|
interval: 2800
|
||||||
|
running: root.opened
|
||||||
|
repeat: true
|
||||||
|
onTriggered: phraseSwap.restart()
|
||||||
|
}
|
||||||
|
|
||||||
|
SequentialAnimation {
|
||||||
|
id: phraseSwap
|
||||||
|
PropertyAnimation {
|
||||||
|
target: hero; property: "metaOpacity"
|
||||||
|
to: 0.0; duration: 180; easing.type: Easing.OutQuad
|
||||||
|
}
|
||||||
|
ScriptAction {
|
||||||
|
script: root.phraseIndex = (root.phraseIndex + 1) % root.activePhrases.length
|
||||||
|
}
|
||||||
|
PropertyAnimation {
|
||||||
|
target: hero; property: "metaOpacity"
|
||||||
|
to: 1.0; duration: 260; easing.type: Easing.InQuad
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
component AuthRow: CursorSurface {
|
||||||
|
id: authRow
|
||||||
|
|
||||||
|
hasCursor: root.cursorActive && root.focusSection === "auth"
|
||||||
|
foreground: root.foreground
|
||||||
|
|
||||||
|
implicitHeight: row.implicitHeight + Style.spacing.rowPaddingX
|
||||||
|
|
||||||
|
MouseArea {
|
||||||
|
anchors.fill: parent
|
||||||
|
hoverEnabled: true
|
||||||
|
cursorShape: tailscale.busy ? Qt.ArrowCursor : Qt.PointingHandCursor
|
||||||
|
enabled: !tailscale.busy
|
||||||
|
onEntered: root.setAuthCursor()
|
||||||
|
onClicked: tailscale.authorizeProfileSwitching()
|
||||||
|
}
|
||||||
|
|
||||||
|
RowLayout {
|
||||||
|
id: row
|
||||||
|
anchors.left: parent.left
|
||||||
|
anchors.right: parent.right
|
||||||
|
anchors.verticalCenter: parent.verticalCenter
|
||||||
|
anchors.leftMargin: Style.space(10)
|
||||||
|
anchors.rightMargin: Style.space(10)
|
||||||
|
spacing: Style.space(8)
|
||||||
|
|
||||||
|
Text {
|
||||||
|
text: ""
|
||||||
|
color: root.dim
|
||||||
|
font.family: root.fontFamily
|
||||||
|
font.pixelSize: Style.font.heading
|
||||||
|
Layout.alignment: Qt.AlignVCenter
|
||||||
|
}
|
||||||
|
|
||||||
|
ColumnLayout {
|
||||||
|
Layout.fillWidth: true
|
||||||
|
spacing: Style.space(1)
|
||||||
|
|
||||||
|
Text {
|
||||||
|
Layout.fillWidth: true
|
||||||
|
text: "Authorize switching"
|
||||||
|
color: root.foreground
|
||||||
|
font.family: root.fontFamily
|
||||||
|
font.pixelSize: Style.font.body
|
||||||
|
elide: Text.ElideRight
|
||||||
|
}
|
||||||
|
|
||||||
|
Text {
|
||||||
|
Layout.fillWidth: true
|
||||||
|
text: "Allow this user to see and switch Tailscale connections"
|
||||||
|
color: root.dim
|
||||||
|
font.family: root.fontFamily
|
||||||
|
font.pixelSize: Style.font.caption
|
||||||
|
elide: Text.ElideRight
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
PanelActionButton {
|
||||||
|
iconText: ""
|
||||||
|
foreground: root.foreground
|
||||||
|
fontFamily: root.fontFamily
|
||||||
|
enabled: !tailscale.busy
|
||||||
|
Layout.alignment: Qt.AlignVCenter
|
||||||
|
onClicked: tailscale.authorizeProfileSwitching()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
component AccountRow: CursorSurface {
|
||||||
|
id: accountRow
|
||||||
|
property var account: null
|
||||||
|
property int rowIndex: 0
|
||||||
|
readonly property bool selectedAccount: account && account.selected === true
|
||||||
|
readonly property bool switchingAccount: account && tailscale.switchingAccountId === String(account.id || "")
|
||||||
|
readonly property string accountText: account ? tailscale.accountLabel(account) : "Account"
|
||||||
|
|
||||||
|
hasCursor: root.cursorActive && root.focusSection === "accounts" && root.accountIndex === rowIndex
|
||||||
|
current: selectedAccount
|
||||||
|
foreground: root.foreground
|
||||||
|
fill: root.hoverFill
|
||||||
|
currentFill: root.selectedFill
|
||||||
|
|
||||||
|
implicitHeight: accountInner.implicitHeight + Style.spacing.xl
|
||||||
|
|
||||||
|
Row {
|
||||||
|
id: accountInner
|
||||||
|
anchors.left: parent.left
|
||||||
|
anchors.right: parent.right
|
||||||
|
anchors.verticalCenter: parent.verticalCenter
|
||||||
|
anchors.leftMargin: Style.space(6)
|
||||||
|
anchors.rightMargin: Style.space(6)
|
||||||
|
spacing: Style.space(8)
|
||||||
|
|
||||||
|
Text {
|
||||||
|
id: accountGlyph
|
||||||
|
text: ""
|
||||||
|
color: accountRow.selectedAccount || accountRow.switchingAccount ? root.foreground : root.dim
|
||||||
|
font.family: root.fontFamily
|
||||||
|
font.pixelSize: Style.font.body
|
||||||
|
width: Style.space(22)
|
||||||
|
horizontalAlignment: Text.AlignHCenter
|
||||||
|
anchors.verticalCenter: parent.verticalCenter
|
||||||
|
|
||||||
|
NumberAnimation on rotation {
|
||||||
|
running: accountRow.switchingAccount
|
||||||
|
from: 0
|
||||||
|
to: 360
|
||||||
|
duration: 900
|
||||||
|
loops: Animation.Infinite
|
||||||
|
}
|
||||||
|
|
||||||
|
onRotationChanged: if (!accountRow.switchingAccount && rotation !== 0) rotation = 0
|
||||||
|
}
|
||||||
|
|
||||||
|
Text {
|
||||||
|
text: accountRow.accountText
|
||||||
|
color: root.foreground
|
||||||
|
font.family: root.fontFamily
|
||||||
|
font.pixelSize: Style.font.body
|
||||||
|
font.bold: accountRow.selectedAccount
|
||||||
|
elide: Text.ElideRight
|
||||||
|
width: parent.width - Style.space(22) - Style.space(8)
|
||||||
|
anchors.verticalCenter: parent.verticalCenter
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
MouseArea {
|
||||||
|
anchors.fill: parent
|
||||||
|
hoverEnabled: true
|
||||||
|
cursorShape: Qt.PointingHandCursor
|
||||||
|
onEntered: root.setAccountCursor(accountRow.rowIndex)
|
||||||
|
onClicked: if (accountRow.account) tailscale.switchAccount(accountRow.account.id)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
component PeerRow: CursorSurface {
|
||||||
|
id: peerRow
|
||||||
|
property var peer: null
|
||||||
|
property int rowIndex: 0
|
||||||
|
readonly property string peerName: peer ? String(peer.HostName || "Unknown") : "Unknown"
|
||||||
|
readonly property string peerIp: peer && peer.TailscaleIPs && peer.TailscaleIPs.length > 0 ? String(peer.TailscaleIPs[0]) : ""
|
||||||
|
readonly property string peerIpv6: {
|
||||||
|
if (!peer || !peer.TailscaleIPv6 || peer.TailscaleIPv6.length === 0) return ""
|
||||||
|
return String(peer.TailscaleIPv6[0] || "")
|
||||||
|
}
|
||||||
|
readonly property string peerDns: peer ? String(peer.DNSName || "") : ""
|
||||||
|
|
||||||
|
hasCursor: root.cursorActive && root.focusSection === "peers" && root.peerIndex === rowIndex
|
||||||
|
foreground: root.foreground
|
||||||
|
|
||||||
|
implicitHeight: Math.max(peerContent.implicitHeight, copyButton.implicitHeight) + Style.spacing.rowPaddingX
|
||||||
|
|
||||||
|
MouseArea {
|
||||||
|
anchors.fill: parent
|
||||||
|
acceptedButtons: Qt.LeftButton
|
||||||
|
hoverEnabled: true
|
||||||
|
cursorShape: Qt.ArrowCursor
|
||||||
|
onContainsMouseChanged: if (containsMouse) root.setPeerCursor(peerRow.rowIndex)
|
||||||
|
}
|
||||||
|
|
||||||
|
RowLayout {
|
||||||
|
anchors.left: parent.left
|
||||||
|
anchors.right: parent.right
|
||||||
|
anchors.verticalCenter: parent.verticalCenter
|
||||||
|
anchors.leftMargin: Style.space(10)
|
||||||
|
anchors.rightMargin: Style.space(8)
|
||||||
|
spacing: Style.space(8)
|
||||||
|
|
||||||
|
Text {
|
||||||
|
text: tailscale.osIcon(peer ? peer.OS : "")
|
||||||
|
color: root.foreground
|
||||||
|
font.family: root.fontFamily
|
||||||
|
font.pixelSize: Style.font.icon
|
||||||
|
Layout.alignment: Qt.AlignVCenter
|
||||||
|
}
|
||||||
|
|
||||||
|
ColumnLayout {
|
||||||
|
id: peerContent
|
||||||
|
Layout.fillWidth: true
|
||||||
|
spacing: Style.space(1)
|
||||||
|
|
||||||
|
Text {
|
||||||
|
Layout.fillWidth: true
|
||||||
|
text: peerRow.peerName
|
||||||
|
color: root.foreground
|
||||||
|
font.family: root.fontFamily
|
||||||
|
font.pixelSize: Style.font.body
|
||||||
|
elide: Text.ElideRight
|
||||||
|
}
|
||||||
|
|
||||||
|
Text {
|
||||||
|
Layout.fillWidth: true
|
||||||
|
text: {
|
||||||
|
var parts = []
|
||||||
|
if (peerRow.peerIp !== "") parts.push(peerRow.peerIp)
|
||||||
|
if (peerRow.peerDns !== "") parts.push(peerRow.peerDns)
|
||||||
|
return parts.join(" · ")
|
||||||
|
}
|
||||||
|
color: root.dim
|
||||||
|
font.family: root.fontFamily
|
||||||
|
font.pixelSize: Style.font.caption
|
||||||
|
elide: Text.ElideRight
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
PanelActionButton {
|
||||||
|
id: copyButton
|
||||||
|
iconText: ""
|
||||||
|
foreground: root.foreground
|
||||||
|
fontFamily: root.fontFamily
|
||||||
|
enabled: peerRow.peerIp !== "" || peerRow.peerName !== "" || peerRow.peerDns !== "" || peerRow.peerIpv6 !== ""
|
||||||
|
Layout.alignment: Qt.AlignVCenter
|
||||||
|
onClicked: copyPopup.open()
|
||||||
|
}
|
||||||
|
|
||||||
|
Popup {
|
||||||
|
id: copyPopup
|
||||||
|
x: copyButton.x + copyButton.width - width
|
||||||
|
y: copyButton.y + copyButton.height + Style.space(4)
|
||||||
|
width: Style.space(280)
|
||||||
|
padding: 0
|
||||||
|
modal: false
|
||||||
|
focus: true
|
||||||
|
closePolicy: Popup.CloseOnEscape | Popup.CloseOnPressOutside
|
||||||
|
background: Rectangle {
|
||||||
|
color: Color.background
|
||||||
|
border.color: root.dim
|
||||||
|
border.width: 1
|
||||||
|
radius: Style.radius.md
|
||||||
|
}
|
||||||
|
|
||||||
|
contentItem: Column {
|
||||||
|
width: parent.width
|
||||||
|
|
||||||
|
CopyChoice {
|
||||||
|
width: parent.width
|
||||||
|
label: peerRow.peerName
|
||||||
|
enabled: peerRow.peerName !== ""
|
||||||
|
onChosen: {
|
||||||
|
copyPopup.close()
|
||||||
|
tailscale.copyPeerName(peerRow.peer)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
CopyChoice {
|
||||||
|
width: parent.width
|
||||||
|
label: peerRow.peerDns
|
||||||
|
enabled: peerRow.peerDns !== ""
|
||||||
|
onChosen: {
|
||||||
|
copyPopup.close()
|
||||||
|
tailscale.copyPeerDnsName(peerRow.peer)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
CopyChoice {
|
||||||
|
width: parent.width
|
||||||
|
label: peerRow.peerIpv6
|
||||||
|
enabled: peerRow.peerIpv6 !== ""
|
||||||
|
onChosen: {
|
||||||
|
copyPopup.close()
|
||||||
|
tailscale.copyToClipboard(peerRow.peerIpv6, peerRow.peerName + " IPv6")
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
CopyChoice {
|
||||||
|
width: parent.width
|
||||||
|
label: peerRow.peerIp
|
||||||
|
enabled: peerRow.peerIp !== ""
|
||||||
|
onChosen: {
|
||||||
|
copyPopup.close()
|
||||||
|
tailscale.copyPeerIp(peerRow.peer)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
component CopyChoice: CursorSurface {
|
||||||
|
id: copyChoice
|
||||||
|
signal chosen()
|
||||||
|
property string label: ""
|
||||||
|
|
||||||
|
visible: enabled
|
||||||
|
foreground: root.foreground
|
||||||
|
implicitHeight: Style.space(48)
|
||||||
|
radius: 0
|
||||||
|
|
||||||
|
MouseArea {
|
||||||
|
anchors.fill: parent
|
||||||
|
hoverEnabled: true
|
||||||
|
cursorShape: Qt.PointingHandCursor
|
||||||
|
onClicked: copyChoice.chosen()
|
||||||
|
}
|
||||||
|
|
||||||
|
RowLayout {
|
||||||
|
anchors.fill: parent
|
||||||
|
anchors.leftMargin: Style.space(12)
|
||||||
|
anchors.rightMargin: Style.space(12)
|
||||||
|
spacing: Style.space(10)
|
||||||
|
|
||||||
|
Text {
|
||||||
|
Layout.fillWidth: true
|
||||||
|
text: copyChoice.label
|
||||||
|
color: root.foreground
|
||||||
|
font.family: root.fontFamily
|
||||||
|
font.pixelSize: Style.font.body
|
||||||
|
elide: Text.ElideRight
|
||||||
|
}
|
||||||
|
|
||||||
|
Text {
|
||||||
|
text: ""
|
||||||
|
color: root.foreground
|
||||||
|
font.family: root.fontFamily
|
||||||
|
font.pixelSize: Style.font.icon
|
||||||
|
Layout.alignment: Qt.AlignVCenter
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
component ExitNodeRow: CursorSurface {
|
||||||
|
id: exitNodeRow
|
||||||
|
property var peer: null
|
||||||
|
property int rowIndex: 0
|
||||||
|
readonly property bool activeExitNode: peer && peer.ExitNode === true
|
||||||
|
readonly property bool settingExitNode: peer && tailscale.settingExitNodeId === String(peer.id || "")
|
||||||
|
readonly property string peerName: peer ? String(peer.HostName || "Unknown") : "Unknown"
|
||||||
|
|
||||||
|
hasCursor: root.cursorActive && root.focusSection === "exitNodes" && root.exitNodeIndex === rowIndex
|
||||||
|
current: activeExitNode || settingExitNode
|
||||||
|
foreground: root.foreground
|
||||||
|
fill: root.hoverFill
|
||||||
|
currentFill: root.selectedFill
|
||||||
|
|
||||||
|
implicitHeight: exitNodeInner.implicitHeight + Style.spacing.xl
|
||||||
|
|
||||||
|
Row {
|
||||||
|
id: exitNodeInner
|
||||||
|
anchors.left: parent.left
|
||||||
|
anchors.right: parent.right
|
||||||
|
anchors.verticalCenter: parent.verticalCenter
|
||||||
|
anchors.leftMargin: Style.space(6)
|
||||||
|
anchors.rightMargin: Style.space(6)
|
||||||
|
spacing: Style.space(8)
|
||||||
|
|
||||||
|
Text {
|
||||||
|
id: exitNodeGlyph
|
||||||
|
text: tailscale.osIcon(peer ? peer.OS : "")
|
||||||
|
color: exitNodeRow.activeExitNode || exitNodeRow.settingExitNode ? root.foreground : root.dim
|
||||||
|
font.family: root.fontFamily
|
||||||
|
font.pixelSize: Style.font.body
|
||||||
|
width: Style.space(22)
|
||||||
|
horizontalAlignment: Text.AlignHCenter
|
||||||
|
anchors.verticalCenter: parent.verticalCenter
|
||||||
|
|
||||||
|
NumberAnimation on rotation {
|
||||||
|
running: exitNodeRow.settingExitNode
|
||||||
|
from: 0
|
||||||
|
to: 360
|
||||||
|
duration: 900
|
||||||
|
loops: Animation.Infinite
|
||||||
|
}
|
||||||
|
|
||||||
|
onRotationChanged: if (!exitNodeRow.settingExitNode && rotation !== 0) rotation = 0
|
||||||
|
}
|
||||||
|
|
||||||
|
Text {
|
||||||
|
text: exitNodeRow.peerName
|
||||||
|
color: root.foreground
|
||||||
|
font.family: root.fontFamily
|
||||||
|
font.pixelSize: Style.font.body
|
||||||
|
font.bold: exitNodeRow.activeExitNode
|
||||||
|
elide: Text.ElideRight
|
||||||
|
width: parent.width - Style.space(22) - Style.space(8)
|
||||||
|
anchors.verticalCenter: parent.verticalCenter
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
MouseArea {
|
||||||
|
anchors.fill: parent
|
||||||
|
hoverEnabled: true
|
||||||
|
cursorShape: Qt.PointingHandCursor
|
||||||
|
onEntered: root.setExitNodeCursor(exitNodeRow.rowIndex)
|
||||||
|
onClicked: if (exitNodeRow.peer) tailscale.setExitNode(exitNodeRow.peer)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
@@ -0,0 +1,38 @@
|
|||||||
|
# Tailscale Omarchy Widget
|
||||||
|
|
||||||
|
Native Omarchy bar widget for Tailscale.
|
||||||
|
|
||||||
|
## Features
|
||||||
|
|
||||||
|
- Shows Tailscale connection state in the bar
|
||||||
|
- Left click opens a keyboard-friendly panel
|
||||||
|
- Right click toggles Tailscale on/off
|
||||||
|
- Switch between available Tailscale connections when multiple are available
|
||||||
|
- Browse machines from `tailscale status --json`
|
||||||
|
- Copy a machine's Tailscale IP, host name, or DNS name
|
||||||
|
|
||||||
|
## Keyboard shortcuts
|
||||||
|
|
||||||
|
Inside the panel:
|
||||||
|
|
||||||
|
- `j` / `k` or arrows: move cursor
|
||||||
|
- `enter` / `space`: activate current row
|
||||||
|
- `c`: copy selected peer IP
|
||||||
|
- `n`: copy selected peer name
|
||||||
|
- `d`: copy selected peer DNS name
|
||||||
|
- `t`: toggle Tailscale
|
||||||
|
- `r`: refresh status
|
||||||
|
- `esc`: close
|
||||||
|
|
||||||
|
## Requirements
|
||||||
|
|
||||||
|
- `tailscale` CLI on `PATH`
|
||||||
|
- `wl-copy` for clipboard copy actions
|
||||||
|
|
||||||
|
## Icon
|
||||||
|
|
||||||
|
Renders the Tailscale mark natively as a theme-colored 3×3 dot grid, matching the official SVG silhouette while avoiding tiny-SVG rendering quirks in the bar.
|
||||||
|
|
||||||
|
## Add to the bar
|
||||||
|
|
||||||
|
This widget ships as first-party plugin `omarchy.tailscale`. Add it through Omarchy's bar settings UI, or add an entry such as `{ "id": "omarchy.tailscale" }` to one of the `bar.layout` sections in `~/.config/omarchy/shell.json` and restart the shell.
|
||||||
+502
@@ -0,0 +1,502 @@
|
|||||||
|
import QtQuick
|
||||||
|
import Quickshell
|
||||||
|
import Quickshell.Io
|
||||||
|
import qs.Commons
|
||||||
|
import "Model.js" as Model
|
||||||
|
|
||||||
|
Item {
|
||||||
|
id: root
|
||||||
|
|
||||||
|
property var settings: ({})
|
||||||
|
|
||||||
|
property bool installed: false
|
||||||
|
property bool running: false
|
||||||
|
property bool needsLogin: false
|
||||||
|
property bool refreshing: false
|
||||||
|
property string backendState: "Unknown"
|
||||||
|
property string statusText: "Checking…"
|
||||||
|
property string selfName: ""
|
||||||
|
property string selfDnsName: ""
|
||||||
|
property string selfIp: ""
|
||||||
|
property string authUrl: ""
|
||||||
|
property var peers: []
|
||||||
|
property var accounts: []
|
||||||
|
property string selectedAccountId: ""
|
||||||
|
property string selectedAccountLabel: ""
|
||||||
|
property string switchingAccountId: ""
|
||||||
|
property string settingExitNodeId: ""
|
||||||
|
property bool accountsAccessDenied: false
|
||||||
|
property string actionStatus: ""
|
||||||
|
property string lastError: ""
|
||||||
|
|
||||||
|
readonly property int refreshIntervalSec: intSetting("refreshIntervalSec", 30, 5, 3600)
|
||||||
|
readonly property bool busy: whichProcess.running || statusProcess.running || accountsProcess.running || actionProcess.running || loginProcess.running || switchProcess.running || operatorProcess.running || exitNodeProcess.running
|
||||||
|
readonly property string userName: Quickshell.env("USER") || Quickshell.env("LOGNAME")
|
||||||
|
|
||||||
|
property string _statusOutput: ""
|
||||||
|
property string _statusError: ""
|
||||||
|
property string _accountsOutput: ""
|
||||||
|
property string _accountsError: ""
|
||||||
|
property string _actionOutput: ""
|
||||||
|
property string _actionError: ""
|
||||||
|
property string _loginOutput: ""
|
||||||
|
property string _loginError: ""
|
||||||
|
property bool _loginInProgress: false
|
||||||
|
property bool _loginUrlOpened: false
|
||||||
|
property string _preLoginAuthUrl: ""
|
||||||
|
property double _lastAccountsRefreshMs: 0
|
||||||
|
property string _switchOutput: ""
|
||||||
|
property string _switchError: ""
|
||||||
|
property string _exitNodeOutput: ""
|
||||||
|
property string _exitNodeError: ""
|
||||||
|
property string _operatorOutput: ""
|
||||||
|
property string _operatorError: ""
|
||||||
|
|
||||||
|
function setting(name, fallback) {
|
||||||
|
var value = settings ? settings[name] : undefined
|
||||||
|
return value === undefined || value === null ? fallback : value
|
||||||
|
}
|
||||||
|
|
||||||
|
function intSetting(name, fallback, min, max) {
|
||||||
|
var n = parseInt(String(setting(name, fallback)), 10)
|
||||||
|
if (!isFinite(n)) n = fallback
|
||||||
|
if (n < min) n = min
|
||||||
|
if (n > max) n = max
|
||||||
|
return n
|
||||||
|
}
|
||||||
|
|
||||||
|
function filterIPv4(ips) {
|
||||||
|
return Model.filterIPv4(ips)
|
||||||
|
}
|
||||||
|
|
||||||
|
function cleanDnsName(name) {
|
||||||
|
return Model.cleanDnsName(name)
|
||||||
|
}
|
||||||
|
|
||||||
|
function shortDnsName(name) {
|
||||||
|
return Model.shortDnsName(name)
|
||||||
|
}
|
||||||
|
|
||||||
|
function displayHostName(hostName, dnsName) {
|
||||||
|
return Model.displayHostName(hostName, dnsName)
|
||||||
|
}
|
||||||
|
|
||||||
|
function osIcon(os) {
|
||||||
|
return Model.osIcon(os)
|
||||||
|
}
|
||||||
|
|
||||||
|
function accountLabel(account) {
|
||||||
|
return Model.accountLabel(account)
|
||||||
|
}
|
||||||
|
|
||||||
|
function copyToClipboard(value, label) {
|
||||||
|
var text = String(value || "")
|
||||||
|
if (text === "") return
|
||||||
|
Quickshell.execDetached(["bash", "-c", "printf %s " + Util.shellQuote(text) + " | wl-copy"])
|
||||||
|
}
|
||||||
|
|
||||||
|
function copyPeerIp(peer) {
|
||||||
|
if (!peer) return
|
||||||
|
var ips = filterIPv4(peer.TailscaleIPs || [])
|
||||||
|
copyToClipboard(ips.length > 0 ? ips[0] : "", displayHostName(peer.HostName, peer.DNSName) + " IP")
|
||||||
|
}
|
||||||
|
|
||||||
|
function copyPeerName(peer) {
|
||||||
|
if (!peer) return
|
||||||
|
copyToClipboard(displayHostName(peer.HostName, peer.DNSName), displayHostName(peer.HostName, peer.DNSName) + " name")
|
||||||
|
}
|
||||||
|
|
||||||
|
function copyPeerDnsName(peer) {
|
||||||
|
if (!peer) return
|
||||||
|
copyToClipboard(cleanDnsName(peer.DNSName), displayHostName(peer.HostName, peer.DNSName) + " DNS name")
|
||||||
|
}
|
||||||
|
|
||||||
|
function refresh(forceAccounts) {
|
||||||
|
if (installed) {
|
||||||
|
refreshStatusAndAccounts(forceAccounts === true)
|
||||||
|
return
|
||||||
|
}
|
||||||
|
if (!whichProcess.running) {
|
||||||
|
refreshing = true
|
||||||
|
whichProcess.command = ["which", "tailscale"]
|
||||||
|
whichProcess.running = true
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function refreshStatusAndAccounts(forceAccounts) {
|
||||||
|
if (!installed) return
|
||||||
|
if (!statusProcess.running) {
|
||||||
|
_statusOutput = ""
|
||||||
|
_statusError = ""
|
||||||
|
refreshing = true
|
||||||
|
statusProcess.command = ["tailscale", "status", "--json"]
|
||||||
|
statusProcess.running = true
|
||||||
|
}
|
||||||
|
var now = Date.now()
|
||||||
|
var shouldRefreshAccounts = forceAccounts === true || accounts.length === 0 || now - _lastAccountsRefreshMs > 60000
|
||||||
|
if (shouldRefreshAccounts && !accountsProcess.running) {
|
||||||
|
_accountsOutput = ""
|
||||||
|
_accountsError = ""
|
||||||
|
_lastAccountsRefreshMs = now
|
||||||
|
accountsProcess.command = ["tailscale", "switch", "--list", "--json"]
|
||||||
|
accountsProcess.running = true
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function elideStatus(text) {
|
||||||
|
var value = String(text || "").replace(/\s+/g, " ").trim()
|
||||||
|
return value.length > 140 ? value.substring(0, 137) + "…" : value
|
||||||
|
}
|
||||||
|
|
||||||
|
function resetUnavailable(message) {
|
||||||
|
running = false
|
||||||
|
needsLogin = false
|
||||||
|
backendState = "Unavailable"
|
||||||
|
statusText = message
|
||||||
|
selfName = ""
|
||||||
|
selfDnsName = ""
|
||||||
|
selfIp = ""
|
||||||
|
authUrl = ""
|
||||||
|
peers = []
|
||||||
|
accounts = []
|
||||||
|
selectedAccountId = ""
|
||||||
|
selectedAccountLabel = ""
|
||||||
|
switchingAccountId = ""
|
||||||
|
settingExitNodeId = ""
|
||||||
|
accountsAccessDenied = false
|
||||||
|
}
|
||||||
|
|
||||||
|
function parseStatus(raw) {
|
||||||
|
var parsed = Model.parseStatus(raw)
|
||||||
|
if (!parsed.ok) {
|
||||||
|
resetUnavailable(parsed.message || "Status error")
|
||||||
|
lastError = parsed.error || "Failed to parse tailscale status"
|
||||||
|
console.warn("tailscale", lastError)
|
||||||
|
return
|
||||||
|
}
|
||||||
|
if (parsed.unavailable) {
|
||||||
|
resetUnavailable(parsed.message || "Disconnected")
|
||||||
|
return
|
||||||
|
}
|
||||||
|
|
||||||
|
backendState = parsed.backendState
|
||||||
|
running = parsed.running
|
||||||
|
needsLogin = parsed.needsLogin
|
||||||
|
authUrl = parsed.authUrl
|
||||||
|
if (needsLogin && _loginInProgress && !_loginUrlOpened && authUrl !== "" && authUrl !== _preLoginAuthUrl) openAuthUrlFrom(authUrl, false)
|
||||||
|
selfName = parsed.selfName
|
||||||
|
selfDnsName = parsed.selfDnsName
|
||||||
|
selfIp = parsed.selfIp
|
||||||
|
peers = parsed.running ? parsed.peers : []
|
||||||
|
|
||||||
|
if (needsLogin) statusText = "Needs login"
|
||||||
|
else if (running) {
|
||||||
|
statusText = "Connected"
|
||||||
|
_loginInProgress = false
|
||||||
|
_loginUrlOpened = false
|
||||||
|
_preLoginAuthUrl = ""
|
||||||
|
loginTimeoutTimer.stop()
|
||||||
|
} else if (backendState === "Stopped") {
|
||||||
|
statusText = "Disconnected"
|
||||||
|
} else {
|
||||||
|
statusText = backendState
|
||||||
|
}
|
||||||
|
lastError = ""
|
||||||
|
}
|
||||||
|
|
||||||
|
function parseAccounts(raw) {
|
||||||
|
var parsed = Model.parseAccounts(raw)
|
||||||
|
accounts = parsed.accounts
|
||||||
|
selectedAccountId = parsed.selectedAccountId
|
||||||
|
selectedAccountLabel = parsed.selectedAccountLabel
|
||||||
|
accountsAccessDenied = false
|
||||||
|
}
|
||||||
|
|
||||||
|
function toggleTailscale() {
|
||||||
|
if (!installed) return
|
||||||
|
if (running) runAction(["tailscale", "down"], "Turning Tailscale off…")
|
||||||
|
else loginOrUp()
|
||||||
|
}
|
||||||
|
|
||||||
|
function loginOrUp() {
|
||||||
|
if (!installed || loginProcess.running) return
|
||||||
|
_loginOutput = ""
|
||||||
|
_loginError = ""
|
||||||
|
actionStatus = needsLogin ? "Starting Tailscale login…" : "Turning Tailscale on…"
|
||||||
|
_loginInProgress = needsLogin
|
||||||
|
_loginUrlOpened = false
|
||||||
|
_preLoginAuthUrl = authUrl
|
||||||
|
var command = ["tailscale", "up"]
|
||||||
|
if (needsLogin) command.push("--force-reauth")
|
||||||
|
loginProcess.command = command
|
||||||
|
loginProcess.running = true
|
||||||
|
if (needsLogin) loginTimeoutTimer.restart()
|
||||||
|
}
|
||||||
|
|
||||||
|
function switchAccount(id) {
|
||||||
|
var accountId = String(id || "")
|
||||||
|
if (!installed || accountId === "" || accountId === selectedAccountId || switchProcess.running) return
|
||||||
|
_switchOutput = ""
|
||||||
|
_switchError = ""
|
||||||
|
switchingAccountId = accountId
|
||||||
|
switchProcess.command = ["tailscale", "switch", accountId]
|
||||||
|
switchProcess.running = true
|
||||||
|
}
|
||||||
|
|
||||||
|
function exitNodeTarget(peer) {
|
||||||
|
if (!peer) return ""
|
||||||
|
if (peer.DNSName) return cleanDnsName(peer.DNSName)
|
||||||
|
if (peer.HostName) return String(peer.HostName)
|
||||||
|
var ips = filterIPv4(peer.TailscaleIPs || [])
|
||||||
|
return ips.length > 0 ? ips[0] : ""
|
||||||
|
}
|
||||||
|
|
||||||
|
function setExitNode(peer) {
|
||||||
|
if (!installed || !running || !peer || exitNodeProcess.running) return
|
||||||
|
var target = exitNodeTarget(peer)
|
||||||
|
if (target === "") return
|
||||||
|
_exitNodeOutput = ""
|
||||||
|
_exitNodeError = ""
|
||||||
|
settingExitNodeId = String(peer.id || "")
|
||||||
|
exitNodeProcess.command = ["tailscale", "set", "--exit-node=" + target]
|
||||||
|
exitNodeProcess.running = true
|
||||||
|
}
|
||||||
|
|
||||||
|
function authorizeProfileSwitching() {
|
||||||
|
if (!installed || operatorProcess.running || userName === "") return
|
||||||
|
_operatorOutput = ""
|
||||||
|
_operatorError = ""
|
||||||
|
actionStatus = "Authorizing Tailscale profiles…"
|
||||||
|
operatorProcess.command = ["pkexec", "tailscale", "set", "--operator=" + userName]
|
||||||
|
operatorProcess.running = true
|
||||||
|
}
|
||||||
|
|
||||||
|
function runAction(command, label) {
|
||||||
|
if (actionProcess.running) return
|
||||||
|
_actionOutput = ""
|
||||||
|
_actionError = ""
|
||||||
|
actionStatus = label || "Working…"
|
||||||
|
actionProcess.command = command
|
||||||
|
actionProcess.running = true
|
||||||
|
}
|
||||||
|
|
||||||
|
function openAuthUrlFrom(text, allowFallback) {
|
||||||
|
if (_loginUrlOpened) return true
|
||||||
|
var match = String(text || "").match(/https?:\/\/\S+/)
|
||||||
|
var url = match && match[0] ? match[0] : (allowFallback === true ? authUrl : "")
|
||||||
|
if (url !== "") {
|
||||||
|
_loginUrlOpened = true
|
||||||
|
_loginInProgress = false
|
||||||
|
loginTimeoutTimer.stop()
|
||||||
|
Qt.openUrlExternally(url)
|
||||||
|
actionStatus = "Opened login link"
|
||||||
|
actionStatusTimer.restart()
|
||||||
|
return true
|
||||||
|
}
|
||||||
|
return false
|
||||||
|
}
|
||||||
|
|
||||||
|
function handleLoginOutput(data, isError) {
|
||||||
|
var text = String(data || "")
|
||||||
|
if (isError) _loginError += text + "\n"
|
||||||
|
else _loginOutput += text + "\n"
|
||||||
|
if (_loginInProgress && !_loginUrlOpened) openAuthUrlFrom(text, false)
|
||||||
|
}
|
||||||
|
|
||||||
|
Timer {
|
||||||
|
id: refreshTimer
|
||||||
|
interval: root.refreshIntervalSec * 1000
|
||||||
|
repeat: true
|
||||||
|
running: true
|
||||||
|
triggeredOnStart: true
|
||||||
|
onTriggered: root.refresh()
|
||||||
|
}
|
||||||
|
|
||||||
|
Timer {
|
||||||
|
id: delayedRefresh
|
||||||
|
interval: 600
|
||||||
|
repeat: false
|
||||||
|
onTriggered: root.refresh()
|
||||||
|
}
|
||||||
|
|
||||||
|
Timer {
|
||||||
|
id: actionStatusTimer
|
||||||
|
interval: 2200
|
||||||
|
repeat: false
|
||||||
|
onTriggered: root.actionStatus = ""
|
||||||
|
}
|
||||||
|
|
||||||
|
Timer {
|
||||||
|
id: loginTimeoutTimer
|
||||||
|
interval: 10000
|
||||||
|
repeat: false
|
||||||
|
onTriggered: {
|
||||||
|
if (!root._loginInProgress || root._loginUrlOpened) return
|
||||||
|
if (!root.openAuthUrlFrom(root.authUrl, true)) {
|
||||||
|
root._loginInProgress = false
|
||||||
|
root.actionStatus = "Tailscale login link not available yet"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
Process {
|
||||||
|
id: whichProcess
|
||||||
|
running: false
|
||||||
|
command: []
|
||||||
|
onExited: function(exitCode) {
|
||||||
|
root.installed = exitCode === 0
|
||||||
|
if (root.installed) root.refreshStatusAndAccounts()
|
||||||
|
else {
|
||||||
|
root.refreshing = false
|
||||||
|
root.resetUnavailable("Not installed")
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
Process {
|
||||||
|
id: statusProcess
|
||||||
|
running: false
|
||||||
|
command: []
|
||||||
|
stdout: StdioCollector { id: statusStdout; waitForEnd: true; onStreamFinished: root._statusOutput = text }
|
||||||
|
stderr: StdioCollector { id: statusStderr; waitForEnd: true; onStreamFinished: root._statusError = text }
|
||||||
|
onExited: function(exitCode) {
|
||||||
|
root.refreshing = false
|
||||||
|
var stdout = String(statusStdout.text || root._statusOutput || "")
|
||||||
|
var stderr = String(statusStderr.text || root._statusError || "")
|
||||||
|
if (exitCode === 0) root.parseStatus(stdout)
|
||||||
|
else {
|
||||||
|
root.resetUnavailable("Disconnected")
|
||||||
|
root.lastError = stderr.trim()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
Process {
|
||||||
|
id: accountsProcess
|
||||||
|
running: false
|
||||||
|
command: []
|
||||||
|
stdout: StdioCollector { id: accountsStdout; waitForEnd: true; onStreamFinished: root._accountsOutput = text }
|
||||||
|
stderr: StdioCollector { id: accountsStderr; waitForEnd: true; onStreamFinished: root._accountsError = text }
|
||||||
|
onExited: function(exitCode) {
|
||||||
|
var stdout = String(accountsStdout.text || root._accountsOutput || "")
|
||||||
|
var stderr = String(accountsStderr.text || root._accountsError || "")
|
||||||
|
if (exitCode === 0) root.parseAccounts(stdout)
|
||||||
|
else {
|
||||||
|
root.parseAccounts("")
|
||||||
|
if (/profiles access denied/i.test(stderr) || /profiles access denied/i.test(stdout)) {
|
||||||
|
root.accountsAccessDenied = true
|
||||||
|
root.lastError = "Authorize Tailscale profiles to show connections"
|
||||||
|
} else {
|
||||||
|
root.lastError = elideStatus(stderr || stdout || "Could not list Tailscale connections")
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
Process {
|
||||||
|
id: actionProcess
|
||||||
|
running: false
|
||||||
|
command: []
|
||||||
|
stdout: StdioCollector { id: actionStdout; waitForEnd: true; onStreamFinished: root._actionOutput = text }
|
||||||
|
stderr: StdioCollector { id: actionStderr; waitForEnd: true; onStreamFinished: root._actionError = text }
|
||||||
|
onExited: function(exitCode) {
|
||||||
|
var stdout = String(actionStdout.text || root._actionOutput || "")
|
||||||
|
var stderr = String(actionStderr.text || root._actionError || "")
|
||||||
|
if (exitCode !== 0) {
|
||||||
|
root.lastError = elideStatus(stderr || stdout || "Tailscale command failed")
|
||||||
|
root.actionStatus = root.lastError
|
||||||
|
} else {
|
||||||
|
root.lastError = ""
|
||||||
|
root.actionStatus = ""
|
||||||
|
}
|
||||||
|
delayedRefresh.restart()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
Process {
|
||||||
|
id: loginProcess
|
||||||
|
running: false
|
||||||
|
command: []
|
||||||
|
stdout: SplitParser { onRead: function(data) { root.handleLoginOutput(data, false) } }
|
||||||
|
stderr: SplitParser { onRead: function(data) { root.handleLoginOutput(data, true) } }
|
||||||
|
onExited: function(exitCode) {
|
||||||
|
var combined = String(root._loginOutput || "") + "\n" + String(root._loginError || "")
|
||||||
|
var opened = root.openAuthUrlFrom(combined, true)
|
||||||
|
if (exitCode !== 0 && !opened) {
|
||||||
|
root._loginInProgress = false
|
||||||
|
root.lastError = elideStatus(combined || "tailscale up failed")
|
||||||
|
root.actionStatus = root.lastError
|
||||||
|
} else if (!opened) {
|
||||||
|
root.lastError = ""
|
||||||
|
root.actionStatus = ""
|
||||||
|
}
|
||||||
|
delayedRefresh.restart()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
Process {
|
||||||
|
id: switchProcess
|
||||||
|
running: false
|
||||||
|
command: []
|
||||||
|
stdout: StdioCollector { id: switchStdout; waitForEnd: true; onStreamFinished: root._switchOutput = text }
|
||||||
|
stderr: StdioCollector { id: switchStderr; waitForEnd: true; onStreamFinished: root._switchError = text }
|
||||||
|
onExited: function(exitCode) {
|
||||||
|
var stdout = String(switchStdout.text || root._switchOutput || "")
|
||||||
|
var stderr = String(switchStderr.text || root._switchError || "")
|
||||||
|
if (exitCode !== 0) {
|
||||||
|
root.lastError = elideStatus(stderr || stdout || "Account switch failed")
|
||||||
|
root.actionStatus = root.lastError
|
||||||
|
} else {
|
||||||
|
root.lastError = ""
|
||||||
|
root.actionStatus = ""
|
||||||
|
root._lastAccountsRefreshMs = 0
|
||||||
|
}
|
||||||
|
root.switchingAccountId = ""
|
||||||
|
delayedRefresh.restart()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
Process {
|
||||||
|
id: exitNodeProcess
|
||||||
|
running: false
|
||||||
|
command: []
|
||||||
|
stdout: StdioCollector { id: exitNodeStdout; waitForEnd: true; onStreamFinished: root._exitNodeOutput = text }
|
||||||
|
stderr: StdioCollector { id: exitNodeStderr; waitForEnd: true; onStreamFinished: root._exitNodeError = text }
|
||||||
|
onExited: function(exitCode) {
|
||||||
|
var stdout = String(exitNodeStdout.text || root._exitNodeOutput || "")
|
||||||
|
var stderr = String(exitNodeStderr.text || root._exitNodeError || "")
|
||||||
|
if (exitCode !== 0) {
|
||||||
|
root.lastError = elideStatus(stderr || stdout || "Exit node selection failed")
|
||||||
|
root.actionStatus = root.lastError
|
||||||
|
} else {
|
||||||
|
root.lastError = ""
|
||||||
|
root.actionStatus = ""
|
||||||
|
}
|
||||||
|
root.settingExitNodeId = ""
|
||||||
|
delayedRefresh.restart()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
Process {
|
||||||
|
id: operatorProcess
|
||||||
|
running: false
|
||||||
|
command: []
|
||||||
|
stdout: StdioCollector { id: operatorStdout; waitForEnd: true; onStreamFinished: root._operatorOutput = text }
|
||||||
|
stderr: StdioCollector { id: operatorStderr; waitForEnd: true; onStreamFinished: root._operatorError = text }
|
||||||
|
onExited: function(exitCode) {
|
||||||
|
var stdout = String(operatorStdout.text || root._operatorOutput || "")
|
||||||
|
var stderr = String(operatorStderr.text || root._operatorError || "")
|
||||||
|
if (exitCode !== 0) {
|
||||||
|
root.lastError = elideStatus(stderr || stdout || "Tailscale authorization failed")
|
||||||
|
root.actionStatus = root.lastError
|
||||||
|
} else {
|
||||||
|
root.accountsAccessDenied = false
|
||||||
|
root.lastError = ""
|
||||||
|
root.actionStatus = "Tailscale profiles authorized"
|
||||||
|
actionStatusTimer.restart()
|
||||||
|
root._lastAccountsRefreshMs = 0
|
||||||
|
}
|
||||||
|
delayedRefresh.restart()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
@@ -0,0 +1,72 @@
|
|||||||
|
import QtQuick
|
||||||
|
import qs.Commons
|
||||||
|
|
||||||
|
Item {
|
||||||
|
id: root
|
||||||
|
|
||||||
|
property real iconSize: Style.font.icon
|
||||||
|
property color color: Color.foreground
|
||||||
|
property color badgeColor: Color.urgent
|
||||||
|
property bool crossed: false
|
||||||
|
property bool warning: false
|
||||||
|
|
||||||
|
width: iconSize
|
||||||
|
height: iconSize
|
||||||
|
implicitWidth: iconSize
|
||||||
|
implicitHeight: iconSize
|
||||||
|
|
||||||
|
readonly property real dotSize: Math.max(2, root.iconSize * 0.24)
|
||||||
|
readonly property real mid: (root.iconSize - dotSize) / 2
|
||||||
|
readonly property real end: root.iconSize - dotSize
|
||||||
|
|
||||||
|
// Native rendering of the Tailscale mark from the SVG: a 3×3 dot grid
|
||||||
|
// with the inactive dots faded. This avoids Qt SVG/effect rendering quirks
|
||||||
|
// in tiny bar slots while keeping the official silhouette.
|
||||||
|
Dot { x: 0; y: 0; opacity: 0.24 }
|
||||||
|
Dot { x: root.mid; y: 0; opacity: 0.24 }
|
||||||
|
Dot { x: root.end; y: 0; opacity: 0.24 }
|
||||||
|
Dot { x: 0; y: root.mid; opacity: 1.0 }
|
||||||
|
Dot { x: root.mid; y: root.mid; opacity: 1.0 }
|
||||||
|
Dot { x: root.end; y: root.mid; opacity: 1.0 }
|
||||||
|
Dot { x: 0; y: root.end; opacity: 0.24 }
|
||||||
|
Dot { x: root.mid; y: root.end; opacity: 1.0 }
|
||||||
|
Dot { x: root.end; y: root.end; opacity: 0.24 }
|
||||||
|
|
||||||
|
Rectangle {
|
||||||
|
visible: root.crossed
|
||||||
|
anchors.centerIn: parent
|
||||||
|
width: parent.width * 1.22
|
||||||
|
height: Math.max(2, parent.height * 0.14)
|
||||||
|
radius: height / 2
|
||||||
|
color: root.badgeColor
|
||||||
|
rotation: -45
|
||||||
|
}
|
||||||
|
|
||||||
|
Rectangle {
|
||||||
|
visible: root.warning
|
||||||
|
width: Math.max(7, parent.width * 0.42)
|
||||||
|
height: width
|
||||||
|
radius: width / 2
|
||||||
|
color: root.badgeColor
|
||||||
|
anchors.right: parent.right
|
||||||
|
anchors.bottom: parent.bottom
|
||||||
|
border.color: Color.popups.background
|
||||||
|
border.width: 1
|
||||||
|
|
||||||
|
Text {
|
||||||
|
anchors.centerIn: parent
|
||||||
|
text: "!"
|
||||||
|
color: Color.background
|
||||||
|
font.family: Style.font.family
|
||||||
|
font.pixelSize: Math.max(6, parent.height * 0.72)
|
||||||
|
font.bold: true
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
component Dot: Rectangle {
|
||||||
|
width: root.dotSize
|
||||||
|
height: root.dotSize
|
||||||
|
radius: width / 2
|
||||||
|
color: root.color
|
||||||
|
}
|
||||||
|
}
|
||||||
@@ -0,0 +1,35 @@
|
|||||||
|
{
|
||||||
|
"schemaVersion": 1,
|
||||||
|
"id": "omarchy.tailscale",
|
||||||
|
"name": "Tailscale",
|
||||||
|
"version": "1.0.0",
|
||||||
|
"author": "Omarchy",
|
||||||
|
"license": "MIT",
|
||||||
|
"description": "Tailscale status, connection switching, machine browsing, and quick copy actions in the Omarchy bar.",
|
||||||
|
"kinds": [
|
||||||
|
"bar-widget"
|
||||||
|
],
|
||||||
|
"entryPoints": {
|
||||||
|
"barWidget": "Panel.qml"
|
||||||
|
},
|
||||||
|
"barWidget": {
|
||||||
|
"displayName": "Tailscale",
|
||||||
|
"description": "Toggle Tailscale, switch connections, browse machines, and copy machine IPs or names.",
|
||||||
|
"category": "Network",
|
||||||
|
"allowMultiple": false,
|
||||||
|
"defaults": {
|
||||||
|
"refreshIntervalSec": 30
|
||||||
|
},
|
||||||
|
"schema": [
|
||||||
|
{
|
||||||
|
"key": "refreshIntervalSec",
|
||||||
|
"type": "integer",
|
||||||
|
"label": "Refresh interval (seconds)",
|
||||||
|
"min": 5,
|
||||||
|
"max": 3600,
|
||||||
|
"step": 5,
|
||||||
|
"defaultValue": 30
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
}
|
||||||
Reference in New Issue
Block a user