!feat: partial tab groups support on firefox

entrypoints/sidepanel/utils/opener.ts

@@ -60,8 +60,7 @@ async function createGroup(group: GroupItem, windowId: number, discard?: boolean
 	));
 
 	// "Pinned" group is technically not a group, so not much else to do here
-	// and Firefox doesn't even support tab groups
+	if (group.pinned === true)
-	if (group.pinned === true || import.meta.env.FIREFOX)
 		return;
 
 	const groupId: number = await chrome.tabs.group({
@@ -69,10 +68,13 @@ async function createGroup(group: GroupItem, windowId: number, discard?: boolean
 		createProperties: { windowId }
 	});
 
-	await chrome.tabGroups.update(groupId, {
+	// Grouping support came in 138, tabGroups is expected to be in 139
-		title: group.title,
+	// TODO: Remove this check once the API is available
-		color: group.color
+	if (!import.meta.env.FIREFOX)
-	});
+		await chrome.tabGroups.update(groupId, {
+			title: group.title,
+			color: group.color
+		});
 }
 
 async function manageWindow(handle: (windowId: number) => Promise<void>, windowProps?: Windows.CreateCreateDataType): Promise<void>

utils/saveTabsToCollection.ts

@@ -83,22 +83,22 @@ async function createCollectionFromTabs(tabs: Tabs.Tab[]): Promise<[CollectionIt
 		}
 	}
 
-	if (import.meta.env.FIREFOX)
-	{
-		for (; tabIndex < tabs.length; tabIndex++)
-			collection.items.push({ type: "tab", url: tabs[tabIndex].url!, title: tabs[tabIndex].title });
-
-		return [collection, tabs];
-	}
-
 	// Special case, if all tabs are in the same group, create a collection with the group title
-	if (tabs[0].groupId && tabs[0].groupId !== chrome.tabGroups.TAB_GROUP_ID_NONE &&
+	if (tabs[0].groupId && tabs[0].groupId !== -1 &&
 		tabs.every(i => i.groupId === tabs[0].groupId)
 	)
 	{
-		const group = await browser.tabGroups!.get(tabs[0].groupId);
+		// TODO: Remove the check when Firefox 139 is out
-		collection.title = group.title;
+		if (!import.meta.env.FIREFOX)
-		collection.color = group.color;
+		{
+			const group = await browser.tabGroups!.get(tabs[0].groupId);
+			collection.title = group.title;
+			collection.color = group.color;
+		}
+		else
+		{
+			collection.color = "blue";
+		}
 
 		tabs.forEach(i =>
 			collection.items.push({ type: "tab", url: i.url!, title: i.title })
@@ -113,7 +113,7 @@ async function createCollectionFromTabs(tabs: Tabs.Tab[]): Promise<[CollectionIt
 	{
 		const tab = tabs[tabIndex];
 
-		if (!tab.groupId || tab.groupId === chrome.tabGroups.TAB_GROUP_ID_NONE)
+		if (!tab.groupId || tab.groupId === -1)
 		{
 			collection.items.push({ type: "tab", url: tab.url!, title: tab.title });
 			activeGroup = null;
@@ -123,14 +123,27 @@ async function createCollectionFromTabs(tabs: Tabs.Tab[]): Promise<[CollectionIt
 		if (!activeGroup || activeGroup !== tab.groupId)
 		{
 			activeGroup = tab.groupId;
-			const group = await browser.tabGroups!.get(activeGroup);
 
-			collection.items.push({
+			// TODO: Remove the check when Firefox 139 is out
-				type: "group",
+			if (import.meta.env.FIREFOX)
-				color: group.color,
+			{
-				title: group.title,
+				collection.items.push({
-				items: []
+					type: "group",
-			});
+					color: "blue",
+					items: []
+				});
+			}
+			else
+			{
+				const group = await browser.tabGroups!.get(activeGroup);
+
+				collection.items.push({
+					type: "group",
+					color: group.color,
+					title: group.title,
+					items: []
+				});
+			}
 		}
 
 		(collection.items[collection.items.length - 1] as GroupItem).items.push({

wxt.config.ts

@@ -78,7 +78,7 @@ export default defineConfig({
 				gecko:
 				{
 					id: "tabsaside@xfox111.net",
-					strict_min_version: "109.0"
+					strict_min_version: "138.0"
 				}
 			};