diff --git a/src/web/containers/Workspace/WidgetManager/WidgetManager.jsx b/src/web/containers/Workspace/WidgetManager/WidgetManager.jsx
index e905505c8..6cccc9fa4 100644
--- a/src/web/containers/Workspace/WidgetManager/WidgetManager.jsx
+++ b/src/web/containers/Workspace/WidgetManager/WidgetManager.jsx
@@ -154,13 +154,16 @@ class WidgetManager extends Component {
         }
     }
     render() {
-        const widgets = _.concat(
-            store.get('workspace.container.default.widgets'),
-            store.get('workspace.container.primary.widgets'),
-            store.get('workspace.container.secondary.widgets')
-        );
-        _.each(this.widgetList, (widget) => {
-            if (_.includes(widgets, widget.id)) {
+        const defaultWidgets = store.get('workspace.container.default.widgets', [])
+            .map(widgetId => widgetId.split(':')[0]);
+        const primaryWidgets = store.get('workspace.container.primary.widgets', [])
+            .map(widgetId => widgetId.split(':')[0]);
+        const secondaryWidgets = store.get('workspace.container.secondary.widgets', [])
+            .map(widgetId => widgetId.split(':')[0]);
+        const activeWidgets = _.union(defaultWidgets, primaryWidgets, secondaryWidgets);
+
+        this.widgetList.forEach(widget => {
+            if (_.includes(activeWidgets, widget.id)) {
                 widget.visible = true;
             } else {
                 widget.visible = false;
diff --git a/src/web/containers/Workspace/WidgetManager/index.jsx b/src/web/containers/Workspace/WidgetManager/index.jsx
index e150dbcde..78c6fbfd2 100644
--- a/src/web/containers/Workspace/WidgetManager/index.jsx
+++ b/src/web/containers/Workspace/WidgetManager/index.jsx
@@ -7,18 +7,21 @@ import store, { defaultState } from '../../../store';
 import WidgetManager from './WidgetManager';
 
 export const getActiveWidgets = () => {
-    const defaultWidgets = store.get('workspace.container.default.widgets');
-    const primaryWidgets = store.get('workspace.container.primary.widgets');
-    const secondaryWidgets = store.get('workspace.container.secondary.widgets');
-    const activeWidgets = _.concat(defaultWidgets, primaryWidgets, secondaryWidgets)
-        .filter(widgetid => {
-            if (widgetid === 'grbl' && !_.includes(controller.loadedControllers, GRBL)) {
+    const defaultWidgets = store.get('workspace.container.default.widgets', [])
+        .map(widgetId => widgetId.split(':')[0]);
+    const primaryWidgets = store.get('workspace.container.primary.widgets', [])
+        .map(widgetId => widgetId.split(':')[0]);
+    const secondaryWidgets = store.get('workspace.container.secondary.widgets', [])
+        .map(widgetId => widgetId.split(':')[0]);
+    const activeWidgets = _.union(defaultWidgets, primaryWidgets, secondaryWidgets)
+        .filter(widget => {
+            if (widget === 'grbl' && !_.includes(controller.loadedControllers, GRBL)) {
                 return false;
             }
-            if (widgetid === 'smoothie' && !_.includes(controller.loadedControllers, SMOOTHIE)) {
+            if (widget === 'smoothie' && !_.includes(controller.loadedControllers, SMOOTHIE)) {
                 return false;
             }
-            if (widgetid === 'tinyg' && !_.includes(controller.loadedControllers, TINYG)) {
+            if (widget === 'tinyg' && !_.includes(controller.loadedControllers, TINYG)) {
                 return false;
             }
             return true;
@@ -29,9 +32,12 @@ export const getActiveWidgets = () => {
 
 export const getInactiveWidgets = () => {
     const allWidgets = Object.keys(defaultState.widgets);
-    const defaultWidgets = store.get('workspace.container.default.widgets');
-    const primaryWidgets = store.get('workspace.container.primary.widgets');
-    const secondaryWidgets = store.get('workspace.container.secondary.widgets');
+    const defaultWidgets = store.get('workspace.container.default.widgets', [])
+        .map(widgetId => widgetId.split(':')[0]);
+    const primaryWidgets = store.get('workspace.container.primary.widgets', [])
+        .map(widgetId => widgetId.split(':')[0]);
+    const secondaryWidgets = store.get('workspace.container.secondary.widgets', [])
+        .map(widgetId => widgetId.split(':')[0]);
     const inactiveWidgets = _.difference(allWidgets, defaultWidgets, primaryWidgets, secondaryWidgets)
         .filter(widget => {
             if (widget === 'grbl' && !_.includes(controller.loadedControllers, GRBL)) {