43 lines
1.6 KiB
TypeScript
43 lines
1.6 KiB
TypeScript
|
import { bind, Variable } from "astal";
|
||
|
|
||
|
import Network from "gi://AstalNetwork";
|
||
|
|
||
|
export default function NetworkButton() {
|
||
|
const network = Network.get_default();
|
||
|
|
||
|
const state = Variable.derive(
|
||
|
[bind(network, "primary"), bind(network, "wifi"), bind(network, "wired")],
|
||
|
(primary, wifi, wired) => {
|
||
|
switch (primary) {
|
||
|
case Network.Primary.WIFI:
|
||
|
return {
|
||
|
icon: wifi.iconName,
|
||
|
label: wifi.ssid,
|
||
|
tooltip: `Connected to ${wifi.ssid}`,
|
||
|
};
|
||
|
case Network.Primary.WIRED:
|
||
|
return {
|
||
|
icon: wired.iconName,
|
||
|
label: "Wired",
|
||
|
tooltip: {
|
||
|
[Network.Internet.CONNECTED]: `Connected to Ethernet`,
|
||
|
[Network.Internet.CONNECTING]: `Connecting to Ethernet...`,
|
||
|
[Network.Internet.DISCONNECTED]: `Connected to Ethernet (no internet!)`,
|
||
|
}[wired.internet],
|
||
|
};
|
||
|
default:
|
||
|
return {
|
||
|
icon: "network-disconnected-symbolic",
|
||
|
label: "Disconnected",
|
||
|
tooltip: "No connection",
|
||
|
};
|
||
|
}
|
||
|
}
|
||
|
)
|
||
|
|
||
|
const binding = bind(state);
|
||
|
return <box tooltipText={binding.as((t) => t.tooltip)} spacing={5}>
|
||
|
<image iconName={binding.as((i) => i.icon)} />
|
||
|
<label label={binding.as((l) => l.label)} />
|
||
|
</box>
|
||
|
}
|