💥 fix: can't convert non-null pointer to js value

Thanks aylur!!

src/window/Bar.tsx

@@ -5,6 +5,7 @@ import { FocusedClient } from "../widget/bar/FocusedClient";
 import { Apps } from "../widget/bar/Apps";
 import { Clock } from "../widget/bar/Clock";
 import { Status } from "../widget/bar/Status";
+import { Media } from "../widget/bar/Media";
 
 
 export const Bar = (mon: number) => {
@@ -29,6 +30,7 @@ export const Bar = (mon: number) => {
                   $type="center">
 
                     <Clock />
+                    <Media />
                 </Gtk.Box>
                 <Gtk.Box class={"widgets-right"} homogeneous={false}
                   spacing={widgetSpacing} halign={Gtk.Align.END}

src/window/CenterWindow.tsx

@@ -1,10 +1,11 @@
-import { Astal, Gtk } from "ags/gtk4";
-
+import { Gtk } from "ags/gtk4";
 import { Separator } from "../widget/Separator";
 import { PopupWindow } from "../widget/PopupWindow";
 import { BigMedia } from "../widget/center-window/BigMedia";
-import { time } from "../scripts/utils";
-import { player } from "../widget/bar/Media";
+import { time, variableToBoolean } from "../scripts/utils";
+import { createBinding } from "ags";
+
+import AstalMpris from "gi://AstalMpris?version=0.1";
 
 export const CenterWindow = (mon: number) => 
     <PopupWindow namespace={"center-window"} marginTop={10} monitor={mon}
@@ -13,8 +14,7 @@ export const CenterWindow = (mon: number) =>
         <Gtk.Box class={"center-window-container"} spacing={6}>
             <Gtk.Box class={"left"} orientation={Gtk.Orientation.VERTICAL}>
                 <Gtk.Box class={"datetime"} orientation={Gtk.Orientation.VERTICAL}
-                  halign={Gtk.Align.CENTER} valign={Gtk.Align.CENTER} 
-                  vexpand={true}>
+                  halign={Gtk.Align.CENTER} valign={Gtk.Align.CENTER} vexpand>
 
                     <Gtk.Label class={"time"} label={time(t => t.format("%H:%M")!)} />
                     <Gtk.Label class={"date"} label={time(d => d.format("%A, %B %d")!)} />
@@ -27,8 +27,10 @@ export const CenterWindow = (mon: number) =>
             </Gtk.Box>
 
             <Separator orientation={Gtk.Orientation.HORIZONTAL} cssColor="gray"
-              margin={5} spacing={8} alpha={.3} visible={player(pl => pl.available)}
+              margin={5} spacing={8} alpha={.3} visible={variableToBoolean(
+                  createBinding(AstalMpris.get_default(), "players")
+              )}
             />
             <BigMedia />
         </Gtk.Box>
-    </PopupWindow> as Astal.Window;
+    </PopupWindow>;

src/window/FloatingNotifications.tsx

@@ -28,8 +28,10 @@ export const FloatingNotifications = (mon: number) =>
                             <NotificationWidget notification={notif} showTime={false}
                               actionClose={() => Notifications.getDefault().removeNotification(notif)}
                               holdOnHover={false} actionClicked={() => {
-                                  const viewAction = notif.actions.filter(action => 
-                                      action.label.toLowerCase() === "view")?.[0];
+                                  const viewAction = notif.actions.filter(a => 
+                                      a.id.toLowerCase() === "view" || 
+                                          a.label.toLowerCase() === "view"
+                                  )?.[0];
 
                                   viewAction && notif.invoke(viewAction.id);
                               }}