diff --git a/config/ags/config.js b/config/ags/config.js
index d2e4380..76f2b77 100644
--- a/config/ags/config.js
+++ b/config/ags/config.js
@@ -5,6 +5,7 @@ import { NotificationCenter } from './js/notifications/center.js';
 import { NotificationsPopupList } from './js/notifications/popup.js'
 import { Calendar } from './js/date.js';
 import { QuickSettings } from './js/quick-settings/main.js';
+import { Overview } from './js/overview/main.js';
 
 import { Closer, closeAll } from './js/misc/closer.js';
 ags.App.closeAll = () => closeAll();
@@ -27,5 +28,6 @@ export default {
     NotificationsPopupList,
     Calendar,
     QuickSettings,
+    Overview,
   ],
 };
diff --git a/config/ags/js/bar/workspaces.js b/config/ags/js/bar/workspaces.js
index ad227e4..b9e9c18 100644
--- a/config/ags/js/bar/workspaces.js
+++ b/config/ags/js/bar/workspaces.js
@@ -7,6 +7,9 @@ import { EventBox } from '../misc/cursorbox.js';
 const Workspace = ({ i } = {}) =>
 Revealer({
   transition: "slide_right",
+  properties: [
+    ['id', i],
+  ],
   child: EventBox({
     tooltipText: `${i}`,
     onPrimaryClickRelease: () => execAsync(`hyprctl dispatch workspace ${i}`).catch(print),
@@ -29,17 +32,38 @@ export const Workspaces = Box({
   className: 'workspaces',
   children: [EventBox({
     child: Box({
-      children: Array.from({ length: 15 }, (_, i) => i + 1).map(i => Workspace({ i: i})),
-      connections: [[Hyprland, box => {
-        let workspaces = [];
-        Hyprland.workspaces.forEach(ws => {
-          if (ws.id > 0) workspaces.push(ws);
-        });
+      properties: [
+        ['workspaces'],
 
-        box.children.forEach(rev => rev.reveal_child = false);
-        workspaces.forEach(ws => {
-          box.children[ws.id - 1].reveal_child = true;
-        });
+        ['refresh', box => {
+          box.children.forEach(rev => rev.reveal_child = false);
+          box._workspaces.forEach(ws => {
+            ws.revealChild = true;
+          });
+        }],
+
+        ['updateWs', box => {
+          Hyprland.workspaces.forEach(ws => {
+            let currentWs = box.children.find(ch => ch._id == ws.id);
+            if (!currentWs && ws.id > 0) {
+              box.add(Workspace({ i: ws.id}));
+            }
+          });
+          box.show_all();
+
+          // Make sure the order is correct
+          box._workspaces.forEach((workspace, i) => {
+            workspace.get_parent().reorder_child(workspace, i);
+          });
+        }],
+      ],
+      connections: [[Hyprland, box => {
+        box._workspaces = box.children.filter(ch => {
+          return Hyprland.workspaces.find(ws => ws.id == ch._id)
+        }).sort((a, b) => a._id - b._id);
+
+        box._updateWs(box);
+        box._refresh(box);
       }]],
     }),
   })],
diff --git a/config/ags/js/overview/main.js b/config/ags/js/overview/main.js
index 96add99..202884a 100644
--- a/config/ags/js/overview/main.js
+++ b/config/ags/js/overview/main.js
@@ -16,7 +16,7 @@ const DEFAULT_SPECIAL = {
 export const Overview = Window({
   name: 'overview',
   layer: 'overlay',
-  //popup: true,
+  popup: true,
   anchor: 'top',
   margin: [ 0, 0, 0, 0 ],
   child: Box({
@@ -45,17 +45,12 @@ export const Overview = Window({
     connections: [
       [Hyprland, box => {
         let childI = 0;
-        box._workspaces = box.children[childI++].centerWidget.children.concat(
-                          box.children[childI].centerWidget.children);
-
-        // Make sure the order is correct
-        box._workspaces.forEach(workspace => {
-          workspace.get_parent().reorder_child(workspace, workspace._id)
-        });
+        box._workspaces = [].concat(box.children[childI++].centerWidget.children,
+                                    box.children[childI].centerWidget.children)
+                            .sort((a, b) => a._id - b._id);
 
         box._updateWs(box);
         box._updateApps(box);
-
       }],
     ],
     properties: [
@@ -142,13 +137,7 @@ export const Overview = Window({
       ['updateWs', box => {
         Hyprland.workspaces.forEach(ws => {
           let currentWs = box._workspaces.find(ch => ch._id == ws.id)
-          if (currentWs) {
-            if (!currentWs._ordered) {
-              currentWs.get_parent().reorder_child(currentWs, ws._id);
-              currentWs._ordered = true;
-            }
-          }
-          else {
+          if (!currentWs) {
             var childI = 0;
             if (ws.id < 0) {
               childI = 1;
@@ -157,7 +146,6 @@ export const Overview = Window({
             currentWs = Box({
               properties: [
                 ['id', ws.id],
-                ['ordered', false],
               ],
               className: 'workspace',
               child: EventBox({
@@ -171,6 +159,11 @@ export const Overview = Window({
           }
         });
         box.show_all();
+
+        // Make sure the order is correct
+        box._workspaces.forEach((workspace, i) => {
+          workspace.get_parent().reorder_child(workspace, i)
+        });
       }],
     ],
   }),