Transform tray & menu files to typescript (#740)

9 files changed, 441 insertions, 394 deletions

diff --git a/src/actions/lib/actions.ts b/src/actions/lib/actions.ts
index da27c2e2b..faf576fd8 100644
--- a/src/actions/lib/actions.ts
+++ b/src/actions/lib/actions.ts
@@ -1,8 +1,6 @@
-import PropTypes from 'prop-types';
-
 export interface ActionDefinitions {
   [key: string]: {
-    [key: string]: PropTypes.InferType<any>;
+    [key: string]: any;
   };
 }
 
@@ -18,18 +16,19 @@ export interface Actions {
   };
 }
 
-export const createActionsFromDefinitions = <T extends {}>(
+export const createActionsFromDefinitions = <T>(
   actionDefinitions: ActionDefinitions,
   validate: any,
 ): T => {
   const actions = {};
-  // eslint-disable-next-line unicorn/no-array-for-each
-  Object.keys(actionDefinitions).forEach(actionName => {
+
+  for (const actionName of Object.keys(actionDefinitions)) {
     const action = (params = {}) => {
       const schema = actionDefinitions[actionName];
       validate(schema, params, actionName);
       action.notify(params);
     };
+
     actions[actionName] = action;
     action.listeners = [];
     action.listen = listener => action.listeners.push(listener);
@@ -37,21 +36,24 @@ export const createActionsFromDefinitions = <T extends {}>(
       const { listeners } = action;
       listeners.splice(listeners.indexOf(listener), 1);
     };
-    action.notify = params =>
-      // eslint-disable-next-line unicorn/no-array-for-each
-      action.listeners.forEach(listener => listener(params));
-  });
+    action.notify = params => {
+      for (const listener of action.listeners) {
+        listener(params);
+      }
+    };
+  }
+
   return actions as T;
 };
 
 export default (definitions, validate) => {
   const newActions = {};
-  // eslint-disable-next-line unicorn/no-array-for-each
-  Object.keys(definitions).forEach(scopeName => {
+  for (const scopeName of Object.keys(definitions)) {
     newActions[scopeName] = createActionsFromDefinitions(
       definitions[scopeName],
       validate,
     );
-  });
+  }
+
   return newActions;
 };
diff --git a/src/components/ui/input/index.tsx b/src/components/ui/input/index.tsx
index cb26c0ea4..a6d401195 100644
--- a/src/components/ui/input/index.tsx
+++ b/src/components/ui/input/index.tsx
@@ -84,11 +84,6 @@ class Input extends Component<IProps, IState> {
     onChange(e);
 
     if (scorePassword) {
-      console.log(
-        '--->',
-        e.target.value,
-        scorePasswordFunc(e.target.value as string),
-      );
       this.setState({
         passwordScore: scorePasswordFunc(e.target.value),
       });
diff --git a/src/electron/ipc-api/appIndicator.ts b/src/electron/ipc-api/appIndicator.ts
index bd5f6a68f..766e6937a 100644
--- a/src/electron/ipc-api/appIndicator.ts
+++ b/src/electron/ipc-api/appIndicator.ts
@@ -1,7 +1,8 @@
-import { app, ipcMain, BrowserWindow, Tray } from 'electron';
+import { app, ipcMain, BrowserWindow } from 'electron';
 import { join } from 'path';
 import { autorun } from 'mobx';
 import { isMac, isWindows, isLinux } from '../../environment';
+import TrayIcon from '../../lib/Tray';
 
 const INDICATOR_TASKBAR = 'taskbar';
 const FILE_EXTENSION = isWindows ? 'ico' : 'png';
@@ -24,16 +25,14 @@ function getAsset(type: 'tray' | 'taskbar', asset: string) {
 export default (params: {
   mainWindow: BrowserWindow;
   settings: any;
-  trayIcon: Tray;
+  trayIcon: TrayIcon;
 }) => {
   autorun(() => {
     isTrayIconEnabled = params.settings.app.get('enableSystemTray');
 
     if (!isTrayIconEnabled) {
-      // @ts-expect-error Property 'hide' does not exist on type 'Tray'.
       params.trayIcon.hide();
     } else if (isTrayIconEnabled) {
-      // @ts-expect-error Property 'show' does not exist on type 'Tray'.
       params.trayIcon.show();
     }
   });
@@ -87,7 +86,6 @@ export default (params: {
     }
 
     // Update Tray
-    // @ts-expect-error Property 'setIndicator' does not exist on type 'Tray'.
     params.trayIcon.setIndicator(args.indicator);
   });
 };
diff --git a/src/electron/ipc-api/index.ts b/src/electron/ipc-api/index.ts
index 1a8838c4e..b57a9d881 100644
--- a/src/electron/ipc-api/index.ts
+++ b/src/electron/ipc-api/index.ts
@@ -1,4 +1,4 @@
-import { BrowserWindow, Tray } from 'electron';
+import { BrowserWindow } from 'electron';
 import autoUpdate from './autoUpdate';
 import settings from './settings';
 import sessionStorage from './sessionStorage';
@@ -9,11 +9,12 @@ import localServer from './localServer';
 import languageDetect from './languageDetect';
 import dnd from './dnd';
 import focusState from './focusState';
+import TrayIcon from '../../lib/Tray';
 
 export default (params: {
   mainWindow: BrowserWindow;
   settings: any;
-  trayIcon: Tray;
+  trayIcon: TrayIcon;
 }) => {
   settings(params);
   sessionStorage();
diff --git a/src/features/workspaces/actions.ts b/src/features/workspaces/actions.ts
index b4e1d0758..4c8b74450 100644
--- a/src/features/workspaces/actions.ts
+++ b/src/features/workspaces/actions.ts
@@ -2,7 +2,14 @@ import PropTypes from 'prop-types';
 import Workspace from './models/Workspace';
 import { createActionsFromDefinitions } from '../../actions/lib/actions';
 
-export default createActionsFromDefinitions(
+export interface WorkspaceActions {
+  openWorkspaceSettings: () => void;
+  toggleWorkspaceDrawer: () => void;
+  deactivate: () => void;
+  activate: (options: any) => void;
+}
+
+export default createActionsFromDefinitions<WorkspaceActions>(
   {
     edit: {
       workspace: PropTypes.instanceOf(Workspace).isRequired,
diff --git a/src/index.ts b/src/index.ts
index 3233714e0..0efd0437d 100644
--- a/src/index.ts
+++ b/src/index.ts
@@ -33,7 +33,7 @@ import { ifUndefined } from './jsUtils';
 
 import { mainIpcHandler as basicAuthHandler } from './features/basicAuth';
 import ipcApi from './electron/ipc-api';
-import Tray from './lib/Tray';
+import TrayIcon from './lib/Tray';
 import DBus from './lib/DBus';
 import Settings from './electron/Settings';
 import handleDeepLink from './electron/deepLinking';
@@ -251,7 +251,7 @@ const createWindow = () => {
   });
 
   // Initialize System Tray
-  const trayIcon: Tray = new Tray();
+  const trayIcon: TrayIcon = new TrayIcon();
 
   // Initialize DBus interface
   const dbus = new DBus(trayIcon);
diff --git a/src/lib/DBus.ts b/src/lib/DBus.ts
index b1febc2d1..bbff405c4 100644
--- a/src/lib/DBus.ts
+++ b/src/lib/DBus.ts
@@ -1,17 +1,20 @@
 import { MessageBus, sessionBus } from 'dbus-next';
 import { isLinux } from '../environment';
+import TrayIcon from './Tray';
 
 export default class DBus {
   bus: MessageBus | null = null;
 
-  trayIcon: any;
+  trayIcon: TrayIcon;
 
-  constructor(trayIcon: any) {
+  constructor(trayIcon: TrayIcon) {
     this.trayIcon = trayIcon;
   }
 
   start() {
-    if (!isLinux || this.bus) return;
+    if (!isLinux || this.bus) {
+      return;
+    }
 
     try {
       this.bus = sessionBus();
@@ -47,7 +50,9 @@ export default class DBus {
   }
 
   stop() {
-    if (!this.bus) return;
+    if (!this.bus) {
+      return;
+    }
 
     this.bus.disconnect();
     this.bus = null;
diff --git a/src/lib/Menu.js b/src/lib/Menu.ts
index 52b6be18a..c206ea55d 100644
--- a/src/lib/Menu.js
+++ b/src/lib/Menu.ts
@@ -1,4 +1,4 @@
-import { clipboard } from 'electron';
+import { clipboard, MenuItemConstructorOptions } from 'electron';
 import {
   app,
   Menu,
@@ -8,7 +8,7 @@ import {
   getCurrentWindow,
 } from '@electron/remote';
 import { autorun, action, makeObservable, observable } from 'mobx';
-import { defineMessages } from 'react-intl';
+import { defineMessages, IntlShape } from 'react-intl';
 import osName from 'os-name';
 import { fromJS } from 'immutable';
 import semver from 'semver';
@@ -42,9 +42,11 @@ import { importExportURL, serverBase, serverName } from '../api/apiBase';
 import { openExternalUrl } from '../helpers/url-helpers';
 import globalMessages from '../i18n/globalMessages';
 import { onAuthGoToReleaseNotes } from '../helpers/update-helpers';
-
 // @ts-expect-error Cannot find module '../buildInfo.json' or its corresponding type declarations.
-import * as buildInfo from '../buildInfo.json';
+import { timestamp, gitHashShort, gitBranch } from '../buildInfo.json';
+import Service from '../models/Service';
+import { StoresProps } from '../@types/ferdium-components.types';
+import { RealStores } from '../stores';
 
 const menuItems = defineMessages({
   edit: {
@@ -349,11 +351,11 @@ const menuItems = defineMessages({
   },
 });
 
-function getActiveService() {
+function getActiveService(): Service | undefined {
   return window['ferdium'].stores.services.active;
 }
 
-function _toggleFullScreen() {
+function toggleFullScreen(): void {
   const mainWindow = getCurrentWindow();
 
   if (!mainWindow) return;
@@ -365,314 +367,337 @@ function _toggleFullScreen() {
   }
 }
 
-const _titleBarTemplateFactory = (intl, locked) => [
-  {
-    label: intl.formatMessage(menuItems.edit),
-    accelerator: `${altKey()}+E`,
-    submenu: [
-      {
-        label: intl.formatMessage(menuItems.undo),
-        role: 'undo',
-      },
-      {
-        label: intl.formatMessage(menuItems.redo),
-        role: 'redo',
-      },
-      {
-        type: 'separator',
-      },
-      {
-        label: intl.formatMessage(menuItems.cut),
-        accelerator: `${cmdOrCtrlShortcutKey()}+X`,
-        role: 'cut',
-      },
-      {
-        label: intl.formatMessage(menuItems.copy),
-        accelerator: `${cmdOrCtrlShortcutKey()}+C`,
-        role: 'copy',
-      },
-      {
-        label: intl.formatMessage(menuItems.paste),
-        accelerator: `${cmdOrCtrlShortcutKey()}+V`,
-        role: 'paste',
-      },
-      {
-        label: intl.formatMessage(menuItems.pasteAndMatchStyle),
-        accelerator: `${cmdOrCtrlShortcutKey()}+${shiftKey()}+V`, // Override the accelerator since this adds new key combo in macos
-        role: 'pasteAndMatchStyle',
-      },
-      {
-        label: intl.formatMessage(menuItems.delete),
-        role: 'delete',
-      },
-      {
-        label: intl.formatMessage(menuItems.selectAll),
-        accelerator: `${cmdOrCtrlShortcutKey()}+A`,
-        role: 'selectall',
-      },
-    ],
-  },
-  {
-    label: intl.formatMessage(menuItems.view),
-    accelerator: `${altKey()}+V`,
-    visible: !locked,
-    submenu: [
-      {
-        type: 'separator',
-      },
-      {
-        label: intl.formatMessage(menuItems.openQuickSwitch),
-        accelerator: `${cmdOrCtrlShortcutKey()}+S`,
-        click() {
-          window['ferdium'].features.quickSwitch.state.isModalVisible = true;
+function titleBarTemplateFactory(
+  intl: IntlShape,
+  locked: boolean,
+): MenuItemConstructorOptions[] {
+  return [
+    {
+      label: intl.formatMessage(menuItems.edit),
+      accelerator: `${altKey()}+E`,
+      submenu: [
+        {
+          label: intl.formatMessage(menuItems.undo),
+          role: 'undo',
         },
-      },
-      {
-        type: 'separator',
-      },
-      {
-        label: intl.formatMessage(menuItems.findInPage),
-        accelerator: `${cmdOrCtrlShortcutKey()}+F`,
-        click() {
-          const service = getActiveService();
-          // Check if there is a service active
-          if (service) {
-            // Focus webview so find in page popup gets focused
-            service.webview.focus();
-
+        {
+          label: intl.formatMessage(menuItems.redo),
+          role: 'redo',
+        },
+        {
+          type: 'separator',
+        },
+        {
+          label: intl.formatMessage(menuItems.cut),
+          accelerator: `${cmdOrCtrlShortcutKey()}+X`,
+          role: 'cut',
+        },
+        {
+          label: intl.formatMessage(menuItems.copy),
+          accelerator: `${cmdOrCtrlShortcutKey()}+C`,
+          role: 'copy',
+        },
+        {
+          label: intl.formatMessage(menuItems.paste),
+          accelerator: `${cmdOrCtrlShortcutKey()}+V`,
+          role: 'paste',
+        },
+        {
+          label: intl.formatMessage(menuItems.pasteAndMatchStyle),
+          accelerator: `${cmdOrCtrlShortcutKey()}+${shiftKey()}+V`, // Override the accelerator since this adds new key combo in macos
+          role: 'pasteAndMatchStyle',
+        },
+        {
+          label: intl.formatMessage(menuItems.delete),
+          role: 'delete',
+        },
+        {
+          label: intl.formatMessage(menuItems.selectAll),
+          accelerator: `${cmdOrCtrlShortcutKey()}+A`,
+          role: 'selectAll',
+        },
+      ],
+    },
+    {
+      label: intl.formatMessage(menuItems.view),
+      accelerator: `${altKey()}+V`,
+      visible: !locked,
+      submenu: [
+        {
+          type: 'separator',
+        },
+        {
+          label: intl.formatMessage(menuItems.openQuickSwitch),
+          accelerator: `${cmdOrCtrlShortcutKey()}+S`,
+          click() {
+            window['ferdium'].features.quickSwitch.state.isModalVisible = true;
+          },
+        },
+        {
+          type: 'separator',
+        },
+        {
+          label: intl.formatMessage(menuItems.findInPage),
+          accelerator: `${cmdOrCtrlShortcutKey()}+F`,
+          click() {
+            const activeService = getActiveService();
+            if (!activeService) {
+              return;
+            }
+            activeService.webview.focus();
             window['ferdium'].actions.service.sendIPCMessage({
-              serviceId: service.id,
+              serviceId: activeService.id,
               channel: 'find-in-page',
               args: {},
             });
-          }
+          },
         },
-      },
-      {
-        type: 'separator',
-      },
-      {
-        label: intl.formatMessage(menuItems.back),
-        accelerator: `${!isMac ? altKey() : cmdOrCtrlShortcutKey()}+Left`,
-        click() {
-          getActiveService().webview.goBack();
+        {
+          type: 'separator',
         },
-      },
-      {
-        label: intl.formatMessage(menuItems.forward),
-        accelerator: `${!isMac ? altKey() : cmdOrCtrlShortcutKey()}+Right`,
-        click() {
-          getActiveService().webview.goForward();
+        {
+          label: intl.formatMessage(menuItems.back),
+          accelerator: `${!isMac ? altKey() : cmdOrCtrlShortcutKey()}+Left`,
+          click() {
+            const activeService = getActiveService();
+            if (!activeService) {
+              return;
+            }
+            activeService.webview.goBack();
+          },
         },
-      },
-      {
-        type: 'separator',
-      },
-      {
-        label: intl.formatMessage(menuItems.resetZoom),
-        accelerator: `${cmdOrCtrlShortcutKey()}+0`,
-        click() {
-          getActiveService().webview.setZoomLevel(0);
+        {
+          label: intl.formatMessage(menuItems.forward),
+          accelerator: `${!isMac ? altKey() : cmdOrCtrlShortcutKey()}+Right`,
+          click() {
+            const activeService = getActiveService();
+            if (!activeService) {
+              return;
+            }
+            activeService.webview.goForward();
+          },
         },
-      },
-      {
-        label: intl.formatMessage(menuItems.zoomIn),
-        accelerator: `${cmdOrCtrlShortcutKey()}+plus`,
-        click() {
-          const activeService = getActiveService().webview;
-          const level = activeService.getZoomLevel();
-
-          activeService.setZoomLevel(level + 0.5);
+        {
+          type: 'separator',
         },
-      },
-      {
-        label: intl.formatMessage(menuItems.zoomOut),
-        accelerator: `${cmdOrCtrlShortcutKey()}+-`,
-        click() {
-          const activeService = getActiveService().webview;
-          const level = activeService.getZoomLevel();
-
-          activeService.setZoomLevel(level - 0.5);
+        {
+          label: intl.formatMessage(menuItems.resetZoom),
+          accelerator: `${cmdOrCtrlShortcutKey()}+0`,
+          click() {
+            const activeService = getActiveService();
+            if (!activeService) {
+              return;
+            }
+            activeService.webview.setZoomLevel(0);
+          },
         },
-      },
-      {
-        type: 'separator',
-      },
-      {
-        label: intl.formatMessage(menuItems.toggleFullScreen),
-        click: () => {
-          _toggleFullScreen();
+        {
+          label: intl.formatMessage(menuItems.zoomIn),
+          accelerator: `${cmdOrCtrlShortcutKey()}+plus`,
+          click() {
+            const activeService = getActiveService();
+            if (!activeService) {
+              return;
+            }
+            const { webview } = activeService;
+            const level = webview.getZoomLevel();
+            webview.setZoomLevel(level + 0.5);
+          },
         },
-        accelerator: toggleFullScreenKey(),
-      },
-      {
-        label: intl.formatMessage(menuItems.toggleNavigationBar),
-        accelerator: `${cmdOrCtrlShortcutKey()}+B`,
-        role: 'toggleNavigationBar',
-        type: 'checkbox',
-        checked:
-          window['ferdium'].stores.settings.app.navigationBarManualActive,
-        click: () => {
-          window['ferdium'].actions.settings.update({
-            type: 'app',
-            data: {
-              navigationBarManualActive:
-                !window['ferdium'].stores.settings.app
-                  .navigationBarManualActive,
-            },
-          });
+        {
+          label: intl.formatMessage(menuItems.zoomOut),
+          accelerator: `${cmdOrCtrlShortcutKey()}+-`,
+          click() {
+            const activeService = getActiveService();
+            if (!activeService) {
+              return;
+            }
+            const { webview } = activeService;
+            const level = webview.getZoomLevel();
+            webview.setZoomLevel(level - 0.5);
+          },
         },
-      },
-      {
-        label: intl.formatMessage(menuItems.splitModeToggle),
-        accelerator: `${splitModeToggleShortcutKey()}`,
-        role: 'splitModeToggle',
-        type: 'checkbox',
-        checked: window['ferdium'].stores.settings.app.splitMode,
-        click: () => {
-          window['ferdium'].actions.settings.update({
-            type: 'app',
-            data: {
-              splitMode: !window['ferdium'].stores.settings.app.splitMode,
-            },
-          });
+        {
+          type: 'separator',
         },
-      },
-      {
-        label: intl.formatMessage(menuItems.toggleDarkMode),
-        type: 'checkbox',
-        accelerator: `${cmdOrCtrlShortcutKey()}+${shiftKey()}+D`,
-        checked: window['ferdium'].stores.settings.app.darkMode,
-        click: () => {
-          window['ferdium'].actions.settings.update({
-            type: 'app',
-            data: {
-              darkMode: !window['ferdium'].stores.settings.app.darkMode,
-            },
-          });
+        {
+          label: intl.formatMessage(menuItems.toggleFullScreen),
+          click: () => {
+            toggleFullScreen();
+          },
+          accelerator: toggleFullScreenKey(),
         },
-      },
-    ],
-  },
-  {
-    label: intl.formatMessage(menuItems.services),
-    accelerator: `${altKey()}+S`,
-    visible: !locked,
-    submenu: [],
-  },
-  {
-    label: intl.formatMessage(menuItems.workspaces),
-    accelerator: `${altKey()}+W`,
-    submenu: [],
-    visible: !locked,
-  },
-  {
-    label: intl.formatMessage(menuItems.todos),
-    submenu: [],
-    visible: !locked,
-  },
-  {
-    label: intl.formatMessage(menuItems.window),
-    role: 'window',
-    submenu: [
-      {
-        label: intl.formatMessage(menuItems.minimize),
-        role: 'minimize',
-      },
-      {
-        label: intl.formatMessage(menuItems.close),
-        role: 'close',
-      },
-    ],
-  },
-  {
-    label: intl.formatMessage(menuItems.help),
-    accelerator: `${altKey()}+H`,
-    role: 'help',
-    submenu: [
-      {
-        label: intl.formatMessage(menuItems.learnMore),
-        click() {
-          openExternalUrl(LIVE_API_FERDIUM_WEBSITE, true);
+        {
+          label: intl.formatMessage(menuItems.toggleNavigationBar),
+          accelerator: `${cmdOrCtrlShortcutKey()}+B`,
+          // role: 'toggleNavigationBar',
+          type: 'checkbox',
+          checked:
+            window['ferdium'].stores.settings.app.navigationBarManualActive,
+          click: () => {
+            window['ferdium'].actions.settings.update({
+              type: 'app',
+              data: {
+                navigationBarManualActive:
+                  !window['ferdium'].stores.settings.app
+                    .navigationBarManualActive,
+              },
+            });
+          },
         },
-      },
-      {
-        label: intl.formatMessage(menuItems.changelog),
-        click() {
-          window.location.href = onAuthGoToReleaseNotes(window.location.href);
+        {
+          label: intl.formatMessage(menuItems.splitModeToggle),
+          accelerator: `${splitModeToggleShortcutKey()}`,
+          // role: 'splitModeToggle',
+          type: 'checkbox',
+          checked: window['ferdium'].stores.settings.app.splitMode,
+          click: () => {
+            window['ferdium'].actions.settings.update({
+              type: 'app',
+              data: {
+                splitMode: !window['ferdium'].stores.settings.app.splitMode,
+              },
+            });
+          },
         },
-      },
-      {
-        label: intl.formatMessage(menuItems.importExportData),
-        click() {
-          openExternalUrl(importExportURL(), true);
+        {
+          label: intl.formatMessage(menuItems.toggleDarkMode),
+          type: 'checkbox',
+          accelerator: `${cmdOrCtrlShortcutKey()}+${shiftKey()}+D`,
+          checked: window['ferdium'].stores.settings.app.darkMode,
+          click: () => {
+            window['ferdium'].actions.settings.update({
+              type: 'app',
+              data: {
+                darkMode: !window['ferdium'].stores.settings.app.darkMode,
+              },
+            });
+          },
         },
-        enabled: !locked,
-      },
-      {
-        type: 'separator',
-      },
-      {
-        label: intl.formatMessage(menuItems.support),
-        click() {
-          openExternalUrl(`${LIVE_API_FERDIUM_WEBSITE}/contact`, true);
+      ],
+    },
+    {
+      label: intl.formatMessage(menuItems.services),
+      accelerator: `${altKey()}+S`,
+      visible: !locked,
+      submenu: [],
+    },
+    {
+      label: intl.formatMessage(menuItems.workspaces),
+      accelerator: `${altKey()}+W`,
+      submenu: [],
+      visible: !locked,
+    },
+    {
+      label: intl.formatMessage(menuItems.todos),
+      submenu: [],
+      visible: !locked,
+    },
+    {
+      label: intl.formatMessage(menuItems.window),
+      role: 'window',
+      submenu: [
+        {
+          label: intl.formatMessage(menuItems.minimize),
+          role: 'minimize',
         },
-      },
-      {
-        type: 'separator',
-      },
-      {
-        label: intl.formatMessage(menuItems.tos),
-        click() {
-          openExternalUrl(`${serverBase()}/terms`, true);
+        {
+          label: intl.formatMessage(menuItems.close),
+          role: 'close',
         },
-      },
-      {
-        label: intl.formatMessage(menuItems.privacy),
-        click() {
-          openExternalUrl(`${serverBase()}/privacy`, true);
+      ],
+    },
+    {
+      label: intl.formatMessage(menuItems.help),
+      accelerator: `${altKey()}+H`,
+      role: 'help',
+      submenu: [
+        {
+          label: intl.formatMessage(menuItems.learnMore),
+          click() {
+            openExternalUrl(LIVE_API_FERDIUM_WEBSITE, true);
+          },
         },
-      },
-    ],
-  },
-];
+        {
+          label: intl.formatMessage(menuItems.changelog),
+          click() {
+            window.location.href = onAuthGoToReleaseNotes(window.location.href);
+          },
+        },
+        {
+          label: intl.formatMessage(menuItems.importExportData),
+          click() {
+            openExternalUrl(importExportURL(), true);
+          },
+          enabled: !locked,
+        },
+        {
+          type: 'separator',
+        },
+        {
+          label: intl.formatMessage(menuItems.support),
+          click() {
+            openExternalUrl(`${LIVE_API_FERDIUM_WEBSITE}/contact`, true);
+          },
+        },
+        {
+          type: 'separator',
+        },
+        {
+          label: intl.formatMessage(menuItems.tos),
+          click() {
+            openExternalUrl(`${serverBase()}/terms`, true);
+          },
+        },
+        {
+          label: intl.formatMessage(menuItems.privacy),
+          click() {
+            openExternalUrl(`${serverBase()}/privacy`, true);
+          },
+        },
+      ],
+    },
+  ];
+}
 
-class FranzMenu {
-  @observable currentTemplate = [];
+class FranzMenu implements StoresProps {
+  @observable currentTemplate: MenuItemConstructorOptions[];
 
-  constructor(stores, actions) {
+  actions: any;
+
+  stores: RealStores;
+
+  constructor(stores: RealStores, actions: any) {
     this.stores = stores;
     this.actions = actions;
+    this.currentTemplate = [];
 
     makeObservable(this);
 
-    setTimeout(() => {
-      autorun(this._build.bind(this));
-    }, 10);
+    setTimeout(() => autorun(this._build.bind(this)), 10);
   }
 
-  @action _setCurrentTemplate(tpl) {
+  @action _setCurrentTemplate(tpl: MenuItemConstructorOptions[]): void {
     this.currentTemplate = tpl;
   }
 
-  rebuild() {
+  rebuild(): void {
     this._build();
   }
 
-  get template() {
+  get template(): any {
     return fromJS(this.currentTemplate).toJS();
   }
 
-  getOsName() {
+  getOsName(): string {
     let osNameParse = osName();
     const isWin11 = semver.satisfies(os.release(), '>=10.0.22000');
-
     osNameParse = isWindows && isWin11 ? 'Windows 11' : osNameParse;
 
     return osNameParse;
   }
 
-  _build() {
+  _build(): void {
     // need to clone object so we don't modify computed (cached) object
     const serviceTpl = Object.assign([], this.serviceTpl());
 
@@ -687,11 +712,11 @@ class FranzMenu {
       this.stores.settings.app.locked &&
       this.stores.settings.app.lockingFeatureEnabled &&
       this.stores.user.isLoggedIn;
-    const tpl = _titleBarTemplateFactory(intl, locked);
     const { actions } = this;
+    const tpl = titleBarTemplateFactory(intl, locked);
 
     if (!isMac) {
-      tpl[1].submenu.push({
+      (tpl[1].submenu as MenuItemConstructorOptions[]).push({
         label: intl.formatMessage(menuItems.autohideMenuBar),
         type: 'checkbox',
         checked: window['ferdium'].stores.settings.app.autohideMenuBar,
@@ -708,7 +733,7 @@ class FranzMenu {
     }
 
     if (!locked) {
-      tpl[1].submenu.push(
+      (tpl[1].submenu as MenuItemConstructorOptions[]).push(
         {
           type: 'separator',
         },
@@ -740,7 +765,7 @@ class FranzMenu {
       );
 
       if (this.stores.todos.isFeatureEnabledByUser) {
-        tpl[1].submenu.push({
+        (tpl[1].submenu as MenuItemConstructorOptions[]).push({
           label: intl.formatMessage(menuItems.toggleTodosDevTools),
           accelerator: `${cmdOrCtrlShortcutKey()}+${shiftKey()}+${altKey()}+O`,
           click: () => {
@@ -750,7 +775,7 @@ class FranzMenu {
         });
       }
 
-      tpl[1].submenu.unshift(
+      (tpl[1].submenu as MenuItemConstructorOptions[]).unshift(
         {
           label: intl.formatMessage(menuItems.reloadService),
           accelerator: `${cmdOrCtrlShortcutKey()}+R`,
@@ -759,8 +784,8 @@ class FranzMenu {
               this.stores.user.isLoggedIn &&
               this.stores.services.enabled.length > 0
             ) {
-              if (getActiveService().recipe.id === CUSTOM_WEBSITE_RECIPE_ID) {
-                getActiveService().webview.reload();
+              if (getActiveService()?.recipe.id === CUSTOM_WEBSITE_RECIPE_ID) {
+                getActiveService()?.webview.reload();
               } else {
                 this.actions.service.reloadActive();
               }
@@ -816,7 +841,7 @@ class FranzMenu {
           systemPreferences.canPromptTouchID()
         : false;
 
-      tpl[0].submenu.unshift(
+      (tpl[0].submenu as MenuItemConstructorOptions[]).unshift(
         {
           label: intl.formatMessage(menuItems.touchId),
           accelerator: `${lockFerdiumShortcutKey()}`,
@@ -909,9 +934,9 @@ class FranzMenu {
       `Node.js: ${nodeVersion}`,
       `Platform: ${this.getOsName()}`,
       `Arch: ${osArch}`,
-      `Build date: ${new Date(Number(buildInfo.timestamp))}`,
-      `Git SHA: ${buildInfo.gitHashShort}`,
-      `Git branch: ${buildInfo.gitBranch}`,
+      `Build date: ${new Date(Number(timestamp))}`,
+      `Git SHA: ${gitHashShort}`,
+      `Git branch: ${gitBranch}`,
     ].join('\n');
 
     const about = {
@@ -940,7 +965,7 @@ class FranzMenu {
 
     if (isMac) {
       // Edit menu.
-      tpl[1].submenu.push(
+      (tpl[1].submenu as MenuItemConstructorOptions[]).push(
         {
           type: 'separator',
         },
@@ -949,17 +974,17 @@ class FranzMenu {
           submenu: [
             {
               label: intl.formatMessage(menuItems.startSpeaking),
-              role: 'startspeaking',
+              role: 'startSpeaking',
             },
             {
               label: intl.formatMessage(menuItems.stopSpeaking),
-              role: 'stopspeaking',
+              role: 'stopSpeaking',
             },
           ],
         },
       );
 
-      tpl[0].submenu.unshift(about, {
+      (tpl[0].submenu as MenuItemConstructorOptions[]).unshift(about, {
         type: 'separator',
       });
     } else {
@@ -985,7 +1010,7 @@ class FranzMenu {
         },
       ];
 
-      tpl[tpl.length - 1].submenu.push(
+      (tpl[tpl.length - 1].submenu as MenuItemConstructorOptions[]).push(
         {
           type: 'separator',
         },
@@ -1002,7 +1027,7 @@ class FranzMenu {
 
       tpl[5].submenu = this.todosMenu();
 
-      tpl[tpl.length - 1].submenu.push(
+      (tpl[tpl.length - 1].submenu as MenuItemConstructorOptions[]).push(
         {
           type: 'separator',
         },
@@ -1014,13 +1039,15 @@ class FranzMenu {
     Menu.setApplicationMenu(menu);
   }
 
-  serviceTpl() {
+  serviceTpl(): MenuItemConstructorOptions[] {
     const { intl } = window['ferdium'];
     const { user, services, settings } = this.stores;
-    if (!user.isLoggedIn) return [];
-    const menu = [];
-    const cmdAltShortcutsVisibile = !isLinux;
+    if (!user.isLoggedIn) {
+      return [];
+    }
 
+    const cmdAltShortcutsVisibile = !isLinux;
+    const menu: MenuItemConstructorOptions[] = [];
     menu.push(
       {
         label: intl.formatMessage(menuItems.addNewService),
@@ -1075,7 +1102,7 @@ class FranzMenu {
     for (const [i, service] of services.allDisplayed.entries()) {
       menu.push({
         label: this._getServiceName(service),
-        accelerator: i < 9 ? `${cmdOrCtrlShortcutKey()}+${i + 1}` : null,
+        accelerator: i < 9 ? `${cmdOrCtrlShortcutKey()}+${i + 1}` : undefined,
         type: 'radio',
         checked: service.isActive,
         click: () => {
@@ -1108,12 +1135,12 @@ class FranzMenu {
     return menu;
   }
 
-  workspacesMenu() {
+  workspacesMenu(): MenuItemConstructorOptions[] {
     const { workspaces, activeWorkspace, isWorkspaceDrawerOpen } =
       workspaceStore;
     const { intl } = window['ferdium'];
-    const menu = [];
 
+    const menu: MenuItemConstructorOptions[] = [];
     // Add new workspace item:
     menu.push({
       label: intl.formatMessage(menuItems.addNewWorkspace),
@@ -1159,7 +1186,7 @@ class FranzMenu {
       menu.push({
         label: workspace.name,
         accelerator:
-          i < 9 ? `${cmdOrCtrlShortcutKey()}+${altKey()}+${i + 1}` : null,
+          i < 9 ? `${cmdOrCtrlShortcutKey()}+${altKey()}+${i + 1}` : undefined,
         type: 'radio',
         checked: activeWorkspace ? workspace.id === activeWorkspace.id : false,
         click: () => {
@@ -1171,11 +1198,11 @@ class FranzMenu {
     return menu;
   }
 
-  todosMenu() {
+  todosMenu(): MenuItemConstructorOptions[] {
     const { isTodosPanelVisible, isFeatureEnabledByUser } = this.stores.todos;
     const { intl } = window['ferdium'];
-    const menu = [];
 
+    const menu: MenuItemConstructorOptions[] = [];
     menu.push({
       label: intl.formatMessage(
         isFeatureEnabledByUser ? menuItems.disableTodos : menuItems.enableTodos,
@@ -1209,7 +1236,7 @@ class FranzMenu {
     return menu;
   }
 
-  debugMenu() {
+  debugMenu(): MenuItemConstructorOptions[] {
     const { intl } = window['ferdium'];
 
     return [
@@ -1233,9 +1260,8 @@ class FranzMenu {
       {
         label: intl.formatMessage(menuItems.publishDebugInfo),
         click: () => {
-          window[
-            'ferdium'
-          ].features.publishDebugInfo.state.isModalVisible = true;
+          window['ferdium'].features.publishDebugInfo.state.isModalVisible =
+            true;
         },
       },
     ];
@@ -1246,15 +1272,14 @@ class FranzMenu {
       return service.name;
     }
 
-    let { name } = service.recipe;
-
+    let { name: serviceName } = service.recipe;
     if (service.team) {
-      name = `${name} (${service.team})`;
+      serviceName = `${serviceName} (${service.team})`;
     } else if (service.customUrl) {
-      name = `${name} (${service.customUrl})`;
+      serviceName = `${serviceName} (${service.customUrl})`;
     }
 
-    return name;
+    return serviceName;
   }
 }
 
diff --git a/src/lib/Tray.js b/src/lib/Tray.ts
index fffdec64d..8e489edde 100644
--- a/src/lib/Tray.js
+++ b/src/lib/Tray.ts
@@ -7,6 +7,7 @@ import {
   Tray,
   ipcMain,
   BrowserWindow,
+  NativeImage,
 } from 'electron';
 import { join } from 'path';
 import macosVersion from 'macos-version';
@@ -19,56 +20,30 @@ const INDICATOR_TRAY_INDIRECT = 'tray-indirect';
 
 // TODO: Need to support i18n for a lot of the hard-coded strings in this file
 export default class TrayIcon {
-  trayIcon = null;
+  trayIcon: Tray | null = null;
 
-  indicator = 0;
+  indicator: string | number = 0;
 
-  themeChangeSubscriberId = null;
+  themeChangeSubscriberId: number | null = null;
 
-  trayMenu = null;
+  trayMenu: Menu | null = null;
 
   visible = false;
 
   isAppMuted = false;
 
-  mainWindow = null;
-
-  trayMenuTemplate = tray => [
-    {
-      label:
-        tray.mainWindow.isVisible() && tray.mainWindow.isFocused()
-          ? 'Hide Ferdium'
-          : 'Show Ferdium',
-      click() {
-        tray._toggleWindow();
-      },
-    },
-    {
-      label: tray.isAppMuted
-        ? 'Enable Notifications && Audio'
-        : 'Disable Notifications && Audio',
-      click() {
-        if (!tray.mainWindow) return;
-        tray.mainWindow.webContents.send('muteApp');
-      },
-    },
-    {
-      label: 'Quit Ferdium',
-      click() {
-        app.quit();
-      },
-    },
-  ];
+  mainWindow: BrowserWindow | null = null;
 
   constructor() {
-    ipcMain.on('initialAppSettings', (event, appSettings) => {
+    ipcMain.on('initialAppSettings', (_, appSettings) => {
       this._updateTrayMenu(appSettings);
     });
-    ipcMain.on('updateAppSettings', (event, appSettings) => {
+    ipcMain.on('updateAppSettings', (_, appSettings) => {
       this._updateTrayMenu(appSettings);
     });
 
-    this.mainWindow = BrowserWindow.getAllWindows()[0];
+    const [firstWindow] = BrowserWindow.getAllWindows();
+    this.mainWindow = firstWindow;
 
     // listen to window events to be able to set correct string
     // to tray menu ('Hide Ferdium' / 'Show Ferdium')
@@ -92,7 +67,36 @@ export default class TrayIcon {
     });
   }
 
-  _updateTrayMenu(appSettings) {
+  trayMenuTemplate(tray) {
+    return [
+      {
+        label:
+          tray.mainWindow.isVisible() && tray.mainWindow.isFocused()
+            ? 'Hide Ferdium'
+            : 'Show Ferdium',
+        click() {
+          tray._toggleWindow();
+        },
+      },
+      {
+        label: tray.isAppMuted
+          ? 'Enable Notifications && Audio'
+          : 'Disable Notifications && Audio',
+        click() {
+          if (!tray.mainWindow) return;
+          tray.mainWindow.webContents.send('muteApp');
+        },
+      },
+      {
+        label: 'Quit Ferdium',
+        click() {
+          app.quit();
+        },
+      },
+    ];
+  }
+
+  _updateTrayMenu(appSettings): void {
     if (!this.trayIcon) return;
 
     if (appSettings && appSettings.type === 'app') {
@@ -105,13 +109,15 @@ export default class TrayIcon {
     }
   }
 
-  show() {
+  show(): void {
     this.visible = true;
     this._show();
   }
 
-  _show() {
-    if (this.trayIcon) return;
+  _show(): void {
+    if (this.trayIcon) {
+      return;
+    }
 
     this.trayIcon = new Tray(this._getAsset('tray', INDICATOR_TRAY_PLAIN));
     this.trayIcon.setToolTip('Ferdium');
@@ -127,7 +133,9 @@ export default class TrayIcon {
 
     if (isMac || isWindows) {
       this.trayIcon.on('right-click', () => {
-        this.trayIcon.popUpContextMenu(this.trayMenu);
+        if (this.trayIcon && this.trayMenu) {
+          this.trayIcon.popUpContextMenu(this.trayMenu);
+        }
       });
     }
 
@@ -141,9 +149,11 @@ export default class TrayIcon {
     }
   }
 
-  _toggleWindow() {
-    const mainWindow = BrowserWindow.getAllWindows()[0];
-    if (!mainWindow) return;
+  _toggleWindow(): void {
+    const [mainWindow] = BrowserWindow.getAllWindows();
+    if (!mainWindow) {
+      return;
+    }
 
     if (mainWindow.isMinimized()) {
       mainWindow.restore();
@@ -161,12 +171,12 @@ export default class TrayIcon {
     }
   }
 
-  hide() {
+  hide(): void {
     this.visible = false;
     this._hide();
   }
 
-  _hide() {
+  _hide(): void {
     if (!this.trayIcon) return;
 
     this.trayIcon.destroy();
@@ -178,7 +188,7 @@ export default class TrayIcon {
     }
   }
 
-  recreateIfVisible() {
+  recreateIfVisible(): void {
     if (this.visible) {
       this._hide();
       setTimeout(() => {
@@ -189,23 +199,26 @@ export default class TrayIcon {
     }
   }
 
-  setIndicator(indicator) {
+  setIndicator(indicator: string | number): void {
     this.indicator = indicator;
     this._refreshIcon();
   }
 
-  _getAssetFromIndicator(indicator) {
+  _getAssetFromIndicator(indicator: string | number): string {
+    let assetFromIndicator = INDICATOR_TRAY_PLAIN;
     if (indicator === '•') {
-      return INDICATOR_TRAY_INDIRECT;
+      assetFromIndicator = INDICATOR_TRAY_INDIRECT;
     }
     if (indicator !== 0) {
-      return INDICATOR_TRAY_UNREAD;
+      assetFromIndicator = INDICATOR_TRAY_UNREAD;
     }
-    return INDICATOR_TRAY_PLAIN;
+    return assetFromIndicator;
   }
 
-  _refreshIcon() {
-    if (!this.trayIcon) return;
+  _refreshIcon(): void {
+    if (!this.trayIcon) {
+      return;
+    }
 
     this.trayIcon.setImage(
       this._getAsset('tray', this._getAssetFromIndicator(this.indicator)),
@@ -221,13 +234,14 @@ export default class TrayIcon {
     }
   }
 
-  _getAsset(type, asset) {
-    let { platform } = process;
+  _getAsset(type, asset): NativeImage {
+    const { platform } = process;
+    let platformPath: string = platform;
 
     if (isMac && macosVersion.isGreaterThanOrEqualTo('11')) {
-      platform = `${platform}-20`;
+      platformPath = `${platform}-20`;
     } else if (isMac && nativeTheme.shouldUseDarkColors) {
-      platform = `${platform}-dark`;
+      platformPath = `${platform}-dark`;
     }
 
     const trayImg = nativeImage.createFromPath(
@@ -237,7 +251,7 @@ export default class TrayIcon {
         'assets',
         'images',
         type,
-        platform,
+        platformPath,
         `${asset}.${FILE_EXTENSION}`,
       ),
     );