Replace network signal icons with labels to prevent stuttering bug.

This commit is contained in:
Jas Singh
2024-07-13 22:34:39 -07:00
parent 58f6e02b8d
commit 880198c842
4 changed files with 187 additions and 174 deletions

View File

@@ -0,0 +1,23 @@
const getWifiIcon = (iconName) => {
const deviceIconMap = [
["network-wireless-acquiring", "󰤩"],
["network-wireless-connected", "󰤨"],
["network-wireless-encrypted", "󰤪"],
["network-wireless-hotspot", "󰤨"],
["network-wireless-no-route", "󰤩"],
["network-wireless-offline", "󰤮"],
["network-wireless-signal-excellent", "󰤨"],
["network-wireless-signal-good", "󰤥"],
["network-wireless-signal-ok", "󰤢"],
["network-wireless-signal-weak", "󰤟"],
["network-wireless-signal-none", "󰤯"],
];
const foundMatch = deviceIconMap.find((icon) =>
RegExp(icon[0]).test(iconName.toLowerCase()),
);
return foundMatch ? foundMatch[1] : "󰤨";
};
export { getWifiIcon };

View File

@@ -1,3 +1,4 @@
import { getWifiIcon } from "../utils.js";
const renderWAPs = (self, network, staging, connecting) => { const renderWAPs = (self, network, staging, connecting) => {
const getIdBySsid = (ssid, nmcliOutput) => { const getIdBySsid = (ssid, nmcliOutput) => {
const lines = nmcliOutput.trim().split("\n"); const lines = nmcliOutput.trim().split("\n");
@@ -26,194 +27,184 @@ const renderWAPs = (self, network, staging, connecting) => {
failed: "Connection Failed", failed: "Connection Failed",
}; };
self.hook(network, () => { self.hook(network, () => {
console.log(JSON.stringify(network, null, 2)); Utils.merge([staging.bind("value"), connecting.bind("value")], () => {
Utils.merge( // Sometimes the network service will yield a "this._device is undefined" when
[staging.bind("value"), connecting.bind("value")], // trying to access the "access_points" property. So we must validate that
() => { // it's not 'undefined'
// Sometimes the network service will yield a "this._device is undefined" when let WAPs =
// trying to access the "access_points" property. So we must validate that network.wifi._device !== undefined ? network.wifi["access-points"] : [];
// it's not 'undefined'
let WAPs =
network.wifi._device !== undefined
? network.wifi["access-points"]
: [];
const dedupeWAPs = () => { const dedupeWAPs = () => {
const dedupMap = {}; const dedupMap = {};
WAPs.forEach((item) => { WAPs.forEach((item) => {
if (!Object.hasOwnProperty.call(dedupMap, item.ssid)) { if (!Object.hasOwnProperty.call(dedupMap, item.ssid)) {
dedupMap[item.ssid] = item; dedupMap[item.ssid] = item;
}
});
return Object.keys(dedupMap).map((itm) => dedupMap[itm]);
};
WAPs = dedupeWAPs();
const isInStaging = (wap) => {
if (Object.keys(staging.value).length === 0) {
return false;
} }
return wap.bssid === staging.value.bssid;
};
const isDisconnecting = (wap) => {
if (wap.ssid === network.wifi.ssid) {
return network.wifi.state.toLowerCase() === "deactivating";
}
return false;
};
const filteredWAPs = WAPs.filter((ap) => {
return ap.ssid !== "Unknown" && !isInStaging(ap);
}).sort((a, b) => {
if (network.wifi.ssid === a.ssid) {
return -1;
}
if (network.wifi.ssid === b.ssid) {
return 1;
}
return b.strength - a.strength;
}); });
if ( return Object.keys(dedupMap).map((itm) => dedupMap[itm]);
filteredWAPs.length <= 0 && };
Object.keys(staging.value).length === 0
) { WAPs = dedupeWAPs();
return (self.child = Widget.Label({
class_name: "waps-not-found dim", const isInStaging = (wap) => {
expand: true, if (Object.keys(staging.value).length === 0) {
hpack: "center", return false;
vpack: "center",
label: "No Wi-Fi Networks Found",
}));
} }
return (self.children = filteredWAPs.map((ap) => {
return Widget.Box({
children: [
Widget.Button({
on_primary_click: () => {
if (ap.bssid === connecting.value || ap.active) {
return;
}
connecting.value = ap.bssid; return wap.bssid === staging.value.bssid;
Utils.execAsync(`nmcli device wifi connect ${ap.bssid}`) };
.then(() => {
connecting.value = ""; const isDisconnecting = (wap) => {
staging.value = {}; if (wap.ssid === network.wifi.ssid) {
}) return network.wifi.state.toLowerCase() === "deactivating";
.catch((err) => { }
if ( return false;
err };
.toLowerCase()
.includes("secrets were required, but not provided") const filteredWAPs = WAPs.filter((ap) => {
) { return ap.ssid !== "Unknown" && !isInStaging(ap);
staging.value = ap; }).sort((a, b) => {
} else { if (network.wifi.ssid === a.ssid) {
Utils.notify({ return -1;
summary: "Network", }
body: err,
timeout: 5000, if (network.wifi.ssid === b.ssid) {
}); return 1;
} }
connecting.value = "";
}); return b.strength - a.strength;
}, });
class_name: "network-element-item",
child: Widget.Box({ if (filteredWAPs.length <= 0 && Object.keys(staging.value).length === 0) {
hexpand: true, return (self.child = Widget.Label({
children: [ class_name: "waps-not-found dim",
Widget.Box({ expand: true,
hpack: "start", hpack: "center",
hexpand: true, vpack: "center",
children: [ label: "No Wi-Fi Networks Found",
Widget.Icon({ }));
class_name: `network-icon wifi ${ap.ssid === network.wifi.ssid ? "active" : ""}`, }
icon: `${ap["iconName"]}`, return (self.children = filteredWAPs.map((ap) => {
}), return Widget.Box({
Widget.Box({ children: [
class_name: "connection-container", Widget.Button({
vertical: true, on_primary_click: () => {
children: [ if (ap.bssid === connecting.value || ap.active) {
Widget.Label({ return;
class_name: "active-connection", }
hpack: "start",
truncate: "end", connecting.value = ap.bssid;
wrap: true, Utils.execAsync(`nmcli device wifi connect ${ap.bssid}`)
label: ap.ssid, .then(() => {
}), connecting.value = "";
Widget.Revealer({ staging.value = {};
revealChild: ap.ssid === network.wifi.ssid, })
child: Widget.Label({ .catch((err) => {
hpack: "start", if (
class_name: "connection-status dim", err
label: .toLowerCase()
WifiStatusMap[ .includes("secrets were required, but not provided")
network.wifi.state.toLowerCase() ) {
], staging.value = ap;
}), } else {
}), Utils.notify({
], summary: "Network",
}), body: err,
], timeout: 5000,
}), });
Widget.Revealer({ }
hpack: "end", connecting.value = "";
vpack: "start", });
reveal_child: },
ap.bssid === connecting.value || isDisconnecting(ap), class_name: "network-element-item",
child: Widget.Spinner({ child: Widget.Box({
hexpand: true,
children: [
Widget.Box({
hpack: "start",
hexpand: true,
children: [
Widget.Label({
vpack: "start", vpack: "start",
class_name: "spinner wap", class_name: `network-icon wifi ${ap.ssid === network.wifi.ssid ? "active" : ""}`,
label: getWifiIcon(`${ap["iconName"]}`),
}), }),
Widget.Box({
class_name: "connection-container",
vpack: "center",
vertical: true,
children: [
Widget.Label({
vpack: "center",
class_name: "active-connection",
hpack: "start",
truncate: "end",
wrap: true,
label: ap.ssid,
}),
Widget.Revealer({
revealChild: ap.ssid === network.wifi.ssid,
child: Widget.Label({
hpack: "start",
class_name: "connection-status dim",
label:
WifiStatusMap[network.wifi.state.toLowerCase()],
}),
}),
],
}),
],
}),
Widget.Revealer({
hpack: "end",
vpack: "start",
reveal_child:
ap.bssid === connecting.value || isDisconnecting(ap),
child: Widget.Spinner({
vpack: "start",
class_name: "spinner wap",
}), }),
], }),
}), ],
}), }),
Widget.Revealer({ }),
vpack: "start", Widget.Revealer({
reveal_child: ap.bssid !== connecting.value && ap.active, vpack: "start",
child: Widget.Button({ reveal_child: ap.bssid !== connecting.value && ap.active,
tooltip_text: "Delete/Forget Network", child: Widget.Button({
class_name: "menu-icon-button network disconnect", tooltip_text: "Delete/Forget Network",
on_primary_click: () => { class_name: "menu-icon-button network disconnect",
connecting.value = ap.bssid; on_primary_click: () => {
connecting.value = ap.bssid;
Utils.execAsync("nmcli connection show --active").then(() => {
Utils.execAsync("nmcli connection show --active").then( Utils.execAsync("nmcli connection show --active").then(
() => { (res) => {
Utils.execAsync("nmcli connection show --active").then( const connectionId = getIdBySsid(ap.ssid, res);
(res) => {
const connectionId = getIdBySsid(ap.ssid, res);
Utils.execAsync( Utils.execAsync(
`nmcli connection delete ${connectionId} "${ap.ssid}"`, `nmcli connection delete ${connectionId} "${ap.ssid}"`,
) )
.then(() => (connecting.value = "")) .then(() => (connecting.value = ""))
.catch((err) => { .catch((err) => {
connecting.value = ""; connecting.value = "";
console.error( console.error(
`Error while forgetting "${ap.ssid}": ${err}`, `Error while forgetting "${ap.ssid}": ${err}`,
); );
}); });
},
);
}, },
); );
}, });
child: Widget.Label({ },
label: "󰚃" child: Widget.Label({
}), label: "󰚃",
}), }),
}), }),
], }),
}); ],
})); });
}, }));
); });
}); });
}; };

View File

@@ -21,7 +21,6 @@
font-size: 1.3em; font-size: 1.3em;
min-width: 1em; min-width: 1em;
min-height: 1em; min-height: 1em;
color: $overlay1; color: $overlay1;
&.active { &.active {

File diff suppressed because one or more lines are too long