refactor(ags): use aylur's lint settings

hosts/wim/config/ags/config.js

@@ -4,7 +4,7 @@ import Closer         from './js/misc/closer.js';
 import Powermenu      from './js/powermenu.js';
 import { Bar }        from './js/bar/main.js';
 import NotifCenter    from './js/notifications/center.js';
-import NotifPopups    from './js/notifications/popup.js'
+import NotifPopups    from './js/notifications/popup.js';
 import Calendar       from './js/date.js';
 import QuickSettings  from './js/quick-settings/main.js';
 import Overview       from './js/overview/main.js';

hosts/wim/config/ags/js/applauncher/main.js

@@ -8,7 +8,7 @@ const icons = {
     apps: {
         apps: 'view-app-grid-symbolic',
         search: 'preferences-system-search-symbolic',
-  }
+    },
 };
 
 

hosts/wim/config/ags/js/bar/brightness.js

@@ -12,13 +12,11 @@ export default () => Overlay({
         connections: [
             [200, self => {
                 Utils.execAsync('brightnessctl get').then(out => {
-          let br = out / 255;
+                    const br = out / 255;
-          if (br > 0.33) {
+                    if (br > 0.33)
                         self.value = br;
-          }
+                    else
-          else {
                         self.value = 0.33;
-          }
                 }).catch(print);
             }],
         ],

hosts/wim/config/ags/js/bar/clock.js

@@ -28,9 +28,8 @@ export default () => EventBox({
     onPrimaryClickRelease: () => App.toggleWindow('calendar'),
     connections: [
         [App, (self, windowName, visible) => {
-      if (windowName == 'calendar') {
+            if (windowName == 'calendar')
                 self.toggleClassName('toggle-on', visible);
-      }
         }],
     ],
     child: Box({

hosts/wim/config/ags/js/bar/fullscreen.js

@@ -14,7 +14,7 @@ import Gesture           from './gesture.js';
 //       with hyprctl if in fullscreen or not until fullscreen
 //       status changes again
 
-export default (props) => Overlay({
+export default props => Overlay({
     overlays: [
         RoundedCorner('topleft',  { className: 'corner' }),
         RoundedCorner('topright', { className: 'corner' }),
@@ -32,17 +32,17 @@ export default (props) => Overlay({
                 properties: [['timeouts', []]],
                 connections: [[Hyprland, self => {
                     Utils.execAsync('hyprctl activewindow -j').then(out => {
-            let client = JSON.parse(out);
+                        const client = JSON.parse(out);
                         if (client.fullscreen === Revealed.value)
                             return;
 
                         Revealed.value = client.fullscreen;
 
                         if (Revealed.value) {
-              setTimeout(() => {
+                            Utils.timeout(2000, () => {
                                 if (Revealed.value)
-                  self.revealChild = false
+                                    self.revealChild = false;
-              }, 2000);
+                            });
                         }
                         else {
                             self.revealChild = true;
@@ -55,12 +55,12 @@ export default (props) => Overlay({
                     onHoverLost: self => {
                         Hovering.value = false;
                         if (Revealed.value) {
-              setTimeout(() => {
+                            Utils.timeout(2000, () => {
                                 if (!Hovering.value) {
                                     self.get_parent().get_parent().children[1].revealChild = true;
                                     self.get_parent().revealChild = false;
                                 }
-              }, 2000);
+                            });
                         }
                     },
                     ...props,
@@ -70,10 +70,10 @@ export default (props) => Overlay({
             Widget.Revealer({
                 connections: [[Revealed, self => {
                     if (Revealed.value) {
-            setTimeout(() => {
+                        Utils.timeout(2000, () => {
                             if (Revealed.value)
                                 self.revealChild = true;
-            }, 2000);
+                        });
                     }
                     else {
                         self.revealChild = false;

hosts/wim/config/ags/js/bar/gesture.js

@@ -8,19 +8,18 @@ export default ({
     child,
     ...props
 }) => {
-  let widget = EventBox({
+    const widget = EventBox({
         ...props,
     });
 
-  let gesture = Gtk.GestureSwipe.new(widget);
+    const gesture = Gtk.GestureSwipe.new(widget);
 
     widget.add(CenterBox({
-    children: [ child ],
+        children: [child],
         connections: [[gesture, () => {
             const velocity = gesture.get_velocity()[1];
             if (velocity < -100)
                 App.openWindow('quick-settings');
-
         }, 'update']],
     }));
 

hosts/wim/config/ags/js/bar/heart.js

@@ -21,7 +21,7 @@ export default () => EventBox({
             setup: self => {
                 subprocess(
                     ['bash', '-c', 'tail -f /home/matt/.config/.heart'],
-          (output) => self.label = ' ' + output,
+                    output => self.label = ' ' + output,
                 );
             },
         }),

hosts/wim/config/ags/js/bar/keyboard-layout.js

@@ -1,7 +1,7 @@
 import { Hyprland, Utils, Widget } from '../../imports.js';
 const { Label, Box, Icon } = Widget;
 
-const DEFAULT_KB = "at-translated-set-2-keyboard";
+const DEFAULT_KB = 'at-translated-set-2-keyboard';
 
 export default () => Box({
     className: 'toggle-off',
@@ -13,9 +13,9 @@ export default () => Box({
         Label({
             connections: [[Hyprland, (self, _n, layout) => {
                 if (!layout) {
-          let obj = Utils.exec('hyprctl devices -j')
+                    const obj = Utils.exec('hyprctl devices -j');
-          let keyboards = JSON.parse(obj)['keyboards'];
+                    const keyboards = JSON.parse(obj)['keyboards'];
-          let kb = keyboards.find(val => val.name === DEFAULT_KB);
+                    const kb = keyboards.find(val => val.name === DEFAULT_KB);
 
                     layout = kb['active_keymap'];
 

hosts/wim/config/ags/js/bar/main.js

@@ -20,7 +20,7 @@ import Revealer       from './fullscreen.js';
 export const Bar = () => Window({
     name: 'bar',
     layer: 'overlay',
-  anchor: [ 'top', 'left', 'right' ],
+    anchor: ['top', 'left', 'right'],
     exclusive: true,
     child: Revealer({
         child: CenterBox({

hosts/wim/config/ags/js/bar/notif-button.js

@@ -21,15 +21,13 @@ export default () => EventBox({
             Icon({
                 connections: [[Notifications, self => {
                     if (Notifications.dnd) {
-            self.icon = 'notification-disabled-symbolic'
+                        self.icon = 'notification-disabled-symbolic';
                     }
                     else {
-            if (Notifications.notifications.length > 0) {
+                        if (Notifications.notifications.length > 0)
-              self.icon = 'notification-new-symbolic'
+                            self.icon = 'notification-new-symbolic';
-            }
+                        else
-            else {
+                            self.icon = 'notification-symbolic';
-              self.icon = 'notification-symbolic'
-            }
                     }
                 }]],
             }),

hosts/wim/config/ags/js/bar/osk-toggle.js

@@ -10,14 +10,14 @@ export default () => EventBox({
     setup: self => {
         subprocess(
             ['bash', '-c', '$AGS_PATH/osk-toggle.sh getState'],
-      (output) => self.toggleClassName('toggle-on', output === 'Running'),
+            output => self.toggleClassName('toggle-on', output === 'Running'),
         );
     },
 
     onPrimaryClickRelease: self => {
         subprocess(
             ['bash', '-c', '$AGS_PATH/osk-toggle.sh toggle'],
-      (output) => self.toggleClassName('toggle-on', output !== 'Running'),
+            output => self.toggleClassName('toggle-on', output !== 'Running'),
         );
     },
 
@@ -27,7 +27,7 @@ export default () => EventBox({
 
         children: [
             Label({
-        label: " 󰌌 ",
+                label: ' 󰌌 ',
             }),
         ],
     }),

hosts/wim/config/ags/js/bar/quick-settings.js

@@ -15,7 +15,7 @@ export default () => EventBox({
         className: 'quick-settings-toggle',
         vertical: false,
         child: Label({
-      label: "  ",
+            label: '  ',
         }),
     }),
 });

hosts/wim/config/ags/js/bar/systray.js

@@ -1,4 +1,4 @@
-import { SystemTray, Widget } from '../../imports.js';
+import { SystemTray, Utils, Widget } from '../../imports.js';
 const { Box, Revealer, Icon, MenuItem } = Widget;
 
 import Gtk from 'gi://Gtk';
@@ -18,16 +18,16 @@ const SysTrayItem = item => MenuItem({
     connections: [[item, btn => {
         btn.child.child.icon = item.icon;
         btn.tooltipMarkup = item.tooltipMarkup;
-  }]]
+    }]],
 });
 
 const SysTray = () => {
-  let widget = Gtk.MenuBar.new();
+    const widget = Gtk.MenuBar.new();
 
     // Properties
     widget._items = new Map();
 
-  widget._onAdded = (id) => {
+    widget._onAdded = id => {
         const item = SystemTray.getItem(id);
         if (widget._items.has(id) || !item)
             return;
@@ -39,15 +39,15 @@ const SysTray = () => {
         w.child.revealChild = true;
     };
 
-  widget._onRemoved = (id) => {
+    widget._onRemoved = id => {
         if (!widget._items.has(id))
             return;
 
         widget._items.get(id).child.revealChild = false;
-    setTimeout(() => {
+        Utils.timeout(400, () => {
             widget._items.get(id).destroy();
             widget._items.delete(id);
-    }, 400);
+        });
     };
 
     // Connections
@@ -55,7 +55,7 @@ const SysTray = () => {
     SystemTray.connect('removed', (_, id) => widget._onRemoved(id));
 
     return widget;
-}
+};
 
 export default () => Revealer({
     transition: 'slide_right',

hosts/wim/config/ags/js/bar/tablet-toggle.js

@@ -10,14 +10,14 @@ export default () => EventBox({
     onPrimaryClickRelease: self => {
         subprocess(
             ['bash', '-c', '$AGS_PATH/tablet-toggle.sh toggle'],
-      (output) => self.toggleClassName('toggle-on', output == 'Tablet'),
+            output => self.toggleClassName('toggle-on', output == 'Tablet'),
         );
     },
     child: Box({
         className: 'tablet-toggle',
         vertical: false,
         child: Label({
-      label: " 󰦧 ",
+            label: ' 󰦧 ',
         }),
     }),
 });

hosts/wim/config/ags/js/bar/workspaces.js

@@ -6,8 +6,8 @@ import EventBox from '../misc/cursorbox.js';
 
 
 const Workspace = ({ i } = {}) =>
-Revealer({
+    Revealer({
-  transition: "slide_right",
+        transition: 'slide_right',
         properties: [['id', i]],
 
         child: EventBox({
@@ -26,7 +26,7 @@ Revealer({
                 }]],
             }),
         }),
-});
+    });
 
 export default () => Box({
     className: 'workspaces',
@@ -44,10 +44,9 @@ export default () => Box({
 
                 ['updateWs', self => {
                     Hyprland.workspaces.forEach(ws => {
-            let currentWs = self.children.find(ch => ch._id == ws.id);
+                        const currentWs = self.children.find(ch => ch._id == ws.id);
-            if (!currentWs && ws.id > 0) {
+                        if (!currentWs && ws.id > 0)
-              self.add(Workspace({ i: ws.id}));
+                            self.add(Workspace({ i: ws.id }));
-            }
                     });
                     self.show_all();
 
@@ -59,7 +58,7 @@ export default () => Box({
             ],
             connections: [[Hyprland, self => {
                 self._workspaces = self.children.filter(ch => {
-          return Hyprland.workspaces.find(ws => ws.id == ch._id)
+                    return Hyprland.workspaces.find(ws => ws.id == ch._id);
                 }).sort((a, b) => a._id - b._id);
 
                 self._updateWs(self);

hosts/wim/config/ags/js/date.js

@@ -53,9 +53,9 @@ const Time = () => Box({
                 label: 'complete date',
                 connections: [[1000, self => {
                     var time = DateTime.new_now_local();
-          self.label = time.format("%A, %B ") +
+                    self.label = time.format('%A, %B ') +
                                  time.get_day_of_month() +
-                       time.format(", %Y");
+                                 time.format(', %Y');
                 }]],
             }),
         }),
@@ -74,8 +74,8 @@ const CalendarWidget = () => Box({
 });
 
 export default () => PopupWindow({
-  anchor: [ 'top', 'right' ],
+    anchor: ['top', 'right'],
-  margin: [ 8, 182, 0, 0],
+    margin: [8, 182, 0, 0],
     name: 'calendar',
     child: Box({
         className: 'date',

hosts/wim/config/ags/js/media-player/gesture.js

@@ -1,4 +1,4 @@
-import { Widget } from '../../imports.js';
+import { Utils, Widget } from '../../imports.js';
 const { Box, Overlay, EventBox } = Widget;
 
 import Gtk from 'gi://Gtk';
@@ -8,9 +8,13 @@ const OFFSCREEN = 500;
 const TRANSITION = 'transition: margin 0.5s ease, opacity 3s ease;';
 
 
-export default ({ properties, connections, props } = {}) => {
+export default ({
-  let widget = EventBox({});
+    properties,
-  let gesture = Gtk.GestureDrag.new(widget)
+    connections,
+    props,
+} = {}) => {
+    const widget = EventBox({});
+    const gesture = Gtk.GestureDrag.new(widget);
 
     widget.add(Overlay({
         ...props,
@@ -18,7 +22,7 @@ export default ({ properties, connections, props } = {}) => {
             ...properties,
             ['dragging', false],
         ],
-    child: Box({className: 'player'}),
+        child: Box({ className: 'player' }),
         connections: [
             ...connections,
 
@@ -29,7 +33,7 @@ export default ({ properties, connections, props } = {}) => {
                 overlay._dragging = true;
                 const offset = gesture.get_offset()[1];
 
-        let playerBox = overlay.list().at(-1);
+                const playerBox = overlay.list().at(-1);
 
                 if (offset >= 0) {
                     playerBox.setStyle(`margin-left:   ${offset}px;
@@ -37,7 +41,7 @@ export default ({ properties, connections, props } = {}) => {
                                         ${playerBox._bgStyle}`);
                 }
                 else {
-          let newOffset = Math.abs(offset);
+                    const newOffset = Math.abs(offset);
                     playerBox.setStyle(`margin-left: -${newOffset}px;
                                         margin-right: ${newOffset}px;
                                         ${playerBox._bgStyle}`);
@@ -52,7 +56,7 @@ export default ({ properties, connections, props } = {}) => {
                 overlay._dragging = false;
                 const offset = gesture.get_offset()[1];
 
-        let playerBox = overlay.list().at(-1);
+                const playerBox = overlay.list().at(-1);
 
                 if (Math.abs(offset) > MAX_OFFSET) {
                     if (offset >= 0) {
@@ -69,15 +73,15 @@ export default ({ properties, connections, props } = {}) => {
                                             opacity: 0;
                                             ${playerBox._bgStyle}`);
                     }
-          setTimeout(() => {
+                    Utils.timeout(500, () => {
                         overlay.reorder_overlay(playerBox, 0);
                         playerBox.setStyle(playerBox._bgStyle);
                         overlay._selected = overlay.list().at(-1);
-          }, 500);
+                    });
                 }
-        else
+                else {
                     playerBox.setStyle(`${TRANSITION} ${playerBox._bgStyle}`);
-
+                }
             }, 'drag-end'],
         ],
     }));

hosts/wim/config/ags/js/media-player/mpris.js

@@ -26,7 +26,7 @@ const icons = {
         prev: '󰒮',
         next: '󰒭',
     },
-}
+};
 
 
 export const CoverArt = (player, props) => CenterBox({
@@ -51,8 +51,10 @@ export const CoverArt = (player, props) => CenterBox({
 
                 if (!self.get_parent()._dragging)
                     self.setStyle(self._bgStyle);
-
+            }).catch(err => {
-      }).catch(err => {if (err !== "") print(err)});
+                if (err !== '')
+                    print(err);
+            });
     }]],
 });
 
@@ -77,7 +79,7 @@ export const ArtistLabel = (player, props) => Label({
 });
 
 export const PlayerIcon = (player, { symbolic = true, ...props } = {}) => {
-  let MainIcon = Icon({
+    const MainIcon = Icon({
         ...props,
         className: 'player-icon',
         size: 32,
@@ -91,30 +93,30 @@ export const PlayerIcon = (player, { symbolic = true, ...props } = {}) => {
 
     return Box({
         connections: [[Mpris, self => {
-      let overlays = self.get_parent().get_parent()
+            const overlays = self.get_parent().get_parent()
                 .get_parent().list();
 
-      let player = overlays.find(overlay => {
+            const player = overlays.find(overlay => {
                 overlay === self.get_parent().get_parent();
             });
 
-      let index = overlays.indexOf(player);
+            const index = overlays.indexOf(player);
 
-      let children = [];
+            const children = [];
             for (let i = 0; i < overlays.length; ++i) {
                 if (i === index) {
                     children.push(MainIcon);
                     children.push(Separator(2));
                 }
                 else {
-          children.push(Box({className: 'position-indicator'}));
+                    children.push(Box({ className: 'position-indicator' }));
                     children.push(Separator(2));
                 }
             }
             self.children = children;
         }]],
     });
-}
+};
 
 // FIXME: get the cursors right or just don't display when disabled
 export const PositionSlider = (player, props) => EventBox({
@@ -138,21 +140,21 @@ export const PositionSlider = (player, props) => EventBox({
                 }
 
                 slider.sensitive = player.length > 0;
-        if (player.length > 0) {
+                if (player.length > 0)
                     slider.value = player.position / player.length;
             }
-      }
         }]],
         connections: [
             [player, s => s._update(s), 'position'],
             [1000, s => s._update(s)],
             [player.colors, s => {
-        let c = player.colors.value;
+                const c = player.colors.value;
-        if (c)
+                if (c) {
                     s.setCss(`highlight { background-color: ${c.buttonAccent}; }
                               slider { background-color: ${c.buttonAccent}; }
                               slider:hover { background-color: ${c.hoverAccent}; }
                               trough { background-color: ${c.buttonText}; }`);
+                }
             }],
         ],
     }),
@@ -197,12 +199,12 @@ const PlayerButton = ({ player, items, onClick, prop }) => Button({
     properties: [['hovered', false]],
     onHover: self => {
         self._hovered = true;
-    if (! self.child.sensitive || ! self.sensitive) {
+        if (! self.child.sensitive || ! self.sensitive)
             self.window.set_cursor(Gdk.Cursor.new_from_name(display, 'not-allowed'));
-    }
+
-    else {
+        else
             self.window.set_cursor(Gdk.Cursor.new_from_name(display, 'pointer'));
-    }
+
 
         if (prop == 'playBackStatus') {
             items.forEach(item => {

hosts/wim/config/ags/js/media-player/player.js

@@ -1,5 +1,5 @@
 import { Mpris, Variable, Widget } from '../../imports.js';
-const { Box, CenterBox, Label } = Widget;
+const { Box, CenterBox } = Widget;
 
 import * as mpris    from './mpris.js';
 import PlayerGesture from './gesture.js';
@@ -101,20 +101,18 @@ export default () => Box({
                     return;
 
                 if (!busName) {
-          let player = Mpris.players.find(p => !overlay._players.has(p.busName));
+                    const player = Mpris.players.find(p => !overlay._players.has(p.busName));
-          if (player) {
+                    if (player)
                         busName = player.busName;
-          }
+                    else
-          else {
                         return;
                 }
-        }
 
                 const player = Mpris.getPlayer(busName);
                 player.colors = Variable();
                 overlay._players.set(busName, PlayerBox(player));
 
-        let result = [];
+                const result = [];
                 overlay._players.forEach(widget => {
                     result.push(widget);
                 });
@@ -123,15 +121,14 @@ export default () => Box({
 
                 // Select favorite player at startup
                 if (!overlay._setup) {
-          if (overlay._players.has(FAVE_PLAYER)) {
+                    if (overlay._players.has(FAVE_PLAYER))
                         overlay._selected = overlay._players.get(FAVE_PLAYER);
-          }
+
                     overlay._setup = true;
                 }
 
                 if (overlay._selected)
                     overlay.reorder_overlay(overlay._selected, -1);
-
             }, 'player-added'],
 
 
@@ -141,7 +138,7 @@ export default () => Box({
 
                 overlay._players.delete(busName);
 
-        let result = [];
+                const result = [];
                 overlay._players.forEach(widget => {
                     result.push(widget);
                 });
@@ -149,7 +146,6 @@ export default () => Box({
                 overlay.overlays = result;
                 if (overlay._selected)
                     overlay.reorder_overlay(overlay._selected, -1);
-
             }, 'player-closed'],
         ],
     }),

hosts/wim/config/ags/js/misc/closer.js

@@ -10,14 +10,14 @@ const ALWAYS_OPEN = [
     'cornertl',
     'cornertr',
     'cornerbl',
-  'cornerbr'
+    'cornerbr',
 ];
 
 
 const closeAll = () => {
     App.windows.forEach(w => {
         if (!ALWAYS_OPEN.some(window => window === w.name))
-      App.closeWindow(w.name)
+            App.closeWindow(w.name);
     });
     App.closeWindow('closer');
 };
@@ -32,10 +32,10 @@ Pointers.connect('new-line', (_, out) => {
                 pos = JSON.parse(pos);
 
                 Object.values(layers).forEach(key => {
-          let bar = key['levels']['3']
+                    const bar = key['levels']['3']
-            .find(n => n.namespace === "bar");
+                        .find(n => n.namespace === 'bar');
 
-          let widgets = key['levels']['3']
+                    const widgets = key['levels']['3']
                         .filter(n => !ALWAYS_OPEN.includes(n.namespace));
 
                     if (pos.x > bar.x && pos.x < bar.x + bar.w &&
@@ -48,17 +48,15 @@ Pointers.connect('new-line', (_, out) => {
                             if (!(pos.x > l.x && pos.x < l.x + l.w &&
                                   pos.y > l.y && pos.y < l.y + l.h)) {
                                 closeAll();
-                return
+                                return;
                             }
                         });
                     }
-
                 });
-
             }).catch(print);
         }).catch(print);
     }
-})
+});
 
 export default () => Window({
     name: 'closer',
@@ -67,10 +65,14 @@ export default () => Window({
 
     child: Revealer({
         connections: [[App, (_, windowName, visible) => {
-      if (!Array.from(App.windows).some(w => w[1].visible &&
+            const anyVisibleAndClosable = Array.from(App.windows).some(w => {
-        !ALWAYS_OPEN.some(window => window === w[0]))) {
+                const isAlwaysOpen = ALWAYS_OPEN.some(window => window === w[0]);
+
+                return w[1].visible && !isAlwaysOpen;
+            });
+
+            if (!anyVisibleAndClosable)
                 App.closeWindow('closer');
-      }
 
             if (windowName === 'closer') {
                 if (visible)

hosts/wim/config/ags/js/misc/cursorbox.js

@@ -5,20 +5,19 @@ const display = Gdk.Display.get_default();
 
 
 export default ({
-  type = "EventBox",
+    type = 'EventBox',
     reset = true,
     ...props
 }) => {
-  if (type === "EventBox") {
+    if (type === 'EventBox') {
         return Widget.EventBox({
             ...props,
             onHover: self => {
-        if (!self.child.sensitive || !self.sensitive) {
+                if (!self.child.sensitive || !self.sensitive)
                     self.window.set_cursor(Gdk.Cursor.new_from_name(display, 'not-allowed'));
-        }
+
-        else {
+                else
                     self.window.set_cursor(Gdk.Cursor.new_from_name(display, 'pointer'));
-        }
             },
             onHoverLost: self => {
                 if (reset)
@@ -30,12 +29,10 @@ export default ({
         return Widget.Button({
             ...props,
             onHover: self => {
-        if (!self.child.sensitive || !self.sensitive) {
+                if (!self.child.sensitive || !self.sensitive)
                     self.window.set_cursor(Gdk.Cursor.new_from_name(display, 'not-allowed'));
-        }
+                else
-        else {
                     self.window.set_cursor(Gdk.Cursor.new_from_name(display, 'pointer'));
-        }
             },
             onHoverLost: self => {
                 if (reset)
@@ -43,4 +40,4 @@ export default ({
             },
         });
     }
-}
+};

hosts/wim/config/ags/js/misc/popup.js

@@ -6,10 +6,10 @@ export default ({
     name,
     child,
     transition = 'slide_down',
-  onOpen = rev => {},
+    onOpen = () => {},
     ...props
 }) => {
-  let window = Window({
+    const window = Window({
         name,
         popup: true,
         visible: false,
@@ -36,4 +36,4 @@ export default ({
     });
     window.getChild = () => child;
     return window;
-}
+};

hosts/wim/config/ags/js/misc/separator.js

@@ -13,4 +13,4 @@ export default (size, { vertical = false } = {}) => {
             style: `min-width: ${size}px;`,
         });
     }
-}
+};

hosts/wim/config/ags/js/notifications/base.js

@@ -14,14 +14,14 @@ const getDragState = box => box.get_parent().get_parent()
     .get_parent().get_parent().get_parent()._dragging;
 
 import Gesture from './gesture.js';
-import EventBox from '../misc/cursorbox.js'
+import EventBox from '../misc/cursorbox.js';
 
 
 const NotificationIcon = notif => {
     let iconCmd = () => {};
 
     if (Applications.query(notif.appEntry).length > 0) {
-    let app = Applications.query(notif.appEntry)[0];
+        const app = Applications.query(notif.appEntry)[0];
 
         let wmClass = app.app.get_string('StartupWMClass');
         if (app.app.get_filename().includes('discord'))
@@ -33,12 +33,12 @@ const NotificationIcon = notif => {
                     execAsync(['bash', '-c',
                         `$AGS_PATH/launch-app.sh
                         ${wmClass}
-              ${app.app.get_string('Exec')}`
+                        ${app.app.get_string('Exec')}`,
                     ]).catch(print);
 
                     globalThis.closeAll();
                 }
-      }
+            };
         }
     }
 
@@ -49,26 +49,24 @@ const NotificationIcon = notif => {
                 valign: 'start',
                 hexpand: false,
                 className: 'icon img',
-        style: `
+                style: `background-image: url("${notif.image}");
-          background-image: url("${notif.image}");
                         background-size: contain;
                         background-repeat: no-repeat;
                         background-position: center;
                         min-width: 78px;
-          min-height: 78px;
+                        min-height: 78px;`,
-        `,
             }),
         });
     }
 
     let icon = 'dialog-information-symbolic';
-  if (lookUpIcon(notif.appIcon)) {
+    if (lookUpIcon(notif.appIcon))
         icon = notif.appIcon;
-  }
 
-  if (lookUpIcon(notif.appEntry)) {
+
+    if (lookUpIcon(notif.appEntry))
         icon = notif.appEntry;
-  }
+
 
     return EventBox({
         onPrimaryClickRelease: iconCmd,
@@ -76,10 +74,8 @@ const NotificationIcon = notif => {
             valign: 'start',
             hexpand: false,
             className: 'icon',
-      style: `
+            style: `min-width: 78px;
-        min-width: 78px;
+                    min-height: 78px;`,
-        min-height: 78px;
-      `,
             children: [Icon({
                 icon, size: 58,
                 halign: 'center',
@@ -91,7 +87,7 @@ const NotificationIcon = notif => {
     });
 };
 
-export default ({ notif, command = () => {}, } = {}) => {
+export default ({ notif, command = () => {} } = {}) => {
     const BlockedApps = [
         'Spotify',
     ];
@@ -109,14 +105,12 @@ export default ({ notif, command = () => {}, } = {}) => {
             ['id', notif.id],
         ],
         onHover: w => {
-      if (!w._hovered) {
+            if (!w._hovered)
                 w._hovered = true;
-      }
         },
         onHoverLost: w => {
-      if (w._hovered) {
+            if (w._hovered)
                 w._hovered = false;
-      }
         },
 
         child: Box({

hosts/wim/config/ags/js/notifications/center.js

@@ -73,7 +73,7 @@ const NotificationList = Box({
                     .map(n => Notification({ notif: n, command: () => n.close() }));
             }
             else if (id) {
-        let notif = Notifications.getNotification(id);
+                const notif = Notifications.getNotification(id);
 
                 const NewNotif = Notification({
                     notif,
@@ -85,7 +85,6 @@ const NotificationList = Box({
                     box.show_all();
                 }
             }
-
         }, 'notified'],
 
         [Notifications, (box, id) => {
@@ -141,7 +140,7 @@ const NotificationCenterWidget = () => Box({
                             Placeholder(),
                         ],
                     }),
-        })
+                }),
             ],
         }),
     ],
@@ -149,7 +148,7 @@ const NotificationCenterWidget = () => Box({
 
 export default () => PopupWindow({
     name: 'notification-center',
-  anchor: [ 'top', 'right' ],
+    anchor: ['top', 'right'],
-  margin: [ 8, 60, 0, 0 ],
+    margin: [8, 60, 0, 0],
     child: NotificationCenterWidget(),
 });

hosts/wim/config/ags/js/notifications/gesture.js

@@ -1,4 +1,4 @@
-import { Widget } from '../../imports.js';
+import { Utils, Widget } from '../../imports.js';
 const { Box, EventBox } = Widget;
 
 import Gtk from 'gi://Gtk';
@@ -11,14 +11,14 @@ export default ({
     startMargin = 0,
     endMargin = 300,
     command = () => {},
-  onHover = w => {},
+    onHover = () => {},
-  onHoverLost = w => {},
+    onHoverLost = () => {},
     child = '',
     children = [],
     properties = [[]],
     ...props
 }) => {
-  let widget = EventBox({
+    const widget = EventBox({
         ...props,
         properties: [
             ['dragging', false],
@@ -34,24 +34,24 @@ export default ({
         },
     });
 
-  let gesture = Gtk.GestureDrag.new(widget);
+    const gesture = Gtk.GestureDrag.new(widget);
 
-  let leftAnim1 = `transition: margin 0.5s ease, opacity 0.5s ease;
+    const leftAnim1 = `transition: margin 0.5s ease, opacity 0.5s ease;
                        margin-left: -${Number(maxOffset + endMargin)}px;
                        margin-right: ${Number(maxOffset + endMargin)}px;
                        opacity: 0;`;
 
-  let leftAnim2 = `transition: margin 0.5s ease, opacity 0.5s ease;
+    const leftAnim2 = `transition: margin 0.5s ease, opacity 0.5s ease;
                        margin-left: -${Number(maxOffset + endMargin)}px;
                        margin-right: ${Number(maxOffset + endMargin)}px;
                        margin-bottom: -70px; margin-top: -70px; opacity: 0;`;
 
-  let rightAnim1 = `transition: margin 0.5s ease, opacity 0.5s ease;
+    const rightAnim1 = `transition: margin 0.5s ease, opacity 0.5s ease;
                         margin-left: ${Number(maxOffset + endMargin)}px;
                         margin-right: -${Number(maxOffset + endMargin)}px;
                         opacity: 0;`;
 
-  let rightAnim2 = `transition: margin 0.5s ease, opacity 0.5s ease;
+    const rightAnim2 = `transition: margin 0.5s ease, opacity 0.5s ease;
                         margin-left: ${Number(maxOffset + endMargin)}px;
                         margin-right: -${Number(maxOffset + endMargin)}px;
                         margin-bottom: -70px; margin-top: -70px; opacity: 0;`;
@@ -62,7 +62,7 @@ export default ({
             ['leftAnim2',  leftAnim2],
             ['rightAnim1', rightAnim1],
             ['rightAnim2', rightAnim2],
-      ['ready', false]
+            ['ready', false],
         ],
         children: [
             ...children,
@@ -97,13 +97,13 @@ export default ({
                          margin-right: ${Number(maxOffset + endMargin)}px;
                          margin-bottom: 0px; margin-top: 0px; opacity: 0;`);
 
-          setTimeout(() => {
+                    Utils.timeout(500, () => {
                         self.setStyle(`transition: margin 0.5s ease, opacity 0.5s ease;
                            margin-left:  ${startMargin}px;
                            margin-right: ${startMargin}px;
                            margin-bottom: unset; margin-top: unset; opacity: 1;`);
-          }, 500);
+                    });
-          setTimeout(() => self._ready = true, 1000);
+                    Utils.timeout(1000, () => self._ready = true);
                     return;
                 }
 
@@ -112,16 +112,16 @@ export default ({
                 if (Math.abs(offset) > maxOffset) {
                     if (offset > 0) {
                         self.setStyle(rightAnim1);
-            setTimeout(() => self.setStyle(rightAnim2), 500);
+                        Utils.timeout(500, () => self.setStyle(rightAnim2));
                     }
                     else {
                         self.setStyle(leftAnim1);
-            setTimeout(() => self.setStyle(leftAnim2), 500);
+                        Utils.timeout(500, () => self.setStyle(leftAnim2));
                     }
-          setTimeout(() => {
+                    Utils.timeout(1000, () => {
                         command();
                         self.destroy();
-          }, 1000);
+                    });
                 }
                 else {
                     self.setStyle(`transition: margin 0.5s ease, opacity 0.5s ease;

hosts/wim/config/ags/js/notifications/popup.js

@@ -1,6 +1,8 @@
-import { Notifications, Widget } from '../../imports.js';
+import { Notifications, Utils, Widget } from '../../imports.js';
 const { Box, Revealer, Window } = Widget;
 
+import GLib from 'gi://GLib';
+
 import Notification from './base.js';
 
 
@@ -11,22 +13,22 @@ const Popups = () => Box({
 
         ['dismiss', (box, id, force = false) => {
             if (!id || !box._map.has(id) ||
-          box._map.get(id)._hovered && !force) {
+          box._map.get(id)._hovered && !force)
 
                 return;
-      }
+
 
             if (box._map.size - 1 === 0)
                 box.get_parent().reveal_child = false;
 
-      setTimeout(() => {
+            Utils.timeout(200, () => {
                 if (box._map.get(id)?.interval) {
                     box._map.get(id).interval.destroy();
                     box._map.get(id).interval = undefined;
                 }
                 box._map.get(id)?.destroy();
                 box._map.delete(id);
-      }, 200);
+            });
         }],
 
         ['notify', (box, id) => {
@@ -38,7 +40,7 @@ const Popups = () => Box({
 
             box._map.delete(id);
 
-      let notif = Notifications.getNotification(id);
+            const notif = Notifications.getNotification(id);
             box._map.set(id, Notification({
                 notif,
                 command: () => notif.dismiss(),
@@ -46,20 +48,20 @@ const Popups = () => Box({
 
             box.children = Array.from(box._map.values()).reverse();
 
-      setTimeout(() => {
+            Utils.timeout(10, () => {
                 box.get_parent().revealChild = true;
-      }, 10);
+            });
 
-      box._map.get(id).interval = setInterval(() => {
+            box._map.get(id).interval = Utils.interval(4500, () => {
                 if (!box._map.get(id)._hovered) {
                     box._map.get(id).child.setStyle(box._map.get(id).child._leftAnim1);
 
                     if (box._map.get(id).interval) {
-            box._map.get(id).interval.destroy();
+                        GLib.source_remove(box._map.get(id).interval);
                         box._map.get(id).interval = undefined;
                     }
                 }
-      }, 4500);
+            });
         }],
     ],
     connections: [
@@ -81,7 +83,7 @@ const PopupList = ({ transition = 'none' } = {}) => Box({
 });
 
 export default () => Window({
-  name: `notifications`,
+    name: 'notifications',
-  anchor: [ 'top', 'left' ],
+    anchor: ['top', 'left'],
     child: PopupList(),
 });

hosts/wim/config/ags/js/overview/clients.js

@@ -6,7 +6,7 @@ import { WindowButton } from './dragndrop.js';
 import * as VARS from './variables.js';
 
 // Has to be a traditional function for 'this' scope
-Array.prototype.remove = function (el) { this.splice(this.indexOf(el), 1) };
+Array.prototype.remove = function (el) { this.splice(this.indexOf(el), 1); };
 
 const scale = size => size * VARS.SCALE - VARS.MARGIN;
 const getFontSize = client => Math.min(scale(client.size[0]),
@@ -19,9 +19,9 @@ const IconStyle = client => `transition: font-size 0.2s linear;
 
 
 const Client = (client, active, clients) => {
-  let wsName = String(client.workspace.name).replace('special:', '');
+    const wsName = String(client.workspace.name).replace('special:', '');
-  let wsId = client.workspace.id;
+    const wsId = client.workspace.id;
-  let addr = `address:${client.address}`;
+    const addr = `address:${client.address}`;
 
     // FIXME: special workspaces not closing when in one and clicking on normal client
     return Revealer({
@@ -29,7 +29,7 @@ const Client = (client, active, clients) => {
         setup: rev => rev.revealChild = true,
         properties: [
             ['address', client.address],
-      ['toDestroy', false]
+            ['toDestroy', false],
         ],
         child: WindowButton({
             address: client.address,
@@ -46,28 +46,28 @@ const Client = (client, active, clients) => {
                             .then(
 
                                 execAsync(`hyprctl dispatch togglespecialworkspace ${wsId}`).then(
-                () => App.closeWindow('overview')
+                                    () => App.closeWindow('overview'),
-              ).catch(print)
+                                ).catch(print),
 
                             ).catch(print);
                     }
                     else {
                         execAsync(`hyprctl dispatch togglespecialworkspace ${wsName}`).then(
-              () => App.closeWindow('overview')
+                            () => App.closeWindow('overview'),
                         ).catch(print);
                     }
                 }
                 else {
                     // close special workspace if one is opened
-          let activeAddress = Hyprland.active.client.address;
+                    const activeAddress = Hyprland.active.client.address;
-          let currentActive = clients.find(c => c.address === activeAddress)
+                    const currentActive = clients.find(c => c.address === activeAddress);
 
                     if (currentActive && currentActive.workspace.id < 0) {
                         execAsync(`hyprctl dispatch togglespecialworkspace ${wsName}`)
                             .catch(print);
                     }
                     execAsync(`hyprctl dispatch focuswindow ${addr}`).then(
-            () => App.closeWindow('overview')
+                        () => App.closeWindow('overview'),
                     ).catch(print);
                 }
             },
@@ -83,18 +83,18 @@ const Client = (client, active, clients) => {
 
 export function updateClients(box) {
     execAsync('hyprctl clients -j').then(out => {
-    let clients = JSON.parse(out).filter(client => client.class)
+        const clients = JSON.parse(out).filter(client => client.class);
 
         box._workspaces.forEach(workspace => {
-      let fixed = workspace.getFixed();
+            const fixed = workspace.getFixed();
-      let toRemove = fixed.get_children();
+            const toRemove = fixed.get_children();
 
             clients.filter(client => client.workspace.id == workspace._id)
                 .forEach(client => {
                     let active = '';
-        if (client.address == Hyprland.active.client.address) {
+                    if (client.address == Hyprland.active.client.address)
                         active = 'active';
-        }
+
 
                     // TODO: fix multi monitor issue. this is just a temp fix
                     client.at[1] -= 2920;
@@ -109,7 +109,7 @@ export function updateClients(box) {
                         client.at[1] = VARS.DEFAULT_SPECIAL.POS_Y;
                     }
 
-        let newClient = [
+                    const newClient = [
                         fixed.get_children().find(ch => ch._address == client.address),
                         client.at[0] * VARS.SCALE,
                         client.at[1] * VARS.SCALE,
@@ -125,11 +125,12 @@ export function updateClients(box) {
                     }
 
                     // Set a timeout here to have an animation when the icon first appears
-        setTimeout(() => {
+                    Utils.timeout(1, () => {
                         newClient[0].child.child.className = `window ${active}`;
                         newClient[0].child.child.style = IconStyle(client);
-        }, 1);
                     });
+                });
+
             fixed.show_all();
             toRemove.forEach(ch => {
                 if (ch._toDestroy) {
@@ -142,4 +143,4 @@ export function updateClients(box) {
             });
         });
     }).catch(print);
-};
+}

hosts/wim/config/ags/js/overview/dragndrop.js

@@ -26,7 +26,7 @@ function createSurfaceFromWidget(widget) {
     widget.draw(cr);
 
     return surface;
-};
+}
 
 let hidden = 0;
 export const WorkspaceDrop = props => EventBox({
@@ -34,15 +34,15 @@ export const WorkspaceDrop = props => EventBox({
     connections: [['drag-data-received', (self, _c, _x, _y, data) => {
         let id = self.get_parent()._id;
 
-    if (id < -1) {
+        if (id < -1)
             id = self.get_parent()._name;
-    }
+
-    else if (id === -1) {
+        else if (id === -1)
             id = `special:${++hidden}`;
-    }
+
-    else if (id === 1000) {
+        else if (id === 1000)
-      id = "empty";
+            id = 'empty';
-    }
+
         execAsync(`hyprctl dispatch movetoworkspacesilent ${id},address:${data.get_text()}`)
             .catch(print);
     }]],
@@ -51,8 +51,8 @@ export const WorkspaceDrop = props => EventBox({
     },
 });
 
-export const WindowButton = ({address, ...props} = {}) => Button({
+export const WindowButton = ({ address, ...props } = {}) => Button({
-  type: "Button",
+    type: 'Button',
     ...props,
     setup: self => {
         self.drag_source_set(Gdk.ModifierType.BUTTON1_MASK, TARGET, Gdk.DragAction.COPY);
@@ -66,7 +66,7 @@ export const WindowButton = ({address, ...props} = {}) => Button({
         self.connect('drag-end', () => {
             self.get_parent().destroy();
 
-      let mainBox = App.getWindow('overview').getChild();
+            const mainBox = App.getWindow('overview').getChild();
             updateClients(mainBox);
         });
     },

hosts/wim/config/ags/js/overview/workspaces.js

@@ -1,7 +1,8 @@
-import { Hyprland, Widget } from '../../imports.js';
+import { Hyprland, Utils, Widget } from '../../imports.js';
 const { Revealer, CenterBox, Box, EventBox, Label, Overlay } = Widget;
 
 import Gtk  from 'gi://Gtk';
+import GLib from 'gi://GLib';
 
 import { WorkspaceDrop } from './dragndrop.js';
 import * as VARS from './variables.js';
@@ -11,7 +12,7 @@ const DEFAULT_STYLE = `min-width:  ${VARS.SCREEN.X * VARS.SCALE}px;
 
 
 export function getWorkspaces(box) {
-  let children = [];
+    const children = [];
     box.children.forEach(type => {
         type.children.forEach(row => {
             row.child.centerWidget.child.children.forEach(ch => {
@@ -20,13 +21,13 @@ export function getWorkspaces(box) {
         });
     });
     box._workspaces = children.sort((a, b) => a._id - b._id);
-};
+}
 
 export const WorkspaceRow = (className, i) => Revealer({
     transition: 'slide_down',
     connections: [[Hyprland, rev => {
-    let minId = i * VARS.WORKSPACE_PER_ROW;
+        const minId = i * VARS.WORKSPACE_PER_ROW;
-    let activeId = Hyprland.active.workspace.id;
+        const activeId = Hyprland.active.workspace.id;
 
         rev.revealChild = Hyprland.workspaces.some(ws => ws.id > minId &&
                                                         (ws.windows > 0 ||
@@ -37,8 +38,8 @@ export const WorkspaceRow = (className, i) => Revealer({
             properties: [['box']],
             setup: eventbox => eventbox._box = eventbox.child.children[0],
             connections: [[Hyprland, eventbox => {
-        let maxId = i * VARS.WORKSPACE_PER_ROW + VARS.WORKSPACE_PER_ROW;
+                const maxId = i * VARS.WORKSPACE_PER_ROW + VARS.WORKSPACE_PER_ROW;
-        let activeId = Hyprland.active.workspace.id;
+                const activeId = Hyprland.active.workspace.id;
 
                 eventbox._box.revealChild = className === 'special' ||
                                                 !Hyprland.workspaces.some(ws => ws.id > maxId &&
@@ -60,7 +61,7 @@ export const WorkspaceRow = (className, i) => Revealer({
 // TODO: please make this readable for the love of god
 const Workspace = (id, name, extra = false) => {
     let workspace;
-  let fixed = Gtk.Fixed.new();
+    const fixed = Gtk.Fixed.new();
 
     if (!extra) {
         workspace = Revealer({
@@ -73,26 +74,25 @@ const Workspace = (id, name, extra = false) => {
                 ['wasActive', false],
             ],
             connections: [[Hyprland, box => {
-        box._timeouts.forEach(timer => timer.destroy());
+                box._timeouts.forEach(timer => GLib.source_remove(timer));
 
-        let activeId = Hyprland.active.workspace.id;
+                const activeId = Hyprland.active.workspace.id;
-        let active = activeId === box._id;
+                const active = activeId === box._id;
 
-        let rev = box.child.child.get_children()[1];
+                const rev = box.child.child.get_children()[1];
-        let n = activeId > box._id;
+                const n = activeId > box._id;
 
                 if (Hyprland.getWorkspace(box._id)?.windows > 0 || active) {
                     rev.setStyle(DEFAULT_STYLE);
-          box._timeouts.push(setTimeout(() => {
+                    box._timeouts.push(Utils.timeout(100, () => {
                         box.revealChild = true;
-          }, 100));
+                    }));
-
                 }
                 else if (!Hyprland.getWorkspace(box._id)?.windows > 0) {
                     rev.setStyle(DEFAULT_STYLE);
-          box._timeouts.push(setTimeout(() => {
+                    box._timeouts.push(Utils.timeout(100, () => {
                         box.revealChild = false;
-          }, 100));
+                    }));
                     return;
                 }
 
@@ -103,18 +103,18 @@ const Workspace = (id, name, extra = false) => {
                     box._wasActive = true;
                 }
                 else if (box._wasActive) {
-          box._timeouts.push(setTimeout(() => {
+                    box._timeouts.push(Utils.timeout(120, () => {
                         rev.setStyle(`${DEFAULT_STYLE}
                                       transition: margin 0.5s ease-in-out;
                                       opacity: 1; margin-left: ${n ? '' : '-'}300px;
                                       margin-right: ${n ? '-' : ''}300px;`);
                         box._wasActive = false;
-          }, 120));
+                    }));
-          box._timeouts.push(setTimeout(() => {
+                    box._timeouts.push(Utils.timeout(500, () => {
                         rev.setStyle(`${DEFAULT_STYLE} opacity: 0;
                                       margin-left: ${n ? '' : '-'}300px;
                                       margin-right: ${n ? '-' : ''}300px;`);
-          }, 500));
+                    }));
                 }
                 else {
                     rev.setStyle(`${DEFAULT_STYLE} opacity: 0;
@@ -137,7 +137,7 @@ const Workspace = (id, name, extra = false) => {
                             className: 'workspace',
                             style: DEFAULT_STYLE,
                             child: fixed,
-            })
+                        }),
                     ],
                 }),
             }),
@@ -170,7 +170,7 @@ const Workspace = (id, name, extra = false) => {
                                     style: 'font-size: 40px;',
                                 }),
                             ],
-            })
+                        }),
                     ],
                 }),
             }),
@@ -183,7 +183,7 @@ const Workspace = (id, name, extra = false) => {
 
 export function updateWorkspaces(box) {
     Hyprland.workspaces.forEach(ws => {
-    let currentWs = box._workspaces.find(ch => ch._id == ws.id);
+        const currentWs = box._workspaces.find(ch => ch._id == ws.id);
         if (!currentWs) {
             var type = 0;
             var rowNo = 0;
@@ -195,11 +195,10 @@ export function updateWorkspaces(box) {
             else {
                 rowNo = Math.floor((ws.id - 1) / VARS.WORKSPACE_PER_ROW);
                 if (rowNo >= box.children[type].children.length) {
-          for (let i = box.children[type].children.length; i <= rowNo; ++i) {
+                    for (let i = box.children[type].children.length; i <= rowNo; ++i)
                         box.children[type].add(WorkspaceRow(type ? 'special' : 'normal', i));
                 }
             }
-      }
             var row = box.children[type].children[rowNo].child.centerWidget.child;
             row.add(Workspace(ws.id, type ? ws.name : ''));
         }
@@ -208,6 +207,6 @@ export function updateWorkspaces(box) {
 
     // Make sure the order is correct
     box._workspaces.forEach((workspace, i) => {
-    workspace.get_parent().reorder_child(workspace, i)
+        workspace.get_parent().reorder_child(workspace, i);
     });
 }

hosts/wim/config/ags/js/powermenu.js

@@ -2,7 +2,7 @@ import { Widget } from '../imports.js';
 const { CenterBox, Label } = Widget;
 
 import PopupWindow from './misc/popup.js';
-import Button      from './misc/cursorbox.js'
+import Button      from './misc/cursorbox.js';
 
 
 const PowermenuWidget = () => CenterBox({
@@ -10,7 +10,7 @@ const PowermenuWidget = () => CenterBox({
     vertical: false,
 
     startWidget: Button({
-    type: "Button",
+        type: 'Button',
         className: 'shutdown',
         onPrimaryClickRelease: 'systemctl poweroff',
 
@@ -20,7 +20,7 @@ const PowermenuWidget = () => CenterBox({
     }),
 
     centerWidget: Button({
-    type: "Button",
+        type: 'Button',
         className: 'reboot',
         onPrimaryClickRelease: 'systemctl reboot',
 
@@ -30,7 +30,7 @@ const PowermenuWidget = () => CenterBox({
     }),
 
     endWidget: Button({
-    type: "Button",
+        type: 'Button',
         className: 'logout',
         onPrimaryClickRelease: 'hyprctl dispatch exit',
 

hosts/wim/config/ags/js/quick-settings/button-grid.js

@@ -8,7 +8,7 @@ import EventBox from '../misc/cursorbox.js';
 const GridButton = ({
     command = () => {},
     secondaryCommand = () => {},
-  icon
+    icon,
 } = {}) => Box({
     className: 'grid-button',
     children: [
@@ -23,7 +23,7 @@ const GridButton = ({
             className: 'right-part',
             onPrimaryClickRelease: () => secondaryCommand(),
             child: Label({
-        label: " ",
+                label: ' ',
                 className: 'grid-chev',
             }),
         }),
@@ -46,12 +46,11 @@ const FirstRow = () => Box({
             icon: Icon({
                 className: 'grid-label',
                 connections: [[Network, icon => {
-          if (Network.wifi.enabled) {
+                    if (Network.wifi.enabled)
                         icon.icon = 'network-wireless-connected-symbolic';
-          }
+
-          else {
+                    else
                         icon.icon = 'network-wireless-offline-symbolic';
-          }
                 }, 'changed']],
             }),
         }),
@@ -63,7 +62,7 @@ const FirstRow = () => Box({
             },
             secondaryCommand: () => {
                 execAsync(['bash', '-c', 'blueberry'])
-          .catch(print)
+                    .catch(print);
             },
             icon: Icon({
                 className: 'grid-label',
@@ -79,7 +78,7 @@ const FirstRow = () => Box({
                             .catch(print);
                     }
                 }, 'changed']],
-      })
+            }),
         }),
 
         GridButton({
@@ -125,7 +124,7 @@ const SubRow = () => CenterBox({
             maxWidthChars: 12,
             connections: [[Bluetooth, self => {
                 if (Bluetooth.connectedDevices[0])
-          self.label = String(Bluetooth.connectedDevices[0])
+                    self.label = String(Bluetooth.connectedDevices[0]);
                 else
                     self.label = 'Disconnected';
             }, 'changed']],
@@ -177,12 +176,11 @@ const SecondRow = () => Box({
                         else {
                             const vol = Audio.speaker.volume * 100;
                             for (const threshold of [-1, 0, 33, 66, 100]) {
-                if (vol > threshold + 1) {
+                                if (vol > threshold + 1)
                                     icon.icon = items[threshold + 1];
                             }
                         }
                     }
-          }
                 }, 'speaker-changed']],
             }),
         }),
@@ -208,14 +206,13 @@ const SecondRow = () => Box({
                         else {
                             const vol = Audio.microphone.volume * 100;
                             for (const threshold of [-1, 0, 1]) {
-                if (vol > threshold + 1) {
+                                if (vol > threshold + 1)
                                     icon.icon = itemsMic[threshold + 1];
                             }
                         }
                     }
-          }
                 }, 'microphone-changed']],
-      })
+            }),
         }),
 
         GridButton({
@@ -226,7 +223,7 @@ const SecondRow = () => Box({
             secondaryCommand: () => App.openWindow('powermenu'),
             icon: Label({
                 className: 'grid-label',
-        label: " 󰌾 ", 
+                label: ' 󰌾 ',
             }),
         }),
 

hosts/wim/config/ags/js/quick-settings/main.js

@@ -22,7 +22,7 @@ const QuickSettingsWidget = () => Box({
                     label: 'Control Center',
                     className: 'title',
                     halign: 'start',
-          style: 'margin-left: 20px'
+                    style: 'margin-left: 20px',
                 }),
 
                 ButtonGrid(),
@@ -37,14 +37,14 @@ const QuickSettingsWidget = () => Box({
         Revealer({
             transition: 'slide_down',
             child: Player(),
-    })
+        }),
 
     ],
 });
 
 export default () => PopupWindow({
     name: 'quick-settings',
-  anchor: [ 'top', 'right' ],
+    anchor: ['top', 'right'],
-  margin: [ 8, 5, 0, ],
+    margin: [8, 5, 0],
     child: QuickSettingsWidget(),
 });

hosts/wim/config/ags/js/quick-settings/slider-box.js

@@ -33,20 +33,18 @@ export default () => Box({
                             else {
                                 const vol = Audio.speaker.volume * 100;
                                 for (const threshold of [-1, 0, 33, 66, 100]) {
-                  if (vol > threshold + 1) {
+                                    if (vol > threshold + 1)
                                         icon.icon = items[threshold + 1];
                                 }
                             }
                         }
-            }
                     }, 'speaker-changed']],
                 }),
 
                 Slider({
                     connections: [[Audio, slider => {
-            if (Audio.speaker) {
+                        if (Audio.speaker)
                             slider.value = Audio.speaker.volume;
-            }
                     }, 'speaker-changed']],
                     onChange: ({ value }) => Audio.speaker.volume = value,
                     max: 0.999,

hosts/wim/config/ags/js/quick-settings/toggle-button.js

@@ -5,13 +5,13 @@ import Gtk from 'gi://Gtk';
 import EventBox    from '../misc/cursorbox.js';
 
 export default () => {
-  let widget = EventBox({});
+    const widget = EventBox({});
 
-  let toggleButton = Gtk.ToggleButton.new();
+    const toggleButton = Gtk.ToggleButton.new();
     toggleButton.add(Icon({
         icon: 'go-down-symbolic',
         className: 'arrow',
-    style: `-gtk-icon-transform: rotate(180deg);`,
+        style: '-gtk-icon-transform: rotate(180deg);',
     }));
 
     // Setup
@@ -22,11 +22,11 @@ export default () => {
 
     // Connections
     toggleButton.connect('toggled', () => {
-    let rev = toggleButton.get_parent().get_parent().get_parent().children[1];
+        const rev = toggleButton.get_parent().get_parent().get_parent().children[1];
 
         if (toggleButton.get_active()) {
             toggleButton.get_children()[0]
-        .setStyle("-gtk-icon-transform: rotate(0deg);");
+                .setStyle('-gtk-icon-transform: rotate(0deg);');
             rev.revealChild = true;
         }
         else {
@@ -39,4 +39,4 @@ export default () => {
     widget.add(toggleButton);
 
     return widget;
-}
+};

hosts/wim/config/ags/js/screen-corners.js

@@ -68,7 +68,7 @@ export const Topleft = () => Widget.Window({
     anchor: ['top', 'left'],
     exclusive: false,
     visible: true,
-    child: RoundedCorner('topleft', { className: 'corner', }),
+    child: RoundedCorner('topleft', { className: 'corner' }),
 });
 export const Topright = () => Widget.Window({
     name: 'cornertr',
@@ -76,7 +76,7 @@ export const Topright = () => Widget.Window({
     anchor: ['top', 'right'],
     exclusive: false,
     visible: true,
-    child: RoundedCorner('topright', { className: 'corner', }),
+    child: RoundedCorner('topright', { className: 'corner' }),
 });
 export const Bottomleft = () => Widget.Window({
     name: 'cornerbl',
@@ -84,7 +84,7 @@ export const Bottomleft = () => Widget.Window({
     anchor: ['bottom', 'left'],
     exclusive: false,
     visible: true,
-    child: RoundedCorner('bottomleft', { className: 'corner', }),
+    child: RoundedCorner('bottomleft', { className: 'corner' }),
 });
 export const Bottomright = () => Widget.Window({
     name: 'cornerbr',
@@ -92,5 +92,5 @@ export const Bottomright = () => Widget.Window({
     anchor: ['bottom', 'right'],
     exclusive: false,
     visible: true,
-    child: RoundedCorner('bottomright', { className: 'corner', }),
+    child: RoundedCorner('bottomright', { className: 'corner' }),
 });

hosts/wim/config/ags/package.json

@@ -1,6 +1,7 @@
 {
   "dependencies": {
     "@girs/gtk-3.0": "^3.24.39-3.2.2",
-    "eslint": "^8.52.0"
+    "eslint": "^8.52.0",
+    "stylelint-config-standard-scss": "^11.0.0"
   }
 }

hosts/wim/config/ags/services/pointers.js

@@ -14,12 +14,12 @@ class Pointers extends Service {
     }
 
     proc = undefined;
-  output = "";
+    output = '';
     devices = new Map();
 
-  get proc() { return this.proc; }
+    get process() { return this.proc; }
-  get output() { return this.output; }
+    get lastLine() { return this.output; }
-  get devices() { return this.devices; }
+    get pointers() { return this.devices; }
 
     constructor() {
         super();
@@ -28,20 +28,20 @@ class Pointers extends Service {
 
     parseDevices() {
         Utils.execAsync(['libinput', 'list-devices']).then(out => {
-      let lines = out.split('\n');
+            const lines = out.split('\n');
             let device = null;
-      let devices = new Map();
+            const devices = new Map();
 
             lines.forEach(line => {
-        let parts = line.split(':');
+                const parts = line.split(':');
 
                 if (parts[0] === 'Device') {
                     device = {};
                     devices.set(parts[1].trim(), device);
                 }
                 else if (device && parts[1]) {
-          let key = parts[0].trim();
+                    const key = parts[0].trim();
-          let value = parts[1].trim();
+                    const value = parts[1].trim();
                     device[key] = value;
                 }
             });
@@ -55,7 +55,7 @@ class Pointers extends Service {
         if (this.proc)
             return;
 
-    let args = [];
+        const args = [];
         this.devices.forEach(dev => {
             if (dev.Kernel) {
                 args.push('--device');
@@ -65,16 +65,15 @@ class Pointers extends Service {
 
         this.proc = Utils.subprocess(
             ['libinput', 'debug-events', ...args],
-      (output) => {
+            output => {
                 if (output.includes('BTN') && output.includes('released') ||
             output.includes('TOUCH_UP') ||
             output.includes('HOLD_END') && !output.includes('cancelled')) {
-
                     this.output = output;
                     this.emit('new-line', output);
                 }
             },
-      (err) => logError(err)
+            err => logError(err),
         );
         this.emit('proc-started', true);
     }