feat: make music label more dynamically configurable (#389)

* feat: make music lable more dynamically configurable

* fix: move seekbar above controls

* fix: add menu for media

* fix: add menu for media

* fix: add menu for media

* Organize media player code

* fix: revert back controls position

* Delete pnpm-lock.yaml

* Update options.ts

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

* fix: merge changes broken

---------

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

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

@@ -737,9 +737,10 @@ export const BarSettings = (): Scrollable<Gtk.Widget, Gtk.Widget> => {
                     type: 'string',
                 }),
                 Option({
-                    opt: options.bar.media.show_artist,
-                    title: 'Show Track Artist',
-                    type: 'boolean',
+                    opt: options.bar.media.format,
+                    title: 'Label Format',
+                    subtitle: 'Available placeholders: {title}, {artists}, {artist}, {album}, {name}, {identity}',
+                    type: 'string',
                 }),
                 Option({
                     opt: options.bar.media.show_label,

widget/settings/pages/config/index.ts

@@ -7,6 +7,7 @@ import { OSDSettings } from './osd/index';
 import { CustomModuleSettings } from 'customModules/config';
 import { PowerMenuSettings } from './menus/power';
 import { GBox } from 'lib/types/widget';
+import { MediaMenuSettings } from './menus/media';
 import { BluetoothMenuSettings } from './menus/bluetooth';
 import { VolumeMenuSettings } from './menus/volume';
 
@@ -15,6 +16,7 @@ type Page =
     | 'Bar'
     | 'Clock Menu'
     | 'Dashboard Menu'
+    | 'Media Menu'
     | 'Power Menu'
     | 'Bluetooth Menu'
     | 'Volume'
@@ -29,6 +31,7 @@ const pagerMap: Page[] = [
     'Bar',
     'Notifications',
     'OSD',
+    'Media Menu',
     'Power Menu',
     'Bluetooth Menu',
     'Volume',
@@ -61,6 +64,7 @@ export const SettingsMenu = (): GBox => {
                     children: {
                         General: BarGeneral(),
                         Bar: BarSettings(),
+                        'Media Menu': MediaMenuSettings(),
                         Notifications: NotificationSettings(),
                         OSD: OSDSettings(),
                         Volume: VolumeMenuSettings(),

widget/settings/pages/config/menus/media.ts

@@ -0,0 +1,21 @@
+import { Option } from 'widget/settings/shared/Option';
+import { Header } from 'widget/settings/shared/Header';
+
+import options from 'options';
+import Scrollable from 'types/widgets/scrollable';
+import { Attribute, Child } from 'lib/types/widget';
+
+export const MediaMenuSettings = (): Scrollable<Child, Attribute> => {
+    return Widget.Scrollable({
+        vscroll: 'automatic',
+        child: Widget.Box({
+            class_name: 'bar-theme-page paged-container',
+            vertical: true,
+            children: [
+                Header('Media'),
+                Option({ opt: options.menus.media.hideAuthor, title: 'Hide Author', type: 'boolean' }),
+                Option({ opt: options.menus.media.hideAlbum, title: 'Hide Album', type: 'boolean' }),
+            ],
+        }),
+    });
+};