Refactor browser extension content scripts to use platform adapters

apps/browser-extension/entrypoints/content/adapters/platform-adapter.ts

@@ -0,0 +1,17 @@
+export interface PlatformAdapter {
+	/**
+	 * Unique identifier for the adapter. Useful for debugging and telemetry.
+	 */
+	readonly id: string
+
+	/**
+	 * Determines whether this adapter should run for the current page.
+	 */
+	matches(): boolean
+
+	/**
+	 * Performs any one-time setup. Implementations should be idempotent.
+	 */
+	init(): void
+}
+

apps/browser-extension/entrypoints/content/chatgpt.ts

@@ -10,6 +10,7 @@ import {
 	createChatGPTInputBarElement,
 	DOMUtils,
 } from "../../utils/ui-components"
+import type { PlatformAdapter } from "./adapters/platform-adapter"
 
 let chatGPTDebounceTimeout: NodeJS.Timeout | null = null
 let chatGPTRouteObserver: MutationObserver | null = null
@@ -38,6 +39,7 @@ export function initializeChatGPT() {
 	document.body.setAttribute("data-chatgpt-initialized", "true")
 }
 
+
 function setupChatGPTRouteChangeDetection() {
 	if (chatGPTRouteObserver) {
 		chatGPTRouteObserver.disconnect()
@@ -254,6 +256,13 @@ function addSupermemoryButtonToMemoriesDialog() {
 	)
 }
 
+export const chatGPTAdapter: PlatformAdapter = {
+	id: "chatgpt",
+	matches: () => DOMUtils.isOnDomain(DOMAINS.CHATGPT),
+	init: initializeChatGPT,
+}
+
+
 async function saveMemoriesToSupermemory() {
 	try {
 		DOMUtils.showToast("loading")

apps/browser-extension/entrypoints/content/claude.ts

@@ -10,6 +10,7 @@ import {
 	createClaudeInputBarElement,
 	DOMUtils,
 } from "../../utils/ui-components"
+import type { PlatformAdapter } from "./adapters/platform-adapter"
 
 let claudeDebounceTimeout: NodeJS.Timeout | null = null
 let claudeRouteObserver: MutationObserver | null = null
@@ -589,6 +590,13 @@ function setupClaudePromptCapture() {
 	)
 }
 
+export const claudeAdapter: PlatformAdapter = {
+	id: "claude",
+	matches: () => DOMUtils.isOnDomain(DOMAINS.CLAUDE),
+	init: initializeClaude,
+}
+
+
 async function setupClaudeAutoFetch() {
 	const result = await chrome.storage.local.get([
 		STORAGE_KEYS.AUTO_SEARCH_ENABLED,

apps/browser-extension/entrypoints/content/index.ts

@@ -1,7 +1,7 @@
 import { DOMAINS, MESSAGE_TYPES } from "../../utils/constants"
 import { DOMUtils } from "../../utils/ui-components"
-import { initializeChatGPT } from "./chatgpt"
-import { initializeClaude } from "./claude"
+import { chatGPTAdapter } from "./chatgpt"
+import { claudeAdapter } from "./claude"
 import { saveMemory, setupGlobalKeyboardShortcut, setupStorageListener } from "./shared"
 import { initializeT3 } from "./t3"
 import { handleTwitterNavigation, initializeTwitter, updateTwitterImportUI } from "./twitter"
@@ -28,40 +28,40 @@ export default defineContentScript({
 		// Setup storage listener
 		setupStorageListener()
 
-		// Observer for dynamic content changes
-		const observeForDynamicChanges = () => {
-			const observer = new MutationObserver(() => {
-				if (DOMUtils.isOnDomain(DOMAINS.CHATGPT)) {
-					initializeChatGPT()
-				}
-				if (DOMUtils.isOnDomain(DOMAINS.CLAUDE)) {
-					initializeClaude()
-				}
-				if (DOMUtils.isOnDomain(DOMAINS.T3)) {
-					initializeT3()
-				}
-				if (DOMUtils.isOnDomain(DOMAINS.TWITTER)) {
-					handleTwitterNavigation()
+		const platformAdapters = [chatGPTAdapter, claudeAdapter]
+
+		const runPlatformAdapters = () => {
+			platformAdapters.forEach((adapter) => {
+				if (adapter.matches()) {
+					adapter.init()
 				}
 			})
 
+			if (DOMUtils.isOnDomain(DOMAINS.T3)) {
+				initializeT3()
+			}
+
+			if (DOMUtils.isOnDomain(DOMAINS.TWITTER)) {
+				handleTwitterNavigation()
+			}
+		}
+
+		runPlatformAdapters()
+		initializeTwitter()
+
+		const observer = new MutationObserver(runPlatformAdapters)
+		const startObserving = () =>
 			observer.observe(document.body, {
 				childList: true,
 				subtree: true,
 			})
-		}
 
-		// Initialize platform-specific functionality
-		initializeChatGPT()
-		initializeClaude()
-		initializeT3()
-		initializeTwitter()
-
-		// Start observing for dynamic changes
 		if (document.readyState === "loading") {
-			document.addEventListener("DOMContentLoaded", observeForDynamicChanges)
+			document.addEventListener("DOMContentLoaded", startObserving, {
+				once: true,
+			})
 		} else {
-			observeForDynamicChanges()
+			startObserving()
 		}
 	},
-})
+})