TheaninovOS/desktops/hyprland/ags/modules/sysinfo.js

// This is for the cool memory indicator on the sidebar
// For the right pill of the bar, see system.js
const {Gdk, Gtk} = imports.gi
const GObject = imports.gi.GObject
const Lang = imports.lang
import {App, Service, Utils, Widget} from "../imports.js"
import Bluetooth from "resource:///com/github/Aylur/ags/service/bluetooth.js"
import Hyprland from "resource:///com/github/Aylur/ags/service/hyprland.js"
import Network from "resource:///com/github/Aylur/ags/service/network.js"
const {execAsync, exec} = Utils
import {CircularProgress} from "./lib/circularprogress.js"
import {MaterialIcon} from "./lib/materialicon.js"

let cpuUsageQueue = []
const CPU_HISTORY_LENGTH = 10

export const ModuleSysInfo = (props = {}) => {
  const swapCircle = Widget({
    type: CircularProgress,
    className: "sidebar-memory-swap-circprog",
    valign: "center",
  })
  const ramCircle = Widget({
    type: CircularProgress,
    className: "sidebar-memory-ram-circprog margin-right-10", // margin right 10 here cuz overlay can't have margins itself
    valign: "center",
  })
  const cpuCircle = Widget.Box({
    children: [
      Widget({
        type: CircularProgress,
        className: "sidebar-cpu-circprog margin-right-10", // margin right 10 here cuz overlay can't have margins itself
        valign: "center",
      }),
    ],
  })
  const memoryCircles = Widget.Box({
    homogeneous: true,
    children: [
      Widget.Overlay({
        child: ramCircle,
        overlays: [swapCircle],
      }),
    ],
  })
  const ramText = Widget.Label({
    halign: "start",
    xalign: 0,
    className: "txt txt-small",
  })
  const swapText = Widget.Label({
    halign: "start",
    xalign: 0,
    className: "txt txt-small",
  })
  const memoryText = Widget.Box({
    vertical: true,
    valign: "center",
    className: "spacing-v--5",
    children: [
      Widget.Box({
        className: "spacing-h-5",
        children: [
          MaterialIcon("memory", "large", {setup: icon => icon.toggleClassName("txt", true)}),
          ramText,
        ],
      }),
      Widget.Box({
        className: "spacing-h-5",
        children: [
          MaterialIcon("swap_horiz", "large", {setup: icon => icon.toggleClassName("txt", true)}),
          swapText,
        ],
      }),
    ],
  })
  return Widget.Box({
    ...props,
    className: "sidebar-group-nopad",
    children: [
      Widget.Scrollable({
        hexpand: true,
        vscroll: "never",
        hscroll: "automatic",
        child: Widget.Box({
          className: "sidebar-sysinfo-grouppad spacing-h--5",
          children: [
            memoryCircles,
            memoryText,
            // cpuCircle,
            // maybe make cpu a graph?
          ],
          connections: [
            [
              3000,
              () => {
                // Get memory info
                const ramString = exec(`bash -c 'free -h --si | rg "Mem:"'`)
                const [ramTotal, ramUsed] = ramString.split(/\s+/).slice(1, 3)
                const ramPerc = Number(
                  exec(`bash -c "printf '%.1f' \\\"$(free -m | rg Mem | awk '{print ($3/$2)*100}')\\\""`),
                )
                const swapString = exec(`bash -c 'free -h --si | rg "Swap:"'`)
                const [swapTotal, swapUsed] = swapString.split(/\s+/).slice(1, 3)
                const swapPerc = Number(
                  exec(`bash -c "printf '%.1f' \\\"$(free -m | rg Swap | awk '{print ($3/$2)*100}')\\\""`),
                )
                // const cpuPerc = parseFloat(exec(`bash -c "top -bn1 | grep 'Cpu(s)' | awk '{print $2 + $4}'"`));
                // Set circular progress (font size cuz hack for anims)
                ramCircle.style = `font-size: ${ramPerc}px;`
                swapCircle.style = `font-size: ${swapPerc}px;`
                ramText.label = `${ramUsed} / ${ramTotal}`
                swapText.label = `${swapUsed} / ${swapTotal}`
              },
            ],
          ],
        }),
      }),
    ],
  })
}