From dd98e343521e0bb95917f4af5c9a1eb54faf2a8c Mon Sep 17 00:00:00 2001
From: retrozinndev <joaovodias@gmail.com>
Date: Tue, 26 Aug 2025 17:07:44 -0300
Subject: [PATCH] :sparkles: feat(backlight): add page widget for backlight
 feature

---
 src/i18n/lang/en_US.ts                        |  5 +++
 src/i18n/lang/pt_BR.ts                        |  5 +++
 src/i18n/struct.ts                            |  5 +++
 src/modules/backlight.ts                      | 14 ++++++-
 src/widget/control-center/Sliders.tsx         |  3 ++
 src/widget/control-center/pages/Backlight.tsx | 41 +++++++++++++++++++
 6 files changed, 72 insertions(+), 1 deletion(-)
 create mode 100644 src/widget/control-center/pages/Backlight.tsx

diff --git a/src/i18n/lang/en_US.ts b/src/i18n/lang/en_US.ts
index 7486f2a..1dc1f58 100644
--- a/src/i18n/lang/en_US.ts
+++ b/src/i18n/lang/en_US.ts
@@ -61,6 +61,11 @@ export default {
                 gamma: "Gamma",
                 temperature: "Temperature"
             },
+            backlight: {
+                title: "Backlight",
+                description: "Control the brightness of your screens",
+                refresh: "Refresh backlights"
+            },
             bluetooth: {
                 title: "Bluetooth",
                 description: "Manage Bluetooth devices",
diff --git a/src/i18n/lang/pt_BR.ts b/src/i18n/lang/pt_BR.ts
index f9d1f30..1b6ae4e 100644
--- a/src/i18n/lang/pt_BR.ts
+++ b/src/i18n/lang/pt_BR.ts
@@ -61,6 +61,11 @@ export default {
                 temperature: "Temperatura",
                 gamma: "Gama"
             },
+            backlight: {
+                title: "Brilho",
+                description: "Controle o nível de brilho das suas telas",
+                refresh: "Recarregar"
+            },
             bluetooth: {
                 title: "Bluetooth",
                 description: "Gerencie dispositivos Bluetooth",
diff --git a/src/i18n/struct.ts b/src/i18n/struct.ts
index b856898..0e9e98e 100644
--- a/src/i18n/struct.ts
+++ b/src/i18n/struct.ts
@@ -59,6 +59,11 @@ export type i18nStruct = {
                 title: string,
                 interface: string
             },
+            backlight: {
+                title: string,
+                description: string,
+                refresh: string
+            },
             bluetooth: {
                 title: string,
                 description: string,
diff --git a/src/modules/backlight.ts b/src/modules/backlight.ts
index 8054bc5..f5b5082 100644
--- a/src/modules/backlight.ts
+++ b/src/modules/backlight.ts
@@ -19,15 +19,22 @@ class Backlight extends GObject.Object {
     #maxBrightness: number;
     #brightness: number;
     #available: boolean = true;
+    #monitor: Gio.FileMonitor;
 
     @signal(Number) brightnessChanged(_: number): void {};
 
+    @getter(String)
+    get name() { return this.#name; }
+
     @getter(String)
     get path() { return this.#path; }
 
     @getter(GObject.Object as unknown as ParamSpec<Backlight>)
     get default() { return Backlight.default; }
 
+    @getter(Object as unknown as ParamSpec<Array<Backlight>>)
+    get backlights() { return Backlight.backlights; }
+    
     @getter(Boolean)
     get isDefault() { return this.path === this.default?.path; }
 
@@ -97,6 +104,7 @@ class Backlight extends GObject.Object {
         }
 
         Backlight._backlights = backlights;
+        backlights.forEach(bk => bk.notify("backlights"));
         return backlights;
     }
 
@@ -119,7 +127,7 @@ class Backlight extends GObject.Object {
         this.#brightness = Number.parseInt(readFile(`${this.#path}/brightness`))
 
 
-        monitorFile(`/sys/class/backlight/${name}/brightness`, () => {
+        this.#monitor = monitorFile(`/sys/class/backlight/${name}/brightness`, () => {
             this.#brightness = this.readBrightness();
             this.notify("brightness");
             this.emit("brightness-changed", this.brightness);
@@ -166,6 +174,10 @@ class Backlight extends GObject.Object {
         return null;
     }
 
+    vfunc_dispose(): void {
+        this.#monitor.cancel();
+    }
+
     public emit<Signal extends keyof typeof this.$signals>(
         signal: Signal,
         ...args: Parameters<(typeof this.$signals)[Signal]>
diff --git a/src/widget/control-center/Sliders.tsx b/src/widget/control-center/Sliders.tsx
index 99e73e6..d06e3f4 100644
--- a/src/widget/control-center/Sliders.tsx
+++ b/src/widget/control-center/Sliders.tsx
@@ -7,6 +7,7 @@ import { createBinding, With } from "ags";
 import { Backlight } from "../../modules/backlight";
 
 import AstalWp from "gi://AstalWp";
+import { PageBacklight } from "./pages/Backlight";
 
 
 export let slidersPages: Pages|undefined;
@@ -65,6 +66,8 @@ export function Sliders() {
                                   Backlight.getDefault()!.brightness = value
                               }}
                             />
+                            <Gtk.Button class={"more"} iconName={"go-next-symbolic"} onClicked={() => 
+                                slidersPages?.toggle(PageBacklight)} />
                         </Gtk.Box>
                     }
                 </With>
diff --git a/src/widget/control-center/pages/Backlight.tsx b/src/widget/control-center/pages/Backlight.tsx
new file mode 100644
index 0000000..4683384
--- /dev/null
+++ b/src/widget/control-center/pages/Backlight.tsx
@@ -0,0 +1,41 @@
+import { Astal, Gtk } from "ags/gtk4";
+import { tr } from "../../../i18n/intl";
+import { Backlight } from "../../../modules/backlight";
+import { Page } from "./Page";
+import { createBinding, With } from "ags";
+import { addSliderMarksFromMinMax } from "../../../modules/utils";
+
+
+export const PageBacklight = new Page({
+    id: "backlight",
+    title: tr("control_center.pages.backlight.title"),
+    description: tr("control_center.pages.backlight.description"),
+    content: () => (
+        <With value={createBinding(Backlight.getDefault()!, "backlights")}>
+            {(bklights: Array<Backlight>) => bklights.length > 0 &&
+                <Gtk.Box orientation={Gtk.Orientation.VERTICAL} spacing={6}>
+                    {bklights.map((bklight, i) =>
+                        <Gtk.Box class={"bklight"} orientation={Gtk.Orientation.VERTICAL}
+                          spacing={4}>
+
+                            <Gtk.Label class={"subheader"} label={`Backlight ${i+1} (${bklight.name})`} 
+                              xalign={0} />
+                            <Astal.Slider $={(self) => addSliderMarksFromMinMax(self)} 
+                              min={0} max={bklight.maxBrightness}
+                              value={createBinding(bklight, "brightness")}
+                              onChangeValue={(_, __, value) => {
+                                  bklight.brightness = value
+                              }}
+                            />
+                        </Gtk.Box>
+                    )}
+                </Gtk.Box>
+            }
+        </With>
+    ),
+    headerButtons: [{
+        icon: "arrow-circular-top-right",
+        tooltipText: tr("control_center.pages.backlight.refresh"),
+        actionClicked: () => Backlight.scan()
+    }]
+});