Feat: Add systray icon size option (#966)

* Feat: Add systray icon size option

Adds ability to adjust custom icon size for systray module

* Fix: (gjs warning/formating)

Fixes:

- gjs warning: theme parsing error - Not using units is deprecated.
Assuming 'px'. (defaults to rem units 1 by default)

- prettier formatting for MenuCustomIcon JSX element

* Fix: Update default icon size / size type def

Updated default icon size to 1.3rem and added type def to
configuration/modules/config/bar/systray/types.ts

* Fix: supposed to be 1.3em not 1.3rem default size

---------

Co-authored-by: Jas Singh <jaskiratpal.singh@outlook.com>

src/components/bar/modules/systray/index.tsx

@@ -16,12 +16,12 @@ const createMenu = (menuModel: Gio.MenuModel, actionGroup: Gio.ActionGroup | nul
     return menu;
 };
 
-const MenuCustomIcon = ({ iconLabel, iconColor, item }: MenuCustomIconProps): JSX.Element => {
+const MenuCustomIcon = ({ iconLabel, iconColor, iconSize, item }: MenuCustomIconProps): JSX.Element => {
     return (
         <label
             className={'systray-icon txt-icon'}
             label={iconLabel}
-            css={iconColor ? `color: ${iconColor}` : ''}
+            css={iconColor ? `color: ${iconColor}; font-size: ${iconSize}` : ''}
             tooltipMarkup={bind(item, 'tooltipMarkup')}
         />
     );
@@ -98,10 +98,16 @@ const SysTray = (): BarBoxChild => {
                 if (matchedCustomIcon !== undefined) {
                     const iconLabel = custIcons[matchedCustomIcon].icon || '󰠫';
                     const iconColor = custIcons[matchedCustomIcon].color;
+                    const iconSize = custIcons[matchedCustomIcon].size || '1.3em';
 
                     return (
                         <MenuEntry item={item}>
-                            <MenuCustomIcon iconLabel={iconLabel} iconColor={iconColor} item={item} />
+                            <MenuCustomIcon
+                                iconLabel={iconLabel}
+                                iconColor={iconColor}
+                                iconSize={iconSize}
+                                item={item}
+                            />
                         </MenuEntry>
                     );
                 }
@@ -139,6 +145,7 @@ const SysTray = (): BarBoxChild => {
 interface MenuCustomIconProps {
     iconLabel: string;
     iconColor: string;
+    iconSize: string;
     item: AstalTray.TrayItem;
 }
 

src/configuration/modules/config/bar/systray/types.ts

@@ -2,5 +2,6 @@ export type SystrayIconMap = {
     [key: string]: {
         icon: string;
         color: string;
+        size: string;
     };
 };