diff --git a/app/app.ts b/app/app.ts
index f8beafa57bd4..68f59118f90f 100644
--- a/app/app.ts
+++ b/app/app.ts
@@ -62,7 +62,7 @@ for (let i = 0; i < styleSheets.length; i++) {
   }
 }
 
-function wrapLogFn(fn: string) {
+function wrapLogFn(fn: 'debug' | 'error' | 'info' | 'log') {
   const old: Function = console[fn];
   console[fn] = (...args: any[]) => {
     old.apply(console, args);
@@ -101,9 +101,18 @@ window.addEventListener('unhandledrejection', e => {
 
 // Remove the startup event listener that catches bundle parse errors and other
 // critical issues starting up the renderer.
-if (window['_startupErrorHandler']) {
-  window.removeEventListener('error', window['_startupErrorHandler']);
-  delete window['_startupErrorHandler'];
+declare global {
+  interface Window {
+    _startupErrorHandler: EventListenerOrEventListenerObject | undefined;
+  }
+}
+
+// TODO: can't find `_startupErrorHandler` in electron or chromium sources
+// This might no longer be relevant, we should breakpoint below and see if
+// it exists.
+if (window._startupErrorHandler) {
+  window.removeEventListener('error', window._startupErrorHandler);
+  delete window._startupErrorHandler;
 }
 
 // Used by Eddy for debugging on mac.
@@ -288,7 +297,7 @@ document.addEventListener('DOMContentLoaded', async () => {
     const obsUserPluginsService: ObsUserPluginsService = ObsUserPluginsService.instance;
 
     // This is used for debugging
-    window['obs'] = obs;
+    (window as typeof window & { obs: typeof obs }).obs = obs;
 
     // Host a new OBS server instance
     obs.IPC.host(remote.process.env.IPC_UUID);
diff --git a/app/components-react/editor/elements/mixer/GLVolmeters.tsx b/app/components-react/editor/elements/mixer/GLVolmeters.tsx
index 3123520d2bfd..2e6de79050d7 100644
--- a/app/components-react/editor/elements/mixer/GLVolmeters.tsx
+++ b/app/components-react/editor/elements/mixer/GLVolmeters.tsx
@@ -215,7 +215,10 @@ class GLVolmetersController {
   }
 
   beforeDestroy() {
-    if (this.gl) window['activeWebglContexts'] -= 1;
+    if (this.gl) {
+      // TODO: where is this defined or used, can be undefined too?
+      (window as typeof window & { activeWebglContexts: number })['activeWebglContexts'] -= 1;
+    }
     clearInterval(this.canvasWidthInterval);
     // unsubscribe all volmeters
     Object.keys(this.subscriptions).forEach(sourceId => this.unsubscribeVolmeter(sourceId));
diff --git a/app/components-react/editor/layouts/Classic.tsx b/app/components-react/editor/layouts/Classic.tsx
index 188384dc315f..d3d491fe0cab 100644
--- a/app/components-react/editor/layouts/Classic.tsx
+++ b/app/components-react/editor/layouts/Classic.tsx
@@ -15,7 +15,11 @@ export function Classic(p: React.PropsWithChildren<LayoutProps>) {
   return (
     <div className={styles.rows} ref={componentRef}>
       <div className={styles.cell} style={{ height: `${100 - resizes.bar1 * 100}%` }}>
-        {p.children?.['1'] || <></>}
+        {
+          // TODO: index
+          // @ts-ignore
+          p.children?.['1'] || <></>
+        }
       </div>
       <ResizeBar
         position="top"
@@ -30,7 +34,11 @@ export function Classic(p: React.PropsWithChildren<LayoutProps>) {
         >
           {['2', '3', '4'].map(slot => (
             <div key={slot} className={cx(styles.cell, 'no-top-padding')}>
-              {p.children?.[slot] || <></>}
+              {
+                // TODO: index
+                // @ts-ignore
+                p.children?.[slot] || <></>
+              }
             </div>
           ))}
         </div>
diff --git a/app/components-react/editor/layouts/Default.tsx b/app/components-react/editor/layouts/Default.tsx
index 23c50d567260..3c48cc5da0ea 100644
--- a/app/components-react/editor/layouts/Default.tsx
+++ b/app/components-react/editor/layouts/Default.tsx
@@ -18,7 +18,11 @@ export function Default(p: React.PropsWithChildren<LayoutProps>) {
         className={styles.cell}
         style={{ height: `${100 - (resizes.bar1 + resizes.bar2!) * 100}%` }}
       >
-        {p.children?.['1'] || <></>}
+        {
+          // TODO: index
+          // @ts-ignore
+          p.children?.['1'] || <></>
+        }
       </div>
       <ResizeBar
         position="top"
@@ -32,7 +36,11 @@ export function Default(p: React.PropsWithChildren<LayoutProps>) {
           style={{ height: `${resizes.bar1 * 100}%` }}
           className={cx(styles.cell, 'no-top-padding')}
         >
-          {p.children?.['2'] || <></>}
+          {
+            // TODO: index
+            // @ts-ignore
+            p.children?.['2'] || <></>
+          }
         </div>
       </ResizeBar>
       <ResizeBar
@@ -48,7 +56,11 @@ export function Default(p: React.PropsWithChildren<LayoutProps>) {
         >
           {['3', '4', '5'].map(slot => (
             <div key={slot} className={cx(styles.cell, 'no-top-padding')}>
-              {p.children?.[slot] || <></>}
+              {
+                // TODO: index
+                // @ts-ignore
+                p.children?.[slot] || <></>
+              }
             </div>
           ))}
         </div>
diff --git a/app/components-react/editor/layouts/FourByFour.tsx b/app/components-react/editor/layouts/FourByFour.tsx
index ecf8e7d41bc8..6c5561ccf4d2 100644
--- a/app/components-react/editor/layouts/FourByFour.tsx
+++ b/app/components-react/editor/layouts/FourByFour.tsx
@@ -18,7 +18,11 @@ export function FourByFour(p: React.PropsWithChildren<LayoutProps>) {
         className={styles.cell}
         style={{ height: `${100 - (resizes.bar1 + resizes.bar2) * 100}%` }}
       >
-        {p.children?.['1'] || <></>}
+        {
+          // TODO: index
+          // @ts-ignore
+          p.children?.['1'] || <></>
+        }
       </div>
       <ResizeBar
         position="top"
@@ -28,8 +32,20 @@ export function FourByFour(p: React.PropsWithChildren<LayoutProps>) {
         min={mins.bar1}
       >
         <div className={styles.segmented} style={{ height: `${resizes.bar1 * 100}%` }}>
-          <div className={cx(styles.cell, 'no-top-padding')}>{p.children?.['2'] || <></>}</div>
-          <div className={cx(styles.cell, 'no-top-padding')}>{p.children?.['3'] || <></>}</div>
+          <div className={cx(styles.cell, 'no-top-padding')}>
+            {
+              // TODO: index
+              // @ts-ignore
+              p.children?.['2'] || <></>
+            }
+          </div>
+          <div className={cx(styles.cell, 'no-top-padding')}>
+            {
+              // TODO: index
+              // @ts-ignore
+              p.children?.['3'] || <></>
+            }
+          </div>
         </div>
       </ResizeBar>
       <ResizeBar
@@ -43,8 +59,20 @@ export function FourByFour(p: React.PropsWithChildren<LayoutProps>) {
           className={styles.segmented}
           style={{ height: `${resizes.bar2 * 100}%`, padding: '0 8px' }}
         >
-          <div className={cx(styles.cell, 'no-top-padding')}>{p.children?.['4'] || <></>}</div>
-          <div className={cx(styles.cell, 'no-top-padding')}>{p.children?.['5'] || <></>}</div>
+          <div className={cx(styles.cell, 'no-top-padding')}>
+            {
+              // TODO: index
+              // @ts-ignore
+              p.children?.['4'] || <></>
+            }
+          </div>
+          <div className={cx(styles.cell, 'no-top-padding')}>
+            {
+              // TODO: index
+              // @ts-ignore
+              p.children?.['5'] || <></>
+            }
+          </div>
         </div>
       </ResizeBar>
     </div>
diff --git a/app/components-react/editor/layouts/OnePane.tsx b/app/components-react/editor/layouts/OnePane.tsx
index 094b4e53bdf0..4640ccdc69de 100644
--- a/app/components-react/editor/layouts/OnePane.tsx
+++ b/app/components-react/editor/layouts/OnePane.tsx
@@ -22,17 +22,43 @@ export function OnePane(p: React.PropsWithChildren<LayoutProps>) {
         min={mins.bar1}
       >
         <div style={{ width: `${100 - resizes.bar1 * 100}%` }} className={styles.cell}>
-          {p.children?.['2'] || <></>}
+          {
+            // TODO: index
+            // @ts-ignore
+            p.children?.['2'] || <></>
+          }
         </div>
       </ResizeBar>
       <div className={styles.rows} style={{ width: `${resizes.bar1 * 100}%`, paddingTop: '16px' }}>
         <div className={styles.cell} style={{ height: '100%' }}>
-          {p.children?.['1'] || <></>}
+          {
+            // TODO: index
+            // @ts-ignore
+            p.children?.['1'] || <></>
+          }
         </div>
         <div className={styles.segmented}>
-          <div className={styles.cell}>{p.children?.['3'] || <></>}</div>
-          <div className={styles.cell}>{p.children?.['4'] || <></>}</div>
-          <div className={styles.cell}>{p.children?.['5'] || <></>}</div>
+          <div className={styles.cell}>
+            {
+              // TODO: index
+              // @ts-ignore
+              p.children?.['3'] || <></>
+            }
+          </div>
+          <div className={styles.cell}>
+            {
+              // TODO: index
+              // @ts-ignore
+              p.children?.['4'] || <></>
+            }
+          </div>
+          <div className={styles.cell}>
+            {
+              // TODO: index
+              // @ts-ignore
+              p.children?.['5'] || <></>
+            }
+          </div>
         </div>
       </div>
     </div>
diff --git a/app/components-react/editor/layouts/OnePaneR.tsx b/app/components-react/editor/layouts/OnePaneR.tsx
index 93bfca223646..b84f80ebac0d 100644
--- a/app/components-react/editor/layouts/OnePaneR.tsx
+++ b/app/components-react/editor/layouts/OnePaneR.tsx
@@ -19,12 +19,34 @@ export function OnePaneR(p: React.PropsWithChildren<LayoutProps>) {
         style={{ width: `${100 - resizes.bar1 * 100}%`, paddingTop: '16px' }}
       >
         <div className={styles.cell} style={{ height: '100%' }}>
-          {p.children?.['1'] || <></>}
+          {
+            // TODO: index
+            // @ts-ignore
+            p.children?.['1'] || <></>
+          }
         </div>
         <div className={styles.segmented}>
-          <div className={styles.cell}>{p.children?.['3'] || <></>}</div>
-          <div className={styles.cell}>{p.children?.['4'] || <></>}</div>
-          <div className={styles.cell}>{p.children?.['5'] || <></>}</div>
+          <div className={styles.cell}>
+            {
+              // TODO: index
+              // @ts-ignore
+              p.children?.['3'] || <></>
+            }
+          </div>
+          <div className={styles.cell}>
+            {
+              // TODO: index
+              // @ts-ignore
+              p.children?.['4'] || <></>
+            }
+          </div>
+          <div className={styles.cell}>
+            {
+              // TODO: index
+              // @ts-ignore
+              p.children?.['5'] || <></>
+            }
+          </div>
         </div>
       </div>
       <ResizeBar
@@ -35,7 +57,11 @@ export function OnePaneR(p: React.PropsWithChildren<LayoutProps>) {
         min={mins.bar1}
       >
         <div style={{ width: `${resizes.bar1 * 100}%` }} className={styles.cell}>
-          {p.children?.['2'] || <></>}
+          {
+            // TODO: index
+            // @ts-ignore
+            p.children?.['2'] || <></>
+          }
         </div>
       </ResizeBar>
     </div>
diff --git a/app/components-react/editor/layouts/Pyramid.tsx b/app/components-react/editor/layouts/Pyramid.tsx
index 62b9b1ad38ee..46e65150ea50 100644
--- a/app/components-react/editor/layouts/Pyramid.tsx
+++ b/app/components-react/editor/layouts/Pyramid.tsx
@@ -15,7 +15,11 @@ export function Pyramid(p: React.PropsWithChildren<LayoutProps>) {
   return (
     <div className={styles.rows} ref={componentRef}>
       <div className={styles.cell} style={{ height: `${100 - resizes.bar1 * 100}%` }}>
-        {p.children?.['1'] || <></>}
+        {
+          // TODO: index
+          // @ts-ignore
+          p.children?.['1'] || <></>
+        }
       </div>
       <ResizeBar
         position="top"
@@ -30,7 +34,11 @@ export function Pyramid(p: React.PropsWithChildren<LayoutProps>) {
         >
           {['2', '3'].map(slot => (
             <div className={cx(styles.cell, 'no-top-padding')} key={slot}>
-              {p.children?.[slot] || <></>}
+              {
+                // TODO: index
+                // @ts-ignore
+                p.children?.[slot] || <></>
+              }
             </div>
           ))}
         </div>
diff --git a/app/components-react/editor/layouts/Triplets.tsx b/app/components-react/editor/layouts/Triplets.tsx
index 3167268960da..3c97fa4e1995 100644
--- a/app/components-react/editor/layouts/Triplets.tsx
+++ b/app/components-react/editor/layouts/Triplets.tsx
@@ -31,7 +31,11 @@ export function Triplets(p: React.PropsWithChildren<LayoutProps>) {
         >
           {['1', '4'].map(slot => (
             <div key={slot} className={styles.cell}>
-              {p.children?.[slot] || <></>}
+              {
+                // TODO: index
+                // @ts-ignore
+                p.children?.[slot] || <></>
+              }
             </div>
           ))}
         </div>
@@ -39,7 +43,11 @@ export function Triplets(p: React.PropsWithChildren<LayoutProps>) {
       <div className={styles.stacked} style={{ width: `${resizes.bar1 * 100}%` }}>
         {['2', '5'].map(slot => (
           <div key={slot} className={styles.cell}>
-            {p.children?.[slot] || <></>}
+            {
+              // TODO: index
+              // @ts-ignore
+              p.children?.[slot] || <></>
+            }
           </div>
         ))}
       </div>
@@ -54,7 +62,11 @@ export function Triplets(p: React.PropsWithChildren<LayoutProps>) {
         <div className={styles.stacked} style={{ width: `${resizes.bar2 * 100}%` }}>
           {['3', '6'].map(slot => (
             <div key={slot} className={styles.cell}>
-              {p.children?.[slot] || <></>}
+              {
+                // TODO: index
+                // @ts-ignore
+                p.children?.[slot] || <></>
+              }
             </div>
           ))}
         </div>
diff --git a/app/components-react/editor/layouts/TwoPane.tsx b/app/components-react/editor/layouts/TwoPane.tsx
index 671698e053df..9a03aa54f0ee 100644
--- a/app/components-react/editor/layouts/TwoPane.tsx
+++ b/app/components-react/editor/layouts/TwoPane.tsx
@@ -25,16 +25,36 @@ export function TwoPane(p: React.PropsWithChildren<LayoutProps>) {
           style={{ width: `${100 - (resizes.bar1 + resizes.bar2) * 100}%` }}
           className={styles.cell}
         >
-          {p.children?.['2'] || <></>}
+          {
+            // TODO: index
+            // @ts-ignore
+            p.children?.['2'] || <></>
+          }
         </div>
       </ResizeBar>
       <div className={styles.rows} style={{ width: `${resizes.bar1 * 100}%`, paddingTop: '16px' }}>
         <div style={{ height: '100%' }} className={styles.cell}>
-          {p.children?.['1'] || <></>}
+          {
+            // TODO: index
+            // @ts-ignore
+            p.children?.['1'] || <></>
+          }
         </div>
         <div className={styles.segmented}>
-          <div className={styles.cell}>{p.children?.['3'] || <></>}</div>
-          <div className={styles.cell}>{p.children?.['4'] || <></>}</div>
+          <div className={styles.cell}>
+            {
+              // TODO: index
+              // @ts-ignore
+              p.children?.['3'] || <></>
+            }
+          </div>
+          <div className={styles.cell}>
+            {
+              // TODO: index
+              // @ts-ignore
+              p.children?.['4'] || <></>
+            }
+          </div>
         </div>
       </div>
       <ResizeBar
@@ -46,7 +66,11 @@ export function TwoPane(p: React.PropsWithChildren<LayoutProps>) {
         transformScale={1}
       >
         <div style={{ width: `${resizes.bar2 * 100}%` }} className={styles.cell}>
-          {p.children?.['5'] || <></>}
+          {
+            // TODO: index
+            // @ts-ignore
+            p.children?.['5'] || <></>
+          }
         </div>
       </ResizeBar>
     </div>
diff --git a/app/components-react/hooks/zustand.tsx b/app/components-react/hooks/zustand.tsx
index 9f1301a3943c..301c0af53cc1 100644
--- a/app/components-react/hooks/zustand.tsx
+++ b/app/components-react/hooks/zustand.tsx
@@ -87,6 +87,8 @@ export function useController<T>(ControllerCtx: Context<T>): NonNullable<T> {
       if (actionName === 'constructor') continue;
       if (!(controller as any)[actionName]?.bind) continue;
       // Run initialize actions if they exist
+      // TODO: index
+      // @ts-ignore
       if (actionName === 'init') controller[actionName]();
       actions[actionName] = (controller as any)[actionName].bind(controller);
     }
diff --git a/app/components-react/pages/Studio.tsx b/app/components-react/pages/Studio.tsx
index a2aafa4ac760..d15505ddffce 100644
--- a/app/components-react/pages/Studio.tsx
+++ b/app/components-react/pages/Studio.tsx
@@ -22,6 +22,8 @@ export default function Studio(p: { onTotalWidth: (width: Number) => void }) {
     layout: LayoutService.views.component,
   }));
 
+  // TODO: index
+  // @ts-ignore
   const Layout = layouts[layout];
 
   const { children, childrenMins } = useMemo(() => {
@@ -29,6 +31,8 @@ export default function Studio(p: { onTotalWidth: (width: Number) => void }) {
     const childrenMins: Dictionary<IVec2> = {};
     elementsToRender.forEach((el: ELayoutElement) => {
       const componentName = LayoutService.views.elementComponent(el);
+      // TODO: index
+      // @ts-ignore
       const Component = elements[componentName];
       const slot = slottedElements[el]?.slot;
       if (slot && Component) {
diff --git a/app/components-react/pages/grow/Cards.tsx b/app/components-react/pages/grow/Cards.tsx
index 74a3fc93af4e..883c8f6edb99 100644
--- a/app/components-react/pages/grow/Cards.tsx
+++ b/app/components-react/pages/grow/Cards.tsx
@@ -174,7 +174,13 @@ export function PlatformCard(p: { platform: ICommunityReach }) {
     <div className={styles.card}>
       <div className={styles.cardHeader}>
         <PlatformLogo platform={icon} className={styles.cardIcon} />
-        <span className={cx(styles.title, styles[icon])}>{nameMap[icon]}</span>
+        <span className={cx(styles.title, styles[icon])}>
+          {
+            // TODO: index
+            // @ts-ignore
+            nameMap[icon]
+          }
+        </span>
       </div>
       {followers != null ? (
         <span>{$t('%{followers} followers', { followers })}</span>
diff --git a/app/components-react/pages/grow/Grow.tsx b/app/components-react/pages/grow/Grow.tsx
index 1b8a295ea64d..89d79148acda 100644
--- a/app/components-react/pages/grow/Grow.tsx
+++ b/app/components-react/pages/grow/Grow.tsx
@@ -232,7 +232,13 @@ function StreamPulse(p: { analytics: IDashboardAnalytics }) {
           <div className={styles.card} key={stat.value}>
             <i className={stat.icon} />
             <span className={styles.title}>{stat.title}</span>
-            <span className={styles.stat}>{stats[stat.value]}</span>
+            <span className={styles.stat}>
+              {
+                // TODO: index
+                // @ts-ignore
+                stats[stat.value]
+              }
+            </span>
           </div>
         ))}
       </div>
diff --git a/app/components-react/pages/layout-editor/LayoutEditor.tsx b/app/components-react/pages/layout-editor/LayoutEditor.tsx
index 687b1e1307f0..4a4a3ef099f0 100644
--- a/app/components-react/pages/layout-editor/LayoutEditor.tsx
+++ b/app/components-react/pages/layout-editor/LayoutEditor.tsx
@@ -53,6 +53,8 @@ function DisplayedLayout() {
 
   function elementInSlot(slot: LayoutSlot) {
     return Object.keys(slottedElements).find(
+      // TODO: index
+      // @ts-ignore
       el => slottedElements[el].slot === slot,
     ) as ELayoutElement;
   }
diff --git a/app/components-react/pages/layout-editor/SideBar.tsx b/app/components-react/pages/layout-editor/SideBar.tsx
index b3cc6e0fafb5..f14f88767e78 100644
--- a/app/components-react/pages/layout-editor/SideBar.tsx
+++ b/app/components-react/pages/layout-editor/SideBar.tsx
@@ -28,7 +28,11 @@ export default function SideBar() {
             <img
               key={layout}
               className={currentLayout === layout ? styles.active : ''}
+              // TODO: index
+              // @ts-ignore
               onClick={() => setCurrentLayout(ELayout[layout])}
+              // TODO: index
+              // @ts-ignore
               src={layoutImage(ELayout[layout])}
             />
           ))}
diff --git a/app/components-react/pages/layout-editor/hooks.ts b/app/components-react/pages/layout-editor/hooks.ts
index 97377c494e69..dad0fb2ee6d1 100644
--- a/app/components-react/pages/layout-editor/hooks.ts
+++ b/app/components-react/pages/layout-editor/hooks.ts
@@ -47,6 +47,8 @@ class LayoutEditorModule {
     let existingEl;
     if (id && ['1', '2', '3', '4', '5', '6'].includes(id)) {
       existingEl = Object.keys(this.state.slottedElements).find(
+        // TODO: index
+        // @ts-ignore
         existing => this.state.slottedElements[existing].slot === id,
       ) as ELayoutElement;
       if (existingEl && this.state.slottedElements[el]) {
diff --git a/app/components-react/pages/onboarding/ObsImport.tsx b/app/components-react/pages/onboarding/ObsImport.tsx
index 42a850db421d..6792d94c5bdd 100644
--- a/app/components-react/pages/onboarding/ObsImport.tsx
+++ b/app/components-react/pages/onboarding/ObsImport.tsx
@@ -129,6 +129,8 @@ function FeatureCards() {
   return (
     <div className={styles.container}>
       {recommendedFeatures.map(feature => {
+        // TODO: index
+        // @ts-ignore
         const data = featuresMetadata[feature];
         return (
           <div className={styles.card} key={feature}>
diff --git a/app/components-react/pages/onboarding/Onboarding.tsx b/app/components-react/pages/onboarding/Onboarding.tsx
index 7efef1dbdc08..a04789b60ac4 100644
--- a/app/components-react/pages/onboarding/Onboarding.tsx
+++ b/app/components-react/pages/onboarding/Onboarding.tsx
@@ -209,6 +209,8 @@ export class OnboardingModule {
   get currentStep(): IOnboardingStep {
     // Useful for testing in development
     if (Utils.env.SLD_FORCE_ONBOARDING_STEP) {
+      // TODO: index
+      // @ts-ignore
       return ONBOARDING_STEPS()[Utils.env.SLD_FORCE_ONBOARDING_STEP];
     }
 
diff --git a/app/components-react/pages/stream-scheduler/StreamScheduler.tsx b/app/components-react/pages/stream-scheduler/StreamScheduler.tsx
index 74a4d1ed140a..6db365ce9552 100644
--- a/app/components-react/pages/stream-scheduler/StreamScheduler.tsx
+++ b/app/components-react/pages/stream-scheduler/StreamScheduler.tsx
@@ -101,6 +101,8 @@ function SchedulerCalendar() {
    * So delegate the click event to the root div
    */
   function onCalendarClick(event: MouseEvent) {
+    // TODO: index
+    // @ts-ignore
     const $td = event.target!['closest']('td');
     if (!$td) return;
     $td.querySelector('[data-role="day"]')!['click']();
diff --git a/app/components-react/shared/BrowserView.tsx b/app/components-react/shared/BrowserView.tsx
index fa77501a91d4..7417ad74834f 100644
--- a/app/components-react/shared/BrowserView.tsx
+++ b/app/components-react/shared/BrowserView.tsx
@@ -137,7 +137,11 @@ export default function BrowserView(p: BrowserViewProps) {
       // ignore some common errors
       // that happen when the window has been closed before BrowserView accomplished the request
       if (e && typeof e === 'object') {
+        // TODO: index
+        // @ts-ignore
         if (e['code'] === 'ERR_ABORTED') return;
+        // TODO: index
+        // @ts-ignore
         if (e['message'] && e['message'].match(/\(\-3\) loading/)) return;
       }
       throw e;
diff --git a/app/components-react/shared/HotkeyBinding.tsx b/app/components-react/shared/HotkeyBinding.tsx
index 8bfa720ec1e3..e5ec68c198f4 100644
--- a/app/components-react/shared/HotkeyBinding.tsx
+++ b/app/components-react/shared/HotkeyBinding.tsx
@@ -103,6 +103,8 @@ export default function HotkeyBinding(p: {
     };
 
     p.onBind({
+      // TODO: index
+      // @ts-ignore
       key: code[key],
       modifiers: getModifiers(event),
     });
diff --git a/app/components-react/shared/PerformanceMetrics.tsx b/app/components-react/shared/PerformanceMetrics.tsx
index 07c359269540..d498169b6da8 100644
--- a/app/components-react/shared/PerformanceMetrics.tsx
+++ b/app/components-react/shared/PerformanceMetrics.tsx
@@ -30,6 +30,8 @@ export default function PerformanceMetrics(props: {
   );
 
   function showAttribute(attribute: string) {
+    // TODO: index
+    // @ts-ignore
     return props.mode === 'full' || pinnedStats[attribute];
   }
 
@@ -39,6 +41,8 @@ export default function PerformanceMetrics(props: {
 
   function classForStat(stat: string) {
     if (props.mode === 'limited') return '';
+    // TODO: index
+    // @ts-ignore
     return `clickable ${pinnedStats[stat] ? 'active' : ''}`;
   }
 
@@ -77,6 +81,8 @@ export default function PerformanceMetrics(props: {
       )}
     >
       {shownCells.map(attribute => {
+        // TODO: index
+        // @ts-ignore
         const data = metadata[attribute];
         return (
           <Tooltip placement="bottom" title={pinTooltip(data.label)} key={attribute}>
@@ -86,6 +92,8 @@ export default function PerformanceMetrics(props: {
                 classForStat(attribute),
                 'performance-metric-wrapper',
               )}
+              // TODO: index
+              // @ts-ignore
               onClick={() => updatePinnedStats(attribute, !pinnedStats[attribute])}
             >
               <i className={cx(styles.performanceMetricIcon, data.icon)} />
diff --git a/app/components-react/shared/PlatformLogo.tsx b/app/components-react/shared/PlatformLogo.tsx
index bf63e5d3bddf..efffdee613b8 100644
--- a/app/components-react/shared/PlatformLogo.tsx
+++ b/app/components-react/shared/PlatformLogo.tsx
@@ -37,6 +37,8 @@ export default function PlatformLogo(p: IProps & HTMLAttributes<unknown>) {
       instagram: 'instagram',
     }[p.platform];
   }
+  // TODO: index
+  // @ts-ignore
   const size = p.size && (sizeMap[p.size] ?? p.size);
   const sizeStyle = size
     ? {
diff --git a/app/components-react/shared/SvgContainer.tsx b/app/components-react/shared/SvgContainer.tsx
index f83722cd930b..a26d07deff09 100644
--- a/app/components-react/shared/SvgContainer.tsx
+++ b/app/components-react/shared/SvgContainer.tsx
@@ -13,12 +13,17 @@ export default function SvgContainer(p: {
     const attrs = {};
     let attrMatch;
     while ((attrMatch = SVG_ATTRS_REGEX.exec(svgTag)) !== null) {
+      // TODO: index
+      // @ts-ignore
       attrs[attrMatch[1]] = attrMatch[2];
     }
     return attrs;
   }
 
   function derivePaths() {
+    // FIXME: do we want dotAll? if so we need to change our target to `es2018`
+    // ref: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/RegExp/dotAll
+    // @ts-ignore
     const pathsMatch = p.src.match(/>\s*(<.*>)\s*</s);
 
     return (pathsMatch && pathsMatch[1]) || '';
diff --git a/app/components-react/shared/Translate.tsx b/app/components-react/shared/Translate.tsx
index 920f3a63f0f3..5ec37616d9b2 100644
--- a/app/components-react/shared/Translate.tsx
+++ b/app/components-react/shared/Translate.tsx
@@ -71,6 +71,8 @@ export default function Translate(p: {
     }
 
     // render slots if found
+    // TODO: index
+    // @ts-ignore
     const slotName = camelize(xmlNode['tagName']);
     const namedReactNode = s.namedReactNodes[slotName];
     if (namedReactNode) {
diff --git a/app/components-react/shared/VueComponent.tsx b/app/components-react/shared/VueComponent.tsx
index 74108731414f..98a2065e2657 100644
--- a/app/components-react/shared/VueComponent.tsx
+++ b/app/components-react/shared/VueComponent.tsx
@@ -34,7 +34,7 @@ export class VueComponent extends Component<IProps, { id: string; vueInstance: V
       methods: {
         updateProps(newProps: { componentClass: typeof Vue; componentProps: unknown }) {
           this['componentClass'] = newProps.componentClass;
-          this['componenentProps'] = newProps.componentProps;
+          this['componentProps'] = newProps.componentProps;
         },
       },
       render(h) {
@@ -45,6 +45,8 @@ export class VueComponent extends Component<IProps, { id: string; vueInstance: V
   }
 
   componentDidUpdate(props: IProps): void {
+    // TODO: index
+    // @ts-ignore
     this.state.vueInstance!['updateProps'](props);
   }
 
diff --git a/app/components-react/shared/inputs/FormFactory.tsx b/app/components-react/shared/inputs/FormFactory.tsx
index e264e8114ea1..eed6983f3bde 100644
--- a/app/components-react/shared/inputs/FormFactory.tsx
+++ b/app/components-react/shared/inputs/FormFactory.tsx
@@ -92,6 +92,8 @@ function FormInput(p: {
 
   if (!type) return <></>;
 
+  // TODO: index
+  // @ts-ignore
   const Input = componentTable[type];
   let handleChange = p.onChange(p.id);
   if (type === 'checkboxGroup') handleChange = p.onChange;
diff --git a/app/components-react/shared/inputs/InputWrapper.tsx b/app/components-react/shared/inputs/InputWrapper.tsx
index ea137c728572..e694cc7c0016 100644
--- a/app/components-react/shared/inputs/InputWrapper.tsx
+++ b/app/components-react/shared/inputs/InputWrapper.tsx
@@ -37,5 +37,7 @@ function useLayout(p: TInputWrapperProps) {
   const contextLayout = context?.layout;
   const wrapperLayout = p.layout;
   const layout = wrapperLayout || contextLayout || 'inline';
+  // TODO: index
+  // @ts-ignore
   return layoutPresets[layout] || {};
 }
diff --git a/app/components-react/shared/inputs/ListInput.tsx b/app/components-react/shared/inputs/ListInput.tsx
index fe142afe7d8a..fe7a72ea67d3 100644
--- a/app/components-react/shared/inputs/ListInput.tsx
+++ b/app/components-react/shared/inputs/ListInput.tsx
@@ -102,8 +102,16 @@ export const ListInput = InputComponent(<T extends any>(p: TListInputProps<T>) =
         getPopupContainer={getPopupContainer}
         data-value={inputAttrs.value}
         data-selected-option-label={selectedOption?.label}
-        data-show-search={!!inputAttrs['showSearch']}
-        data-loading={!!inputAttrs['loading']}
+        data-show-search={
+          // TODO: index
+          // @ts-ignore
+          !!inputAttrs['showSearch']
+        }
+        data-loading={
+          // TODO: index
+          // @ts-ignore
+          !!inputAttrs['loading']
+        }
       >
         {options && options.map((opt, ind) => renderOption(opt, ind, p))}
       </Select>
diff --git a/app/components-react/shared/inputs/TagsInput.tsx b/app/components-react/shared/inputs/TagsInput.tsx
index be8f1708fa80..20991882d7ef 100644
--- a/app/components-react/shared/inputs/TagsInput.tsx
+++ b/app/components-react/shared/inputs/TagsInput.tsx
@@ -38,8 +38,12 @@ export const TagsInput = InputComponent(<T extends any[]>(p: TTagsInputProps<T>)
 
   function renderTag(tagProps: TagProps) {
     const tag = p.options
-      ? tagsMap[tagProps['value']]
-      : { label: tagProps['value'], value: tagProps['value'] };
+      ? // TODO: index
+        // @ts-ignore
+        tagsMap[tagProps['value']]
+      : // TODO: index
+        // @ts-ignore
+        { label: tagProps['value'], value: tagProps['value'] };
     if (p.tagRender) {
       return p.tagRender(tagProps, tag);
     }
@@ -83,7 +87,11 @@ export const TagsInput = InputComponent(<T extends any[]>(p: TTagsInputProps<T>)
         dropdownRender={dropdownRender}
         data-value={JSON.stringify(inputAttrs.value)}
         data-display-value={JSON.stringify(displayValue)}
-        data-show-search={inputAttrs['showSearch']}
+        data-show-search={
+          // TODO: index
+          // @ts-ignore
+          inputAttrs['showSearch']
+        }
       >
         {options.length > 0 && options.map((opt, ind) => renderOption(opt, ind, p))}
       </Select>
diff --git a/app/components-react/shared/inputs/TimeInput.tsx b/app/components-react/shared/inputs/TimeInput.tsx
index 3bd27cc967dc..461eceb8632e 100644
--- a/app/components-react/shared/inputs/TimeInput.tsx
+++ b/app/components-react/shared/inputs/TimeInput.tsx
@@ -61,4 +61,6 @@ function getAntdValue(value?: number) {
 }
 
 // tell the Form to convert a timestamp value to a Moment value when call `Form.setFieldsValue`
+// TODO: index
+// @ts-ignore
 TimeInput['getAntdValue'] = getAntdValue;
diff --git a/app/components-react/shared/inputs/inputs.ts b/app/components-react/shared/inputs/inputs.ts
index 075c6bab471e..371af9f0a454 100644
--- a/app/components-react/shared/inputs/inputs.ts
+++ b/app/components-react/shared/inputs/inputs.ts
@@ -429,5 +429,7 @@ export function getInputComponentByType(
   const name = Object.keys(InputComponents).find(componentName => {
     return componentName.split('Input')[0].toLowerCase() === type;
   });
+  // TODO: index
+  // @ts-ignore
   return name ? InputComponents[name] : null;
 }
diff --git a/app/components-react/sidebar/SideNav.tsx b/app/components-react/sidebar/SideNav.tsx
index 8279d3b36340..ca173baa4d57 100644
--- a/app/components-react/sidebar/SideNav.tsx
+++ b/app/components-react/sidebar/SideNav.tsx
@@ -28,6 +28,8 @@ export default function SideNav() {
       [ESubMenuItemKey.AppsStoreHome]: EMenuItemKey.AppStore,
     };
     if (Object.keys(subMenuItems).includes(currentMenuItem as EMenuItemKey)) {
+      // TODO: index
+      // @ts-ignore
       setCurrentMenuItem(subMenuItems[currentMenuItem]);
     }
   }
diff --git a/app/components-react/widgets/AlertBox.tsx b/app/components-react/widgets/AlertBox.tsx
index ed92c28fbc0d..eb04f6ecc3db 100644
--- a/app/components-react/widgets/AlertBox.tsx
+++ b/app/components-react/widgets/AlertBox.tsx
@@ -207,6 +207,8 @@ function CommonAlertSettings(p: { type: TAlertType; hiddenFields?: string[] }) {
   const bind = createVariationBinding(p.type, 'default', useForceUpdate(), p.hiddenFields);
   const containerRef = useRef<HTMLDivElement>(null);
   const bindMinAmount =
+    // TODO: index
+    // @ts-ignore
     bind['alert_message_min_amount'].value !== undefined ? bind['alert_message_min_amount'] : null;
 
   return (
diff --git a/app/components-react/widgets/GameWidget.tsx b/app/components-react/widgets/GameWidget.tsx
index a7d06d9e52b8..ac0c2463ee38 100644
--- a/app/components-react/widgets/GameWidget.tsx
+++ b/app/components-react/widgets/GameWidget.tsx
@@ -70,6 +70,8 @@ function gameOption(key: string) {
     'chat-word': $t('Chat Word'),
   };
 
+  // TODO: index
+  // @ts-ignore
   return { label: optionTable[key], value: key };
 }
 
diff --git a/app/components-react/widgets/common/WidgetWindow.tsx b/app/components-react/widgets/common/WidgetWindow.tsx
index 09539dd4f973..3bda613ebf17 100644
--- a/app/components-react/widgets/common/WidgetWindow.tsx
+++ b/app/components-react/widgets/common/WidgetWindow.tsx
@@ -67,6 +67,8 @@ export function WidgetWindow() {
 
   // take the source id and widget's component from the window's params
   const { Module, WidgetSettingsComponent } = useOnCreate(() => {
+    // TODO: index
+    // @ts-ignore
     const [WidgetSettingsComponent, Module] = components[widgetType];
     return { sourceId, Module, WidgetSettingsComponent };
   });
diff --git a/app/components-react/widgets/common/useWidget.tsx b/app/components-react/widgets/common/useWidget.tsx
index 72b674afb1f9..0774ae4559c2 100644
--- a/app/components-react/widgets/common/useWidget.tsx
+++ b/app/components-react/widgets/common/useWidget.tsx
@@ -206,6 +206,8 @@ export class WidgetModule<TWidgetState extends IWidgetState = IWidgetState> {
   }
 
   get config(): IWidgetConfig {
+    // TODO: index
+    // @ts-ignore
     return this.widgetsConfig[this.state.type];
   }
 
diff --git a/app/components-react/widgets/useAlertBox.tsx b/app/components-react/widgets/useAlertBox.tsx
index 14f8405b2c9f..3bd415e665b0 100644
--- a/app/components-react/widgets/useAlertBox.tsx
+++ b/app/components-react/widgets/useAlertBox.tsx
@@ -77,6 +77,8 @@ export class AlertBoxModule extends WidgetModule<IAlertBoxState> {
     // define onChange handler
     statePatch => this.updateSettings(statePatch),
     // pull additional metadata like tooltip, label, min, max, etc...
+    // TODO: index
+    // @ts-ignore
     fieldName => this.generalMetadata[fieldName],
   );
 
@@ -99,6 +101,8 @@ export class AlertBoxModule extends WidgetModule<IAlertBoxState> {
       },
       // pull additional metadata like tooltip, label, min, max, etc...
       fieldName => ({
+        // TODO: index
+        // @ts-ignore
         ...this.variationsMetadata[alertType as any][fieldName],
         hidden: hiddenFields.includes(fieldName as string),
       }),
@@ -117,6 +121,8 @@ export class AlertBoxModule extends WidgetModule<IAlertBoxState> {
    */
   get enabledAlerts() {
     return Object.keys(this.widgetData.variations).filter(
+      // TODO: index
+      // @ts-ignore
       alertType => this.widgetData.variations[alertType].default.enabled,
     );
   }
@@ -153,6 +159,8 @@ export class AlertBoxModule extends WidgetModule<IAlertBoxState> {
 
     // sanitize general settings
     Object.keys(settings).forEach(key => {
+      // TODO: index
+      // @ts-ignore
       settings[key] = this.sanitizeValue(settings[key], key, this.generalMetadata[key]);
     });
 
@@ -206,6 +214,8 @@ export class AlertBoxModule extends WidgetModule<IAlertBoxState> {
           value = this.sanitizeValue(
             value,
             targetKey,
+            // TODO: index
+            // @ts-ignore
             this.variationsMetadata[alertEvent.type][targetKey],
           );
 
@@ -309,6 +319,8 @@ export class AlertBoxModule extends WidgetModule<IAlertBoxState> {
     // flatten settings by adding prefixes
     const settingsPatch = {} as any;
     Object.keys(variationPatch).forEach(key => {
+      // TODO: index
+      // @ts-ignore
       settingsPatch[`${apiKey}_${key}`] = variationPatch[key];
     });
 
@@ -333,6 +345,8 @@ export class AlertBoxModule extends WidgetModule<IAlertBoxState> {
 
   get selectedAlert(): TAlertType | null {
     const selectedTab = this.state.selectedTab;
+    // TODO: index
+    // @ts-ignore
     if (this.eventsConfig[selectedTab]) {
       return selectedTab as TAlertType;
     }
@@ -542,6 +556,8 @@ function getVariationsMetadata() {
 
   // mix common and specific metadata and return it
   Object.keys(specificMetadata).forEach(alertType => {
+    // TODO: index
+    // @ts-ignore
     specificMetadata[alertType] = { ...commonMetadata, ...specificMetadata[alertType] };
   });
   return specificMetadata as {
diff --git a/app/components-react/windows/EditTransform.tsx b/app/components-react/windows/EditTransform.tsx
index 4389ea7e9c9c..8374475e6a0d 100644
--- a/app/components-react/windows/EditTransform.tsx
+++ b/app/components-react/windows/EditTransform.tsx
@@ -52,12 +52,16 @@ export default function EditTransform() {
   function setPos(dir: string) {
     return async (value: number) => {
       if (await invalidForm()) return;
+      // TODO: index
+      // @ts-ignore
       const delta = Number(value) - Math.round(rect[dir]);
 
       EditorCommandsService.actions.executeCommand('MoveItemsCommand', selection, {
         [dir]: delta,
       });
 
+      // TODO: index
+      // @ts-ignore
       const newValue = rect[dir] + delta;
       setRect({ ...rect, [dir]: newValue });
     };
@@ -66,7 +70,11 @@ export default function EditTransform() {
   function setScale(dir: string) {
     return async (value: number) => {
       if (await invalidForm()) return;
+      // TODO: index
+      // @ts-ignore
       if (Number(value) === rect[dir]) return;
+      // TODO: index
+      // @ts-ignore
       const scale = Number(value) / rect[dir];
       const scaleX = dir === 'width' ? scale : 1;
       const scaleY = dir === 'height' ? scale : 1;
diff --git a/app/components-react/windows/go-live/dual-output/UltraDestinationSwitchers.tsx b/app/components-react/windows/go-live/dual-output/UltraDestinationSwitchers.tsx
index adde2315b1a6..b64e58d32ff6 100644
--- a/app/components-react/windows/go-live/dual-output/UltraDestinationSwitchers.tsx
+++ b/app/components-react/windows/go-live/dual-output/UltraDestinationSwitchers.tsx
@@ -115,7 +115,7 @@ function DestinationSwitcher(p: IDestinationSwitcherProps) {
   const switchInputRef = useRef<HTMLInputElement>(null);
   const containerRef = useRef<HTMLDivElement>(null);
   const platform = typeof p.destination === 'string' ? (p.destination as TPlatform) : null;
-  const enable = !p.enabled ?? (p.promptConnectTikTok && p.promptConnectTikTok === true);
+  const enable = (p.promptConnectTikTok && p.promptConnectTikTok === true) || !p.enabled;
   const { RestreamService, MagicLinkService } = Services;
   const canDisablePrimary = p.canDisablePrimary;
 
diff --git a/app/components-react/windows/go-live/useGoLiveSettings.ts b/app/components-react/windows/go-live/useGoLiveSettings.ts
index 57a41ce4c439..c9f809e8faf4 100644
--- a/app/components-react/windows/go-live/useGoLiveSettings.ts
+++ b/app/components-react/windows/go-live/useGoLiveSettings.ts
@@ -118,6 +118,8 @@ class GoLiveSettingsState extends StreamInfoView<IGoLiveSettingsState> {
       platforms.forEach(platform => {
         if (!view.supports(fieldName, [platform])) return;
         const platformSettings = getDefined(this.state.platforms[platform]);
+        // TODO: index
+        // @ts-ignore
         platformSettings[fieldName] = value;
       });
     });
@@ -193,6 +195,8 @@ export class GoLiveSettingsModule {
     // prefill the form if `prepopulateOptions` provided
     if (prepopulateOptions) {
       Object.keys(prepopulateOptions).forEach(platform => {
+        // TODO: index
+        // @ts-ignore
         Object.assign(settings.platforms[platform], prepopulateOptions[platform]);
       });
     }
diff --git a/app/components-react/windows/notifications/Notifications.tsx b/app/components-react/windows/notifications/Notifications.tsx
index a9290aef2cb9..b49144e77ddf 100644
--- a/app/components-react/windows/notifications/Notifications.tsx
+++ b/app/components-react/windows/notifications/Notifications.tsx
@@ -37,27 +37,35 @@ export default function Notifications() {
 
       {Object.keys(notificationGroups).map((groupName: string) => (
         <div key={groupName}>
-          {notificationGroups[groupName].length > 0 && (
-            <h4>{groupName === 'unread' ? $t('New Notifications') : $t('Log')}</h4>
-          )}
-          {notificationGroups[groupName].map((notify: INotification) => (
-            <div
-              key={notify.id}
-              onClick={() => onNotificationClickHandler(notify.id)}
-              className={cx(styles.notification, {
-                [styles.unread]: notify.unread,
-                [styles.hasAction]: notify.action,
-              })}
-              data-name={notify.action && 'hasAction'}
-            >
-              <div className="icon">
-                {notify.type === 'INFO' && <span className="fa fa-info-circle" />}
-                {notify.type === 'WARNING' && <span className="fa fa-warning" />}
+          {
+            // TODO: index
+            // @ts-ignore
+            notificationGroups[groupName].length > 0 && (
+              <h4>{groupName === 'unread' ? $t('New Notifications') : $t('Log')}</h4>
+            )
+          }
+          {
+            // TODO: index
+            // @ts-ignore
+            notificationGroups[groupName].map((notify: INotification) => (
+              <div
+                key={notify.id}
+                onClick={() => onNotificationClickHandler(notify.id)}
+                className={cx(styles.notification, {
+                  [styles.unread]: notify.unread,
+                  [styles.hasAction]: notify.action,
+                })}
+                data-name={notify.action && 'hasAction'}
+              >
+                <div className="icon">
+                  {notify.type === 'INFO' && <span className="fa fa-info-circle" />}
+                  {notify.type === 'WARNING' && <span className="fa fa-warning" />}
+                </div>
+                <div className="message">{notify.message}</div>
+                <div className={styles.date}>{momentize(notify.date)}</div>
               </div>
-              <div className="message">{notify.message}</div>
-              <div className={styles.date}>{momentize(notify.date)}</div>
-            </div>
-          ))}
+            ))
+          }
         </div>
       ))}
     </Scrollable>
diff --git a/app/components-react/windows/settings/Appearance.tsx b/app/components-react/windows/settings/Appearance.tsx
index 9e982157e800..eff01fee98ea 100644
--- a/app/components-react/windows/settings/Appearance.tsx
+++ b/app/components-react/windows/settings/Appearance.tsx
@@ -109,6 +109,8 @@ export function AppearanceSettings() {
             id: app.id,
             name: app.manifest?.name,
             icon: app.manifest?.icon,
+            // TODO: index
+            // @ts-ignore
             isActive: displayedAppsStatus[app.id] ?? false,
           });
         }
@@ -185,7 +187,11 @@ export function AppearanceSettings() {
               label={menuTitles(EMenuItemKey.Editor)}
               layout="horizontal"
               onChange={() => toggleMenuItem(ENavName.TopNav, EMenuItemKey.Editor)}
-              value={menuItemStatus[EMenuItemKey.Editor]}
+              value={
+                // TODO: index
+                // @ts-ignore
+                menuItemStatus[EMenuItemKey.Editor]
+              }
               disabled={!isLoggedIn || compactView || currentTab === 'default'}
             />
             <SwitchInput
@@ -201,35 +207,55 @@ export function AppearanceSettings() {
               label={menuTitles(EMenuItemKey.StudioMode)}
               layout="horizontal"
               onChange={() => toggleMenuItem(ENavName.TopNav, EMenuItemKey.StudioMode)}
-              value={menuItemStatus[EMenuItemKey.StudioMode]}
+              value={
+                // TODO: index
+                // @ts-ignore
+                menuItemStatus[EMenuItemKey.StudioMode]
+              }
               disabled={!isLoggedIn || compactView}
             />
             <SwitchInput
               label={menuTitles(EMenuItemKey.LayoutEditor)}
               layout="horizontal"
               onChange={() => toggleMenuItem(ENavName.TopNav, EMenuItemKey.LayoutEditor)}
-              value={menuItemStatus[EMenuItemKey.LayoutEditor]}
+              value={
+                // TODO: index
+                // @ts-ignore
+                menuItemStatus[EMenuItemKey.LayoutEditor]
+              }
               disabled={!isLoggedIn || compactView}
             />
             <SwitchInput
               label={menuTitles(EMenuItemKey.Themes)}
               layout="horizontal"
               onChange={() => toggleMenuItem(ENavName.TopNav, EMenuItemKey.Themes)}
-              value={menuItemStatus[EMenuItemKey.Themes]}
+              value={
+                // TODO: index
+                // @ts-ignore
+                menuItemStatus[EMenuItemKey.Themes]
+              }
               disabled={!isLoggedIn || compactView}
             />
             <SwitchInput
               label={menuTitles(EMenuItemKey.Highlighter)}
               layout="horizontal"
               onChange={() => toggleMenuItem(ENavName.TopNav, EMenuItemKey.Highlighter)}
-              value={menuItemStatus[EMenuItemKey.Highlighter]}
+              value={
+                // TODO:
+                // @ts-ignore
+                menuItemStatus[EMenuItemKey.Highlighter]
+              }
               disabled={!isLoggedIn || compactView}
             />
             <SwitchInput
               label={menuTitles(EMenuItemKey.RecordingHistory)}
               layout="horizontal"
               onChange={() => toggleMenuItem(ENavName.TopNav, EMenuItemKey.RecordingHistory)}
-              value={menuItemStatus[EMenuItemKey.RecordingHistory]}
+              value={
+                // TODO:
+                // @ts-ignore
+                menuItemStatus[EMenuItemKey.RecordingHistory]
+              }
               disabled={!isLoggedIn || compactView}
             />
           </Col>
@@ -241,7 +267,11 @@ export function AppearanceSettings() {
                 label={menuTitles(EMenuItemKey.AppStore)}
                 layout="horizontal"
                 onChange={() => toggleMenuItem(ENavName.TopNav, EMenuItemKey.AppStore)}
-                value={menuItemStatus[EMenuItemKey.AppStore]}
+                value={
+                  // TODO:
+                  // @ts-ignore
+                  menuItemStatus[EMenuItemKey.AppStore]
+                }
                 disabled={!isLoggedIn || compactView}
               />
 
diff --git a/app/components-react/windows/settings/GameOverlay.tsx b/app/components-react/windows/settings/GameOverlay.tsx
index 260e253ee45f..b33519214d66 100644
--- a/app/components-react/windows/settings/GameOverlay.tsx
+++ b/app/components-react/windows/settings/GameOverlay.tsx
@@ -54,10 +54,24 @@ export function GameOverlay() {
     return (
       <div>
         {windows.map(win => (
-          <React.Fragment key={titles[win]}>
+          <React.Fragment
+            key={
+              // TODO: index
+              // @ts-ignore
+              titles[win]
+            }
+          >
             <SwitchInput
-              label={titles[win]}
-              value={windowProperties[win].enabled}
+              label={
+                // TODO: index
+                // @ts-ignore
+                titles[win]
+              }
+              value={
+                // TODO: index
+                // @ts-ignore
+                windowProperties[win].enabled
+              }
               onInput={() => GameOverlayService.actions.toggleWindowEnabled(win)}
             />
           </React.Fragment>
diff --git a/app/components-react/windows/settings/ObsSettings.tsx b/app/components-react/windows/settings/ObsSettings.tsx
index dc02f4b31c98..27a02c9a6551 100644
--- a/app/components-react/windows/settings/ObsSettings.tsx
+++ b/app/components-react/windows/settings/ObsSettings.tsx
@@ -50,7 +50,11 @@ export function ObsSettingsSection(
  */
 function getPageComponent(page: string) {
   const componentName = Object.keys(pageComponents).find(componentName => {
+    // TODO: index
+    // @ts-ignore
     return pageComponents[componentName].page === page;
   });
+  // TODO: index
+  // @ts-ignore
   return componentName ? pageComponents[componentName] : null;
 }
diff --git a/app/components-react/windows/source-showcase/SourceGrid.tsx b/app/components-react/windows/source-showcase/SourceGrid.tsx
index 4bd387d7479e..aecbd17a1578 100644
--- a/app/components-react/windows/source-showcase/SourceGrid.tsx
+++ b/app/components-react/windows/source-showcase/SourceGrid.tsx
@@ -56,6 +56,8 @@ export default function SourceGrid(p: { activeTab: string }) {
       Object.keys(WidgetType)
         .filter((type: string) => isNaN(Number(type)) && type !== 'SubscriberGoal')
         .filter((type: string) => {
+          // TODO: index
+          // @ts-ignore
           const widgetPlatforms = WidgetDisplayData(primaryPlatform)[WidgetType[type]]?.platforms;
           if (!widgetPlatforms) return true;
           return linkedPlatforms?.some(
@@ -66,6 +68,8 @@ export default function SourceGrid(p: { activeTab: string }) {
           // show only supported widgets
           const whitelist = primaryPlatformService?.widgetsWhitelist;
           if (!whitelist) return true;
+          // TODO: index
+          // @ts-ignore
           return whitelist.includes(WidgetType[type]);
         }),
     [],
@@ -100,6 +104,8 @@ export default function SourceGrid(p: { activeTab: string }) {
       ].includes(source.value),
     );
     const essentialWidgets = iterableWidgetTypes.filter(type =>
+      // TODO: index
+      // @ts-ignore
       [WidgetType.AlertBox, WidgetType.EventList].includes(WidgetType[type]),
     );
     return { essentialDefaults, essentialWidgets };
diff --git a/app/components-react/windows/source-showcase/SourceTag.tsx b/app/components-react/windows/source-showcase/SourceTag.tsx
index dd6fe1616077..5b5ab38a3891 100644
--- a/app/components-react/windows/source-showcase/SourceTag.tsx
+++ b/app/components-react/windows/source-showcase/SourceTag.tsx
@@ -29,6 +29,8 @@ export default function SourceTag(p: {
   const { platform } = useVuex(() => ({ platform: UserService.views.platform?.type }));
 
   const displayData =
+    // TODO: index
+    // @ts-ignore
     WidgetDisplayData(platform)[WidgetType[p.type]] || SourceDisplayData()[p.type];
 
   function active() {
diff --git a/app/components-react/windows/source-showcase/index.tsx b/app/components-react/windows/source-showcase/index.tsx
index f76a512e054a..a3113d750f7e 100644
--- a/app/components-react/windows/source-showcase/index.tsx
+++ b/app/components-react/windows/source-showcase/index.tsx
@@ -93,6 +93,8 @@ function SideBar() {
   }, [inspectedAppId]);
 
   function widgetData(type: string | WidgetType) {
+    // TODO: index
+    // @ts-ignore
     return WidgetDisplayData(platform)[WidgetType[type]];
   }
 
diff --git a/app/components-react/windows/source-showcase/useSourceShowcase.tsx b/app/components-react/windows/source-showcase/useSourceShowcase.tsx
index 5bad82efec03..429e66625ac1 100644
--- a/app/components-react/windows/source-showcase/useSourceShowcase.tsx
+++ b/app/components-react/windows/source-showcase/useSourceShowcase.tsx
@@ -60,7 +60,11 @@ export class SourceShowcaseController {
 
   selectInspectedSource() {
     const inspectedSource = this.store.inspectedSource;
+    // TODO: index
+    // @ts-ignore
     if (WidgetType[inspectedSource] != null) {
+      // TODO: index
+      // @ts-ignore
       this.selectWidget(WidgetType[inspectedSource] as WidgetType);
     } else if (inspectedSource === 'streamlabel') {
       this.selectStreamlabel();
diff --git a/app/components/custom-source-properties/StreamlabelProperties.tsx b/app/components/custom-source-properties/StreamlabelProperties.tsx
index 195244d8096a..a8870e1fd7a1 100644
--- a/app/components/custom-source-properties/StreamlabelProperties.tsx
+++ b/app/components/custom-source-properties/StreamlabelProperties.tsx
@@ -254,7 +254,7 @@ export default class StreamlabelProperties extends Vue {
             onInput={(val: string) => this.handleInput(val)}
             metadata={this.metadata.labelType}
           />
-          {Object.keys(this.labelSettings).map(key => (
+          {Object.keys(this.labelSettings).map((key: keyof IStreamlabelSettings) => (
             <HFormGroup
               key={key}
               vModel={this.labelSettings[key]}
diff --git a/app/components/obs/inputs/Components.ts b/app/components/obs/inputs/Components.ts
index 0cd30ce42adc..a36e3cb932e3 100644
--- a/app/components/obs/inputs/Components.ts
+++ b/app/components/obs/inputs/Components.ts
@@ -7,6 +7,8 @@ const inputComponents = (comps as any) as { [key: string]: typeof Vue };
 
 export function propertyComponentForType(type: TObsType): typeof TsxComponent {
   const componentName = Object.keys(inputComponents).find(name => {
+    // TODO: index
+    // @ts-ignore
     const componentObsType = inputComponents[name]['obsType'];
     return Array.isArray(componentObsType)
       ? componentObsType.includes(type)
diff --git a/app/components/obs/inputs/ObsColorInput.tsx b/app/components/obs/inputs/ObsColorInput.tsx
index f94055e432b1..d387e33c0dc3 100644
--- a/app/components/obs/inputs/ObsColorInput.tsx
+++ b/app/components/obs/inputs/ObsColorInput.tsx
@@ -22,7 +22,7 @@ class ObsColorInput extends ObsInput<IObsInput<number>> {
   @debounce(500)
   setValue(hex: string) {
     const rgba = this.hexToRGB(hex);
-    if (!Object.keys(rgba).every(key => rgba[key] === this.obsColor[key])) {
+    if (!Object.keys(rgba).every((key: keyof typeof rgba) => rgba[key] === this.obsColor[key])) {
       const intColor = Utils.rgbaToInt(rgba.r, rgba.g, rgba.b, rgba.a);
       this.emitInput({ ...this.value, value: intColor });
     }
diff --git a/app/components/obs/inputs/ObsInput.ts b/app/components/obs/inputs/ObsInput.ts
index a83a692acdb0..803e06473d85 100644
--- a/app/components/obs/inputs/ObsInput.ts
+++ b/app/components/obs/inputs/ObsInput.ts
@@ -449,7 +449,7 @@ export function setPropertiesFormData(
 
     if (property.type === 'OBS_PROPERTY_FONT') {
       settings['custom_font'] = (property.value as IObsFont).path;
-      delete settings[property.name]['path'];
+      delete (settings[property.name] as IObsFont).path;
     }
   });
 
diff --git a/app/components/shared/inputs/BaseInput.ts b/app/components/shared/inputs/BaseInput.ts
index 3fd6d2f306ca..2e15a4831cd9 100644
--- a/app/components/shared/inputs/BaseInput.ts
+++ b/app/components/shared/inputs/BaseInput.ts
@@ -92,7 +92,7 @@ export abstract class BaseInput<
    */
   get validate() {
     const validations = this.getValidations();
-    Object.keys(validations).forEach(key => {
+    Object.keys(validations).forEach((key: keyof typeof validations) => {
       // VeeValidate recognizes undefined values as valid constraints
       // so just remove it
       if (validations[key] == null) delete validations[key];
diff --git a/app/components/shared/inputs/CodeInput.vue.ts b/app/components/shared/inputs/CodeInput.vue.ts
index fa8dffa0eb4e..96fc7fbb8a1c 100644
--- a/app/components/shared/inputs/CodeInput.vue.ts
+++ b/app/components/shared/inputs/CodeInput.vue.ts
@@ -28,8 +28,10 @@ export default class CodeInput extends BaseInput<string, IInputMetadata> {
 
   mounted() {
     const $textarea = this.$el.querySelector('textarea');
+    const editorOptions = this.editorOptions;
     const options = {
-      ...this.editorOptions[this.metadata.type],
+      // TODO: index, error handling
+      ...editorOptions[(this.metadata.type as unknown) as keyof typeof editorOptions],
       theme: this.theme,
     };
 
diff --git a/app/components/shared/inputs/TagsInput.tsx b/app/components/shared/inputs/TagsInput.tsx
index 05faaef77759..4a1d0986b6eb 100644
--- a/app/components/shared/inputs/TagsInput.tsx
+++ b/app/components/shared/inputs/TagsInput.tsx
@@ -91,6 +91,8 @@ export default class TagsInput extends BaseInput<
     // onSearchChange event from vue-multiselect doesn't work in tsx mode
     // so bind a native listener for the search input
     this.$el.querySelector('input[type=text]').addEventListener('keyup', (e: InputEvent) => {
+      // TODO: index
+      // @ts-ignore
       this.onSearchChangeHandler(e.currentTarget['value']);
     });
   }
diff --git a/app/components/tsx-component.ts b/app/components/tsx-component.ts
index d39d0ee91b33..e359bafa9b22 100644
--- a/app/components/tsx-component.ts
+++ b/app/components/tsx-component.ts
@@ -6,6 +6,8 @@ export function createProps<TProps extends new () => any>(
   const propsObj = {};
   const props = new propsClass();
   Object.keys(props).forEach((key: string) => {
+    // TODO: index
+    // @ts-ignore
     propsObj[key] = { default: props[key] };
   });
   return propsObj;
diff --git a/app/components/widgets/AlertBox.vue.ts b/app/components/widgets/AlertBox.vue.ts
index 7cfc4da42db5..1564640e834e 100644
--- a/app/components/widgets/AlertBox.vue.ts
+++ b/app/components/widgets/AlertBox.vue.ts
@@ -46,13 +46,19 @@ export default class AlertBox extends WidgetSettings<IAlertBoxData, AlertBoxServ
   $refs: { [key: string]: HTMLElement };
 
   afterFetch() {
+    // TODO: index
+    // @ts-ignore
     this.alertTypes = this.alertTypes.filter(type => this.wData.settings[type]);
     const languages = this.wData.tts_languages;
     this.languages = Object.keys(languages)
       .map(category => ({
         label: category,
+        // TODO: index
+        // @ts-ignore
         options: Object.keys(languages[category]).map(key => ({
           value: key,
+          // TODO: index
+          // @ts-ignore
           label: languages[category][key],
         })),
       }))
@@ -60,6 +66,8 @@ export default class AlertBox extends WidgetSettings<IAlertBoxData, AlertBoxServ
   }
 
   alertName(alertType: string) {
+    // TODO: index
+    // @ts-ignore
     return alertNameMap()[alertType];
   }
 
@@ -83,6 +91,8 @@ export default class AlertBox extends WidgetSettings<IAlertBoxData, AlertBoxServ
     if (this.selectedAlert === 'general') {
       return this.wData;
     }
+    // TODO: index
+    // @ts-ignore
     return this.wData.settings[this.selectedAlert].variations.find(
       (variation: IAlertBoxVariation) => variation.id === this.selectedId,
     );
@@ -122,10 +132,14 @@ export default class AlertBox extends WidgetSettings<IAlertBoxData, AlertBoxServ
   }
 
   get minTriggerAmount() {
+    // TODO: index
+    // @ts-ignore
     return this.wData.settings[triggerAmountMap[this.selectedAlert]];
   }
 
   set minTriggerAmount(value: number) {
+    // TODO: index
+    // @ts-ignore
     this.wData.settings[triggerAmountMap[this.selectedAlert]] = value;
   }
 
@@ -166,6 +180,8 @@ export default class AlertBox extends WidgetSettings<IAlertBoxData, AlertBoxServ
 
   addAlert(type: string) {
     const newVariation = this.alertBoxService.newVariation(type);
+    // TODO: index
+    // @ts-ignore
     this.wData.settings[type].variations.push(newVariation);
     this.selectedAlert = type;
     this.addAlertMenuOpen = false;
@@ -175,6 +191,8 @@ export default class AlertBox extends WidgetSettings<IAlertBoxData, AlertBoxServ
 
   removeVariation(id: string) {
     this.selectedId = `default-${this.selectedAlert}`;
+    // TODO: index
+    // @ts-ignore
     this.wData.settings[this.selectedAlert].variations = this.wData.settings[
       this.selectedAlert
     ].variations.filter((variation: IAlertBoxVariation) => variation.id !== id);
@@ -186,6 +204,8 @@ export default class AlertBox extends WidgetSettings<IAlertBoxData, AlertBoxServ
     this.selectedId = id;
     // Above is done here with a stop propagation in the input to avoid possible race conditions which would lead to
     // this.selectedVariation potentially being incorrect
+    // TODO: index
+    // @ts-ignore
     const field: HTMLInputElement = this.$refs[`${id}-name-input`][0];
     this.$nextTick(() => field.focus());
   }
diff --git a/app/components/widgets/CodeEditor.vue.ts b/app/components/widgets/CodeEditor.vue.ts
index 10ff144fb182..69a7e486427d 100644
--- a/app/components/widgets/CodeEditor.vue.ts
+++ b/app/components/widgets/CodeEditor.vue.ts
@@ -32,6 +32,8 @@ export default class CodeEditor extends Vue {
   value!: IWidgetData;
 
   editorInputValue =
+    // TODO: index
+    // @ts-ignore
     this.value.settings[`custom_${this.metadata.type}`] ||
     this.selectedVariation.settings[this.alertBoxValue];
 
@@ -65,6 +67,8 @@ export default class CodeEditor extends Vue {
 
   get selectedVariation() {
     if (!this.metadata.selectedAlert || !this.metadata.selectedId) return;
+    // TODO: index
+    // @ts-ignore
     return this.value.settings[this.metadata.selectedAlert].variations.find(
       (variation: IAlertBoxVariation) => variation.id === this.metadata.selectedId,
     );
@@ -73,11 +77,15 @@ export default class CodeEditor extends Vue {
   setCustomCode(newData: IWidgetData) {
     const type = this.metadata.type;
     if (this.selectedVariation) {
+      // TODO: index
+      // @ts-ignore
       const newVariation = newData.settings[this.metadata.selectedAlert].variations.find(
         (variation: IAlertBoxVariation) => variation.id === this.metadata.selectedId,
       );
       newVariation.settings[this.alertBoxValue] = this.editorInputValue;
     } else {
+      // TODO: index
+      // @ts-ignore
       newData.settings[`custom_${type}`] = this.editorInputValue;
     }
 
@@ -106,6 +114,8 @@ export default class CodeEditor extends Vue {
   restoreDefaults() {
     const type = this.metadata.type;
     if (this.value.custom_defaults) {
+      // TODO: index
+      // @ts-ignore
       this.editorInputValue = this.value.custom_defaults[type];
     } else {
       this.onFailHandler($t('This widget does not have defaults.'));
diff --git a/app/components/widgets/Credits.vue.ts b/app/components/widgets/Credits.vue.ts
index 3668720dd8cc..53cdaa7bfd0e 100644
--- a/app/components/widgets/Credits.vue.ts
+++ b/app/components/widgets/Credits.vue.ts
@@ -24,6 +24,8 @@ export default class Credits extends WidgetSettings<ICreditsData, CreditsService
   }
 
   optionIterable(map: Dictionary<string>) {
+    // TODO: index
+    // @ts-ignore
     return Object.keys(map).filter(option => this.wData.settings[option] != null);
   }
 
diff --git a/app/components/widgets/CustomFieldsEditor.vue.ts b/app/components/widgets/CustomFieldsEditor.vue.ts
index fc746e8a1589..329d85249f97 100644
--- a/app/components/widgets/CustomFieldsEditor.vue.ts
+++ b/app/components/widgets/CustomFieldsEditor.vue.ts
@@ -121,15 +121,21 @@ export default class CustomFieldsEditor extends Vue {
   created() {
     this.customFields = this.selectedVariation
       ? this.selectedVariation.settings.customJson
-      : this.value.settings['custom_json'];
+      : // TODO: index
+        // @ts-ignore
+        this.value.settings['custom_json'];
     this.editorInputValue = this.selectedVariation
       ? this.selectedVariation.settings.customJson
-      : this.value.settings['custom_json'];
+      : // TODO: index
+        // @ts-ignore
+        this.value.settings['custom_json'];
     this.settingsService = this.widgetsService.getWidgetSettingsService(this.value.type);
   }
 
   get selectedVariation() {
     if (!this.metadata.selectedAlert || !this.metadata.selectedId) return;
+    // TODO: index
+    // @ts-ignore
     return this.value.settings[this.metadata.selectedAlert].variations.find(
       (variation: IAlertBoxVariation) => variation.id === this.metadata.selectedId,
     );
@@ -189,11 +195,15 @@ export default class CustomFieldsEditor extends Vue {
 
   setCustomJson(newData: IWidgetData) {
     if (this.selectedVariation) {
+      // TODO: index
+      // @ts-ignore
       const newVariation = newData.settings[this.metadata.selectedAlert].variations.find(
         (variation: IAlertBoxVariation) => variation.id === this.metadata.selectedId,
       );
       newVariation.settings.customJson = this.customFields;
     } else {
+      // TODO: index
+      // @ts-ignore
       newData.settings['custom_json'] = this.customFields;
     }
     return newData;
@@ -249,6 +259,8 @@ export default class CustomFieldsEditor extends Vue {
 
   emitInput(newValue: IWidgetData) {
     this.$emit('input', newValue);
+    // TODO: index
+    // @ts-ignore
     this.editorInputValue = newValue.settings['custom_json'];
   }
 
diff --git a/app/components/widgets/EventList.vue.ts b/app/components/widgets/EventList.vue.ts
index 1ef6ab64db7e..27da0820a3e0 100644
--- a/app/components/widgets/EventList.vue.ts
+++ b/app/components/widgets/EventList.vue.ts
@@ -43,10 +43,14 @@ export default class EventList extends WidgetSettings<IEventListData, EventListS
   }
 
   valueForEvent(event: { key: string; title: string }) {
+    // TODO: index
+    // @ts-ignore
     return this.wData.settings[event.key];
   }
 
   setEvent(event: { key: string; title: string }, value: boolean) {
+    // TODO: index
+    // @ts-ignore
     this.wData.settings[event.key] = value;
   }
 
diff --git a/app/components/widgets/SponsorBanner.vue.ts b/app/components/widgets/SponsorBanner.vue.ts
index 14f5950644ae..5eb0db1c8f54 100644
--- a/app/components/widgets/SponsorBanner.vue.ts
+++ b/app/components/widgets/SponsorBanner.vue.ts
@@ -10,6 +10,8 @@ import VFormGroup from 'components/shared/inputs/VFormGroup.vue';
 import { $t } from 'services/i18n';
 import ValidatedForm from 'components/shared/inputs/ValidatedForm';
 
+type Position = '1' | '2';
+
 @Component({
   components: {
     WidgetEditor,
@@ -31,7 +33,7 @@ export default class SponsorBanner extends WidgetSettings<
   showDurationTooltip = $t('The amount of time the widget will appear.');
   animationTooltip = $t('These are the animations that are used to show your banner.');
 
-  get positions() {
+  get positions(): Position[] {
     if (!this.loaded) return ['1'];
     return this.wData.settings.placement_options === 'double' ? ['1', '2'] : ['1'];
   }
@@ -51,14 +53,14 @@ export default class SponsorBanner extends WidgetSettings<
     return decodeURIComponent(href.split(/[\\/]/).pop());
   }
 
-  addImage(placement: string) {
+  addImage(placement: Position) {
     this.wData.settings[`placement_${placement}_images`].push({
       href: $t('No Image'),
       duration: 10,
     });
   }
 
-  removeImage(href: string, placement: string) {
+  removeImage(href: string, placement: Position) {
     this.wData.settings[`placement_${placement}_images`] = this.wData.settings[
       `placement_${placement}_images`
     ].filter((image: { href: string }) => image.href !== href);
diff --git a/app/components/widgets/TipJar.vue.ts b/app/components/widgets/TipJar.vue.ts
index 342a1f5dfeaf..dd0e8078d5f1 100644
--- a/app/components/widgets/TipJar.vue.ts
+++ b/app/components/widgets/TipJar.vue.ts
@@ -70,7 +70,7 @@ export default class TipJar extends WidgetSettings<ITipJarData, TipJarService> {
     ];
   }
 
-  titleFromKey(key: string) {
+  titleFromKey(key: keyof typeof nameMap) {
     return nameMap()[key];
   }
 
@@ -85,8 +85,11 @@ export default class TipJar extends WidgetSettings<ITipJarData, TipJarService> {
   }
 
   get mediaGalleryInputs() {
-    if (!mediaGalleryInputs[this.platform]) return [];
-    return mediaGalleryInputs[this.platform];
+    if (!Object.keys(mediaGalleryInputs).includes(this.platform)) {
+      return [];
+    }
+
+    return mediaGalleryInputs[this.platform as keyof typeof mediaGalleryInputs];
   }
 
   afterFetch() {
diff --git a/app/components/widgets/WidgetSettings.vue.ts b/app/components/widgets/WidgetSettings.vue.ts
index 35b207f45aec..b0221322b8f7 100644
--- a/app/components/widgets/WidgetSettings.vue.ts
+++ b/app/components/widgets/WidgetSettings.vue.ts
@@ -99,7 +99,7 @@ export default class WidgetSettings<
       this.requestState = 'success';
     } catch (e: unknown) {
       const errorMessage =
-        e && e['message'] ? e['message'] : $t('Save failed, something went wrong.');
+        (e as { message?: string }).message || $t('Save failed, something went wrong.');
       this.dataUpdatedHandler(this.lastSuccessfullySavedWData);
       this.requestState = 'fail';
       this.failHandler(errorMessage);
diff --git a/app/components/widgets/goal/GenericGoal.vue.ts b/app/components/widgets/goal/GenericGoal.vue.ts
index 998db591df84..5962e4fb78ed 100644
--- a/app/components/widgets/goal/GenericGoal.vue.ts
+++ b/app/components/widgets/goal/GenericGoal.vue.ts
@@ -57,6 +57,8 @@ export default class GenericGoal extends WidgetSettings<IGoalData, GenericGoalSe
       await this.service.saveGoal(this.goalCreateOptions);
       this.requestState = 'success';
     } catch (e: unknown) {
+      // TODO: index
+      // @ts-ignore
       this.failHandler(e['message']);
       this.requestState = 'fail';
     }
diff --git a/app/components/windows/ChildWindow.tsx b/app/components/windows/ChildWindow.tsx
index 70f071d46f0d..3850f3b7283d 100644
--- a/app/components/windows/ChildWindow.tsx
+++ b/app/components/windows/ChildWindow.tsx
@@ -8,7 +8,7 @@ import { TitleBar } from 'components/shared/ReactComponentList';
 import { AppService } from 'services/app';
 import styles from './ChildWindow.m.less';
 import ModalWrapper from '../shared/modals/ModalWrapper';
-import antdThemes from 'styles/antd/index';
+import antdThemes, { Theme } from 'styles/antd/index';
 
 @Component({})
 export default class ChildWindow extends Vue {
@@ -22,6 +22,8 @@ export default class ChildWindow extends Vue {
 
   unbind: () => void;
 
+  theme: Theme = 'night-theme';
+
   mounted() {
     this.unbind = this.customizationService.state.bindProps(this, {
       theme: 'theme',
@@ -46,8 +48,6 @@ export default class ChildWindow extends Vue {
     return this.windowsService.state.child;
   }
 
-  theme = 'night-theme';
-
   get currentComponent() {
     return this.components[this.components.length - 1];
   }
@@ -61,7 +61,7 @@ export default class ChildWindow extends Vue {
   }
 
   @Watch('theme')
-  updateAntd(newTheme: string, oldTheme: string) {
+  updateAntd(newTheme: Theme, oldTheme: Theme) {
     antdThemes[oldTheme].unuse();
     antdThemes[newTheme].use();
   }
@@ -152,6 +152,8 @@ export default class ChildWindow extends Vue {
         <ModalWrapper renderFn={this.modalOptions?.renderFn} />
 
         {this.componentsToRender.map((comp, index) => {
+          // TODO: index
+          // @ts-ignore
           const ChildWindowComponent = getComponents()[comp.componentName];
           return (
             <ChildWindowComponent key={`${comp.componentName}-${index}`} vShow={comp.isShown} />
diff --git a/app/components/windows/EventFilterMenu.tsx b/app/components/windows/EventFilterMenu.tsx
index 488f97de9aaf..23aad0066128 100644
--- a/app/components/windows/EventFilterMenu.tsx
+++ b/app/components/windows/EventFilterMenu.tsx
@@ -73,8 +73,8 @@ export default class EventFilterMenu extends TsxComponent<{}> {
   get renderGeneralFilters() {
     return (
       <div class={styles.generalFilters}>
-        {Object.keys(this.mainFilters).map(filter => (
-          <div>{this.renderBooleanInput(filter, this.mainFilters[filter])}</div>
+        {Object.entries(this.mainFilters).map(([name, filter]) => (
+          <div>{this.renderBooleanInput(name, filter)}</div>
         ))}
       </div>
     );
@@ -85,9 +85,9 @@ export default class EventFilterMenu extends TsxComponent<{}> {
       <div class={styles.halfWidth}>
         <div>{this.renderBooleanInput('subscription', this.subFilters['subscription'], true)}</div>
         {this.subsEnabled &&
-          Object.keys(this.subFilters)
-            .filter(filter => filter !== 'subscription')
-            .map(filter => <div>{this.renderBooleanInput(filter, this.subFilters[filter])}</div>)}
+          Object.entries(this.subFilters)
+            .filter(([name]) => name !== 'subscription')
+            .map(([name, filter]) => <div>{this.renderBooleanInput(name, filter)}</div>)}
       </div>
     );
   }
@@ -98,16 +98,14 @@ export default class EventFilterMenu extends TsxComponent<{}> {
         <div>{this.renderBooleanInput('resub', this.resubFilters['resub'], true)}</div>
         <div class={styles.resubOptions}>
           {this.resubsEnabled &&
-            Object.keys(this.resubFilters)
+            Object.entries(this.resubFilters)
               .filter(
-                key =>
-                  !/months/.test(key) &&
-                  key !== 'resub' &&
-                  key !== 'filter_subscription_minimum_enabled',
+                ([name]) =>
+                  !/months/.test(name) &&
+                  name !== 'resub' &&
+                  name !== 'filter_subscription_minimum_enabled',
               )
-              .map(filter => (
-                <div>{this.renderBooleanInput(filter, this.resubFilters[filter])}</div>
-              ))}
+              .map(([name, filter]) => <div>{this.renderBooleanInput(name, filter)}</div>)}
         </div>
         {this.renderResubMonthsFilter}
       </div>
diff --git a/app/components/windows/Main.vue.ts b/app/components/windows/Main.vue.ts
index 0ccfc1e7e985..4e13e11a7d62 100644
--- a/app/components/windows/Main.vue.ts
+++ b/app/components/windows/Main.vue.ts
@@ -40,7 +40,7 @@ import { IModalOptions, WindowsService } from 'services/windows';
 import ResizeBar from 'components/shared/ResizeBar.vue';
 import { getPlatformService } from 'services/platforms';
 import ModalWrapper from '../shared/modals/ModalWrapper';
-import antdThemes from 'styles/antd/index';
+import antdThemes, { Theme } from 'styles/antd/index';
 
 @Component({
   components: {
@@ -82,6 +82,9 @@ export default class Main extends Vue {
     renderFn: null,
   };
 
+  theme: Theme = 'night-theme';
+  minEditorWidth = 500;
+
   created() {
     window.addEventListener('resize', this.windowSizeHandler);
   }
@@ -108,7 +111,7 @@ export default class Main extends Vue {
   }
 
   @Watch('theme')
-  updateAntd(newTheme: string, oldTheme: string) {
+  updateAntd(newTheme: Theme, oldTheme: Theme) {
     antdThemes[oldTheme].unuse();
     antdThemes[newTheme].use();
   }
@@ -130,8 +133,6 @@ export default class Main extends Vue {
     this.unbind();
   }
 
-  minEditorWidth = 500;
-
   get title() {
     return this.windowsService.state.main.title;
   }
@@ -144,8 +145,6 @@ export default class Main extends Vue {
     return this.navigationService.state.params;
   }
 
-  theme = 'night-theme';
-
   get applicationLoading() {
     return this.appService.state.loading;
   }
diff --git a/app/components/windows/OneOffWindow.vue.ts b/app/components/windows/OneOffWindow.vue.ts
index cc5ce87fe083..ccb269ca0b10 100644
--- a/app/components/windows/OneOffWindow.vue.ts
+++ b/app/components/windows/OneOffWindow.vue.ts
@@ -5,7 +5,7 @@ import { getComponents, WindowsService } from 'services/windows';
 import { CustomizationService } from 'services/customization';
 import Util from 'services/utils';
 import { TitleBar } from 'components/shared/ReactComponentList';
-import antdThemes from 'styles/antd/index';
+import antdThemes, { Theme } from 'styles/antd/index';
 
 @Component({
   components: {
@@ -42,7 +42,7 @@ export default class OneOffWindow extends Vue {
   }
 
   @Watch('theme')
-  updateAntd(newTheme: string, oldTheme: string) {
+  updateAntd(newTheme: Theme, oldTheme: Theme) {
     antdThemes[oldTheme].unuse();
     antdThemes[newTheme].use();
   }
diff --git a/app/components/windows/WidgetEditor.vue.ts b/app/components/windows/WidgetEditor.vue.ts
index 2fe15666f660..da6a38d22228 100644
--- a/app/components/windows/WidgetEditor.vue.ts
+++ b/app/components/windows/WidgetEditor.vue.ts
@@ -106,6 +106,9 @@ export default class WidgetEditor extends TsxComponent<WidgetEditorProps> {
     ) {
       return;
     }
+    // TODO: index
+    // WONTFIX till AlertBox replacement
+    // @ts-ignore
     return this.wData.settings[this.props.selectedAlert].variations.find(
       (variation: IAlertBoxVariation) => variation.id === this.props.selectedId,
     );
diff --git a/app/components/windows/settings/DeveloperSettings.tsx b/app/components/windows/settings/DeveloperSettings.tsx
index f9811ce706c8..8b079db88a0e 100644
--- a/app/components/windows/settings/DeveloperSettings.tsx
+++ b/app/components/windows/settings/DeveloperSettings.tsx
@@ -132,7 +132,11 @@ export default class DeveloperSettings extends Vue {
     const settings: Partial<ITcpServersSettings> = {};
     settingsData.forEach(subCategory => {
       subCategory.parameters.forEach(parameter => {
+        // TODO: index
+        // @ts-ignore
         if (!settings[subCategory.codeSubCategory]) settings[subCategory.codeSubCategory] = {};
+        // TODO: index
+        // @ts-ignore
         settings[subCategory.codeSubCategory][parameter.name] = parameter.value;
       });
     });
diff --git a/app/components/windows/settings/NotificationsSettings.vue.ts b/app/components/windows/settings/NotificationsSettings.vue.ts
index 352e23f3258d..87a23900d6b2 100644
--- a/app/components/windows/settings/NotificationsSettings.vue.ts
+++ b/app/components/windows/settings/NotificationsSettings.vue.ts
@@ -23,6 +23,8 @@ export default class NotificationsSettings extends Vue {
   saveNotificationsSettings(formData: TObsFormData) {
     const settings: Partial<INotificationsSettings> = {};
     formData.forEach(formInput => {
+      // TODO: index
+      // @ts-ignore
       settings[formInput.name] = formInput.value;
     });
     this.notificationsService.setSettings(settings);
@@ -32,6 +34,8 @@ export default class NotificationsSettings extends Vue {
   saveTroubleshooterSettings(formData: TObsFormData) {
     const settings: Partial<ITroubleshooterSettings> = {};
     formData.forEach(formInput => {
+      // TODO: index
+      // @ts-ignore
       settings[formInput.name] = formInput.value;
     });
     this.troubleshooterService.setSettings(settings);
diff --git a/app/services-manager.ts b/app/services-manager.ts
index 20175770ecbe..42981dbf90a9 100644
--- a/app/services-manager.ts
+++ b/app/services-manager.ts
@@ -37,7 +37,7 @@ export class ServicesManager extends Service {
   init() {
     // this helps to debug services from the console
     if (Utils.isDevMode() || process.env.SLOBS_PRODUCTION_DEBUG) {
-      window['sm'] = this;
+      (window as typeof window & { sm: ServicesManager }).sm = this;
     }
 
     // Renderer windows access services in the worker window via proxy API
@@ -70,7 +70,8 @@ export class ServicesManager extends Service {
   }
 
   getStatefulServicesAndMutators(): Dictionary<typeof StatefulService> {
-    const statefulServices = {};
+    const statefulServices: Dictionary<typeof StatefulService> = {};
+
     Object.keys(this.services).forEach(serviceName => {
       const ServiceClass = this.services[serviceName];
       if (typeof ServiceClass === 'object') return; // skip AppServices object
@@ -79,6 +80,7 @@ export class ServicesManager extends Service {
       if (!isStatefulService && !isMutator) return;
       statefulServices[serviceName] = this.services[serviceName];
     });
+
     return statefulServices;
   }
 
diff --git a/app/services/api/external-api.ts b/app/services/api/external-api.ts
index fcd3385cd3fc..7d599669ddf1 100644
--- a/app/services/api/external-api.ts
+++ b/app/services/api/external-api.ts
@@ -84,6 +84,8 @@ export class ExternalApiService extends RpcApi {
   init() {
     // initialize all singletons
     Object.keys(this.resources).forEach(resourceName => {
+      // TODO: index
+      // @ts-ignore
       const Resource = this.resources[resourceName];
       if (Resource && Resource.isSingleton) this.instances[resourceName] = new Resource();
     });
@@ -107,6 +109,8 @@ export class ExternalApiService extends RpcApi {
     const helperName = resourceId.split('[')[0];
     const constructorArgsStr = resourceId.slice(helperName.length);
     const constructorArgs = constructorArgsStr ? JSON.parse(constructorArgsStr) : void 0;
+    // TODO: index
+    // @ts-ignore
     const Helper = this.resources[helperName];
     if (Helper) {
       return this.applyFallbackProxy(new (Helper as any)(...constructorArgs));
diff --git a/app/services/api/internal-api-client.ts b/app/services/api/internal-api-client.ts
index 4f15866ec810..c3dc171d3884 100644
--- a/app/services/api/internal-api-client.ts
+++ b/app/services/api/internal-api-client.ts
@@ -59,20 +59,34 @@ export class InternalApiClient {
           return this.applyIpcProxy(target, true, true);
         }
 
+        // TODO: index
+        // @ts-ignore
         if (!target[property]) return target[property];
 
+        // TODO: index
+        // @ts-ignore
         if (typeof target[property] !== 'function' && !(target[property] instanceof Observable)) {
+          // TODO: index
+          // @ts-ignore
           return target[property];
         }
 
         if (
+          // TODO: index
+          // @ts-ignore
           typeof target[property] === 'function' &&
+          // TODO: index
+          // @ts-ignore
           target[property]['__executeInCurrentWindow']
         ) {
+          // TODO: index
+          // @ts-ignore
           return target[property];
         }
 
         const methodName = property.toString();
+        // TODO: index
+        // @ts-ignore
         const isHelper = target['_isHelper'];
 
         // TODO: Remove once you're sure this is impossible
@@ -85,7 +99,11 @@ export class InternalApiClient {
           shouldReturn,
         });
 
+        // TODO: index
+        // @ts-ignore
         if (typeof target[property] === 'function') return handler;
+        // TODO: index
+        // @ts-ignore
         if (target[property] instanceof Observable) return handler();
       },
     });
diff --git a/app/services/api/rpc-api.ts b/app/services/api/rpc-api.ts
index ad854665f48b..910a5438b4e7 100644
--- a/app/services/api/rpc-api.ts
+++ b/app/services/api/rpc-api.ts
@@ -280,7 +280,7 @@ export abstract class RpcApi extends Service {
       this.requestErrors.push(`Resource not found: ${resourceId}`);
       return null;
     }
-    const resourceScheme = {};
+    const resourceScheme: Dictionary<string> = {};
 
     // collect resource keys from the whole prototype chain
     const keys: string[] = [];
@@ -298,8 +298,8 @@ export abstract class RpcApi extends Service {
   }
 
   private getResourceModel(helper: Object): Object {
-    if (helper['getModel'] && typeof helper['getModel'] === 'function') {
-      return helper['getModel']();
+    if ('getModel' in helper && typeof helper.getModel === 'function') {
+      return helper.getModel();
     }
     return {};
   }
diff --git a/app/services/app/app-decorators.ts b/app/services/app/app-decorators.ts
index 9b2208c9d400..944dd58983d5 100644
--- a/app/services/app/app-decorators.ts
+++ b/app/services/app/app-decorators.ts
@@ -30,6 +30,8 @@ export function RunInLoadingMode(options: IRunInLoadingModeOptions = {}): any {
 export function SyncWithValue() {
   return createDecorator((options, key) => {
     // create watchers and props.value if don't exist
+    // TODO: index
+    // @ts-ignore
     (options.props || (options.props = {}))['value'] = null;
     if (!options.watch) options.watch = {};
 
@@ -42,12 +44,20 @@ export function SyncWithValue() {
       immediate: true, // immediate call will setup the initial local value
       handler(newVal) {
         // update the local value
+        // TODO: index
+        // @ts-ignore
         this[key] = cloneDeep(newVal);
         // changing the prop should not trigger the `input` event
         // only changes of local value inside component should trigger this event
+        // TODO: index
+        // @ts-ignore
         if (!this['_isNotInitialCall']) {
+          // TODO: index
+          // @ts-ignore
           this['_isNotInitialCall'] = true;
         } else {
+          // TODO: index
+          // @ts-ignore
           this['_shouldSkipNextWatcher'] = true;
         }
       },
@@ -57,9 +67,15 @@ export function SyncWithValue() {
     options.watch[key] = {
       deep: true,
       handler(newVal) {
+        // TODO: index
+        // @ts-ignore
         if (!this['_shouldSkipNextWatcher']) {
+          // TODO: index
+          // @ts-ignore
           this['$emit']('input', cloneDeep(newVal));
         }
+        // TODO: index
+        // @ts-ignore
         this['_shouldSkipNextWatcher'] = false;
       },
     };
diff --git a/app/services/audio/audio.ts b/app/services/audio/audio.ts
index b35425771499..b3c1120f9c59 100644
--- a/app/services/audio/audio.ts
+++ b/app/services/audio/audio.ts
@@ -230,12 +230,12 @@ export class AudioService extends StatefulService<IAudioSourcesState> {
     // Fader is ignored by this method.  Use setFader instead
     const newPatch = omit(patch, 'fader');
 
-    Object.keys(newPatch).forEach(name => {
+    Object.keys(newPatch).forEach((name: keyof typeof newPatch) => {
       const value = newPatch[name];
       if (value === void 0) return;
 
       if (name === 'syncOffset') {
-        obsInput.syncOffset = AudioService.msToTimeSpec(value);
+        obsInput.syncOffset = AudioService.msToTimeSpec(value as typeof newPatch['syncOffset']);
       } else if (name === 'forceMono') {
         if (this.views.getSource(sourceId).forceMono !== value) {
           value
@@ -243,8 +243,10 @@ export class AudioService extends StatefulService<IAudioSourcesState> {
             : (obsInput.flags -= obs.ESourceFlags.ForceMono);
         }
       } else if (name === 'muted') {
-        this.sourcesService.setMuted(sourceId, value);
+        this.sourcesService.setMuted(sourceId, value as typeof newPatch['muted']);
       } else {
+        // TODO: index
+        // @ts-ignore
         obsInput[name] = value;
       }
     });
diff --git a/app/services/core/service-helper.ts b/app/services/core/service-helper.ts
index 7e40301f917d..c2b1a9ed1a55 100644
--- a/app/services/core/service-helper.ts
+++ b/app/services/core/service-helper.ts
@@ -16,28 +16,44 @@ import Utils from 'services/utils';
 
 export function ServiceHelper(parentServiceName: string) {
   return function <T extends { new (...args: any[]): {} }>(constr: T) {
+    // TODO: index
+    // @ts-ignore
     constr['_isHelperFor'] = parentServiceName;
     const klass = class extends constr {
       constructor(...args: any[]) {
         super(...args);
+        // TODO: index
+        // @ts-ignore
         this['_isHelper'] = true;
+        // TODO: index
+        // @ts-ignore
         this['_constructorArgs'] = args;
+        // TODO: index
+        // @ts-ignore
         this['_resourceId'] = constr.name + JSON.stringify(args);
 
         return new Proxy(this, {
           get: (target, key: string) => {
             if (
+              // TODO: index
+              // @ts-ignore
               typeof target[key] === 'function' &&
               key !== 'isDestroyed' &&
+              // TODO: index
+              // @ts-ignore
               target['isDestroyed']()
             ) {
               return () => {
                 throw new Error(
+                  // TODO: index
+                  // @ts-ignore
                   `Trying to call the method "${key}" on destroyed object "${this['_resourceId']}"`,
                 );
               };
             }
 
+            // TODO: index
+            // @ts-ignore
             return target[key];
           },
         });
@@ -61,6 +77,8 @@ export function ExecuteInWorkerProcess(): MethodDecorator {
         }
 
         // TODO: Find something better than global var
+        // TODO: index
+        // @ts-ignore
         return window['servicesManager'].internalApiClient.getRequestHandler(this, property, {
           isAction: false,
           shouldReturn: true,
diff --git a/app/services/core/service.ts b/app/services/core/service.ts
index 3199604d7d58..62a085dd7fac 100644
--- a/app/services/core/service.ts
+++ b/app/services/core/service.ts
@@ -61,6 +61,8 @@ function getActionProxy<T extends Service>(
       return (...args: unknown[]) => {
         return new Promise<unknown>((resolve, reject) => {
           try {
+            // TODO: index
+            // @ts-ignore
             const result: unknown = (target[key] as Function).apply(target, args);
             isReturn ? resolve(result) : resolve(undefined);
           } catch (e: unknown) {
@@ -90,11 +92,17 @@ export abstract class Service {
   serviceName = this.constructor.name;
 
   static get instance() {
+    // TODO: index
+    // @ts-ignore
     const instance = !this.hasInstance ? Service.createInstance(this) : this[singleton];
 
     if (this.proxyFn) {
+      // TODO: index
+      // @ts-ignore
       if (!proxies[this.name]) proxies[this.name] = this.proxyFn(instance);
 
+      // TODO: index
+      // @ts-ignore
       return proxies[this.name];
     } else {
       return instance;
@@ -102,6 +110,8 @@ export abstract class Service {
   }
 
   static get hasInstance(): boolean {
+    // TODO: index
+    // @ts-ignore
     return !!instances[this.name];
   }
 
diff --git a/app/services/core/stateful-service.ts b/app/services/core/stateful-service.ts
index baad9a227c67..1c5c1c4a07b8 100644
--- a/app/services/core/stateful-service.ts
+++ b/app/services/core/stateful-service.ts
@@ -155,6 +155,8 @@ export function getModule(ModuleContainer: any): Module<any, any> {
   for (const mutationName in prototypeMutations) {
     const serviceName = mutationName.split('.')[0];
     if (serviceName !== (ModuleContainer._isHelperFor ?? ModuleContainer.name)) continue;
+    // TODO: index
+    // @ts-ignore
     mutations[mutationName] = prototypeMutations[mutationName];
   }
 
@@ -187,6 +189,8 @@ export abstract class ViewHandler<TState extends object> {
     service: TService,
   ): InstanceType<TService>['views'] {
     // TODO: Working around circular reference
+    // TODO: index
+    // @ts-ignore
     return window['servicesManager'].getResource(service.name).views;
   }
 }
diff --git a/app/services/customization.ts b/app/services/customization.ts
index 436f052d5c43..f42f0faa3536 100644
--- a/app/services/customization.ts
+++ b/app/services/customization.ts
@@ -9,6 +9,7 @@ import { AppService } from './app';
 import * as obs from '../../obs-api';
 import { RealmObject } from './realm';
 import { ObjectSchema } from 'realm';
+import { Theme } from 'styles/antd';
 
 // Maps to --background
 const THEME_BACKGROUNDS = {
@@ -158,6 +159,8 @@ export class CustomizationState extends RealmObject {
   }
 
   get displayBackground() {
+    // TODO: index
+    // @ts-ignore
     return DISPLAY_BACKGROUNDS[this.theme];
   }
 }
@@ -216,8 +219,9 @@ export class CustomizationService extends Service {
     this.settingsChanged.next(settingsPatch);
   }
 
-  get currentTheme() {
-    return this.state.theme;
+  get currentTheme(): Theme {
+    // TODO: one level deeper is Realm, keep string for now
+    return this.state.theme as Theme;
   }
 
   setTheme(theme: string) {
diff --git a/app/services/diagnostics.ts b/app/services/diagnostics.ts
index 9ee3bdefa8ac..7d2ef647a83b 100644
--- a/app/services/diagnostics.ts
+++ b/app/services/diagnostics.ts
@@ -113,6 +113,8 @@ class Section {
         }
       }
 
+      // TODO: index
+      // @ts-ignore
       const value = data[key] as unknown;
 
       if (typeof value === 'object' && value != null) {
@@ -508,6 +510,8 @@ export class DiagnosticsService extends PersistentStatefulService<IDiagnosticsSe
         },
         'Connected Platforms': Object.keys(this.userService.views.platforms).map(p => {
           return {
+            // TODO: index
+            // @ts-ignore
             Username: this.userService.views.platforms[p].username,
             Platform: p,
           };
@@ -548,11 +552,19 @@ export class DiagnosticsService extends PersistentStatefulService<IDiagnosticsSe
       const fpsObj = { Type: setting.fpsType.toString() };
 
       if (fpsObj.Type === 'Common FPS Values') {
+        // TODO: index
+        // @ts-ignore
         fpsObj['Value'] = setting.fpsCom;
       } else if (fpsObj.Type === 'Integer FPS Value') {
+        // TODO: index
+        // @ts-ignore
         fpsObj['Value'] = setting.fpsInt;
       } else if (fpsObj.Type === 'Fractional FPS Value') {
+        // TODO: index
+        // @ts-ignore
         fpsObj['Numerator'] = setting.fpsNum;
+        // TODO: index
+        // @ts-ignore
         fpsObj['Denominator'] = setting.fpsDen;
       }
 
@@ -634,6 +646,8 @@ export class DiagnosticsService extends PersistentStatefulService<IDiagnosticsSe
 
       // Ensures we are working with an array
       [].concat(gpuInfo).forEach((gpu, index) => {
+        // TODO: index
+        // @ts-ignore
         gpuSection[`GPU ${index + 1}`] = {
           Name: gpu.Name,
           'Driver Version': gpu.DriverVersion,
@@ -749,12 +763,16 @@ export class DiagnosticsService extends PersistentStatefulService<IDiagnosticsSe
         const data = { Time: entry.timestamp.toString() };
 
         if (entry.module) {
+          // TODO: index
+          // @ts-ignore
           data['Module'] =
             entry.module +
             ' (' +
             (entry.path && entry.path.length !== 0 ? entry.path : 'unknown path') +
             ')';
         } else {
+          // TODO: index
+          // @ts-ignore
           data['Module'] = '(no data)';
         }
 
@@ -800,11 +818,15 @@ export class DiagnosticsService extends PersistentStatefulService<IDiagnosticsSe
       ];
 
       if (source) {
+        // TODO: index
+        // @ts-ignore
         globalSources[name] = {
           ...audioDeviceObj(settings.Audio[name] as string),
           ...this.generateSourceData(source),
         };
       } else {
+        // TODO: index
+        // @ts-ignore
         globalSources[name] = 'Disabled';
       }
     });
@@ -863,6 +885,8 @@ export class DiagnosticsService extends PersistentStatefulService<IDiagnosticsSe
     const sceneData = {};
 
     this.scenesService.views.scenes.map(s => {
+      // TODO: index
+      // @ts-ignore
       sceneData[s.name] = s.getItems().map(si => {
         return this.generateSourceData(si.getSource(), si);
       });
@@ -911,8 +935,12 @@ export class DiagnosticsService extends PersistentStatefulService<IDiagnosticsSe
     };
 
     if (propertiesManagerType === 'widget') {
+      // TODO: index
+      // @ts-ignore
       sourceData['Widget Type'] = widgetLookup[propertiesManagerSettings.widgetType];
     } else if (propertiesManagerType === 'streamlabels') {
+      // TODO: index
+      // @ts-ignore
       sourceData['Streamlabel Type'] = propertiesManagerSettings.statname;
     }
 
@@ -927,7 +955,11 @@ export class DiagnosticsService extends PersistentStatefulService<IDiagnosticsSe
         );
       }
 
+      // TODO: index
+      // @ts-ignore
       sourceData['Selected Device Id'] = deviceId;
+      // TODO: index
+      // @ts-ignore
       sourceData['Selected Device Name'] = device?.description ?? '<DEVICE NOT FOUND>';
     }
 
@@ -936,9 +968,13 @@ export class DiagnosticsService extends PersistentStatefulService<IDiagnosticsSe
     }
 
     if (sceneItem) {
+      // TODO: index
+      // @ts-ignore
       sourceData['Visible'] = sceneItem.visible;
     }
 
+    // TODO: index
+    // @ts-ignore
     sourceData['Filters'] = this.sourceFiltersService.views
       .filtersBySourceId(source.sourceId)
       .map(f => {
@@ -969,14 +1005,24 @@ export class DiagnosticsService extends PersistentStatefulService<IDiagnosticsSe
         return arr;
       }, []);
 
+      // TODO: index
+      // @ts-ignore
       sourceData['Enabled Audio Tracks'] = enabledTracks.join(', ');
     }
 
+    // TODO: index
+    // @ts-ignore
     sourceData['Muted'] = audioSource.muted;
+    // TODO: index
+    // @ts-ignore
     sourceData['Volume'] = audioSource.fader.deflection * 100;
+    // TODO: index
+    // @ts-ignore
     sourceData['Monitoring'] = ['Monitor Off', 'Monitor Only (mute output)', 'Monitor and Output'][
       audioSource.monitoringType
     ];
+    // TODO: index
+    // @ts-ignore
     sourceData['Sync Offset'] = audioSource.syncOffset;
 
     return sourceData;
@@ -1069,12 +1115,16 @@ export class DiagnosticsService extends PersistentStatefulService<IDiagnosticsSe
 
   private convertWmiValues(wmiObject: object) {
     Object.keys(wmiObject).forEach(key => {
+      // TODO: index
+      // @ts-ignore
       const val = wmiObject[key];
 
       if (typeof val === 'string') {
         const match = val.match(/\/Date\((\d+)\)/);
 
         if (match) {
+          // TODO: index
+          // @ts-ignore
           wmiObject[key] = new Date(parseInt(match[1], 10)).toString();
         }
       }
diff --git a/app/services/editor.ts b/app/services/editor.ts
index ccabc6583e1a..2218a8eaba1c 100644
--- a/app/services/editor.ts
+++ b/app/services/editor.ts
@@ -287,6 +287,8 @@ export class EditorService extends StatefulService<IEditorServiceState> {
       };
 
       const options = {
+        // TODO: index
+        // @ts-ignore
         ...optionsMap[name],
         lockRatio: !event.shiftKey,
       };
@@ -406,7 +408,11 @@ export class EditorService extends StatefulService<IEditorServiceState> {
     // resizeRegion is opposite the anchor point
     const oppositePointsMap = { 0: 1, 0.5: 0.5, 1: 0 };
     const resizeRegionPosition = v2(
+      // TODO: index
+      // @ts-ignore
       oppositePointsMap[AnchorPositions[opts.anchor].x],
+      // TODO: index
+      // @ts-ignore
       oppositePointsMap[AnchorPositions[opts.anchor].y],
     );
 
diff --git a/app/services/game-overlay/index.ts b/app/services/game-overlay/index.ts
index 71c1d360905b..03295d5829fb 100644
--- a/app/services/game-overlay/index.ts
+++ b/app/services/game-overlay/index.ts
@@ -56,11 +56,11 @@ const hideInteraction = `
 
   /* Trovo Chat */
   // Fix chat container that's cut off on Game Overlay's 300px wide window
-  /* 
-   * The input box is rendered way after this code runs, insert a CSS rule to hide it instead of 
-   * manipulating style directly since we will never find the element here. 
-   * Since we're using CSSStyleSheet we add the rest of the rules here. 
-   * 
+  /*
+   * The input box is rendered way after this code runs, insert a CSS rule to hide it instead of
+   * manipulating style directly since we will never find the element here.
+   * Since we're using CSSStyleSheet we add the rest of the rules here.
+   *
    * 1. Fix chat wrapper width.
    * 2. Hide chat input panel.
    * 3. Hide all headers, including Gift Rank.
@@ -175,8 +175,10 @@ export class GameOverlayService extends PersistentStatefulService<GameOverlaySta
 
   assignCommonWindowOptions() {
     const [containerX, containerY] = this.getWindowContainerStartingPosition();
+    const { r, g, b } = this.customizationService.themeBackground;
+
     this.commonWindowOptions = {
-      backgroundColor: this.customizationService.themeBackground,
+      backgroundColor: '#' + r + g + b,
       show: false,
       frame: false,
       width: 300,
@@ -216,11 +218,15 @@ export class GameOverlayService extends PersistentStatefulService<GameOverlaySta
 
   configureWindows() {
     Object.keys(this.windows).forEach((key: string) => {
+      // TODO: index
+      // @ts-ignore
       const win = this.windows[key];
 
       const position = this.determineStartPosition(key);
       const size = key === 'chat' ? { width: 300, height: 600 } : { width: 600, height: 300 };
       win.setBounds({ ...position, ...size });
+      // TODO: index
+      // @ts-ignore
       this.previewWindows[key].setBounds({ ...position, ...size });
     });
 
@@ -252,6 +258,8 @@ export class GameOverlayService extends PersistentStatefulService<GameOverlaySta
   }
 
   determineStartPosition(window: string) {
+    // TODO: index
+    // @ts-ignore
     const pos = this.state.windowProperties[window].position;
     if (pos) {
       const display = remote.screen.getAllDisplays().find(display => {
@@ -270,6 +278,8 @@ export class GameOverlayService extends PersistentStatefulService<GameOverlaySta
 
   resetPosition() {
     this.enabledWindows.forEach((key: string) => {
+      // TODO: index
+      // @ts-ignore
       const overlayId = this.state.windowProperties[key].id;
       if (!overlayId) return;
 
@@ -277,7 +287,11 @@ export class GameOverlayService extends PersistentStatefulService<GameOverlaySta
       const pos = this.defaultPosition(key);
       const size = key === 'chat' ? { width: 300, height: 600 } : { width: 600, height: 300 };
 
+      // TODO: index
+      // @ts-ignore
       this.windows[key].setBounds({ ...pos, ...size });
+      // TODO: index
+      // @ts-ignore
       this.previewWindows[key].setBounds({ ...pos, ...size });
       this.overlay.setPosition(overlayId, pos.x, pos.y, size.width, size.height);
     });
@@ -323,6 +337,8 @@ export class GameOverlayService extends PersistentStatefulService<GameOverlaySta
 
   get enabledWindows() {
     return Object.keys(this.windows).filter(
+      // TODO: index
+      // @ts-ignore
       (win: string) => this.state.windowProperties[win].enabled,
     );
   }
@@ -345,13 +361,23 @@ export class GameOverlayService extends PersistentStatefulService<GameOverlaySta
   async toggleWindowEnabled(window: string) {
     this.TOGGLE_WINDOW_ENABLED(window);
 
+    // TODO: index
+    // @ts-ignore
     const id = this.state.windowProperties[window].id;
 
+    // TODO: index
+    // @ts-ignore
     this.overlay.setVisibility(id, this.state.windowProperties[window].enabled);
 
+    // TODO: index
+    // @ts-ignore
     if (!this.state.windowProperties[window].enabled) {
+      // TODO: index
+      // @ts-ignore
       this.previewWindows[window].hide();
     } else if (this.state.previewMode) {
+      // TODO: index
+      // @ts-ignore
       this.previewWindows[window].show();
     }
   }
@@ -362,10 +388,16 @@ export class GameOverlayService extends PersistentStatefulService<GameOverlaySta
     if (!this.state.isEnabled) return;
     this.SET_PREVIEW_MODE(previewMode);
     if (previewMode) {
+      // TODO: index
+      // @ts-ignore
       this.enabledWindows.forEach(win => this.previewWindows[win].show());
     } else {
       this.enabledWindows.forEach(async key => {
+        // TODO: index
+        // @ts-ignore
         const win: electron.BrowserWindow = this.previewWindows[key];
+        // TODO: index
+        // @ts-ignore
         const overlayId = this.state.windowProperties[key].id;
 
         const [x, y] = win.getPosition();
@@ -382,6 +414,8 @@ export class GameOverlayService extends PersistentStatefulService<GameOverlaySta
     this.SET_OPACITY(percentage);
     if (!this.state.isEnabled) return;
     Object.keys(this.windows).forEach(key => {
+      // TODO: index
+      // @ts-ignore
       const overlayId = this.state.windowProperties[key].id;
 
       this.overlay.setTransparency(overlayId, percentage * 2.55);
@@ -409,6 +443,8 @@ export class GameOverlayService extends PersistentStatefulService<GameOverlaySta
 
   private createWindowOverlays() {
     Object.keys(this.windows).forEach((key: string) => {
+      // TODO: index
+      // @ts-ignore
       const win: electron.BrowserWindow = this.windows[key];
       // Fix race condition in screen tests
       if (win.isDestroyed()) return;
@@ -427,6 +463,8 @@ export class GameOverlayService extends PersistentStatefulService<GameOverlaySta
 
       this.overlay.setPosition(overlayId, position.x, position.y, width, height);
       this.overlay.setTransparency(overlayId, this.state.opacity * 2.55);
+      // TODO: index
+      // @ts-ignore
       this.overlay.setVisibility(overlayId, this.state.windowProperties[key].enabled);
 
       win.webContents.executeJavaScript(hideInteraction);
@@ -444,7 +482,11 @@ export class GameOverlayService extends PersistentStatefulService<GameOverlaySta
   }
 
   private getPosition(key: string, win: electron.BrowserWindow) {
+    // TODO: index
+    // @ts-ignore
     if (this.state.windowProperties[key].position) {
+      // TODO: index
+      // @ts-ignore
       return this.state.windowProperties[key].position;
     }
     const [x, y] = win.getPosition();
@@ -474,16 +516,22 @@ export class GameOverlayService extends PersistentStatefulService<GameOverlaySta
 
   @mutation()
   private SET_WINDOW_ID(window: string, id: number) {
+    // TODO: index
+    // @ts-ignore
     this.state.windowProperties[window].id = id;
   }
 
   @mutation()
   private SET_WINDOW_POSITION(window: string, position: IVec2) {
+    // TODO: index
+    // @ts-ignore
     this.state.windowProperties[window].position = position;
   }
 
   @mutation()
   private TOGGLE_WINDOW_ENABLED(window: string) {
+    // TODO: index
+    // @ts-ignore
     this.state.windowProperties[window].enabled = !this.state.windowProperties[window].enabled;
   }
 
diff --git a/app/services/grow/grow.ts b/app/services/grow/grow.ts
index b078ca3a2040..9bda9f8a679d 100644
--- a/app/services/grow/grow.ts
+++ b/app/services/grow/grow.ts
@@ -218,6 +218,8 @@ export class GrowService extends StatefulService<IGrowServiceState> {
       Object.keys(platforms)
         .filter(platform => platform !== 'tiktok')
         .map(async platform => {
+          // TODO: index
+          // @ts-ignore
           const followers = await platformService[platform].fetchFollowers();
           communityReach.push({ icon: platform as TPlatform, followers });
         }),
diff --git a/app/services/guest-cam/consumer.ts b/app/services/guest-cam/consumer.ts
index 15beb8564750..43b0057f87df 100644
--- a/app/services/guest-cam/consumer.ts
+++ b/app/services/guest-cam/consumer.ts
@@ -40,6 +40,8 @@ export class Consumer extends MediasoupEntity {
     this.transportCreated = true;
     const turnConfig = await this.guestCamService.getTurnConfig();
 
+    // TODO: index
+    // @ts-ignore
     event.data['iceServers'] = [turnConfig];
 
     this.makeObsRequest('func_create_receive_transport', event.data);
diff --git a/app/services/guest-cam/index.ts b/app/services/guest-cam/index.ts
index 951371f747b3..38b11f53d848 100644
--- a/app/services/guest-cam/index.ts
+++ b/app/services/guest-cam/index.ts
@@ -937,7 +937,11 @@ export class GuestCamService extends StatefulService<IGuestCamServiceState> {
   sendWebRTCRequest(data: Object) {
     return new Promise(resolve => {
       this.socket.emit('webrtc', data, (result: Object) => {
+        // TODO: index
+        // @ts-ignore
         if (result && result['error']) {
+          // TODO: index
+          // @ts-ignore
           this.error(`Got error response from request ${data['type']}`);
         }
 
@@ -1093,6 +1097,8 @@ export class GuestCamService extends StatefulService<IGuestCamServiceState> {
   private UPDATE_GUEST(streamId: string, patch: Partial<IGuest>) {
     const guest = this.state.guests.find(g => g.remoteProducer.streamId === streamId);
     Object.keys(patch).forEach(key => {
+      // TODO: index
+      // @ts-ignore
       Vue.set(guest, key, patch[key]);
     });
   }
diff --git a/app/services/guest-cam/producer.ts b/app/services/guest-cam/producer.ts
index 144e4d019d3a..89c1c0812f18 100644
--- a/app/services/guest-cam/producer.ts
+++ b/app/services/guest-cam/producer.ts
@@ -75,6 +75,8 @@ export class Producer extends MediasoupEntity {
       if (!this.transportId) {
         const turnConfig = await this.guestCamService.getTurnConfig();
 
+        // TODO: index
+        // @ts-ignore
         result['iceServers'] = [turnConfig];
 
         this.makeObsRequest('func_create_send_transport', result);
diff --git a/app/services/highlighter/create-transition.ts b/app/services/highlighter/create-transition.ts
index 9f224b080ad3..82f23cc832d7 100644
--- a/app/services/highlighter/create-transition.ts
+++ b/app/services/highlighter/create-transition.ts
@@ -38,6 +38,8 @@ const resizeModes = {
 };
 
 const makeFrag = (transitionGlsl: string, resizeMode: string): string => {
+  // TODO: index
+  // @ts-ignore
   const r = resizeModes[resizeMode];
   if (!r) throw new Error('invalid resizeMode=' + resizeMode);
   return `\
diff --git a/app/services/integrations/shared-storage.ts b/app/services/integrations/shared-storage.ts
index 3d88926dc7d0..7d6631e66739 100644
--- a/app/services/integrations/shared-storage.ts
+++ b/app/services/integrations/shared-storage.ts
@@ -107,10 +107,16 @@ export class SharedStorageService extends Service {
 
   validateFile(filepath: string, platform?: string) {
     const stats = fs.lstatSync(filepath);
+    // TODO: index
+    // @ts-ignore
     if (platform && PLATFORM_RULES[platform]) {
+      // TODO: index
+      // @ts-ignore
       if (stats.size > PLATFORM_RULES[platform].size) {
         throw new Error($t('File is too large to upload'));
       }
+      // TODO: index
+      // @ts-ignore
       if (!PLATFORM_RULES[platform].types.includes(path.extname(filepath))) {
         throw new Error(
           $t('File type %{extension} is not supported', { extension: path.extname(filepath) }),
diff --git a/app/services/layout/index.ts b/app/services/layout/index.ts
index 22b5884005cc..b239d49685c0 100644
--- a/app/services/layout/index.ts
+++ b/app/services/layout/index.ts
@@ -41,6 +41,8 @@ class LayoutViews extends ViewHandler<ILayoutServiceState> {
 
   get elementsToRender() {
     return Object.keys(this.currentTab.slottedElements).filter(
+      // TODO: index
+      // @ts-ignore
       key => this.currentTab.slottedElements[key].slot,
     );
   }
@@ -99,6 +101,8 @@ class LayoutViews extends ViewHandler<ILayoutServiceState> {
 
   aggregateMinimum(orientation: 'x' | 'y', slots: IVec2Array) {
     const minimums = slots.map(mins => {
+      // TODO: index
+      // @ts-ignore
       if (mins) return mins[orientation];
       return 10;
     });
@@ -173,9 +177,17 @@ export class LayoutService extends PersistentStatefulService<ILayoutServiceState
     const slottedElements = {};
     if (this.state.currentTab !== 'default') return;
     Object.keys(this.state.tabs.default.slottedElements).forEach(el => {
+      // TODO: index
+      // @ts-ignore
       if (typeof this.state.tabs.default.slottedElements[el] === 'string') {
+        // TODO: index
+        // @ts-ignore
         slottedElements[el] = { slot: this.state.tabs.default.slottedElements[el] };
+        // TODO: index
+        // @ts-ignore
       } else if (this.state.tabs.default.slottedElements[el]) {
+        // TODO: index
+        // @ts-ignore
         slottedElements[el] = this.state.tabs.default.slottedElements[el];
       }
     });
@@ -234,7 +246,11 @@ export class LayoutService extends PersistentStatefulService<ILayoutServiceState
     if (LayoutService.defaultState.tabs[this.state.currentTab]) {
       Object.keys(LayoutService.defaultState.tabs[this.state.currentTab].slottedElements).forEach(
         el => {
+          // TODO: index
+          // @ts-ignore
           if (!slottedElements[el]) {
+            // TODO: index
+            // @ts-ignore
             slottedElements[el] = { slot: null };
           }
         },
diff --git a/app/services/markers.ts b/app/services/markers.ts
index 285e9991fadd..a0f8309a1b63 100644
--- a/app/services/markers.ts
+++ b/app/services/markers.ts
@@ -17,6 +17,8 @@ interface IMarkersServiceState {
 class MarkersServiceViews extends ViewHandler<IMarkersServiceState> {
   getLabel(id: string) {
     if (!this.state) return id;
+    // TODO: index
+    // @ts-ignore
     return this.state[id];
   }
 }
@@ -112,6 +114,8 @@ export class MarkersService extends PersistentStatefulService<IMarkersServiceSta
 
   @mutation()
   private SET_MARKER_NAME(marker: string, value: string) {
+    // TODO: index
+    // @ts-ignore
     this.state[marker] = value;
   }
 }
diff --git a/app/services/media-backup.ts b/app/services/media-backup.ts
index c4ac73ba74c0..84c8f2a37a59 100644
--- a/app/services/media-backup.ts
+++ b/app/services/media-backup.ts
@@ -189,8 +189,12 @@ export class MediaBackupService extends StatefulService<IMediaBackupState> {
     } catch (e: unknown) {
       // At the moment, we don't surface sync errors to the user
       if (this.validateSyncLock(localId, syncLock)) {
+        // TODO: index
+        // @ts-ignore
         if (e['status'] !== 404) {
           // Don't log 404s, these are somewhat expected.
+          // TODO: index
+          // @ts-ignore
           console.error(`[Media Backup] Ran out of retries fetching data ${e['body']}`);
         }
         this.UPDATE_FILE(localId, { status: EMediaFileStatus.Synced });
@@ -235,6 +239,8 @@ export class MediaBackupService extends StatefulService<IMediaBackupState> {
         this.downloadFile(data.url, serverId, data.filename),
       );
     } catch (e: unknown) {
+      // TODO: index
+      // @ts-ignore
       console.error(`[Media Backup] Error downloading file: ${e['body']}`);
 
       // At the moment, we don't surface sync errors to the user
diff --git a/app/services/obs-importer.ts b/app/services/obs-importer.ts
index ffcdc2a3d04f..3dc0a1ccc4de 100644
--- a/app/services/obs-importer.ts
+++ b/app/services/obs-importer.ts
@@ -538,6 +538,8 @@ export class ObsImporterService extends StatefulService<{ progress: number; tota
       'AuxAudioDevice3',
     ];
     channelNames.forEach((channelName, i) => {
+      // TODO: index
+      // @ts-ignore
       const obsAudioSource = configJSON[channelName];
       if (obsAudioSource) {
         const isSourceAvailable = this.sourcesService
diff --git a/app/services/onboarding.ts b/app/services/onboarding.ts
index f85d2964ae9a..6737059b0655 100644
--- a/app/services/onboarding.ts
+++ b/app/services/onboarding.ts
@@ -297,6 +297,8 @@ export class OnboardingService extends StatefulService<IOnboardingServiceState>
   }
 
   themeUrl(id: number) {
+    // TODO: index
+    // @ts-ignore
     return this.themeMetadata[id];
   }
 
diff --git a/app/services/patch-notes/index.ts b/app/services/patch-notes/index.ts
index b825d1fb941f..dc71a136b033 100644
--- a/app/services/patch-notes/index.ts
+++ b/app/services/patch-notes/index.ts
@@ -37,6 +37,8 @@ export class PatchNotesService extends PersistentStatefulService<IPatchNotesStat
 
     if (Util.isDevMode()) {
       // Useful for previewing patch notes in dev mode
+      // TODO: index
+      // @ts-ignore
       window['showPatchNotes'] = () => {
         this.navigationService.navigate('PatchNotes');
       };
diff --git a/app/services/performance.ts b/app/services/performance.ts
index 81d26d22a99a..24acfd49b10c 100644
--- a/app/services/performance.ts
+++ b/app/services/performance.ts
@@ -143,6 +143,8 @@ export class PerformanceService extends StatefulService<IPerformanceState> {
   @mutation()
   private SET_PERFORMANCE_STATS(stats: Partial<IPerformanceState>) {
     Object.keys(stats).forEach(stat => {
+      // TODO: index
+      // @ts-ignore
       Vue.set(this.state, stat, stats[stat]);
     });
   }
diff --git a/app/services/platform-apps/api/index.ts b/app/services/platform-apps/api/index.ts
index 7e8b7cb402ab..2303428429ef 100644
--- a/app/services/platform-apps/api/index.ts
+++ b/app/services/platform-apps/api/index.ts
@@ -79,6 +79,8 @@ export class PlatformAppsApi {
         methodName => {
           api[moduleName][methodName] = async (...args: any[]) => {
             if (authorized) {
+              // TODO: index
+              // @ts-ignore
               return await this.modules[moduleName][methodName](context, ...args);
             }
 
@@ -93,6 +95,8 @@ export class PlatformAppsApi {
       ((this.modules[moduleName].constructor as typeof Module).apiEvents || []).forEach(
         eventName => {
           if (authorized) {
+            // TODO: index
+            // @ts-ignore
             api[moduleName][eventName] = this.modules[moduleName][eventName];
           } else {
             api[moduleName][eventName] = async () => {
diff --git a/app/services/platform-apps/api/modules/scene-transitions.ts b/app/services/platform-apps/api/modules/scene-transitions.ts
index 2ebac6d7a560..39a10b27e0e0 100644
--- a/app/services/platform-apps/api/modules/scene-transitions.ts
+++ b/app/services/platform-apps/api/modules/scene-transitions.ts
@@ -278,9 +278,15 @@ export class SceneTransitionsModule extends Module {
     const settings = {};
 
     Object.keys(options).forEach(key => {
+      // TODO: index
+      // @ts-ignore
       const val = options[key];
 
+      // TODO: index
+      // @ts-ignore
       if (obsKeyMapping[key]) {
+        // TODO: index
+        // @ts-ignore
         settings[obsKeyMapping[key]] = obsValueMapping[key] ? obsValueMapping[key](val) : val;
       }
     });
diff --git a/app/services/platform-apps/api/modules/theme.ts b/app/services/platform-apps/api/modules/theme.ts
index 7c226df475e1..5cb992c400c6 100644
--- a/app/services/platform-apps/api/modules/theme.ts
+++ b/app/services/platform-apps/api/modules/theme.ts
@@ -24,6 +24,8 @@ export class ThemeModule extends Module {
 
     this.customizationService.settingsChanged.subscribe(patch => {
       if (patch.theme != null) {
+        // TODO: index
+        // @ts-ignore
         this.themeChanged.next(themeTable[patch.theme]);
       }
     });
@@ -34,6 +36,8 @@ export class ThemeModule extends Module {
 
   @apiMethod()
   getTheme(): ETheme {
+    // TODO: index
+    // @ts-ignore
     return themeTable[this.customizationService.currentTheme];
   }
 }
diff --git a/app/services/platform-apps/index.ts b/app/services/platform-apps/index.ts
index 68da7ee3b17b..8a15ad5a6b76 100644
--- a/app/services/platform-apps/index.ts
+++ b/app/services/platform-apps/index.ts
@@ -317,6 +317,8 @@ export class PlatformAppsService extends StatefulService<IPlatformAppServiceStat
     try {
       await this.validateManifest(manifest, appPath);
     } catch (e: unknown) {
+      // TODO: index
+      // @ts-ignore
       return e['message'];
     }
 
diff --git a/app/services/protocol-links.ts b/app/services/protocol-links.ts
index 67843c9eb153..50ce3f4d6c58 100644
--- a/app/services/protocol-links.ts
+++ b/app/services/protocol-links.ts
@@ -77,6 +77,8 @@ export class ProtocolLinksService extends Service {
     };
 
     if (this.handlers[info.base]) {
+      // TODO: index
+      // @ts-ignore
       this[this.handlers[info.base]](info);
     }
   }
@@ -95,6 +97,8 @@ export class ProtocolLinksService extends Service {
         install,
       });
       const menuItem =
+        // TODO: index
+        // @ts-ignore
         ProtocolLinkKeyMap[parts[1]] ?? this.sideNavService.views.isOpen
           ? ESideNavKey.Scene
           : ESideNavKey.Themes;
diff --git a/app/services/realm.ts b/app/services/realm.ts
index 306bdfc9a0cc..fdce5ae7d588 100644
--- a/app/services/realm.ts
+++ b/app/services/realm.ts
@@ -28,6 +28,8 @@ export class RealmObject {
    * Serializable id string as hex
    */
   get idString() {
+    // TODO: index
+    // @ts-ignore
     return this.realmModel['_id'].toHexString();
   }
 
@@ -97,6 +99,8 @@ export class RealmObject {
   bindProps(target: Object, bindings: Dictionary<string>) {
     const setProps = () => {
       Object.keys(bindings).forEach(key => {
+        // TODO: index
+        // @ts-ignore
         target[key] = this[bindings[key]];
       });
     };
@@ -119,11 +123,17 @@ export class RealmObject {
       if (!patch.hasOwnProperty(key)) return;
       if (key === '__proto__' || key === 'constructor') return;
 
+      // TODO: index
+      // @ts-ignore
       const val = this[key];
 
       if (val instanceof RealmObject) {
+        // TODO: index
+        // @ts-ignore
         val.deepPatch(patch[key]);
       } else {
+        // TODO: index
+        // @ts-ignore
         this[key] = patch[key];
       }
     });
@@ -133,11 +143,17 @@ export class RealmObject {
     const obj = {};
 
     Object.keys(this.schema.properties).forEach(key => {
+      // TODO: index
+      // @ts-ignore
       const val = this[key];
 
       if (val instanceof RealmObject) {
+        // TODO: index
+        // @ts-ignore
         obj[key] = val.toObject();
       } else {
+        // TODO: index
+        // @ts-ignore
         obj[key] = val;
       }
     });
@@ -261,17 +277,27 @@ export class RealmObject {
     Object.keys(initObject).forEach(k => {
       const descriptor = Object.getOwnPropertyDescriptor(initObject, k);
 
+      // TODO: index
+      // @ts-ignore
       if (typeof initObject[k] === 'function' || descriptor.get) {
         Object.defineProperty(klass.prototype, k, descriptor);
       } else {
+        // TODO: index
+        // @ts-ignore
         const t = typeof initObject[k];
 
         // All else are schema properties
         if (t === 'number') {
+          // TODO: index
+          // @ts-ignore
           propMap[k] = { type: 'double', default: initObject[k] };
         } else if (t === 'boolean') {
+          // TODO: index
+          // @ts-ignore
           propMap[k] = { type: 'bool', default: initObject[k] };
         } else if (t === 'string') {
+          // TODO: index
+          // @ts-ignore
           propMap[k] = { type: 'string', default: initObject[k] };
         }
 
@@ -352,7 +378,11 @@ export class RealmService extends Service {
 
   static registerObject(obj: typeof Realm.Object, klass: typeof RealmObject, persist = false) {
     persist ? this.persistentSchemas.push(obj) : this.ephemeralSchemas.push(obj);
+    // TODO: index
+    // @ts-ignore
     this.databaseMappings[obj['schema']['name']] = persist ? 'persistent' : 'ephemeral';
+    // TODO: index
+    // @ts-ignore
     this.registeredClasses[obj['schema']['name']] = klass;
   }
 
diff --git a/app/services/recent-events.ts b/app/services/recent-events.ts
index 70184753a593..8d5a456b91fb 100644
--- a/app/services/recent-events.ts
+++ b/app/services/recent-events.ts
@@ -564,6 +564,8 @@ export class RecentEventsService extends StatefulService<IRecentEventsState> {
     // Get read status for all events
     const readReceipts = await this.fetchReadReceipts(hashValues);
     eventArray.forEach(event => {
+      // TODO: index
+      // @ts-ignore
       event.read = readReceipts[event.hash] ? readReceipts[event.hash] : false;
 
       // Events older than 1 month are treated as read
@@ -743,9 +745,13 @@ export class RecentEventsService extends StatefulService<IRecentEventsState> {
   }
 
   getEventTypesString() {
-    return Object.keys(this.state.filterConfig)
-      .filter((type: string) => this.state.filterConfig[type] === true)
-      .join(',');
+    return (
+      Object.keys(this.state.filterConfig)
+        // TODO: index
+        // @ts-ignore
+        .filter((type: string) => this.state.filterConfig[type] === true)
+        .join(',')
+    );
   }
 
   applyConfig(config: IRecentEventsConfig) {
@@ -867,16 +873,28 @@ export class RecentEventsService extends StatefulService<IRecentEventsState> {
       }
       return this.shouldFilterSubscription(event);
     }
+    // TODO: index
+    // @ts-ignore
     return this.transformFilterForPlatform()[event.type];
   }
 
   transformFilterForPlatform() {
     const filterMap = cloneDeep(this.state.filterConfig);
+    // TODO: index
+    // @ts-ignore
     filterMap['support'] = filterMap['facebook_support'];
+    // TODO: index
+    // @ts-ignore
     filterMap['like'] = filterMap['facebook_like'];
+    // TODO: index
+    // @ts-ignore
     filterMap['share'] = filterMap['facebook_share'];
+    // TODO: index
+    // @ts-ignore
     filterMap['stars'] = filterMap['facebook_stars'];
     if (this.userService.platform.type === 'youtube') {
+      // TODO: index
+      // @ts-ignore
       filterMap['subscription'] = filterMap['membership_level_1'];
       filterMap['follow'] = filterMap['subscriber'];
     }
@@ -1111,6 +1129,8 @@ export class RecentEventsService extends StatefulService<IRecentEventsState> {
 
   @mutation()
   private SET_SINGLE_FILTER_CONFIG(key: string, value: boolean | number) {
+    // TODO: index
+    // @ts-ignore
     this.state.filterConfig[key] = value;
   }
 
diff --git a/app/services/recording-mode.ts b/app/services/recording-mode.ts
index fc605b727dc8..3b9874879c28 100644
--- a/app/services/recording-mode.ts
+++ b/app/services/recording-mode.ts
@@ -203,6 +203,8 @@ export class RecordingModeService extends PersistentStatefulService<IRecordingMo
     const prunedEntries: Dictionary<IRecordingEntry> = {};
     Object.keys(this.state.recordingHistory).forEach(timestamp => {
       if (moment(timestamp).isAfter(oneMonthAgo)) {
+        // TODO: index
+        // @ts-ignore
         prunedEntries[timestamp] = this.state.recordingHistory[timestamp];
       }
     });
diff --git a/app/services/scene-collections/nodes/hotkeys.ts b/app/services/scene-collections/nodes/hotkeys.ts
index b62ebaabb17e..0750f8b9f583 100644
--- a/app/services/scene-collections/nodes/hotkeys.ts
+++ b/app/services/scene-collections/nodes/hotkeys.ts
@@ -33,6 +33,8 @@ export class HotkeysNode extends ArrayNode<IHotkey, IContext, Hotkey> {
 
   saveItem(hotkey: Hotkey, context: IContext): Promise<IHotkey> {
     const hotkeyObj = hotkey.getModel();
+    // TODO: index
+    // @ts-ignore
     Object.keys(context).forEach(key => delete hotkeyObj[key]);
     return Promise.resolve(hotkeyObj);
   }
diff --git a/app/services/scene-collections/nodes/overlays/video.ts b/app/services/scene-collections/nodes/overlays/video.ts
index cadbd7c197a8..bc94843c171e 100644
--- a/app/services/scene-collections/nodes/overlays/video.ts
+++ b/app/services/scene-collections/nodes/overlays/video.ts
@@ -51,10 +51,14 @@ export class VideoNode extends Node<ISchema, IContext> {
   async load(context: IContext) {
     const filePath = path.join(context.assetsPath, this.data.filename);
     const settings = { ...this.data.settings };
+    // TODO: index
+    // @ts-ignore
     settings['local_file'] = filePath;
 
     // HW decode did not work previously. It now does, so to preserve the same
     // behavior we are disabling it on all new theme installs.
+    // TODO: index
+    // @ts-ignore
     settings['hw_decode'] = false;
     context.sceneItem.getObsInput().update(settings);
 
diff --git a/app/services/scene-collections/nodes/overlays/widget.ts b/app/services/scene-collections/nodes/overlays/widget.ts
index eb0d8a0418a6..a9d334c8c274 100644
--- a/app/services/scene-collections/nodes/overlays/widget.ts
+++ b/app/services/scene-collections/nodes/overlays/widget.ts
@@ -34,6 +34,8 @@ export class WidgetNode extends Node<ISchema, IContext> {
     });
 
     // Make sure we don't override the url setting
+    // TODO: index
+    // @ts-ignore
     delete this.data.settings['url'];
     context.sceneItem.getSource().updateSettings(this.data.settings);
   }
diff --git a/app/services/scene-collections/nodes/root.ts b/app/services/scene-collections/nodes/root.ts
index 5432a6d258ae..4be2577d5321 100644
--- a/app/services/scene-collections/nodes/root.ts
+++ b/app/services/scene-collections/nodes/root.ts
@@ -148,6 +148,8 @@ export class RootNode extends Node<ISchema, {}> {
   migrate(version: number) {
     // Changed name of transition node in version 2
     if (version < 2) {
+      // TODO: index
+      // @ts-ignore
       this.data.transitions = this.data['transition'];
     }
 
diff --git a/app/services/scene-collections/nodes/transitions.ts b/app/services/scene-collections/nodes/transitions.ts
index 34ffa726a16f..012f20652c70 100644
--- a/app/services/scene-collections/nodes/transitions.ts
+++ b/app/services/scene-collections/nodes/transitions.ts
@@ -93,9 +93,17 @@ export class TransitionsNode extends Node<ISchema, {}> {
       const transition: ITransition = {
         id: null,
         name: $t('Global Transition'),
+        // TODO: index
+        // @ts-ignore
         type: this.data['type'],
+        // TODO: index
+        // @ts-ignore
         duration: this.data['duration'],
+        // TODO: index
+        // @ts-ignore
         settings: this.data['settings'],
+        // TODO: index
+        // @ts-ignore
         propertiesManagerSettings: this.data['propertiesManagerSettings'],
       };
       this.data.transitions = [transition];
diff --git a/app/services/scene-collections/state.ts b/app/services/scene-collections/state.ts
index ffbb7cc7ab2d..f08f4df5f371 100644
--- a/app/services/scene-collections/state.ts
+++ b/app/services/scene-collections/state.ts
@@ -292,6 +292,8 @@ export class SceneCollectionsStateService extends StatefulService<ISceneCollecti
   @mutation()
   LOAD_STATE(state: ISceneCollectionsManifest) {
     Object.keys(state).forEach(key => {
+      // TODO: index
+      // @ts-ignore
       Vue.set(this.state, key, state[key]);
     });
   }
diff --git a/app/services/settings-v2/video.ts b/app/services/settings-v2/video.ts
index 4330238d9036..4187a25b9529 100644
--- a/app/services/settings-v2/video.ts
+++ b/app/services/settings-v2/video.ts
@@ -447,6 +447,8 @@ export class VideoSettingsService extends StatefulService<IVideoSetting> {
 
     fpsSettings.forEach((setting: keyof IVideoInfo) => {
       const hasSameVideoSetting =
+        // TODO: index
+        // @ts-ignore
         this.contexts.horizontal.video[setting as string] === verticalVideoSetting;
       let shouldUpdate = hasSameVideoSetting;
       // if the vertical context has been established, also compare legacy settings
diff --git a/app/services/settings/settings.ts b/app/services/settings/settings.ts
index 7f67d86f9b18..4834dc181524 100644
--- a/app/services/settings/settings.ts
+++ b/app/services/settings/settings.ts
@@ -154,7 +154,11 @@ class SettingsViews extends ViewHandler<ISettingsServiceState> {
     for (const groupName in this.state) {
       this.state[groupName].formData.forEach(subGroup => {
         subGroup.parameters.forEach(parameter => {
+          // TODO: index
+          // @ts-ignore
           settingsValues[groupName] = settingsValues[groupName] || {};
+          // TODO: index
+          // @ts-ignore
           settingsValues[groupName][parameter.name] = parameter.value;
         });
       });
@@ -346,6 +350,8 @@ export class SettingsService extends StatefulService<ISettingsServiceState> {
     // load configuration from nodeObs to state
     const settingsFormData = {};
     this.getCategories().forEach(categoryName => {
+      // TODO: index
+      // @ts-ignore
       settingsFormData[categoryName] = this.fetchSettingsFromObs(categoryName);
     });
     this.SET_SETTINGS(settingsFormData);
@@ -603,6 +609,8 @@ export class SettingsService extends StatefulService<ISettingsServiceState> {
     // in the future.
 
     Object.keys(patch).forEach(categoryName => {
+      // TODO: index
+      // @ts-ignore
       const category: Dictionary<any> = patch[categoryName];
       const formSubCategories = this.fetchSettingsFromObs(categoryName).formData;
 
diff --git a/app/services/settings/streaming/stream-settings.ts b/app/services/settings/streaming/stream-settings.ts
index abd15911d18b..75ce84f0f3ba 100644
--- a/app/services/settings/streaming/stream-settings.ts
+++ b/app/services/settings/streaming/stream-settings.ts
@@ -210,6 +210,8 @@ export class StreamSettingsService extends PersistentStatefulService<IStreamSett
       const pickedFields: (keyof IPlatformFlags)[] = ['enabled', 'useCustomFields'];
       const platforms: Dictionary<IPlatformFlags> = {};
       Object.keys(settingsPatch.platforms).map(platform => {
+        // TODO: index
+        // @ts-ignore
         const platformSettings = pick(settingsPatch.platforms![platform], pickedFields);
 
         if (this.dualOutputService.views.dualOutputMode) {
@@ -377,6 +379,8 @@ export class StreamSettingsService extends PersistentStatefulService<IStreamSett
   @mutation()
   private SET_LOCAL_STORAGE_SETTINGS(settings: Partial<IStreamSettingsState>) {
     Object.keys(settings).forEach(prop => {
+      // TODO: index
+      // @ts-ignore
       Vue.set(this.state, prop, settings[prop]);
     });
   }
diff --git a/app/services/side-nav/menu.ts b/app/services/side-nav/menu.ts
index 206c6788820c..877d815a386b 100644
--- a/app/services/side-nav/menu.ts
+++ b/app/services/side-nav/menu.ts
@@ -293,6 +293,8 @@ export class SideNavService extends PersistentStatefulService<ISideNavServiceSta
         menuItems: this.state[ENavName.BottomNav].menuItems.map((menuItem: IMenuItem) => {
           if (menuItem.key === EMenuItemKey.Dashboard) {
             return {
+              // TODO: index
+              // @ts-ignore
               ...this.state[ENavName.BottomNav].menuItems[EMenuItemKey.Dashboard],
               isExpanded: true,
             };
diff --git a/app/services/sources/properties-managers/streamlabels-manager.ts b/app/services/sources/properties-managers/streamlabels-manager.ts
index 34c662a81030..0c2514bb79d5 100644
--- a/app/services/sources/properties-managers/streamlabels-manager.ts
+++ b/app/services/sources/properties-managers/streamlabels-manager.ts
@@ -22,11 +22,17 @@ export class StreamlabelsManager extends DefaultManager {
   init() {
     super.init();
     this.subscription = this.streamlabelsService.output.subscribe(output => {
+      // TODO: index
+      // @ts-ignore
       if (output[this.settings.statname] !== this.oldOutput) {
+        // TODO: index
+        // @ts-ignore
         this.oldOutput = output[this.settings.statname];
 
         this.obsSource.update({
           ...this.obsSource.settings,
+          // TODO: index
+          // @ts-ignore
           text: this.normalizeText(output[this.settings.statname]),
           read_from_file: false,
         });
@@ -60,7 +66,11 @@ export class StreamlabelsManager extends DefaultManager {
 
     if (this.userService.platform) {
       if (this.userService.platform.type === 'youtube') {
+        // TODO: index
+        // @ts-ignore
         if (youtubeKeys[settings.statname]) {
+          // TODO: index
+          // @ts-ignore
           settings.statname = youtubeKeys[settings.statname];
         }
       }
@@ -77,6 +87,8 @@ export class StreamlabelsManager extends DefaultManager {
   applySettings(settings: Dictionary<any>) {
     if (settings.statname !== this.settings.statname) {
       this.obsSource.update({
+        // TODO: index
+        // @ts-ignore
         text: this.normalizeText(this.streamlabelsService.output.getValue()[settings.statname]),
       });
     }
diff --git a/app/services/sources/sources.ts b/app/services/sources/sources.ts
index be056e4d2fad..9f3a1d4790b9 100644
--- a/app/services/sources/sources.ts
+++ b/app/services/sources/sources.ts
@@ -496,6 +496,8 @@ export class SourcesService extends StatefulService<ISourcesState> {
 
     const types = Object.keys(SUPPORTED_EXT);
     for (const type of types) {
+      // TODO: index
+      // @ts-ignore
       if (!SUPPORTED_EXT[type].includes(ext)) continue;
       let settings: Dictionary<TObsValue> | null = null;
       if (type === 'image_source') {
@@ -790,6 +792,8 @@ export class SourcesService extends StatefulService<ISourcesState> {
 
     const defaultVueWindowSize = { width: 920, height: 1024 };
     const defaultReactWindowSize = { width: 600, height: 800 };
+    // TODO: index
+    // @ts-ignore
     const widgetInfo = this.widgetsService.widgetsConfig[WidgetType[componentName]];
     const { width, height } = isReactComponent
       ? widgetInfo.settingsWindowSize || defaultReactWindowSize
diff --git a/app/services/streaming/streaming-view.ts b/app/services/streaming/streaming-view.ts
index ad8743d34e41..704845dc9280 100644
--- a/app/services/streaming/streaming-view.ts
+++ b/app/services/streaming/streaming-view.ts
@@ -139,6 +139,8 @@ export class StreamInfoView<T extends Object> extends ViewHandler<T> {
     return (
       this.settings.customDestinations
         .filter(dest => dest.enabled)
+        // FIXME: index, but also split is a function?
+        // @ts-ignore
         .map(dest => dest.url.split[2]) || []
     );
   }
@@ -281,6 +283,8 @@ export class StreamInfoView<T extends Object> extends ViewHandler<T> {
   get savedSettings(): IGoLiveSettings {
     const destinations = {} as IGoLiveSettings['platforms'];
     this.linkedPlatforms.forEach(platform => {
+      // TODO: index
+      // @ts-ignore
       destinations[platform as string] = this.getSavedPlatformSettings(platform);
     });
 
@@ -338,7 +342,11 @@ export class StreamInfoView<T extends Object> extends ViewHandler<T> {
     destinationsWithCommonSettings.forEach(platform => {
       const destSettings = getDefined(platforms[platform]);
       Object.keys(commonFields).forEach(fieldName => {
+        // TODO: index
+        // @ts-ignore
         if (commonFields[fieldName] || !destSettings[fieldName]) return;
+        // TODO: index
+        // @ts-ignore
         commonFields[fieldName] = destSettings[fieldName];
       });
     });
@@ -347,7 +355,11 @@ export class StreamInfoView<T extends Object> extends ViewHandler<T> {
     destinationWithCustomSettings.forEach(platform => {
       const destSettings = getDefined(platforms[platform]);
       Object.keys(commonFields).forEach(fieldName => {
+        // TODO: index
+        // @ts-ignore
         if (commonFields[fieldName] || !destSettings[fieldName]) return;
+        // TODO: index
+        // @ts-ignore
         commonFields[fieldName] = destSettings[fieldName];
       });
     });
@@ -358,8 +370,14 @@ export class StreamInfoView<T extends Object> extends ViewHandler<T> {
     const commonFields = this.getCommonFields(platforms);
     const result = {} as IGoLiveSettings['platforms'];
     Object.keys(platforms).forEach(platform => {
+      // TODO: index
+      // @ts-ignore
       result[platform] = platforms[platform];
+      // TODO: index
+      // @ts-ignore
       result[platform].title = platforms[platform].title || commonFields.title;
+      // TODO: index
+      // @ts-ignore
       result[platform].description = platforms[platform].description || commonFields.description;
     });
     return result;
@@ -438,6 +456,8 @@ export class StreamInfoView<T extends Object> extends ViewHandler<T> {
    */
   hasFailedChecks(): boolean {
     return !!Object.keys(this.info.checklist).find(
+      // TODO: index
+      // @ts-ignore
       check => this.info.checklist[check] === 'failed',
     );
   }
@@ -447,6 +467,8 @@ export class StreamInfoView<T extends Object> extends ViewHandler<T> {
    */
   hasPendingChecks(): boolean {
     return !!Object.keys(this.info.checklist).find(
+      // TODO: index
+      // @ts-ignore
       check => this.info.checklist[check] === 'pending',
     );
   }
@@ -468,6 +490,8 @@ export class StreamInfoView<T extends Object> extends ViewHandler<T> {
   private getSavedPlatformSettings(platform: TPlatform) {
     const service = getPlatformService(platform);
     const savedDestinations = this.streamSettingsView.state.goLiveSettings?.platforms;
+    // TODO: index
+    // @ts-ignore
     const { enabled, useCustomFields } = (savedDestinations && savedDestinations[platform]) || {
       enabled: false,
       useCustomFields: false,
@@ -475,11 +499,19 @@ export class StreamInfoView<T extends Object> extends ViewHandler<T> {
     const settings = cloneDeep(service.state.settings);
 
     // don't reuse broadcastId and thumbnail for Youtube
+    // TODO: index
+    // @ts-ignore
     if (settings && settings['broadcastId']) settings['broadcastId'] = '';
+    // TODO: index
+    // @ts-ignore
     if (settings && settings['thumbnail']) settings['thumbnail'] = '';
 
     // don't reuse liveVideoId for Facebook
+    // TODO: index
+    // @ts-ignore
     if (platform === 'facebook' && settings && settings['liveVideoId']) {
+      // TODO: index
+      // @ts-ignore
       settings['liveVideoId'] = '';
     }
 
diff --git a/app/services/streamlabels/index.ts b/app/services/streamlabels/index.ts
index ad8d955a3f91..1bd9a6658a9e 100644
--- a/app/services/streamlabels/index.ts
+++ b/app/services/streamlabels/index.ts
@@ -373,6 +373,8 @@ export class StreamlabelsService extends StatefulService<IStreamlabelsServiceSta
     const { trains_combos, ...rest } = data;
     const trainData = {};
     trains_combos.files.forEach(file => {
+      // TODO: index
+      // @ts-ignore
       trainData[file.name] = { label: file.label, files: this.trainFiles(file.name) };
     });
     return {
@@ -382,6 +384,8 @@ export class StreamlabelsService extends StatefulService<IStreamlabelsServiceSta
   }
 
   trainFiles(fileName: string) {
+    // TODO: index
+    // @ts-ignore
     const type = Object.keys(this.trains).find(key => this.trains[key].setting === fileName);
 
     const baseFiles = [
diff --git a/app/services/transitions.ts b/app/services/transitions.ts
index 9cacb0e1be1e..ee45e1938892 100644
--- a/app/services/transitions.ts
+++ b/app/services/transitions.ts
@@ -579,6 +579,8 @@ export class TransitionsService extends StatefulService<ITransitionsState> {
 
     if (transition) {
       Object.keys(patch).forEach(key => {
+        // TODO: index
+        // @ts-ignore
         transition[key] = patch[key];
       });
     }
@@ -613,6 +615,8 @@ export class TransitionsService extends StatefulService<ITransitionsState> {
 
     if (connection) {
       Object.keys(patch).forEach(key => {
+        // TODO: index
+        // @ts-ignore
         connection[key] = patch[key];
       });
     }
diff --git a/app/services/usage-statistics.ts b/app/services/usage-statistics.ts
index 690159e6f54b..f26c889ca5e6 100644
--- a/app/services/usage-statistics.ts
+++ b/app/services/usage-statistics.ts
@@ -151,9 +151,13 @@ export class UsageStatisticsService extends Service {
 
     // Don't check logged in because login may not be verified at this point
     if (this.userService.state.auth && this.userService.state.auth.primaryPlatform) {
+      // TODO: index
+      // @ts-ignore
       metadata['platform'] = this.userService.state.auth.primaryPlatform;
     }
 
+    // TODO: index
+    // @ts-ignore
     metadata['os'] = process.platform;
 
     const bodyData: IUsageApiData = {
diff --git a/app/services/user/index.ts b/app/services/user/index.ts
index 96d1e964498d..1b5d474d006a 100644
--- a/app/services/user/index.ts
+++ b/app/services/user/index.ts
@@ -1244,6 +1244,8 @@ export class UserService extends PersistentStatefulService<IUserServiceState> {
         hasRelogged: true,
       };
 
+      // TODO: index
+      // @ts-ignore
       this.UPDATE_PLATFORM(auth.platforms[auth.primaryPlatform]);
       return EPlatformCallResult.Success;
     }
diff --git a/app/services/utils.ts b/app/services/utils.ts
index d41df39a581e..d11af9a8edad 100644
--- a/app/services/utils.ts
+++ b/app/services/utils.ts
@@ -172,6 +172,8 @@ export default class Utils {
   static getChangedParams<T>(obj: T, patch: T): Partial<T> {
     const result: Dictionary<any> = {};
     Object.keys(patch).forEach(key => {
+      // TODO: index
+      // @ts-ignore
       if (!isEqual(obj[key], patch[key])) result[key] = cloneDeep(patch[key]);
     });
     return result as Partial<T>;
@@ -183,10 +185,18 @@ export default class Utils {
     if (obj == null) return patch;
 
     Object.keys(patch).forEach(key => {
+      // TODO: index
+      // @ts-ignore
       if (!isEqual(obj[key], patch[key])) {
+        // TODO: index
+        // @ts-ignore
         if (patch[key] && typeof patch[key] === 'object' && !Array.isArray(patch[key])) {
+          // TODO: index
+          // @ts-ignore
           result[key] = this.getDeepChangedParams(obj[key], patch[key]);
         } else {
+          // TODO: index
+          // @ts-ignore
           result[key] = patch[key];
         }
       }
diff --git a/app/services/widgets/settings/alert-box/alert-box-data.ts b/app/services/widgets/settings/alert-box/alert-box-data.ts
index b1a2e9801bc0..8abf0e870315 100644
--- a/app/services/widgets/settings/alert-box/alert-box-data.ts
+++ b/app/services/widgets/settings/alert-box/alert-box-data.ts
@@ -80,6 +80,8 @@ const determineTester = (key: string) => {
 };
 
 export const REGEX_TESTERS = Object.keys(API_NAME_MAP).map(key => ({
+  // TODO: index
+  // @ts-ignore
   name: API_NAME_MAP[key],
   tester: determineTester(key),
 }));
@@ -232,6 +234,8 @@ export const newVariation = (type: string): IAlertBoxVariation => ({
       color: '#FFFFFF',
       color2: '#32C3A6',
       font: 'Open Sans',
+      // TODO: index
+      // @ts-ignore
       format: DEFAULT_ALERT_FORMATS[type] || '',
       resubFormat: null,
       tierUpgradeFormat: null,
@@ -239,6 +243,8 @@ export const newVariation = (type: string): IAlertBoxVariation => ({
       thickness: 400,
     },
     textDelay: 0,
+    // TODO: index
+    // @ts-ignore
     type: Object.keys(API_NAME_MAP).find(key => API_NAME_MAP[key] === type),
     useCustomImage: null,
     moderation: null,
diff --git a/app/services/widgets/settings/alert-box/index.ts b/app/services/widgets/settings/alert-box/index.ts
index ce50e17dd07d..95e26b71c3f2 100644
--- a/app/services/widgets/settings/alert-box/index.ts
+++ b/app/services/widgets/settings/alert-box/index.ts
@@ -38,6 +38,8 @@ export class AlertBoxService extends WidgetSettingsService<IAlertBoxData> {
   static initialState = WIDGET_INITIAL_STATE;
 
   apiNames() {
+    // TODO: index
+    // @ts-ignore
     return Object.keys(API_NAME_MAP).map(key => API_NAME_MAP[key]);
   }
 
@@ -56,10 +58,14 @@ export class AlertBoxService extends WidgetSettingsService<IAlertBoxData> {
   }
 
   conditionsByType(type: string) {
+    // TODO: index
+    // @ts-ignore
     return conditions().base.concat(conditions()[type]);
   }
 
   conditionDataByCondition(type: string) {
+    // TODO: index
+    // @ts-ignore
     return conditionData()[type] || metadata.number({ title: $t('Variation Amount') });
   }
 
@@ -70,6 +76,8 @@ export class AlertBoxService extends WidgetSettingsService<IAlertBoxData> {
   toggleCustomCode(enabled: boolean, data: IWidgetSettings, variation: IAlertBoxVariation) {
     const newSettings = { ...data };
     Object.keys(newSettings).forEach(type => {
+      // TODO: index
+      // @ts-ignore
       const variations = newSettings[type] && newSettings[type].variations;
       const found =
         variations && variations.find((vari: IAlertBoxVariation) => variation.id === vari.id);
@@ -176,17 +184,25 @@ export class AlertBoxService extends WidgetSettingsService<IAlertBoxData> {
       if (key === 'subs') {
         triagedSettings['subs'] = this.varifySetting(
           {
+            // TODO: index
+            // @ts-ignore
             showResubMessage: triagedSettings['resubs'].show_message,
             ...triagedSettings['subs'],
+            // TODO: index
+            // @ts-ignore
             ...triagedSettings['resubs'],
           },
           key,
         );
       } else if (this.apiNames().includes(key) && key !== 'resubs') {
+        // TODO: index
+        // @ts-ignore
         triagedSettings[key] = this.varifySetting(triagedSettings[key], key);
       }
     });
     // resubs are folded into the sub settings
+    // TODO: index
+    // @ts-ignore
     triagedSettings['resubs'] = undefined;
 
     return triagedSettings;
@@ -203,20 +219,32 @@ export class AlertBoxService extends WidgetSettingsService<IAlertBoxData> {
             : key.replace(test.tester, '');
         if (test.tester.test(key)) {
           testSuccess = true;
+          // TODO: index
+          // @ts-ignore
           if (!newSettings[test.name]) {
+            // TODO: index
+            // @ts-ignore
+            // TODO: index
+            // @ts-ignore
             newSettings[test.name] = { [newKey]: settings[key] };
           } else {
+            // TODO: index
+            // @ts-ignore
             newSettings[test.name][newKey] = settings[key];
           }
         }
       });
       if (['alert_delay', 'moderation_delay'].includes(key)) {
+        // TODO: index
+        // @ts-ignore
         newSettings[key] = Math.floor(settings[key] / 1000);
       } else if (key === 'interrupt_mode_delay') {
         const constrainedInterruptDelay =
           settings.interrupt_mode_delay / 1000 <= 20 ? settings.interrupt_mode_delay / 1000 : 20;
         newSettings[key] = constrainedInterruptDelay;
       } else if (!testSuccess && !/smfredemption/.test(key)) {
+        // TODO: index
+        // @ts-ignore
         newSettings[key] = settings[key];
       }
 
@@ -420,16 +448,30 @@ export class AlertBoxService extends WidgetSettingsService<IAlertBoxData> {
   private flattenSettings(settings: IAlertBoxSettings): IAlertBoxApiSettings {
     const settingsObj = {} as IAlertBoxApiSettings;
     Object.keys(settings).forEach(setting => {
+      // TODO: index
+      // @ts-ignore
       const prefix = Object.keys(API_NAME_MAP).find(key => API_NAME_MAP[key] === setting);
       if (prefix && prefix !== 'resub') {
         const bitsPrefix = prefix === 'bit' ? 'bits' : prefix;
+        // TODO: index
+        // @ts-ignore
         const defaultVariation = settings[setting].variations.shift();
+        // TODO: index
+        // @ts-ignore
         settingsObj[`${prefix}_variations`] = this.multiplyVariationDuration(
+          // TODO: index
+          // @ts-ignore
           settings[setting].variations,
         );
+        // TODO: index
+        // @ts-ignore
         settingsObj[`${bitsPrefix}_enabled`] = settings[setting].enabled;
+        // TODO: index
+        // @ts-ignore
         settingsObj[`show_${bitsPrefix}_message`] = settings[setting].showMessage;
         if (bitsPrefix === 'facebook_stars') {
+          // TODO: index
+          // @ts-ignore
           settingsObj.facebook_show_stars_message = settings[setting].showMessage;
         }
         const flattenedDefault =
@@ -437,9 +479,13 @@ export class AlertBoxService extends WidgetSettingsService<IAlertBoxData> {
             ? this.unshapeSubs(defaultVariation)
             : this.unshapeVariation(defaultVariation, bitsPrefix);
         Object.keys(flattenedDefault).forEach(key => {
+          // TODO: index
+          // @ts-ignore
           settingsObj[key] = flattenedDefault[key];
         });
       } else if (prefix !== 'resub') {
+        // TODO: index
+        // @ts-ignore
         settingsObj[setting] = settings[setting];
       }
     });
diff --git a/app/services/widgets/widget-source.ts b/app/services/widgets/widget-source.ts
index b6c0f258be8b..8cb8f8363482 100644
--- a/app/services/widgets/widget-source.ts
+++ b/app/services/widgets/widget-source.ts
@@ -46,6 +46,8 @@ export class WidgetSource implements IWidgetSource {
       throw new Error('Only one preview source is allowed for widget');
     }
 
+    // TODO: index
+    // @ts-ignore
     const config = this.widgetsService.widgetsConfig[this.type];
     const source = this.getSource();
     const apiSettings = config || this.getSettingsService().getApiSettings();
diff --git a/app/services/widgets/widgets.ts b/app/services/widgets/widgets.ts
index 3f72935c992b..e8aba88d7562 100644
--- a/app/services/widgets/widgets.ts
+++ b/app/services/widgets/widgets.ts
@@ -133,7 +133,12 @@ export class WidgetsService
   createWidget(type: WidgetType, name?: string): SceneItem {
     if (!this.userService.isLoggedIn) return;
 
+    // TODO: index
+    // DonationGoal is not defined in widgetsConfig, lots of them commented out
+    // @ts-ignore
     const widget = this.widgetsConfig[type] || WidgetDefinitions[type];
+    // TODO: index
+    // @ts-ignore
     const widgetTransform = this.widgetsConfig[type]?.defaultTransform || WidgetDefinitions[type];
 
     const suggestedName =
@@ -161,6 +166,8 @@ export class WidgetsService
       suggestedName,
       'browser_source',
       {
+        // TODO: index
+        // @ts-ignore
         url: this.widgetsConfig[type]
           ? widget.url
           : widget.url(this.hostsService.streamlabs, this.userService.widgetToken),
@@ -243,6 +250,8 @@ export class WidgetsService
         const source = widget.getSource();
         const newPreviewSettings = cloneDeep(source.getSettings());
         delete newPreviewSettings.shutdown;
+        // TODO: index
+        // @ts-ignore
         const config = this.widgetsConfig[widget.type];
         newPreviewSettings.url =
           config?.previewUrl || widget.getSettingsService().getApiSettings().previewUrl;
@@ -284,11 +293,13 @@ export class WidgetsService
    * Used for converting browser_source to streamlabs widgets when importing OBS scene collection
    * returns -1 if it's no type detected
    */
-  getWidgetTypeByUrl(url: string): WidgetType {
+  getWidgetTypeByUrl(url: string): WidgetType | -1 {
     if (!this.userService.views.isLoggedIn) return -1;
 
     const type = Number(
       Object.keys(WidgetDefinitions).find(WidgetType => {
+        // TODO: index
+        // @ts-ignore
         let regExpStr = WidgetDefinitions[WidgetType].url(this.hostsService.streamlabs, '')
           .split('?')[0]
           .replace(/\//g, '\\/');
diff --git a/app/store/index.ts b/app/store/index.ts
index d34cb6b78f9e..fdc1a3a4d95a 100644
--- a/app/store/index.ts
+++ b/app/store/index.ts
@@ -93,10 +93,14 @@ export function createStore(): Store<any> {
   const servicesManager: ServicesManager = ServicesManager.instance;
 
   // TODO: This is bad and I should feel bad
+  // TODO: index
+  // @ts-ignore
   window['servicesManager'] = servicesManager;
 
   const statefulServices = servicesManager.getStatefulServicesAndMutators();
   Object.keys(statefulServices).forEach(serviceName => {
+    // TODO: index
+    // @ts-ignore
     statefulServiceModules[serviceName] = getModule(statefulServices[serviceName]);
   });
 
diff --git a/app/styles/antd/index.ts b/app/styles/antd/index.ts
index 0a2785e3772a..c666b01b23ea 100644
--- a/app/styles/antd/index.ts
+++ b/app/styles/antd/index.ts
@@ -3,9 +3,13 @@ import antdDayTheme from './day-theme.lazy.less';
 import antdPrimeDark from './prime-dark.lazy.less';
 import antdPrimeLight from './prime-light.lazy.less';
 
-export default {
+const themes = {
   ['night-theme']: antdNightTheme,
   ['day-theme']: antdDayTheme,
   ['prime-dark']: antdPrimeDark,
   ['prime-light']: antdPrimeLight,
 };
+
+export type Theme = keyof typeof themes;
+
+export default themes;
diff --git a/app/util/DragHandler.ts b/app/util/DragHandler.ts
index 0dd087521219..0ae981475c27 100644
--- a/app/util/DragHandler.ts
+++ b/app/util/DragHandler.ts
@@ -280,9 +280,10 @@ export class DragHandler {
     );
   }
 
-  private pageSpaceToCanvasSpace(vec: IVec2, display = 'horizontal') {
+  private pageSpaceToCanvasSpace(vec: IVec2, display: 'horizontal' | 'vertical' = 'horizontal') {
     const baseWidth = this.videoSettingsService.baseResolutions[display].baseWidth;
     const baseHeight = this.videoSettingsService.baseResolutions[display].baseHeight;
+
     return {
       x: (vec.x * this.scaleFactor * baseWidth) / this.displaySize.x,
       y: (vec.y * this.scaleFactor * baseHeight) / this.displaySize.y,
diff --git a/app/util/lazy-module.ts b/app/util/lazy-module.ts
index 1db544f5d7a6..c7bd8a2a5cbb 100644
--- a/app/util/lazy-module.ts
+++ b/app/util/lazy-module.ts
@@ -4,7 +4,11 @@ export function lazyModule(module: any) {
 
     Object.defineProperty(target, key, {
       get: () => {
+        // TODO: index
+        // @ts-ignore
         if (!target[objectKey]) target[objectKey] = new module();
+        // TODO: index
+        // @ts-ignore
         return target[objectKey];
       },
     });
diff --git a/app/util/operating-systems.ts b/app/util/operating-systems.ts
index f0e6dd1cabef..6bef953b78f8 100644
--- a/app/util/operating-systems.ts
+++ b/app/util/operating-systems.ts
@@ -6,6 +6,8 @@ export enum OS {
 type TOSHandlerMap<TReturn> = { [os in OS]: (() => TReturn) | TReturn };
 
 export function byOS<TReturn>(handlers: TOSHandlerMap<TReturn>): TReturn {
+  // TODO: index
+  // @ts-ignore
   const handler = handlers[process.platform];
 
   if (typeof handler === 'function') return handler();
diff --git a/app/util/vec2.ts b/app/util/vec2.ts
index 7d742eb9859d..9b5c9ae2de40 100644
--- a/app/util/vec2.ts
+++ b/app/util/vec2.ts
@@ -26,11 +26,19 @@ export class Vec2 extends Vector2 {
     // Change this here behaviour to always return a new object:
     return new Proxy(this, {
       get: (target, propName) => {
+        // TODO: index
+        // maybe use `Object.hasOwnProperty` or the `in` operator (if we care
+        // about inheritance).
+        // @ts-ignore
         if (typeof target[propName] !== 'function' || !Vector2.prototype[propName]) {
+          // TODO: index
+          // @ts-ignore
           return target[propName];
         }
 
         return (...args: any[]) => {
+          // TODO: index
+          // @ts-ignore
           const result = new Vector2(target.x, target.y)[propName](...args);
           if (result instanceof Vector2) return new Vec2(result);
           return result;
diff --git a/package.json b/package.json
index ece99634c75b..39a83cfeb20e 100644
--- a/package.json
+++ b/package.json
@@ -12,7 +12,7 @@
     "compile:updater": "rimraf updater/build && tsc -p updater",
     "compile:strictnulls": "yarn clear && yarn compile:updater && cross-env SLOBS_STRICT_NULLS=true yarn webpack-cli --config ./webpack.dev.config.js",
     "compile:tests": "tsc -p test",
-    "webpack-cli": "node --max-old-space-size=4096 node_modules/webpack-cli/bin/cli.js",
+    "webpack-cli": "node --max-old-space-size=6144 node_modules/webpack-cli/bin/cli.js",
     "watch": "yarn clear && yarn compile:updater && yarn webpack-cli --watch --progress --config ./webpack.dev.config.js",
     "watch:strictnulls": "yarn clear && yarn compile:updater && cross-env SLOBS_STRICT_NULLS=true yarn webpack-cli --watch --progress --config ./webpack.dev.config.js",
     "watch:app": "yarn clear && yarn webpack-cli --watch --progress --config ./webpack.dev-app.config.js",
@@ -112,7 +112,7 @@
     "@sentry/integrations": "5.21.4",
     "@types/archiver": "2.1.3",
     "@types/classnames": "2.2.11",
-    "@types/codemirror": "5.60.4",
+    "@types/codemirror": "5.60.10",
     "@types/extract-zip": "1.6.2",
     "@types/fs-extra": "8.1.1",
     "@types/humps": "1.1.3",
@@ -212,10 +212,10 @@
     "ts-loader": "8.4.0",
     "ts-node": "^10.7.0",
     "typedoc": "0.24.8",
-    "typescript": "4.9.5",
+    "typescript": "5.6.2",
     "urijs": "1.19.11",
     "v-selectpage": "2.0.2",
-    "v-tooltip": "v2.0.3",
+    "v-tooltip": "v2.1.3",
     "vee-validate": "2.2.0",
     "vue": "2.6.9",
     "vue-color": "2.7.0",
diff --git a/test/helpers/api-client.ts b/test/helpers/api-client.ts
index 2e3d530d56e6..010230305e7b 100644
--- a/test/helpers/api-client.ts
+++ b/test/helpers/api-client.ts
@@ -144,6 +144,8 @@ export class ApiClient {
     if (!requestBody.id) throw 'id is required';
 
     return new Promise((resolve, reject) => {
+      // TODO: index
+      // @ts-ignore
       this.requests[requestBody.id] = {
         resolve,
         reject,
@@ -204,6 +206,8 @@ export class ApiClient {
 
         // if message is response for an API call
         // than we should have a pending request object
+        // TODO: index
+        // @ts-ignore
         const request = this.requests[message.id];
         if (request) {
           if (message.error) {
@@ -211,6 +215,8 @@ export class ApiClient {
           } else {
             request.resolve(message.result);
           }
+          // TODO: index
+          // @ts-ignore
           delete this.requests[message.id];
         }
 
@@ -285,6 +291,8 @@ export class ApiClient {
 
     return new Proxy(resourceModel, {
       get: (target, property: string, receiver) => {
+        // TODO: index
+        // @ts-ignore
         if (resourceModel[property] !== void 0) return resourceModel[property];
 
         const resourceScheme = this.getResourceScheme(resourceId);
@@ -355,6 +363,8 @@ class ApiEventWatcher {
     // start watching for events
     this.subscriptions = this.eventNames.map(eventName => {
       const [resourceId, prop] = eventName.split('.');
+      // TODO: index
+      // @ts-ignore
       const observable = this.apiClient.getResource(resourceId)[prop] as Observable<any>;
       return observable.subscribe(() => void 0);
     });
diff --git a/test/helpers/form-monkey.ts b/test/helpers/form-monkey.ts
index 7e26cf15aa61..4ec660408a7a 100644
--- a/test/helpers/form-monkey.ts
+++ b/test/helpers/form-monkey.ts
@@ -211,6 +211,8 @@ export class FormMonkey {
 
       this.log(`got: ${value}`);
       const key = returnTitlesInsteadValues ? input.title : input.name;
+      // TODO: index
+      // @ts-ignore
       formData[key] = value;
     }
 
diff --git a/test/helpers/modules/forms/form.ts b/test/helpers/modules/forms/form.ts
index b0769dce05dd..6058e9dfa57f 100644
--- a/test/helpers/modules/forms/form.ts
+++ b/test/helpers/modules/forms/form.ts
@@ -230,9 +230,13 @@ export async function fillForm(...args: unknown[]): Promise<unknown> {
   if (typeof args[0] === 'string') {
     const formName = args[0];
     const formData = args[1] as TFormData;
+    // TODO: fake hook
+    // eslint-disable-next-line react-hooks/rules-of-hooks
     return useForm(formName).fillForm(formData);
   } else {
     const formData = args[0] as TFormData;
+    // TODO: fake hook
+    // eslint-disable-next-line react-hooks/rules-of-hooks
     return useForm().fillForm(formData);
   }
 }
@@ -246,9 +250,13 @@ export async function readFields(...args: unknown[]): Promise<TFormData> {
   if (typeof args[0] === 'string') {
     const formName = args[0];
     const formData = args[1] as TFormData;
+    // TODO: fake hook
+    // eslint-disable-next-line react-hooks/rules-of-hooks
     return useForm(formName).readFields();
   } else {
     const formData = args[0] as TFormData;
+    // TODO: fake hook
+    // eslint-disable-next-line react-hooks/rules-of-hooks
     return useForm().readFields();
   }
 }
@@ -270,9 +278,13 @@ export async function assertFormContains(
 export async function assertFormContains(...args: any[]): Promise<unknown> {
   if (typeof args[0] === 'string') {
     const [formName, formData, indexKey, valueKey] = args;
+    // TODO: fake hook
+    // eslint-disable-next-line react-hooks/rules-of-hooks
     return useForm(formName).assertFormContains(formData, indexKey, valueKey);
   } else {
     const [formData, indexKey, valueKey] = args;
+    // TODO: fake hook
+    // eslint-disable-next-line react-hooks/rules-of-hooks
     return useForm().assertFormContains(formData, indexKey, valueKey);
   }
 }
@@ -284,5 +296,7 @@ function getInputControllerForType<
   TReturnType extends new (...args: any) => BaseInputController<any>
 >(type: string): TReturnType {
   const controllerName = pascalize(type) + 'InputController';
+  // TODO: index
+  // @ts-ignore
   return inputControllers[controllerName];
 }
diff --git a/test/helpers/webdriver/runner-utils.ts b/test/helpers/webdriver/runner-utils.ts
index 0d1ca7304473..16846c3ab8eb 100644
--- a/test/helpers/webdriver/runner-utils.ts
+++ b/test/helpers/webdriver/runner-utils.ts
@@ -45,6 +45,8 @@ const testTimings: Record<string, number> = (() => {
     const result = {};
 
     // convert the list to the map where key is a test name
+    // TODO: index
+    // @ts-ignore
     records.forEach(r => (result[r.name] = r.time));
     return result;
   } catch (e: unknown) {
diff --git a/test/helpers/webdriver/user.ts b/test/helpers/webdriver/user.ts
index 8535778b851e..1f58d624303f 100644
--- a/test/helpers/webdriver/user.ts
+++ b/test/helpers/webdriver/user.ts
@@ -270,10 +270,11 @@ export async function reserveUserFromPool(
       // request a user with a specific feature
       if (features) {
         // create a filter using mongoDB syntax
-        const filter = {};
-        Object.keys(features).forEach(feature => {
+        const filter: Dictionary<boolean | null> = {};
+        Object.keys(features).forEach((feature: keyof typeof features) => {
           const enabled = features[feature];
-          const filterValue = enabled ? true : null; // convert false to null, since DB doesn't have `false` as a value for features
+          // convert false to null, since DB doesn't have `false` as a value for features
+          const filterValue = enabled ? true : null;
           filter[feature] = filterValue;
         });
         getParams.push(`filter=${JSON.stringify(filter)}`);
diff --git a/test/performance/meter.ts b/test/performance/meter.ts
index 62e4d2383f4f..2e9f52d56db0 100644
--- a/test/performance/meter.ts
+++ b/test/performance/meter.ts
@@ -82,8 +82,10 @@ class Meter {
 
   writeReportToFile(testName: string, path: string) {
     let reportText = `# ${testName}`;
-    Object.keys(this.recordedEvents).forEach(eventName => {
-      const values = this.recordedEvents[eventName].values;
+    const { recordedEvents } = this;
+
+    Object.keys(recordedEvents).forEach((eventName: keyof typeof recordedEvents) => {
+      const values = recordedEvents[eventName].values;
       const average = values.reduce((v1: number, v2: number) => v1 + v2) / values.length;
       const min = Math.min(...values);
       const max = Math.max(...values);
diff --git a/test/regular/widgets/alertbox.ts b/test/regular/widgets/alertbox.ts
index a7917bc362ba..fc5fd035ebeb 100644
--- a/test/regular/widgets/alertbox.ts
+++ b/test/regular/widgets/alertbox.ts
@@ -14,6 +14,7 @@ import { CustomizationService } from '../../../app/services/customization';
 import { assertFormContains, fillForm } from '../../helpers/modules/forms';
 import { sleep } from '../../helpers/sleep';
 
+// TODO: fake hook
 useWebdriver({ pauseIfFailed: false });
 
 test('Alert Box for Twitch', t => testAlertbox(t, 'twitch'));
@@ -36,6 +37,10 @@ const platformAlerts = {
 };
 
 async function testAlertbox(t: TExecutionContext, platform: TPlatform) {
+  if (!Object.keys(platformAlerts).includes(platform)) {
+    t.fail(`Tried to test alerts but no mapping is defined for ${platform}`);
+  }
+
   await logIn(platform);
 
   // create alertbox
@@ -45,7 +50,7 @@ async function testAlertbox(t: TExecutionContext, platform: TPlatform) {
   await openAlertboxSettings();
 
   // click through all available alert types and check for console errors
-  const alerts = platformAlerts[platform];
+  const alerts = platformAlerts[platform as keyof typeof platformAlerts];
   for (const alert of alerts) await click(`span*=${alert}`);
   await sleep(500);
 
diff --git a/test/tsconfig.json b/test/tsconfig.json
index 32ff98098dcb..192e05388fd0 100644
--- a/test/tsconfig.json
+++ b/test/tsconfig.json
@@ -16,7 +16,6 @@
     "experimentalDecorators": true,
     "noImplicitThis": true,
     "removeComments": true,
-    "suppressImplicitAnyIndexErrors": true,
     "strictNullChecks": false,
     // webdriverio bug in their type files
     "skipLibCheck": true,
diff --git a/tsconfig.json b/tsconfig.json
index 73e903bea239..6918088bd5ed 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -14,7 +14,6 @@
     "noImplicitAny": true,
     "noImplicitThis": true,
     "removeComments": true,
-    "suppressImplicitAnyIndexErrors": true,
     "allowSyntheticDefaultImports": true,
     "sourceMap": true,
     "allowJs": false,
@@ -42,10 +41,17 @@
       "vue-tsx-support"
     ]
   },
-  "include": ["./app/**/*"],
-  "exclude": ["./app/components-react/**/*", "**/node_modules/@realm/fetch/dist/types/types.d.ts"],
+  "include": [
+    "./app/**/*"
+  ],
+  "exclude": [
+    "./app/components-react/**/*",
+    "**/node_modules/@realm/fetch/dist/types/types.d.ts"
+  ],
   "typedocOptions": {
-    "entryPoints": ["src/index.ts"],
+    "entryPoints": [
+      "src/index.ts"
+    ],
     "out": "docs"
   }
 }
diff --git a/yarn.lock b/yarn.lock
index eb641f09e4fc..2ecbce93cd3d 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -1667,6 +1667,15 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@babel/runtime@npm:^7.13.10":
+  version: 7.25.6
+  resolution: "@babel/runtime@npm:7.25.6"
+  dependencies:
+    regenerator-runtime: ^0.14.0
+  checksum: ee1a69d3ac7802803f5ee6a96e652b78b8addc28c6a38c725a4ad7d61a059d9e6cb9f6550ed2f63cce67a1bd82e0b1ef66a1079d895be6bfb536a5cfbd9ccc32
+  languageName: node
+  linkType: hard
+
 "@babel/runtime@npm:^7.15.4":
   version: 7.16.5
   resolution: "@babel/runtime@npm:7.16.5"
@@ -2548,12 +2557,12 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@types/codemirror@npm:5.60.4":
-  version: 5.60.4
-  resolution: "@types/codemirror@npm:5.60.4"
+"@types/codemirror@npm:5.60.10":
+  version: 5.60.10
+  resolution: "@types/codemirror@npm:5.60.10"
   dependencies:
     "@types/tern": "*"
-  checksum: 542be5cfef8b36defdaba0b4a0c200d8ba8566d7a6a3b7dcef5f11a59a2232aa402d040df5037a0ada8d4aedc99398854d4efef826625f161ab3425d34742a1e
+  checksum: c5977db03939f2a208f0ec7958be70b4fb205dd3f3122b2175ff28287a5424da95f9030b2838c61d37e6278ec53795861dec12439967c1e1da885b2b2a65b299
   languageName: node
   linkType: hard
 
@@ -11048,7 +11057,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"popper.js@npm:^1.14.3, popper.js@npm:^1.16.0":
+"popper.js@npm:^1.14.3, popper.js@npm:^1.16.1":
   version: 1.16.1
   resolution: "popper.js@npm:1.16.1"
   checksum: c56ae5001ec50a77ee297a8061a0221d99d25c7348d2e6bcd3e45a0d0f32a1fd81bca29d46cb0d4bdf13efb77685bd6a0ce93f9eb3c608311a461f945fffedbe
@@ -12419,6 +12428,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"regenerator-runtime@npm:^0.14.0":
+  version: 0.14.1
+  resolution: "regenerator-runtime@npm:0.14.1"
+  checksum: 9f57c93277b5585d3c83b0cf76be47b473ae8c6d9142a46ce8b0291a04bb2cf902059f0f8445dcabb3fb7378e5fe4bb4ea1e008876343d42e46d3b484534ce38
+  languageName: node
+  linkType: hard
+
 "regenerator-transform@npm:^0.15.2":
   version: 0.15.2
   resolution: "regenerator-transform@npm:0.15.2"
@@ -13140,7 +13156,7 @@ __metadata:
     "@sentry/integrations": 5.21.4
     "@types/archiver": 2.1.3
     "@types/classnames": 2.2.11
-    "@types/codemirror": 5.60.4
+    "@types/codemirror": 5.60.10
     "@types/extract-zip": 1.6.2
     "@types/fs-extra": 8.1.1
     "@types/humps": 1.1.3
@@ -13268,11 +13284,11 @@ __metadata:
     ts-loader: 8.4.0
     ts-node: ^10.7.0
     typedoc: 0.24.8
-    typescript: 4.9.5
+    typescript: 5.6.2
     urijs: 1.19.11
     uuid: ^3.0.1
     v-selectpage: 2.0.2
-    v-tooltip: v2.0.3
+    v-tooltip: v2.1.3
     vee-validate: 2.2.0
     vue: 2.6.9
     vue-color: 2.7.0
@@ -14443,13 +14459,13 @@ __metadata:
   languageName: node
   linkType: hard
 
-"typescript@npm:4.9.5":
-  version: 4.9.5
-  resolution: "typescript@npm:4.9.5"
+"typescript@npm:5.6.2":
+  version: 5.6.2
+  resolution: "typescript@npm:5.6.2"
   bin:
     tsc: bin/tsc
     tsserver: bin/tsserver
-  checksum: ee000bc26848147ad423b581bd250075662a354d84f0e06eb76d3b892328d8d4440b7487b5a83e851b12b255f55d71835b008a66cbf8f255a11e4400159237db
+  checksum: 48777e1dabd9044519f56cd012b0296e3b72bafe12b7e8e34222751d45c67e0eba5387ecdaa6c14a53871a29361127798df6dc8d1d35643a0a47cb0b1c65a33a
   languageName: node
   linkType: hard
 
@@ -14463,13 +14479,13 @@ __metadata:
   languageName: node
   linkType: hard
 
-"typescript@patch:typescript@4.9.5#~builtin<compat/typescript>":
-  version: 4.9.5
-  resolution: "typescript@patch:typescript@npm%3A4.9.5#~builtin<compat/typescript>::version=4.9.5&hash=493e53"
+"typescript@patch:typescript@5.6.2#~builtin<compat/typescript>":
+  version: 5.6.2
+  resolution: "typescript@patch:typescript@npm%3A5.6.2#~builtin<compat/typescript>::version=5.6.2&hash=493e53"
   bin:
     tsc: bin/tsc
     tsserver: bin/tsserver
-  checksum: 2eee5c37cad4390385db5db5a8e81470e42e8f1401b0358d7390095d6f681b410f2c4a0c496c6ff9ebd775423c7785cdace7bcdad76c7bee283df3d9718c0f20
+  checksum: c084ee1ab865f108c787e6233a5f63c126c482c0c8e87ec998ac5288a2ad54b603e1ea8b8b272355823b833eb31b9fabb99e8c6152283e1cb47e3a76bd6faf6c
   languageName: node
   linkType: hard
 
@@ -14784,14 +14800,15 @@ __metadata:
   languageName: node
   linkType: hard
 
-"v-tooltip@npm:v2.0.3":
-  version: 2.0.3
-  resolution: "v-tooltip@npm:2.0.3"
+"v-tooltip@npm:v2.1.3":
+  version: 2.1.3
+  resolution: "v-tooltip@npm:2.1.3"
   dependencies:
-    lodash: ^4.17.15
-    popper.js: ^1.16.0
-    vue-resize: ^0.4.5
-  checksum: 6abc121aeea9130f34354f72efedc98802989a866f2854f0338d52e0adc1f9e27066c79ec6ba40bae3dc5acb80877458825e14501a85f0abd628e04489d49343
+    "@babel/runtime": ^7.13.10
+    lodash: ^4.17.21
+    popper.js: ^1.16.1
+    vue-resize: ^1.0.1
+  checksum: 1f3f0010f7d7566dee3e5b8c2bc7bfa9709371681e48d8bbe368ddb9ff670c8fdfdd228f93eec092450dca8379c87b7b6e738dcfd7fa7a05fb9f1dd92c5a0eb1
   languageName: node
   linkType: hard
 
@@ -14966,12 +14983,14 @@ __metadata:
   languageName: node
   linkType: hard
 
-"vue-resize@npm:^0.4.5":
-  version: 0.4.5
-  resolution: "vue-resize@npm:0.4.5"
+"vue-resize@npm:^1.0.1":
+  version: 1.0.1
+  resolution: "vue-resize@npm:1.0.1"
+  dependencies:
+    "@babel/runtime": ^7.13.10
   peerDependencies:
-    vue: ^2.3.0
-  checksum: 045de8640feb6c48a684f844b13d2981b7365917f407500a729af722c01da424f78ec3107284d90dbd1ba566b196f46f5d6c903cd7c1e6141683710ab1fa4ab2
+    vue: ^2.6.0
+  checksum: 20bca05940addef049c3ba6e416c372891d6fc6a77cffeeafbf10b6325379db827c7286f497387ababfdc72127052baa3d0a38e678a0e4b20739f615b2ca47af
   languageName: node
   linkType: hard