Added an option to define custom window title mappings. (#149)

widget/settings/pages/config/bar/index.ts

@@ -12,7 +12,7 @@ export const BarSettings = () => {
             vertical: true,
             children: [
                 Header('Layouts'),
-                Option({ opt: options.bar.layouts, title: 'Bar Layouts for Monitors', subtitle: 'Please refer to the github README for instructions: https://github.com/Jas-SinghFSU/HyprPanel', type: 'object' }, 'bar-layout-input'),
+                Option({ opt: options.bar.layouts, title: 'Bar Layouts for Monitors', subtitle: 'Wiki Link: https://hyprpanel.com/configuration/panel.html#layouts', type: 'object', subtitleLink: 'https://hyprpanel.com/configuration/panel.html#layouts' }, 'bar-layout-input'),
 
                 Header('Spacing'),
                 Option({ opt: options.theme.bar.outer_spacing, title: 'Outer Spacing', subtitle: 'Spacing on the outer left and right edges of the bar.', type: 'string' }),
@@ -46,6 +46,7 @@ export const BarSettings = () => {
 
                 Header('Window Titles'),
                 Option({ opt: options.theme.bar.buttons.windowtitle.spacing, title: 'Inner Spacing', subtitle: 'Spacing between the icon and the label inside the buttons.', type: 'string' }),
+                Option({ opt: options.bar.windowtitle.title_map, title: 'Window Title Mappings', subtitle: 'Wiki Link: https://hyprpanel.com/configuration/panel.html#window-title-mappings', type: 'object', subtitleLink: 'https://hyprpanel.com/configuration/panel.html#window-title-mappings' }),
 
                 Header('Volume'),
                 Option({ opt: options.bar.volume.label, title: 'Show Volume Percentage', type: 'boolean' }),

widget/settings/shared/Label.ts

@@ -1,4 +1,22 @@
-export const Label = (name: string, sub = "") => {
+export const Label = (name: string, sub = "", subtitleLink = '') => {
+    const subTitle = () => {
+        if (subtitleLink.length) {
+            return Widget.Button({
+                hpack: "start",
+                vpack: "center",
+                class_name: "options-sublabel-link",
+                label: sub,
+                // run a bash command to open the link in the default browswer
+                on_primary_click: () => Utils.execAsync(`bash -c 'xdg-open ${subtitleLink}'`),
+            })
+        }
+        return Widget.Label({
+            hpack: "start",
+            vpack: "center",
+            class_name: "options-sublabel",
+            label: sub
+        })
+    }
     return Widget.Box({
         vertical: true,
         hpack: "start",
@@ -9,12 +27,7 @@ export const Label = (name: string, sub = "") => {
                 class_name: "options-label",
                 label: name
             }),
-            Widget.Label({
-                hpack: "start",
-                vpack: "center",
-                class_name: "options-sublabel",
-                label: sub
-            }),
+            subTitle()
         ]
     })
 }

widget/settings/shared/Option.ts

@@ -14,7 +14,7 @@ export const Option = <T>(props: RowProps<T>, className: string = '') => {
                 hpack: "start",
                 vpack: "center",
                 hexpand: true,
-                child: Label(props.title, props.subtitle || ""),
+                child: Label(props.title, props.subtitle || "", props.subtitleLink),
             }),
             Inputter(props, className, isUnsaved),
             Widget.Button({