Fix UI is broken when navigation bar pref is changed (#54)

public/listeners/index.js

@@ -213,6 +213,16 @@ const loadListeners = () => {
     createMenu();
   });
 
+  ipcMain.on('request-realign-active-workspace', () => {
+    global.attachToMenubar = getPreference('attachToMenubar');
+    global.showSidebar = getPreference('sidebar');
+    global.showNavigationBar = getPreference('navigationBar');
+
+    const activeWorkspace = getActiveWorkspace();
+    setActiveWorkspaceView(activeWorkspace.id);
+    createMenu();
+  });
+
   ipcMain.on('request-open-url-in-workspace', (e, url, id) => {
     if (id) {
       // if id is defined, switch to that workspace

src/components/preferences/index.js

@@ -22,13 +22,14 @@ import StatedMenu from '../shared/stated-menu';
 import { updateIsDefaultMailClient, updateIsDefaultWebBrowser } from '../../state/general/actions';
 
 import {
+  requestClearBrowsingData,
   requestOpenInBrowser,
+  requestRealignActiveWorkspace,
+  requestResetPreferences,
   requestSetPreference,
   requestSetSystemPreference,
-  requestResetPreferences,
-  requestClearBrowsingData,
-  requestShowRequireRestartDialog,
   requestShowCodeInjectionWindow,
+  requestShowRequireRestartDialog,
 } from '../../senders';
 
 const { remote } = window.require('electron');
@@ -120,7 +121,7 @@ const Preferences = ({
             checked={navigationBar}
             onChange={(e) => {
               requestSetPreference('navigationBar', e.target.checked);
-              requestShowRequireRestartDialog();
+              requestRealignActiveWorkspace();
             }}
             classes={{
               switchBase: classes.switchBase,
@@ -427,6 +428,7 @@ const Preferences = ({
           <ListItemText primary="JS Code Injection" secondary={jsCodeInjection ? 'Set' : 'Not set'} />
           <ChevronRightIcon color="action" />
         </ListItem>
+        <Divider />
         <ListItem button onClick={() => requestShowCodeInjectionWindow('css')}>
           <ListItemText primary="CSS Code Injection" secondary={cssCodeInjection ? 'Set' : 'Not set'} />
           <ChevronRightIcon color="action" />

src/senders/index.js

@@ -42,6 +42,7 @@ export const requestSetWorkspace = (id, opts) => ipcRenderer.send('request-set-w
 export const requestSetWorkspacePicture = (id, picturePath) => ipcRenderer.send('request-set-workspace-picture', id, picturePath);
 export const requestRemoveWorkspacePicture = (id) => ipcRenderer.send('request-remove-workspace-picture', id);
 export const requestSetActiveWorkspace = (id) => ipcRenderer.send('request-set-active-workspace', id);
+export const requestRealignActiveWorkspace = () => ipcRenderer.send('request-realign-active-workspace');
 export const requestRemoveWorkspace = (id) => ipcRenderer.send('request-remove-workspace', id);
 export const requestClearBrowsingData = () => ipcRenderer.send('request-clear-browsing-data');
 export const requestOpenUrlInWorkspace = (url, id) => ipcRenderer.send('request-open-url-in-workspace', url, id);