Invoke ipc event to change window theme

Author: GnaneshKunal

redisinsight/desktop/src/lib/app/ipc.handlers.ts

@@ -1,4 +1,4 @@
-import { app, ipcMain } from 'electron'
+import { app, ipcMain, nativeTheme } from 'electron'
 import { electronStore } from 'desktopSrc/lib'
 import { IpcInvokeEvent } from 'uiSrc/electron/constants'
 
@@ -8,4 +8,8 @@ export const initIPCHandlers = () => {
   ipcMain.handle(IpcInvokeEvent.getStoreValue, (_event, key) => electronStore?.get(key))
 
   ipcMain.handle(IpcInvokeEvent.deleteStoreValue, (_event, key) => electronStore?.delete(key))
+
+  ipcMain.handle(IpcInvokeEvent.themeChange, (_event, theme: string) => {
+    nativeTheme.themeSource = theme.toLowerCase()
+  })
 }

redisinsight/ui/src/contexts/themeContext.tsx

@@ -43,6 +43,7 @@ export class ThemeProvider extends React.Component<Props> {
     if (themeValue === Theme.System) {
       actualTheme = this.getSystemTheme()
     }
+    window.app?.ipc?.invoke?.('theme:change', themeValue)
 
     this.setState({ theme: actualTheme, usingSystemTheme: themeValue === Theme.System }, () => {
       themeService.applyTheme(themeValue)

redisinsight/ui/src/electron/constants/ipcEvent.ts

@@ -4,6 +4,7 @@ enum IpcInvokeEvent {
   getAppVersion = 'app:get:version',
   cloudOauth = 'cloud:oauth',
   windowOpen = 'window:open',
+  themeChange = 'theme:change',
 }
 
 enum IpcOnEvent {