feat(ags): hide systray when no items

config/ags/js/bar/main.js

@@ -41,8 +41,6 @@ export const Bar = Window({
 
           SysTray,
 
-          Separator(12),
-
           AudioIndicator,
 
           Separator(12),

config/ags/js/bar/systray.js

@@ -1,8 +1,8 @@
 const { SystemTray } = ags.Service;
-const { Box, Button, Icon, MenuItem } = ags.Widget;
+const { Box, Revealer, Icon, MenuItem } = ags.Widget;
 const { Gtk } = imports.gi;
 
-import { EventBox } from '../misc/cursorbox.js';
+import { Separator } from '../misc/separator.js';
 
 const SysTrayItem = item => MenuItem({
   className: 'tray-item',
@@ -16,7 +16,14 @@ const SysTrayItem = item => MenuItem({
   }]]
 });
 
-export const SysTray = ags.Widget({
+export const SysTray = Revealer({
+  transition: 'slide_right',
+  connections: [[SystemTray, rev => {
+    rev.revealChild = rev.child.children[0].get_children().length > 0;
+  }]],
+  child: Box({
+    children: [
+      ags.Widget({
         type: Gtk.MenuBar,
         className: 'sys-tray',
         properties: [
@@ -43,4 +50,8 @@ export const SysTray = ags.Widget({
           [SystemTray, (box, id) => box._onAdded(box, id), 'added'],
           [SystemTray, (box, id) => box._onRemoved(box, id), 'removed'],
         ],
+      }),
+      Separator(12),
+    ],
+  }),
 });