mirror of
https://github.com/XFox111/TabsAsideExtension.git
synced 2026-04-22 07:58:01 +03:00
405 lines
12 KiB
TypeScript
405 lines
12 KiB
TypeScript
import { track, trackError } from "@/features/analytics";
|
|
import { collectionCount, getCollections, saveCollections } from "@/features/collectionStorage";
|
|
import { migrateStorage } from "@/features/migration";
|
|
import { showWelcomeDialog } from "@/features/v3welcome/utils/showWelcomeDialog";
|
|
import { SettingsValue } from "@/hooks/useSettings";
|
|
import { CollectionItem, GraphicsStorage } from "@/models/CollectionModels";
|
|
import getLogger from "@/utils/getLogger";
|
|
import { onMessage, sendMessage } from "@/utils/messaging";
|
|
import saveTabsToCollection from "@/utils/saveTabsToCollection";
|
|
import sendNotification from "@/utils/sendNotification";
|
|
import { settings } from "@/utils/settings";
|
|
import watchTabSelection from "@/utils/watchTabSelection";
|
|
import { Tabs, Windows } from "wxt/browser";
|
|
import { Unwatch } from "wxt/storage";
|
|
|
|
export default defineBackground(() =>
|
|
{
|
|
try
|
|
{
|
|
const logger = getLogger("background");
|
|
const graphicsCache: GraphicsStorage = {};
|
|
let listLocation: SettingsValue<"listLocation"> = "sidebar";
|
|
|
|
logger("Background script started");
|
|
|
|
// Little workaround for opening side panel
|
|
// See: https://stackoverflow.com/questions/77213045/error-sidepanel-open-may-only-be-called-in-response-to-a-user-gesture-re
|
|
settings.listLocation.getValue().then(location => listLocation = location);
|
|
settings.listLocation.watch(newLocation => listLocation = newLocation);
|
|
|
|
browser.runtime.onInstalled.addListener(async ({ reason, previousVersion }) =>
|
|
{
|
|
logger("onInstalled", reason, previousVersion);
|
|
track("extension_installed", { reason, previousVersion: previousVersion ?? "none" });
|
|
|
|
const previousMajor: number = previousVersion ? parseInt(previousVersion.split(".")[0]) : 0;
|
|
|
|
if (reason === "update" && previousMajor < 3)
|
|
{
|
|
await migrateStorage();
|
|
await showWelcomeDialog.setValue(true);
|
|
browser.runtime.reload();
|
|
}
|
|
});
|
|
|
|
browser.tabs.onUpdated.addListener((_, __, tab) =>
|
|
{
|
|
if (!tab.url)
|
|
return;
|
|
|
|
graphicsCache[tab.url] = {
|
|
preview: graphicsCache[tab.url]?.preview,
|
|
capture: graphicsCache[tab.url]?.capture,
|
|
icon: tab.favIconUrl ?? graphicsCache[tab.url]?.icon
|
|
};
|
|
});
|
|
|
|
browser.commands.onCommand.addListener(
|
|
(command, tab) => performContextAction(command, tab!.windowId!)
|
|
);
|
|
|
|
onMessage("getGraphicsCache", () => graphicsCache);
|
|
onMessage("addThumbnail", ({ data }) =>
|
|
{
|
|
graphicsCache[data.url] = {
|
|
preview: data.thumbnail,
|
|
capture: graphicsCache[data.url]?.capture,
|
|
icon: graphicsCache[data.url]?.icon
|
|
};
|
|
});
|
|
|
|
setupTabCaputre();
|
|
async function setupTabCaputre(): Promise<void>
|
|
{
|
|
const tryCaptureTab = async (tab: Tabs.Tab): Promise<void> =>
|
|
{
|
|
if (!tab.url || tab.status !== "complete" || !tab.active)
|
|
return;
|
|
|
|
try
|
|
{
|
|
// We use chrome here because polyfill throws uncatchable errors for some reason
|
|
// It's a compatible API anyway
|
|
const capture: string = await chrome.tabs.captureVisibleTab(tab.windowId!, { format: "jpeg", quality: 1 });
|
|
|
|
if (capture)
|
|
{
|
|
graphicsCache[tab.url] = {
|
|
capture,
|
|
preview: graphicsCache[tab.url]?.preview,
|
|
icon: graphicsCache[tab.url]?.icon
|
|
};
|
|
}
|
|
}
|
|
catch { }
|
|
};
|
|
|
|
setInterval(() =>
|
|
{
|
|
browser.tabs.query({ active: true })
|
|
.then(tabs => tabs.forEach(tab => tryCaptureTab(tab)));
|
|
}, 1000);
|
|
}
|
|
|
|
setupContextMenu();
|
|
async function setupContextMenu(): Promise<void>
|
|
{
|
|
await browser.contextMenus.removeAll();
|
|
|
|
const items: Record<string, string> =
|
|
{
|
|
"show_collections": i18n.t("actions.show_collections"),
|
|
"set_aside": i18n.t("actions.set_aside.all"),
|
|
"save": i18n.t("actions.save.all")
|
|
};
|
|
|
|
Object.entries(items).forEach(([id, title]) => browser.contextMenus.create({
|
|
id, title,
|
|
visible: true,
|
|
contexts: ["action"]
|
|
}));
|
|
|
|
watchTabSelection(async selection =>
|
|
{
|
|
await browser.contextMenus.update("set_aside", {
|
|
title: i18n.t(`actions.set_aside.${selection}`)
|
|
});
|
|
await browser.contextMenus.update("save", {
|
|
title: i18n.t(`actions.save.${selection}`)
|
|
});
|
|
});
|
|
|
|
browser.contextMenus.onClicked.addListener(
|
|
({ menuItemId }, tab) => performContextAction((menuItemId as string), tab!.windowId!)
|
|
);
|
|
}
|
|
|
|
setupBadge();
|
|
async function setupBadge(): Promise<void>
|
|
{
|
|
let unwatchBadge: Unwatch | null = null;
|
|
const updateBadge = async (count: number | null) =>
|
|
await browser.action.setBadgeText({ text: count && count > 0 ? count.toString() : "" });
|
|
|
|
if (await settings.showBadge.getValue())
|
|
{
|
|
updateBadge(await collectionCount.getValue());
|
|
unwatchBadge = collectionCount.watch(updateBadge);
|
|
}
|
|
|
|
if (import.meta.env.FIREFOX)
|
|
{
|
|
await browser.action.setBadgeBackgroundColor({ color: "#0f6cbd" });
|
|
await browser.action.setBadgeTextColor({ color: "white" });
|
|
}
|
|
|
|
settings.showBadge.watch(async showBadge =>
|
|
{
|
|
if (showBadge)
|
|
{
|
|
updateBadge(await collectionCount.getValue());
|
|
unwatchBadge = collectionCount.watch(updateBadge);
|
|
}
|
|
else
|
|
{
|
|
unwatchBadge?.();
|
|
await browser.action.setBadgeText({ text: "" });
|
|
}
|
|
});
|
|
}
|
|
|
|
setupActionButton();
|
|
async function setupActionButton(): Promise<void>
|
|
{
|
|
let unwatchActionTitle: Unwatch | null = null;
|
|
|
|
const onClickAction = async (): Promise<void> =>
|
|
{
|
|
logger("action.onClicked");
|
|
const defaultAction = await settings.defaultSaveAction.getValue();
|
|
await saveTabs(defaultAction === "set_aside");
|
|
};
|
|
|
|
const updateTitle = async (selection: "all" | "selected"): Promise<void> =>
|
|
{
|
|
const defaultAction = await settings.defaultSaveAction.getValue();
|
|
await browser.action.setTitle({ title: i18n.t(`actions.${defaultAction}.${selection}`) });
|
|
};
|
|
|
|
const toggleSidebarFirefox = async (): Promise<void> =>
|
|
await browser.sidebarAction.toggle();
|
|
|
|
const updateButton = async (action: SettingsValue<"contextAction">): Promise<void> =>
|
|
{
|
|
logger("updateButton", action);
|
|
|
|
// Cleanup any existing behavior
|
|
browser.action.onClicked.removeListener(onClickAction);
|
|
browser.action.onClicked.removeListener(toggleSidebarFirefox);
|
|
browser.action.onClicked.removeListener(openCollectionsInTab);
|
|
|
|
await browser.action.disable();
|
|
await browser.action.setTitle({ title: i18n.t("manifest.name") });
|
|
unwatchActionTitle?.();
|
|
|
|
if (!import.meta.env.FIREFOX)
|
|
await chrome.sidePanel.setPanelBehavior({ openPanelOnActionClick: false });
|
|
|
|
// Setup new behavior
|
|
if (action === "action")
|
|
{
|
|
browser.action.onClicked.addListener(onClickAction);
|
|
unwatchActionTitle = watchTabSelection(updateTitle);
|
|
await browser.action.enable();
|
|
}
|
|
else if (action === "open")
|
|
{
|
|
await browser.action.enable();
|
|
const location = await settings.listLocation.getValue();
|
|
|
|
if (location === "sidebar")
|
|
{
|
|
if (import.meta.env.FIREFOX)
|
|
browser.action.onClicked.addListener(toggleSidebarFirefox);
|
|
else
|
|
chrome.sidePanel.setPanelBehavior({ openPanelOnActionClick: true });
|
|
}
|
|
else if (location !== "popup")
|
|
browser.action.onClicked.addListener(openCollectionsInTab);
|
|
}
|
|
};
|
|
|
|
updateButton(await settings.contextAction.getValue());
|
|
settings.contextAction.watch(updateButton);
|
|
settings.listLocation.watch(async () => updateButton(await settings.contextAction.getValue()));
|
|
}
|
|
|
|
setupCollectionView();
|
|
async function setupCollectionView(): Promise<void>
|
|
{
|
|
const enforcePinnedTab = async (): Promise<void> =>
|
|
{
|
|
logger("enforcePinnedTab");
|
|
|
|
const openWindows: Windows.Window[] = await browser.windows.getAll({ populate: true });
|
|
|
|
for (const openWindow of openWindows)
|
|
{
|
|
if (openWindow.incognito)
|
|
continue;
|
|
|
|
const activeTabs: Tabs.Tab[] = openWindow.tabs!.filter(tab =>
|
|
tab.url === browser.runtime.getURL("/sidepanel.html"));
|
|
|
|
const targetTab: Tabs.Tab | undefined = activeTabs.find(tab => tab.pinned);
|
|
|
|
if (!targetTab)
|
|
await browser.tabs.create({
|
|
url: browser.runtime.getURL("/sidepanel.html"),
|
|
windowId: openWindow.id,
|
|
active: false,
|
|
pinned: true
|
|
});
|
|
|
|
const tabsToClose: Tabs.Tab[] = activeTabs.filter(tab => tab.id !== targetTab?.id);
|
|
|
|
if (tabsToClose.length > 0)
|
|
await browser.tabs.remove(tabsToClose.map(tab => tab.id!));
|
|
}
|
|
};
|
|
|
|
const updateView = async (viewLocation: SettingsValue<"listLocation">): Promise<void> =>
|
|
{
|
|
logger("updateView", viewLocation);
|
|
|
|
browser.tabs.onHighlighted.removeListener(enforcePinnedTab);
|
|
const tabs: Tabs.Tab[] = await browser.tabs.query({
|
|
url: browser.runtime.getURL("/sidepanel.html")
|
|
});
|
|
await browser.tabs.remove(tabs.map(tab => tab.id!));
|
|
|
|
await browser.action.setPopup({
|
|
popup: viewLocation === "popup" ? browser.runtime.getURL("/popup.html") : ""
|
|
});
|
|
|
|
if (import.meta.env.FIREFOX)
|
|
await browser.sidebarAction.setPanel({
|
|
panel: viewLocation === "sidebar" ? browser.runtime.getURL("/sidepanel.html") : ""
|
|
});
|
|
else
|
|
await chrome.sidePanel.setOptions({ enabled: viewLocation === "sidebar" });
|
|
|
|
if (viewLocation === "pinned")
|
|
{
|
|
enforcePinnedTab();
|
|
browser.tabs.onHighlighted.addListener(enforcePinnedTab);
|
|
}
|
|
};
|
|
|
|
updateView(await settings.listLocation.getValue());
|
|
settings.listLocation.watch(updateView);
|
|
}
|
|
|
|
function performContextAction(action: string, windowId: number): void
|
|
{
|
|
if (action === "show_collections")
|
|
{
|
|
if (listLocation === "sidebar" || listLocation === "popup")
|
|
openCollectionsInView(listLocation, windowId);
|
|
else
|
|
openCollectionsInTab();
|
|
}
|
|
else
|
|
saveTabs(action === "set_aside");
|
|
}
|
|
|
|
function openCollectionsInView(view: "sidebar" | "popup", windowId: number): void
|
|
{
|
|
if (view === "sidebar")
|
|
{
|
|
if (import.meta.env.FIREFOX)
|
|
browser.sidebarAction.open();
|
|
else
|
|
chrome.sidePanel.open({ windowId });
|
|
}
|
|
else
|
|
browser.action.openPopup();
|
|
}
|
|
|
|
async function openCollectionsInTab(): Promise<void>
|
|
{
|
|
logger("openCollectionsInTab");
|
|
|
|
const currentWindow: Windows.Window = await browser.windows.getCurrent({ populate: true });
|
|
|
|
if (currentWindow.incognito)
|
|
{
|
|
let availableWindows: Windows.Window[] = await browser.windows.getAll({ populate: true });
|
|
|
|
availableWindows = availableWindows.filter(window =>
|
|
!window.incognito &&
|
|
window.tabs?.some(i => i.url === browser.runtime.getURL("/sidepanel.html"))
|
|
);
|
|
|
|
if (availableWindows.length > 0)
|
|
{
|
|
const availableTab: Tabs.Tab = availableWindows[0].tabs!.find(
|
|
tab => tab.url === browser.runtime.getURL("/sidepanel.html")
|
|
)!;
|
|
|
|
await browser.tabs.update(availableTab.id, { active: true });
|
|
await browser.windows.update(availableWindows[0].id!, { focused: true });
|
|
|
|
return;
|
|
}
|
|
|
|
await browser.windows.create({
|
|
url: browser.runtime.getURL("/sidepanel.html"),
|
|
focused: true
|
|
});
|
|
}
|
|
else
|
|
{
|
|
const collectionTab: Tabs.Tab | undefined = currentWindow.tabs!.find(
|
|
tab => tab.url === browser.runtime.getURL("/sidepanel.html")
|
|
);
|
|
|
|
if (collectionTab)
|
|
await browser.tabs.update(collectionTab.id, { active: true });
|
|
else
|
|
await browser.tabs.create({
|
|
url: browser.runtime.getURL("/sidepanel.html"),
|
|
active: true,
|
|
windowId: currentWindow.id
|
|
});
|
|
}
|
|
}
|
|
|
|
async function saveTabs(closeAfterSave: boolean): Promise<void>
|
|
{
|
|
logger("saveTabs", closeAfterSave);
|
|
|
|
const collection: CollectionItem = await saveTabsToCollection(closeAfterSave);
|
|
const [savedCollections, cloudIssue] = await getCollections();
|
|
const newList = [collection, ...savedCollections];
|
|
|
|
await saveCollections(newList, cloudIssue === null, graphicsCache);
|
|
|
|
sendMessage("refreshCollections", undefined);
|
|
|
|
if (await settings.notifyOnSave.getValue())
|
|
await sendNotification({
|
|
title: i18n.t("notifications.tabs_saved.title"),
|
|
message: i18n.t("notifications.tabs_saved.message"),
|
|
icon: "/notification_icons/cloud_checkmark.png"
|
|
});
|
|
}
|
|
}
|
|
catch (ex)
|
|
{
|
|
console.error(ex);
|
|
trackError("background_error", ex as Error);
|
|
}
|
|
});
|