From 13d5d75e9d33f962cb84d3dd2f67ad2c80017ffd Mon Sep 17 00:00:00 2001 From: retrozinndev Date: Mon, 21 Apr 2025 17:52:38 -0300 Subject: [PATCH] :recycle: ags(ask-popup, entry-popup): port to custom-dialog for cleaner code --- ags/widget/AskPopup.ts | 79 +++++++----------------------- ags/widget/EntryPopup.ts | 102 ++++++++++++--------------------------- 2 files changed, 50 insertions(+), 131 deletions(-) diff --git a/ags/widget/AskPopup.ts b/ags/widget/AskPopup.ts index 706abf9..84c9f21 100644 --- a/ags/widget/AskPopup.ts +++ b/ags/widget/AskPopup.ts @@ -1,9 +1,7 @@ import { Binding } from "astal"; -import { PopupWindow, PopupWindowProps } from "./PopupWindow"; -import { Astal, Gtk, Widget } from "astal/gtk3"; -import { Separator } from "./Separator"; +import { Widget } from "astal/gtk3"; import { tr } from "../i18n/intl"; -import { Windows } from "../windows"; +import { CustomDialog, CustomDialogProps } from "./CustomDialog"; export type AskPopupProps = { @@ -25,65 +23,24 @@ export type AskPopupProps = { export function AskPopup(props: AskPopupProps): Widget.Window { let accepted: boolean = false; - const buttons = [ - new Widget.Button({ - className: "cancel", - hexpand: true, - label: props.cancelText ?? tr("cancel"), - onClick: () => window.close(), - } as Widget.ButtonProps), - new Widget.Button({ - className: "accept", - hexpand: true, - label: props.acceptText ?? tr("accept"), - onClick: () => { - window.close(); - accepted = true; - props.onAccept?.(); - } - } as Widget.ButtonProps) - ]; - - const window = Windows.createWindowForFocusedMonitor((mon: number) => PopupWindow({ + const window = CustomDialog({ namespace: "ask-popup", - className: "ask-popup", - monitor: mon, - cssBackgroundWindow: "background: rgba(0, 0, 0, .3);", - exclusivity: Astal.Exclusivity.IGNORE, - layer: Astal.Layer.OVERLAY, widthRequest: 400, - heightRequest: 220, - onDestroy: () => !accepted && props.onCancel?.(), - child: new Widget.Box({ - className: "ask-popup-box", - orientation: Gtk.Orientation.VERTICAL, - children: [ - new Widget.Label({ - className: "title", - visible: Boolean(props.title), - label: props.title || tr("ask_popup.title") || "Question" - } as Widget.LabelProps), - Separator({ - alpha: .2, - orientation: Gtk.Orientation.VERTICAL - }), - new Widget.Label({ - className: "text", - label: props.text, - yalign: 0, - expand: true - } as Widget.LabelProps), - new Widget.Box({ - className: "buttons", - orientation: Gtk.Orientation.HORIZONTAL, - hexpand: true, - heightRequest: 38, - homogeneous: true, - children: buttons - } as Widget.BoxProps) - ] - } as Widget.BoxProps) - } as PopupWindowProps))(); + heightRequest: 250, + title: props.title ?? tr("ask_popup.title"), + text: props.text, + onFinish: () => !accepted && props.onCancel?.(), + options: [ + { text: props.cancelText ?? tr("cancel") }, + { + text: props.acceptText ?? tr("accept"), + onClick: () => { + accepted = true; + props.onAccept?.(); + } + } + ] + } as CustomDialogProps); return window; } diff --git a/ags/widget/EntryPopup.ts b/ags/widget/EntryPopup.ts index 8357b35..266a428 100644 --- a/ags/widget/EntryPopup.ts +++ b/ags/widget/EntryPopup.ts @@ -1,21 +1,19 @@ import { Binding } from "astal"; -import { Astal, Gtk, Widget } from "astal/gtk3"; +import { Widget } from "astal/gtk3"; import { tr } from "../i18n/intl"; -import { Windows } from "../windows"; -import { PopupWindow, PopupWindowProps } from "./PopupWindow"; -import { Separator } from "./Separator"; +import { CustomDialog, CustomDialogProps } from "./CustomDialog"; export type EntryPopupProps = { - title?: string | Binding; - text: string | Binding; - cancelText?: string | Binding; - acceptText?: string | Binding; + title: string | Binding; + text?: string | Binding; + cancelText?: string | Binding; + acceptText?: string | Binding; closeOnAccept?: boolean; - entryPlaceholder?: string | Binding; + entryPlaceholder?: string | Binding; onAccept: (userInput: string) => void; onCancel?: () => void; onFinish?: () => void; - isPassword?: boolean | Binding; + isPassword?: boolean | Binding; }; export function EntryPopup(props: EntryPopupProps): Widget.Window { @@ -38,70 +36,34 @@ export function EntryPopup(props: EntryPopupProps): Widget.Window { } as Widget.EntryProps); let entered: boolean = false; - const buttons = [ - new Widget.Button({ - className: "cancel", - hexpand: true, - label: props.cancelText ?? tr("cancel"), - onClick: () => props.closeOnAccept && window.close(), - } as Widget.ButtonProps), - new Widget.Button({ - className: "accept", - hexpand: true, - label: props.acceptText ?? tr("accept"), - onClick: () => { - props.closeOnAccept && window.close(); - entered = true; - props.onAccept(entry.text); - entry.text = ""; - } - } as Widget.ButtonProps) - ]; - const window = Windows.createWindowForFocusedMonitor((mon: number) => PopupWindow({ + const window = CustomDialog({ namespace: "entry-popup", - className: "entry-popup", - monitor: mon, - cssBackgroundWindow: "background: rgba(0, 0, 0, .3);", - exclusivity: Astal.Exclusivity.IGNORE, - layer: Astal.Layer.OVERLAY, - widthRequest: 400, + widthRequest: 420, heightRequest: 220, - onDestroy: () => { - props.onFinish?.(); + title: props.title, + text: props.text, + child: entry, + options: [ + { + text: props.cancelText ?? tr("cancel"), + onClick: props.onCancel + }, + { + text: props.acceptText ?? tr("accept"), + closeOnClick: props.closeOnAccept, + onClick: () => { + entered = true; + props.onAccept(entry.text); + entry.text = ""; + } + } + ], + onFinish: () => { !entered && props.onCancel?.() - }, - child: new Widget.Box({ - className: "entry-popup-box", - orientation: Gtk.Orientation.VERTICAL, - children: [ - new Widget.Label({ - className: "title", - visible: Boolean(props.title), - label: props.title || tr("ask_popup.title") || "Question" - } as Widget.LabelProps), - Separator({ - alpha: .2, - orientation: Gtk.Orientation.VERTICAL - }), - new Widget.Label({ - className: "text", - label: props.text, - yalign: 0, - expand: true - } as Widget.LabelProps), - entry, - new Widget.Box({ - className: "buttons", - orientation: Gtk.Orientation.HORIZONTAL, - hexpand: true, - heightRequest: 38, - homogeneous: true, - children: buttons - } as Widget.BoxProps) - ] - } as Widget.BoxProps) - } as PopupWindowProps))(); + props.onFinish?.(); + } + } as CustomDialogProps); return window; }