diff --git a/src/js/BaseComponent.ts b/src/js/BaseComponent.ts
deleted file mode 100644
index 2233a6e95..000000000
--- a/src/js/BaseComponent.ts
+++ /dev/null
@@ -1,53 +0,0 @@
-/* eslint-disable @typescript-eslint/no-explicit-any */
-import { PureComponent } from 'preact/compat';
-
-import { Callback, Unsubscribe } from './state/LocalState.ts';
-
-type OwnState = {
-  ogImageUrl?: any;
-};
-
-// TODO this class should be removed and functional components used everywhere instead
-
-export default abstract class BaseComponent<Props = any, State = any> extends PureComponent<
-  Props,
-  State & OwnState
-> {
-  unmounted?: boolean;
-
-  unsubscribes: Record<string, Unsubscribe | undefined> = {};
-
-  sub(callback: CallableFunction, path?: string): Callback {
-    const cb = (data, key, unsubscribe, f): void => {
-      if (this.unmounted) {
-        unsubscribe?.();
-        return;
-      }
-      this.unsubscribes[path ?? key] = unsubscribe;
-      callback(data, key, unsubscribe, f);
-    };
-
-    return cb as any;
-  }
-
-  inject(name?: string, path?: string): Callback {
-    return this.sub((v: unknown, k: string) => {
-      const newState: any = {};
-      newState[(name ?? k) as keyof State] = v as any;
-      this.setState(newState);
-    }, path);
-  }
-
-  unsubscribe() {
-    Object.keys(this.unsubscribes).forEach((k) => {
-      const unsub = this.unsubscribes[k];
-      unsub?.();
-      delete this.unsubscribes[k];
-    });
-  }
-
-  componentWillUnmount() {
-    this.unmounted = true;
-    this.unsubscribe();
-  }
-}
diff --git a/src/js/components/header/Header.tsx b/src/js/components/header/Header.tsx
index a4539a6fb..67fe5671d 100644
--- a/src/js/components/header/Header.tsx
+++ b/src/js/components/header/Header.tsx
@@ -1,12 +1,12 @@
 import { ChevronDownIcon } from '@heroicons/react/20/solid';
 import { Cog8ToothIcon, HeartIcon } from '@heroicons/react/24/outline';
 import { ArrowLeftIcon, HeartIcon as HeartIconFull } from '@heroicons/react/24/solid';
+import { PureComponent } from 'preact/compat';
 import { Link, route } from 'preact-router';
 
-import Component from '../../BaseComponent.ts';
 import Key from '../../nostr/Key.ts';
 import Relays from '../../nostr/Relays.ts';
-import localState from '../../state/LocalState.ts';
+import localState, { Callback, Unsubscribe } from '../../state/LocalState.ts';
 import { translate as t } from '../../translations/Translation.mjs';
 import Icons from '../../utils/Icons.tsx';
 import Show from '../helpers/Show.tsx';
@@ -19,9 +19,11 @@ declare global {
   }
 }
 
-export default class Header extends Component {
+export default class Header extends PureComponent<any, any> {
   userId = null as string | null;
   iv = null as any;
+  unmounted?: boolean;
+  unsubscribes: Record<string, Unsubscribe | undefined> = {};
 
   constructor() {
     super();
@@ -35,12 +37,32 @@ export default class Header extends Component {
     }
   }
 
+  sub(callback: CallableFunction, path?: string): Callback {
+    const cb = (data, key, unsubscribe, f): void => {
+      if (this.unmounted) {
+        unsubscribe?.();
+        return;
+      }
+      this.unsubscribes[path ?? key] = unsubscribe;
+      callback(data, key, unsubscribe, f);
+    };
+
+    return cb as any;
+  }
+
+  inject(name?: string, path?: string): Callback {
+    return this.sub((v: unknown, k: string) => {
+      const newState: any = {};
+      newState[name ?? k] = v as any;
+      this.setState(newState);
+    }, path);
+  }
+
   backButtonClicked() {
     window.history.back();
   }
 
   componentWillUnmount() {
-    super.componentWillUnmount();
     this.iv && clearInterval(this.iv);
     document.removeEventListener('keydown', this.escFunction, false);
   }
diff --git a/src/js/views/settings/IrisAccount.tsx b/src/js/views/settings/IrisAccount.tsx
index 2b777f422..3ee50f725 100644
--- a/src/js/views/settings/IrisAccount.tsx
+++ b/src/js/views/settings/IrisAccount.tsx
@@ -1,8 +1,8 @@
 import debounce from 'lodash/debounce';
 import { Event, UnsignedEvent } from 'nostr-tools';
+import { Component } from 'preact';
 import { route } from 'preact-router';
 
-import Component from '../../BaseComponent';
 import Events from '../../nostr/Events';
 import Key from '../../nostr/Key';
 import SocialNetwork from '../../nostr/SocialNetwork';