chore(browser-extension): twitter import modal & package dependencies (#643)01-01-chore_browser-extension_fixed_package_dependencies

- twitter import for all bookmarks
- fixed chrome extension package dependencies issues with monorepo

2 files changed, 61 insertions, 7 deletions

diff --git a/apps/browser-extension/entrypoints/content/twitter.ts b/apps/browser-extension/entrypoints/content/twitter.ts
index bfcc44c0..d5328245 100644
--- a/apps/browser-extension/entrypoints/content/twitter.ts
+++ b/apps/browser-extension/entrypoints/content/twitter.ts
@@ -8,6 +8,7 @@ import { trackEvent } from "../../utils/posthog"
 import {
 	createTwitterImportButton,
 	createProjectSelectionModal,
+	createSaveTweetElement,
 	DOMUtils,
 } from "../../utils/ui-components"
 
@@ -56,18 +57,71 @@ function addTwitterImportButton() {
 
 	const button = createTwitterImportButton(async () => {
 		try {
+			await handleAllBookmarksImportClick()
+		} catch (error) {
+			console.error("Error starting import:", error)
+		}
+	})
+
+	document.body.appendChild(button)
+}
+
+async function handleAllBookmarksImportClick() {
+	try {
+		const response = await browser.runtime.sendMessage({
+			action: MESSAGE_TYPES.FETCH_PROJECTS,
+		})
+
+		const projects = response.success && response.data ? response.data : []
+
+		if (projects.length === 0) {
 			await browser.runtime.sendMessage({
 				type: MESSAGE_TYPES.BATCH_IMPORT_ALL,
 			})
 			await trackEvent(POSTHOG_EVENT_KEY.TWITTER_IMPORT_STARTED, {
 				source: `${POSTHOG_EVENT_KEY.SOURCE}_content_script`,
 			})
-		} catch (error) {
-			console.error("Error starting import:", error)
+		} else {
+			await showAllBookmarksProjectModal(projects)
 		}
-	})
+	} catch (error) {
+		console.error("Error handling all bookmarks import:", error)
+		await browser.runtime.sendMessage({
+			type: MESSAGE_TYPES.BATCH_IMPORT_ALL,
+		})
+	}
+}
 
-	document.body.appendChild(button)
+
+async function showAllBookmarksProjectModal(
+	projects: Array<{ id: string; name: string; containerTag: string }>,
+) {
+	await loadSpaceGroteskFonts()
+
+	const modal = createProjectSelectionModal(
+		projects,
+		async (selectedProject) => {
+			modal.remove()
+
+			try {
+				await browser.runtime.sendMessage({
+					type: MESSAGE_TYPES.BATCH_IMPORT_ALL,
+					selectedProject: selectedProject,
+				})
+				await trackEvent(POSTHOG_EVENT_KEY.TWITTER_IMPORT_STARTED, {
+					source: `${POSTHOG_EVENT_KEY.SOURCE}_content_script`,
+					project_selected: true,
+				})
+			} catch (error) {
+				console.error("Error importing all bookmarks:", error)
+			}
+		},
+		() => {
+			modal.remove()
+		},
+	)
+
+	document.body.appendChild(modal)
 }
 
 function addTwitterImportButtonForFolders() {
diff --git a/apps/browser-extension/package.json b/apps/browser-extension/package.json
index a2b72865..f40426a8 100644
--- a/apps/browser-extension/package.json
+++ b/apps/browser-extension/package.json
@@ -16,10 +16,10 @@
 	},
 	"dependencies": {
 		"@tailwindcss/vite": "^4.1.12",
-		"@tanstack/react-query": "^5.85.5",
+		"@tanstack/react-query": "^5.81.2",
 		"posthog-js": "^1.261.7",
-		"react": "^19.1.0",
-		"react-dom": "^19.1.0",
+		"react": "19.2.2",
+		"react-dom": "19.2.2",
 		"tailwindcss": "^4.1.12",
 		"turndown": "^7.1.3"
 	},