12 files changed, 330 insertions, 204 deletions

diff --git a/src/containers/auth/SetupAssistantScreen.tsx b/src/containers/auth/SetupAssistantScreen.tsx
index 44bd32772..8f1871776 100644
--- a/src/containers/auth/SetupAssistantScreen.tsx
+++ b/src/containers/auth/SetupAssistantScreen.tsx
@@ -11,22 +11,22 @@ import UserStore from '../../stores/UserStore';
 
 interface IProps {
   stores: {
-    services?: ServicesStore,
-    router: RouterStore,
-    recipes?: RecipesStore,
-    user?: UserStore,
-  },
+    services: ServicesStore;
+    router: RouterStore;
+    recipes?: RecipesStore;
+    user?: UserStore;
+  };
   actions: {
-    user: UserStore,
-    service: ServicesStore,
-    recipe: RecipesStore,
-  },
+    user: UserStore;
+    service: ServicesStore;
+    recipe: RecipesStore;
+  };
 };
 
 class SetupAssistantScreen extends Component<IProps> {
   state = {
     isSettingUpServices: false,
-  }
+  };
 
   // TODO: Why are these hardcoded here? Do they need to conform to specific services in the packaged recipes? If so, its more important to fix this
   services = {
@@ -69,7 +69,9 @@ class SetupAssistantScreen extends Component<IProps> {
   };
 
   async setupServices(serviceConfig) {
-    const { stores: { services, router } } = this.props;
+    const {
+      stores: { services, router },
+    } = this.props;
 
     this.setState({
       isSettingUpServices: true,
@@ -79,7 +81,7 @@ class SetupAssistantScreen extends Component<IProps> {
     for (const config of serviceConfig) {
       const serviceData = {
         name: this.services[config.id].name,
-        team: config.team
+        team: config.team,
       };
 
       await services._createService({
diff --git a/src/features/todos/store.js b/src/features/todos/store.js
index 9ece76327..8c3917cc3 100644
--- a/src/features/todos/store.js
+++ b/src/features/todos/store.js
@@ -18,7 +18,9 @@ import { createActionBindings } from '../utils/ActionBinding';
 import { IPC, TODOS_ROUTES } from './constants';
 import UserAgent from '../../models/UserAgent';
 
-const debug = require('../../preload-safe-debug')('Ferdium:feature:todos:store');
+const debug = require('../../preload-safe-debug')(
+  'Ferdium:feature:todos:store',
+);
 
 export default class TodoStore extends FeatureStore {
   @observable stores = null;
diff --git a/src/features/workspaces/models/Workspace.ts b/src/features/workspaces/models/Workspace.ts
index cd3918fba..bc636011d 100644
--- a/src/features/workspaces/models/Workspace.ts
+++ b/src/features/workspaces/models/Workspace.ts
@@ -9,7 +9,7 @@ export default class Workspace {
 
   @observable order = null;
 
-  @observable services = [];
+  @observable services: string[] = [];
 
   @observable userId = null;
 
diff --git a/src/index.ts b/src/index.ts
index fa957bf10..0fccac6e9 100644
--- a/src/index.ts
+++ b/src/index.ts
@@ -30,7 +30,7 @@ import {
   userDataRecipesPath,
   userDataPath,
 } from './environment-remote';
-import { ifUndefinedBoolean } from './jsUtils';
+import { ifUndefined } from './jsUtils';
 
 import { mainIpcHandler as basicAuthHandler } from './features/basicAuth';
 import ipcApi from './electron/ipc-api';
@@ -91,7 +91,7 @@ const settings = new Settings('app', DEFAULT_APP_SETTINGS);
 const proxySettings = new Settings('proxy');
 
 const retrieveSettingValue = (key: string, defaultValue: boolean) =>
-  ifUndefinedBoolean(settings.get(key), defaultValue);
+  ifUndefined<boolean>(settings.get(key), defaultValue);
 
 const liftSingleInstanceLock = retrieveSettingValue(
   'liftSingleInstanceLock',
diff --git a/src/jsUtils.test.ts b/src/jsUtils.test.ts
index 651caee5f..34cd8f098 100644
--- a/src/jsUtils.test.ts
+++ b/src/jsUtils.test.ts
@@ -18,36 +18,53 @@ describe('jsUtils', () => {
     });
   });
 
-  describe('ifUndefinedBoolean', () => {
+  describe('ifUndefined<string>', () => {
     it('returns the default value for undefined input', () => {
-      const result = jsUtils.ifUndefinedBoolean(undefined, false);
+      const result = jsUtils.ifUndefined<string>(undefined, 'abc');
+      expect(result).toEqual('abc');
+    });
+
+    it('returns the default value for null input', () => {
+      const result = jsUtils.ifUndefined<string>(null, 'abc');
+      expect(result).toEqual('abc');
+    });
+
+    it('returns the non-default input value for regular string input', () => {
+      const result = jsUtils.ifUndefined<string>('some random string', 'abc');
+      expect(result).toEqual('some random string');
+    });
+  });
+
+  describe('ifUndefined<boolean>', () => {
+    it('returns the default value for undefined input', () => {
+      const result = jsUtils.ifUndefined<boolean>(undefined, false);
       expect(result).toEqual(false);
     });
 
     it('returns the default value for null input', () => {
-      const result = jsUtils.ifUndefinedBoolean(null, true);
+      const result = jsUtils.ifUndefined<boolean>(null, true);
       expect(result).toEqual(true);
     });
 
     it('returns the non-default input value for regular boolean input', () => {
-      const result = jsUtils.ifUndefinedBoolean(true, false);
+      const result = jsUtils.ifUndefined<boolean>(true, false);
       expect(result).toEqual(true);
     });
   });
 
-  describe('ifUndefinedNumber', () => {
+  describe('ifUndefined<number>', () => {
     it('returns the default value for undefined input', () => {
-      const result = jsUtils.ifUndefinedNumber(undefined, 123);
+      const result = jsUtils.ifUndefined<number>(undefined, 123);
       expect(result).toEqual(123);
     });
 
     it('returns the default value for null input', () => {
-      const result = jsUtils.ifUndefinedNumber(null, 234);
+      const result = jsUtils.ifUndefined<number>(null, 234);
       expect(result).toEqual(234);
     });
 
     it('returns the non-default input value for regular Number input', () => {
-      const result = jsUtils.ifUndefinedNumber(1234, 5678);
+      const result = jsUtils.ifUndefined<number>(1234, 5678);
       expect(result).toEqual(1234);
     });
   });
@@ -70,10 +87,10 @@ describe('jsUtils', () => {
 
     it('returns the parsed JSON for the string input', () => {
       const result1 = jsUtils.convertToJSON('{"a":"b","c":"d"}');
-      expect(result1).toEqual({a: 'b', c: 'd'});
+      expect(result1).toEqual({ a: 'b', c: 'd' });
 
       const result2 = jsUtils.convertToJSON('[{"a":"b"},{"c":"d"}]');
-      expect(result2).toEqual([{a: 'b'}, {c: 'd'}]);
+      expect(result2).toEqual([{ a: 'b' }, { c: 'd' }]);
     });
   });
 
@@ -89,8 +106,8 @@ describe('jsUtils', () => {
     });
 
     it('returns cloned object for valid input', () => {
-      const result = jsUtils.cleanseJSObject([{a: 'b'}, {c: 'd'}]);
-      expect(result).toEqual([{a: 'b'}, {c: 'd'}]);
+      const result = jsUtils.cleanseJSObject([{ a: 'b' }, { c: 'd' }]);
+      expect(result).toEqual([{ a: 'b' }, { c: 'd' }]);
     });
   });
 });
diff --git a/src/jsUtils.ts b/src/jsUtils.ts
index 250d595eb..f5b39a000 100644
--- a/src/jsUtils.ts
+++ b/src/jsUtils.ts
@@ -1,9 +1,22 @@
-export const ifUndefinedString = (source: string | undefined | null, defaultValue: string): string => (source !== undefined && source !== null ? source : defaultValue);
+// TODO: ifUndefinedString can be removed after ./src/webview/recipe.js is converted to typescript.
+export const ifUndefinedString = (
+  source: string | undefined | null,
+  defaultValue: string,
+): string => (source !== undefined && source !== null ? source : defaultValue);
 
-export const ifUndefinedBoolean = (source: boolean | undefined | null, defaultValue: boolean): boolean => Boolean(source !== undefined && source !== null ? source : defaultValue);
+export const ifUndefined = <T>(
+  source: undefined | null | T,
+  defaultValue: T,
+): T => {
+  if (source !== undefined && source !== null) {
+    return source;
+  }
 
-export const ifUndefinedNumber = (source: number | undefined | null, defaultValue: number): number => Number(source !== undefined && source !== null ? source : defaultValue);
+  return defaultValue;
+};
 
-export const convertToJSON = (data: string | any | undefined | null) => data && typeof data === 'string' && data.length > 0 ? JSON.parse(data) : data
+export const convertToJSON = (data: string | any | undefined | null) =>
+  data && typeof data === 'string' && data.length > 0 ? JSON.parse(data) : data;
 
-export const cleanseJSObject = (data: any | undefined | null) => JSON.parse(JSON.stringify(data))
+export const cleanseJSObject = (data: any | undefined | null) =>
+  JSON.parse(JSON.stringify(data));
diff --git a/src/models/Recipe.ts b/src/models/Recipe.ts
index be889d22c..eb8b0b1ff 100644
--- a/src/models/Recipe.ts
+++ b/src/models/Recipe.ts
@@ -2,7 +2,7 @@ import semver from 'semver';
 import { pathExistsSync } from 'fs-extra';
 import { join } from 'path';
 import { DEFAULT_SERVICE_SETTINGS } from '../config';
-import { ifUndefinedString, ifUndefinedBoolean } from '../jsUtils';
+import { ifUndefined } from '../jsUtils';
 
 interface IRecipe {
   id: string;
@@ -34,7 +34,7 @@ export default class Recipe {
 
   name: string = '';
 
-  description = '';
+  description: string = '';
 
   version: string = '';
 
@@ -75,6 +75,19 @@ export default class Recipe {
   // TODO: Is this being used?
   local: boolean = false;
 
+  // TODO Add types for this once we know if they are neccesary to pass
+  // on to the initialize-recipe ipc event.
+  overrideUserAgent: any;
+
+  buildUrl: any;
+
+  modifyRequestHeaders: any;
+
+  knownCertificateHosts: any;
+
+  events: any;
+  // End todo.
+
   // TODO: Need to reconcile which of these are optional/mandatory
   constructor(data: IRecipe) {
     if (!data) {
@@ -93,61 +106,64 @@ export default class Recipe {
     }
 
     // from the recipe
-    this.id = ifUndefinedString(data.id, this.id);
-    this.name = ifUndefinedString(data.name, this.name);
-    this.version = ifUndefinedString(data.version, this.version);
+    this.id = ifUndefined<string>(data.id, this.id);
+    this.name = ifUndefined<string>(data.name, this.name);
+    this.version = ifUndefined<string>(data.version, this.version);
     this.aliases = data.aliases || this.aliases;
-    this.serviceURL = ifUndefinedString(
+    this.serviceURL = ifUndefined<string>(
       data.config.serviceURL,
       this.serviceURL,
     );
-    this.hasDirectMessages = ifUndefinedBoolean(
+    this.hasDirectMessages = ifUndefined<boolean>(
       data.config.hasDirectMessages,
       this.hasDirectMessages,
     );
-    this.hasIndirectMessages = ifUndefinedBoolean(
+    this.hasIndirectMessages = ifUndefined<boolean>(
       data.config.hasIndirectMessages,
       this.hasIndirectMessages,
     );
-    this.hasNotificationSound = ifUndefinedBoolean(
+    this.hasNotificationSound = ifUndefined<boolean>(
       data.config.hasNotificationSound,
       this.hasNotificationSound,
     );
-    this.hasTeamId = ifUndefinedBoolean(data.config.hasTeamId, this.hasTeamId);
-    this.hasCustomUrl = ifUndefinedBoolean(
+    this.hasTeamId = ifUndefined<boolean>(
+      data.config.hasTeamId,
+      this.hasTeamId,
+    );
+    this.hasCustomUrl = ifUndefined<boolean>(
       data.config.hasCustomUrl,
       this.hasCustomUrl,
     );
-    this.hasHostedOption = ifUndefinedBoolean(
+    this.hasHostedOption = ifUndefined<boolean>(
       data.config.hasHostedOption,
       this.hasHostedOption,
     );
-    this.urlInputPrefix = ifUndefinedString(
+    this.urlInputPrefix = ifUndefined<string>(
       data.config.urlInputPrefix,
       this.urlInputPrefix,
     );
-    this.urlInputSuffix = ifUndefinedString(
+    this.urlInputSuffix = ifUndefined<string>(
       data.config.urlInputSuffix,
       this.urlInputSuffix,
     );
-    this.disablewebsecurity = ifUndefinedBoolean(
+    this.disablewebsecurity = ifUndefined<boolean>(
       data.config.disablewebsecurity,
       this.disablewebsecurity,
     );
-    this.autoHibernate = ifUndefinedBoolean(
+    this.autoHibernate = ifUndefined<boolean>(
       data.config.autoHibernate,
       this.autoHibernate,
     );
-    this.local = ifUndefinedBoolean(data.config.local, this.local);
-    this.message = ifUndefinedString(data.config.message, this.message);
-    this.allowFavoritesDelineationInUnreadCount = ifUndefinedBoolean(
+    this.local = ifUndefined<boolean>(data.config.local, this.local);
+    this.message = ifUndefined<string>(data.config.message, this.message);
+    this.allowFavoritesDelineationInUnreadCount = ifUndefined<boolean>(
       data.config.allowFavoritesDelineationInUnreadCount,
       this.allowFavoritesDelineationInUnreadCount,
     );
 
     // computed
     this.path = data.path;
-    this.partition = ifUndefinedString(data.config.partition, this.partition);
+    this.partition = ifUndefined<string>(data.config.partition, this.partition);
   }
 
   // TODO: Need to remove this if its not used anywhere
diff --git a/src/models/Service.js b/src/models/Service.ts
index 53285e440..c4165e59a 100644
--- a/src/models/Service.js
+++ b/src/models/Service.ts
@@ -3,114 +3,121 @@ import { ipcRenderer } from 'electron';
 import { webContents } from '@electron/remote';
 import normalizeUrl from 'normalize-url';
 import { join } from 'path';
+import ElectronWebView from 'react-electron-web-view';
 
 import { todosStore } from '../features/todos';
 import { isValidExternalURL } from '../helpers/url-helpers';
 import UserAgent from './UserAgent';
 import { DEFAULT_SERVICE_ORDER } from '../config';
-import {
-  ifUndefinedString,
-  ifUndefinedBoolean,
-  ifUndefinedNumber,
-} from '../jsUtils';
+import { ifUndefined } from '../jsUtils';
+import Recipe from './Recipe';
 
 const debug = require('../preload-safe-debug')('Ferdium:Service');
 
 // TODO: Shouldn't most of these values default to what's defined in DEFAULT_SERVICE_SETTINGS?
 export default class Service {
-  id = '';
+  id: string = '';
 
-  recipe = null;
+  recipe: Recipe;
 
-  _webview = null;
+  _webview: ElectronWebView | null = null;
 
-  timer = null;
+  timer: NodeJS.Timeout | null = null;
 
   events = {};
 
-  @observable isAttached = false;
+  @observable isAttached: boolean = false;
 
-  @observable isActive = false; // Is current webview active
+  @observable isActive: boolean = false; // Is current webview active
 
-  @observable name = '';
+  @observable name: string = '';
 
-  @observable unreadDirectMessageCount = 0;
+  @observable unreadDirectMessageCount: number = 0;
 
-  @observable unreadIndirectMessageCount = 0;
+  @observable unreadIndirectMessageCount: number = 0;
 
-  @observable dialogTitle = '';
+  @observable dialogTitle: string = '';
 
-  @observable order = DEFAULT_SERVICE_ORDER;
+  @observable order: number = DEFAULT_SERVICE_ORDER;
 
-  @observable isEnabled = true;
+  @observable isEnabled: boolean = true;
 
-  @observable isMuted = false;
+  @observable isMuted: boolean = false;
 
-  @observable team = '';
+  @observable team: string = '';
 
-  @observable customUrl = '';
+  @observable customUrl: string = '';
 
-  @observable isNotificationEnabled = true;
+  @observable isNotificationEnabled: boolean = true;
 
-  @observable isBadgeEnabled = true;
+  @observable isBadgeEnabled: boolean = true;
 
-  @observable trapLinkClicks = false;
+  @observable trapLinkClicks: boolean = false;
 
-  @observable isIndirectMessageBadgeEnabled = true;
+  @observable isIndirectMessageBadgeEnabled: boolean = true;
 
-  @observable iconUrl = '';
+  @observable iconUrl: string = '';
 
-  @observable hasCustomUploadedIcon = false;
+  @observable customIconUrl: string = '';
 
-  @observable hasCrashed = false;
+  @observable hasCustomUploadedIcon: boolean = false;
 
-  @observable isDarkModeEnabled = false;
+  @observable hasCrashed: boolean = false;
 
-  @observable isProgressbarEnabled = true;
+  @observable isDarkModeEnabled: boolean = false;
 
-  @observable darkReaderSettings = { brightness: 100, contrast: 90, sepia: 10 };
+  @observable isProgressbarEnabled: boolean = true;
 
-  @observable spellcheckerLanguage = null;
+  @observable darkReaderSettings: object = {
+    brightness: 100,
+    contrast: 90,
+    sepia: 10,
+  };
 
-  @observable isFirstLoad = true;
+  @observable spellcheckerLanguage: string | null = null;
 
-  @observable isLoading = true;
+  @observable isFirstLoad: boolean = true;
 
-  @observable isLoadingPage = true;
+  @observable isLoading: boolean = true;
 
-  @observable isError = false;
+  @observable isLoadingPage: boolean = true;
 
-  @observable errorMessage = '';
+  @observable isError: boolean = false;
 
-  @observable isUsingCustomUrl = false;
+  @observable errorMessage: string = '';
 
-  @observable isServiceAccessRestricted = false;
+  @observable isUsingCustomUrl: boolean = false;
 
+  @observable isServiceAccessRestricted: boolean = false;
+
+  // todo is this used?
   @observable restrictionType = null;
 
-  @observable isHibernationEnabled = false;
+  @observable isHibernationEnabled: boolean = false;
+
+  @observable isWakeUpEnabled: boolean = true;
 
-  @observable isWakeUpEnabled = true;
+  @observable isHibernationRequested: boolean = false;
 
-  @observable isHibernationRequested = false;
+  @observable onlyShowFavoritesInUnreadCount: boolean = false;
 
-  @observable onlyShowFavoritesInUnreadCount = false;
+  @observable lastUsed: number = Date.now(); // timestamp
 
-  @observable lastUsed = Date.now(); // timestamp
+  @observable lastHibernated: number | null = null; // timestamp
 
-  @observable lastHibernated = null; // timestamp
+  @observable lastPoll: number = Date.now();
 
-  @observable lastPoll = Date.now();
+  @observable lastPollAnswer: number = Date.now();
 
-  @observable lastPollAnswer = Date.now();
+  @observable lostRecipeConnection: boolean = false;
 
-  @observable lostRecipeConnection = false;
+  @observable lostRecipeReloadAttempt: number = 0;
 
-  @observable lostRecipeReloadAttempt = 0;
+  @observable userAgentModel: UserAgent;
 
-  @observable userAgentModel = null;
+  @observable proxy: string | null = null;
 
-  constructor(data, recipe) {
+  constructor(data, recipe: Recipe) {
     if (!data) {
       throw new Error('Service config not valid');
     }
@@ -123,64 +130,64 @@ export default class Service {
 
     this.userAgentModel = new UserAgent(recipe.overrideUserAgent);
 
-    this.id = ifUndefinedString(data.id, this.id);
-    this.name = ifUndefinedString(data.name, this.name);
-    this.team = ifUndefinedString(data.team, this.team);
-    this.customUrl = ifUndefinedString(data.customUrl, this.customUrl);
-    this.iconUrl = ifUndefinedString(data.iconUrl, this.iconUrl);
-    this.order = ifUndefinedNumber(data.order, this.order);
-    this.isEnabled = ifUndefinedBoolean(data.isEnabled, this.isEnabled);
-    this.isNotificationEnabled = ifUndefinedBoolean(
+    this.id = ifUndefined<string>(data.id, this.id);
+    this.name = ifUndefined<string>(data.name, this.name);
+    this.team = ifUndefined<string>(data.team, this.team);
+    this.customUrl = ifUndefined<string>(data.customUrl, this.customUrl);
+    this.iconUrl = ifUndefined<string>(data.iconUrl, this.iconUrl);
+    this.order = ifUndefined<number>(data.order, this.order);
+    this.isEnabled = ifUndefined<boolean>(data.isEnabled, this.isEnabled);
+    this.isNotificationEnabled = ifUndefined<boolean>(
       data.isNotificationEnabled,
       this.isNotificationEnabled,
     );
-    this.isBadgeEnabled = ifUndefinedBoolean(
+    this.isBadgeEnabled = ifUndefined<boolean>(
       data.isBadgeEnabled,
       this.isBadgeEnabled,
     );
-    this.trapLinkClicks = ifUndefinedBoolean(
+    this.trapLinkClicks = ifUndefined<boolean>(
       data.trapLinkClicks,
       this.trapLinkClicks,
     );
-    this.isIndirectMessageBadgeEnabled = ifUndefinedBoolean(
+    this.isIndirectMessageBadgeEnabled = ifUndefined<boolean>(
       data.isIndirectMessageBadgeEnabled,
       this.isIndirectMessageBadgeEnabled,
     );
-    this.isMuted = ifUndefinedBoolean(data.isMuted, this.isMuted);
-    this.isDarkModeEnabled = ifUndefinedBoolean(
+    this.isMuted = ifUndefined<boolean>(data.isMuted, this.isMuted);
+    this.isDarkModeEnabled = ifUndefined<boolean>(
       data.isDarkModeEnabled,
       this.isDarkModeEnabled,
     );
-    this.darkReaderSettings = ifUndefinedString(
+    this.darkReaderSettings = ifUndefined<object>(
       data.darkReaderSettings,
       this.darkReaderSettings,
     );
-    this.isProgressbarEnabled = ifUndefinedBoolean(
+    this.isProgressbarEnabled = ifUndefined<boolean>(
       data.isProgressbarEnabled,
       this.isProgressbarEnabled,
     );
-    this.hasCustomUploadedIcon = ifUndefinedBoolean(
+    this.hasCustomUploadedIcon = ifUndefined<boolean>(
       data.iconId?.length > 0,
       this.hasCustomUploadedIcon,
     );
-    this.onlyShowFavoritesInUnreadCount = ifUndefinedBoolean(
+    this.onlyShowFavoritesInUnreadCount = ifUndefined<boolean>(
       data.onlyShowFavoritesInUnreadCount,
       this.onlyShowFavoritesInUnreadCount,
     );
-    this.proxy = ifUndefinedString(data.proxy, this.proxy);
-    this.spellcheckerLanguage = ifUndefinedString(
+    this.proxy = ifUndefined<string | null>(data.proxy, this.proxy);
+    this.spellcheckerLanguage = ifUndefined<string | null>(
       data.spellcheckerLanguage,
       this.spellcheckerLanguage,
     );
-    this.userAgentPref = ifUndefinedString(
+    this.userAgentPref = ifUndefined<string | null>(
       data.userAgentPref,
       this.userAgentPref,
     );
-    this.isHibernationEnabled = ifUndefinedBoolean(
+    this.isHibernationEnabled = ifUndefined<boolean>(
       data.isHibernationEnabled,
       this.isHibernationEnabled,
     );
-    this.isWakeUpEnabled = ifUndefinedBoolean(
+    this.isWakeUpEnabled = ifUndefined<boolean>(
       data.isWakeUpEnabled,
       this.isWakeUpEnabled,
     );
@@ -195,7 +202,7 @@ export default class Service {
       this.isHibernationRequested = true;
     }
 
-    autorun(() => {
+    autorun((): void => {
       if (!this.isEnabled) {
         this.webview = null;
         this.isAttached = false;
@@ -209,7 +216,7 @@ export default class Service {
     });
   }
 
-  @computed get shareWithWebview() {
+  @computed get shareWithWebview(): object {
     return {
       id: this.id,
       spellcheckerLanguage: this.spellcheckerLanguage,
@@ -224,19 +231,19 @@ export default class Service {
     };
   }
 
-  @computed get isTodosService() {
+  @computed get isTodosService(): boolean {
     return this.recipe.id === todosStore.todoRecipeId;
   }
 
-  @computed get canHibernate() {
+  @computed get canHibernate(): boolean {
     return this.isHibernationEnabled;
   }
 
-  @computed get isHibernating() {
+  @computed get isHibernating(): boolean {
     return this.canHibernate && this.isHibernationRequested;
   }
 
-  get webview() {
+  get webview(): ElectronWebView | null {
     if (this.isTodosService) {
       return todosStore.webview;
     }
@@ -248,9 +255,9 @@ export default class Service {
     this._webview = webview;
   }
 
-  @computed get url() {
+  @computed get url(): string {
     if (this.recipe.hasCustomUrl && this.customUrl) {
-      let url;
+      let url: string = '';
       try {
         url = normalizeUrl(this.customUrl, {
           stripAuthentication: false,
@@ -277,7 +284,7 @@ export default class Service {
     return this.recipe.serviceURL;
   }
 
-  @computed get icon() {
+  @computed get icon(): string {
     if (this.iconUrl) {
       return this.iconUrl;
     }
@@ -285,15 +292,15 @@ export default class Service {
     return join(this.recipe.path, 'icon.svg');
   }
 
-  @computed get hasCustomIcon() {
+  @computed get hasCustomIcon(): boolean {
     return Boolean(this.iconUrl);
   }
 
-  @computed get userAgent() {
+  @computed get userAgent(): string {
     return this.userAgentModel.userAgent;
   }
 
-  @computed get userAgentPref() {
+  @computed get userAgentPref(): string | null {
     return this.userAgentModel.userAgentPref;
   }
 
@@ -301,15 +308,15 @@ export default class Service {
     this.userAgentModel.userAgentPref = pref;
   }
 
-  @computed get defaultUserAgent() {
+  @computed get defaultUserAgent(): String {
     return this.userAgentModel.defaultUserAgent;
   }
 
-  @computed get partition() {
+  @computed get partition(): string {
     return this.recipe.partition || `persist:service-${this.id}`;
   }
 
-  initializeWebViewEvents({ handleIPCMessage, openWindow, stores }) {
+  initializeWebViewEvents({ handleIPCMessage, openWindow, stores }): void {
     const webviewWebContents = webContents.fromId(
       this.webview.getWebContentsId(),
     );
@@ -401,6 +408,7 @@ export default class Service {
       this.isLoadingPage = false;
     });
 
+    // eslint-disable-next-line unicorn/consistent-function-scoping
     const didLoad = () => {
       this.isLoading = false;
       this.isLoadingPage = false;
@@ -437,7 +445,7 @@ export default class Service {
       this.webview.send('found-in-page', result);
     });
 
-    webviewWebContents.on('login', (event, request, authInfo, callback) => {
+    webviewWebContents.on('login', (event, _, authInfo, callback) => {
       // const authCallback = callback;
       debug('browser login event', authInfo);
       event.preventDefault();
@@ -460,7 +468,7 @@ export default class Service {
     });
   }
 
-  initializeWebViewListener() {
+  initializeWebViewListener(): void {
     if (this.webview && this.recipe.events) {
       for (const eventName of Object.keys(this.recipe.events)) {
         const eventHandler = this.recipe[this.recipe.events[eventName]];
@@ -471,7 +479,7 @@ export default class Service {
     }
   }
 
-  resetMessageCount() {
+  resetMessageCount(): void {
     this.unreadDirectMessageCount = 0;
     this.unreadIndirectMessageCount = 0;
   }
diff --git a/src/models/UserAgent.js b/src/models/UserAgent.ts
index 3e1394b45..1d06d72b0 100644
--- a/src/models/UserAgent.js
+++ b/src/models/UserAgent.ts
@@ -1,25 +1,28 @@
 import { action, computed, observe, observable } from 'mobx';
 
+import ElectronWebView from 'react-electron-web-view';
 import defaultUserAgent from '../helpers/userAgent-helpers';
 
 const debug = require('../preload-safe-debug')('Ferdium:UserAgent');
 
 export default class UserAgent {
-  _willNavigateListener = null;
+  // eslint-disable-next-line @typescript-eslint/no-unused-vars
+  _willNavigateListener = (_event: any): void => {};
 
-  _didNavigateListener = null;
+  // eslint-disable-next-line @typescript-eslint/no-unused-vars
+  _didNavigateListener = (_event: any): void => {};
 
-  @observable.ref webview = null;
+  @observable.ref webview: ElectronWebView = null;
 
-  @observable chromelessUserAgent = false;
+  @observable chromelessUserAgent: boolean = false;
 
-  @observable userAgentPref = null;
+  @observable userAgentPref: string | null = null;
 
-  @observable getUserAgent = null;
+  @observable overrideUserAgent = (): string => '';
 
-  constructor(overrideUserAgent = null) {
+  constructor(overrideUserAgent: any = null) {
     if (typeof overrideUserAgent === 'function') {
-      this.getUserAgent = overrideUserAgent;
+      this.overrideUserAgent = overrideUserAgent;
     }
 
     observe(this, 'webview', change => {
@@ -33,10 +36,12 @@ export default class UserAgent {
     });
   }
 
-  @computed get defaultUserAgent() {
-    if (typeof this.getUserAgent === 'function') {
-      return this.getUserAgent();
+  @computed get defaultUserAgent(): string {
+    const replacedUserAgent = this.overrideUserAgent();
+    if (replacedUserAgent.length > 0) {
+      return replacedUserAgent;
     }
+
     const globalPref = window['ferdium'].stores.settings.all.app.userAgentPref;
     if (typeof globalPref === 'string') {
       const trimmed = globalPref.trim();
@@ -47,7 +52,7 @@ export default class UserAgent {
     return defaultUserAgent();
   }
 
-  @computed get serviceUserAgentPref() {
+  @computed get serviceUserAgentPref(): string | null {
     if (typeof this.userAgentPref === 'string') {
       const trimmed = this.userAgentPref.trim();
       if (trimmed !== '') {
@@ -57,12 +62,12 @@ export default class UserAgent {
     return null;
   }
 
-  @computed get userAgentWithoutChromeVersion() {
+  @computed get userAgentWithoutChromeVersion(): string {
     const withChrome = this.defaultUserAgent;
     return withChrome.replace(/Chrome\/[\d.]+/, 'Chrome');
   }
 
-  @computed get userAgent() {
+  @computed get userAgent(): string {
     return (
       this.serviceUserAgentPref ||
       (this.chromelessUserAgent
@@ -71,11 +76,11 @@ export default class UserAgent {
     );
   }
 
-  @action setWebviewReference(webview) {
+  @action setWebviewReference(webview: ElectronWebView): void {
     this.webview = webview;
   }
 
-  @action _handleNavigate(url, forwardingHack = false) {
+  @action _handleNavigate(url: string, forwardingHack: boolean = false): void {
     if (url.startsWith('https://accounts.google.com')) {
       if (!this.chromelessUserAgent) {
         debug('Setting user agent to chromeless for url', url);
@@ -92,7 +97,7 @@ export default class UserAgent {
     }
   }
 
-  _addWebviewEvents(webview) {
+  _addWebviewEvents(webview: ElectronWebView): void {
     debug('Adding event handlers');
 
     this._willNavigateListener = event => this._handleNavigate(event.url, true);
@@ -102,7 +107,7 @@ export default class UserAgent {
     webview.addEventListener('did-navigate', this._didNavigateListener);
   }
 
-  _removeWebviewEvents(webview) {
+  _removeWebviewEvents(webview: ElectronWebView): void {
     debug('Removing event handlers');
 
     webview.removeEventListener('will-navigate', this._willNavigateListener);
diff --git a/src/stores.types.ts b/src/stores.types.ts
index 462d862d9..24eefc416 100644
--- a/src/stores.types.ts
+++ b/src/stores.types.ts
@@ -76,25 +76,34 @@ interface TypedStore {
 
 interface AppStore extends TypedStore {
   accentColor: string;
+  adaptableDarkMode: boolean;
   progressbarAccentColor: string;
   authRequestFailed: () => void;
   autoLaunchOnStart: () => void;
   automaticUpdates: boolean;
   clearAppCacheRequest: () => void;
+  clipboardNotifications: boolean;
+  darkMode: boolean;
   dictionaries: [];
+  enableSpellchecking: boolean;
   fetchDataInterval: 4;
   get(key: string): any;
   getAppCacheSizeRequest: () => void;
   healthCheckRequest: () => void;
   isClearingAllCache: () => void;
+  isAppMuted: boolean;
   isFocused: () => void;
   isFullScreen: () => void;
-  isOnline: () => void;
+  isOnline: boolean;
   isSystemDarkModeEnabled: () => void;
   isSystemMuteOverridden: () => void;
   locale: () => void;
   reloadAfterResume: boolean;
   reloadAfterResumeTime: number;
+  searchEngine: string;
+  spellcheckerLanguage: string;
+  splitMode: boolean;
+  splitColumns: number;
   timeOfflineStart: () => void;
   timeSuspensionStart: () => void;
   updateStatus: () => void;
@@ -105,6 +114,7 @@ interface AppStore extends TypedStore {
     DOWNLOADED: 'DOWNLOADED';
     FAILED: 'FAILED';
   };
+  universalDarkMode: boolean;
   cacheSize: () => void;
   debugInfo: () => void;
 }
@@ -145,7 +155,9 @@ interface RecipeStore extends TypedStore {
   isInstalled: (id: string) => boolean;
   active: () => void;
   all: Recipe[];
+  one: (id: string) => Recipe;
   recipeIdForServices: () => void;
+  _install({ recipeId: string }): Promise<Recipe>;
 }
 
 interface RequestsStore extends TypedStore {
@@ -183,7 +195,7 @@ export interface ServicesStore extends TypedStore {
   createServiceRequest: () => void;
   deleteServiceRequest: () => void;
   allServicesRequest: CachedRequest;
-  filterNeedle: () => void;
+  filterNeedle: string;
   lastUsedServices: () => void;
   reorderServicesRequest: () => void;
   serviceMaintenanceTick: () => void;
@@ -237,7 +249,9 @@ interface TodosStore extends TypedStore {
   isTodosPanelForceHidden: () => void;
   isTodosPanelVisible: () => void;
   isUsingPredefinedTodoServer: () => void;
-  settings: () => void;
+  settings: {
+    isFeatureEnabledByUser: boolean;
+  };
   todoRecipeId: () => void;
   todoUrl: () => void;
   userAgent: () => void;
@@ -256,7 +270,7 @@ interface UIStore extends TypedStore {
   isDarkThemeActive: () => void;
   isSplitModeActive: () => void;
   splitColumnsNo: () => void;
-  showMessageBadgesEvenWhenMuted: () => void;
+  showMessageBadgesEvenWhenMuted: boolean;
   theme: () => void;
 }
 
@@ -315,12 +329,21 @@ export interface WorkspacesStore extends TypedStore {
   saving: boolean;
   filterServicesByActiveWorkspace: () => void;
   isFeatureActive: () => void;
+  isAnyWorkspaceActive: boolean;
   isSettingsRouteActive: () => void;
   isSwitchingWorkspace: () => void;
   isWorkspaceDrawerOpen: () => void;
   nextWorkspace: () => void;
   workspaces: Workspace[];
   workspaceBeingEdited: () => void;
+  reorderServicesOfActiveWorkspace: ({
+    oldIndex,
+    newIndex,
+  }: {
+    oldIndex: string;
+    newIndex: string;
+  }) => void;
+  settings: any;
   _activateLastUsedWorkspaceReaction: () => void;
   _allActions: any[];
   _allReactions: any[];
diff --git a/src/stores/ServicesStore.js b/src/stores/ServicesStore.ts
index 999b48d92..caa44146f 100644
--- a/src/stores/ServicesStore.js
+++ b/src/stores/ServicesStore.ts
@@ -5,7 +5,9 @@ import ms from 'ms';
 import { ensureFileSync, pathExistsSync, writeFileSync } from 'fs-extra';
 import { join } from 'path';
 
-import Store from './lib/Store';
+import { Stores } from 'src/stores.types';
+import { ApiInterface } from 'src/api';
+import { Actions } from 'src/actions/lib/actions';
 import Request from './lib/Request';
 import CachedRequest from './lib/CachedRequest';
 import { matchRoute } from '../helpers/routing-helpers';
@@ -14,39 +16,56 @@ import {
   getRecipeDirectory,
   getDevRecipeDirectory,
 } from '../helpers/recipe-helpers';
+import Service from '../models/Service';
 import { workspaceStore } from '../features/workspaces';
 import { DEFAULT_SERVICE_SETTINGS, KEEP_WS_LOADED_USID } from '../config';
 import { cleanseJSObject } from '../jsUtils';
 import { SPELLCHECKER_LOCALES } from '../i18n/languages';
 import { ferdiumVersion } from '../environment-remote';
+import TypedStore from './lib/TypedStore';
 
 const debug = require('../preload-safe-debug')('Ferdium:ServiceStore');
 
-export default class ServicesStore extends Store {
-  @observable allServicesRequest = new CachedRequest(this.api.services, 'all');
+export default class ServicesStore extends TypedStore {
+  @observable allServicesRequest: CachedRequest = new CachedRequest(
+    this.api.services,
+    'all',
+  );
 
-  @observable createServiceRequest = new Request(this.api.services, 'create');
+  @observable createServiceRequest: Request = new Request(
+    this.api.services,
+    'create',
+  );
 
-  @observable updateServiceRequest = new Request(this.api.services, 'update');
+  @observable updateServiceRequest: Request = new Request(
+    this.api.services,
+    'update',
+  );
 
-  @observable reorderServicesRequest = new Request(
+  @observable reorderServicesRequest: Request = new Request(
     this.api.services,
     'reorder',
   );
 
-  @observable deleteServiceRequest = new Request(this.api.services, 'delete');
+  @observable deleteServiceRequest: Request = new Request(
+    this.api.services,
+    'delete',
+  );
 
-  @observable clearCacheRequest = new Request(this.api.services, 'clearCache');
+  @observable clearCacheRequest: Request = new Request(
+    this.api.services,
+    'clearCache',
+  );
 
-  @observable filterNeedle = null;
+  @observable filterNeedle: string | null = null;
 
   // Array of service IDs that have recently been used
   // [0] => Most recent, [n] => Least recent
   // No service ID should be in the list multiple times, not all service IDs have to be in the list
-  @observable lastUsedServices = [];
+  @observable lastUsedServices: string[] = [];
 
-  constructor(...args) {
-    super(...args);
+  constructor(stores: Stores, api: ApiInterface, actions: Actions) {
+    super(stores, api, actions);
 
     // Register action handlers
     this.actions.service.setActive.listen(this._setActive.bind(this));
@@ -207,14 +226,16 @@ export default class ServicesStore extends Store {
     this.serviceMaintenanceTick.cancel();
   }
 
-  /**
-   * Сheck for services to become hibernated.
-   */
-  serviceMaintenanceTick = debounce(() => {
+  _serviceMaintenanceTicker() {
     this._serviceMaintenance();
     this.serviceMaintenanceTick();
     debug('Service maintenance tick');
-  }, ms('10s'));
+  }
+
+  /**
+   * Сheck for services to become hibernated.
+   */
+  serviceMaintenanceTick = debounce(this._serviceMaintenanceTicker, ms('10s'));
 
   /**
    * Run various maintenance tasks on services
@@ -271,7 +292,7 @@ export default class ServicesStore extends Store {
   }
 
   // Computed props
-  @computed get all() {
+  @computed get all(): Service[] {
     if (this.stores.user.isLoggedIn) {
       const services = this.allServicesRequest.execute().result;
       if (services) {
@@ -289,7 +310,7 @@ export default class ServicesStore extends Store {
     return [];
   }
 
-  @computed get enabled() {
+  @computed get enabled(): Service[] {
     return this.all.filter(service => service.isEnabled);
   }
 
@@ -344,9 +365,14 @@ export default class ServicesStore extends Store {
   }
 
   @computed get filtered() {
-    return this.all.filter(service =>
-      service.name.toLowerCase().includes(this.filterNeedle.toLowerCase()),
-    );
+    if (this.filterNeedle !== null) {
+      return this.all.filter(service =>
+        service.name.toLowerCase().includes(this.filterNeedle!.toLowerCase()),
+      );
+    }
+
+    // Return all if there is no filterNeedle present
+    return this.all;
   }
 
   @computed get active() {
@@ -382,8 +408,9 @@ export default class ServicesStore extends Store {
     return this.active && this.active.isTodosService;
   }
 
-  one(id) {
-    return this.all.find(service => service.id === id);
+  // TODO: This can actually return undefined as well
+  one(id: string): Service {
+    return this.all.find(service => service.id === id) as Service;
   }
 
   async _showAddServiceInterface({ recipeId }) {
@@ -449,7 +476,11 @@ export default class ServicesStore extends Store {
 
   @action async _createFromLegacyService({ data }) {
     const { id } = data.recipe;
-    const serviceData = {};
+    const serviceData: {
+      name?: string;
+      team?: string;
+      customUrl?: string;
+    } = {};
 
     if (data.name) {
       serviceData.name = data.name;
@@ -530,7 +561,7 @@ export default class ServicesStore extends Store {
     }
   }
 
-  @action async _deleteService({ serviceId, redirect }) {
+  @action async _deleteService({ serviceId, redirect }): Promise<void> {
     const request = this.deleteServiceRequest.execute(serviceId);
 
     if (redirect) {
@@ -538,14 +569,14 @@ export default class ServicesStore extends Store {
     }
 
     this.allServicesRequest.patch(result => {
-      remove(result, c => c.id === serviceId);
+      remove(result, (c: Service) => c.id === serviceId);
     });
 
     await request._promise;
     this.actionStatus = request.result.status;
   }
 
-  @action async _openRecipeFile({ recipe, file }) {
+  @action async _openRecipeFile({ recipe, file }): Promise<void> {
     // Get directory for recipe
     const normalDirectory = getRecipeDirectory(recipe);
     const devDirectory = getDevRecipeDirectory(recipe);
@@ -702,7 +733,7 @@ export default class ServicesStore extends Store {
             setTimeout(() => {
               document
                 .querySelector('.services__webview-wrapper.is-active')
-                .scrollIntoView({
+                ?.scrollIntoView({
                   behavior: 'smooth',
                   block: 'end',
                   inline: 'nearest',
@@ -1046,7 +1077,13 @@ export default class ServicesStore extends Store {
     service.lastHibernated = Date.now();
   }
 
-  @action _awake({ serviceId, automatic }) {
+  @action _awake({
+    serviceId,
+    automatic,
+  }: {
+    serviceId: string;
+    automatic?: boolean;
+  }) {
     const now = Date.now();
     const service = this.one(serviceId);
     const automaticTag = automatic ? ' automatically ' : ' ';
@@ -1223,7 +1260,7 @@ export default class ServicesStore extends Store {
     }
   }
 
-  _shareSettingsWithServiceProcess() {
+  _shareSettingsWithServiceProcess(): void {
     const settings = {
       ...this.stores.settings.app,
       isDarkThemeActive: this.stores.ui.isDarkThemeActive,
@@ -1234,7 +1271,7 @@ export default class ServicesStore extends Store {
     });
   }
 
-  _cleanUpTeamIdAndCustomUrl(recipeId, data) {
+  _cleanUpTeamIdAndCustomUrl(recipeId, data): any {
     const serviceData = data;
     const recipe = this.stores.recipes.one(recipeId);
 
diff --git a/src/webview/recipe.js b/src/webview/recipe.js
index 847a720ff..9d5a97767 100644
--- a/src/webview/recipe.js
+++ b/src/webview/recipe.js
@@ -158,7 +158,10 @@ class RecipeController {
   }
 
   @computed get spellcheckerLanguage() {
-    return ifUndefinedString(this.settings.service.spellcheckerLanguage, this.settings.app.spellcheckerLanguage);
+    return ifUndefinedString(
+      this.settings.service.spellcheckerLanguage,
+      this.settings.app.spellcheckerLanguage,
+    );
   }
 
   cldIdentifier = null;
@@ -197,13 +200,13 @@ class RecipeController {
     // Add ability to go forward or back with mouse buttons (inside the recipe)
     window.addEventListener('mouseup', e => {
       if (e.button === 3) {
-          e.preventDefault()
-          e.stopPropagation()
-          window.history.back()
+        e.preventDefault();
+        e.stopPropagation();
+        window.history.back();
       } else if (e.button === 4) {
-        e.preventDefault()
-        e.stopPropagation()
-        window.history.forward()
+        e.preventDefault();
+        e.stopPropagation();
+        window.history.forward();
       }
     });
   }