feat: inline chrome-extension-toolkit (#744)

* feat(build): inline chrome-extension-toolkit

fix: tsconfig

docs: add chrome-extension-toolkit README.md

chore: update imports

fix: stores

fix: chrome-extension-toolkit ForegroundMessenger

fix: calendarBackgroundHandler

fix: format and lint

fix: path alias

fix: add jsdom env and fix imports

Co-authored-by: Sriram Hariharan <sghsri@gmail.com>

* build: vite storybook config crx toolkit line

---------

Co-authored-by: Sriram Hariharan <sghsri@gmail.com>
Co-authored-by: Derek <derex1987@gmail.com>

src/pages/background/background.ts

@@ -1,7 +1,7 @@
+import { MessageListener } from '@chrome-extension-toolkit';
 import type { BACKGROUND_MESSAGES } from '@shared/messages';
 import { UserScheduleStore } from '@shared/storage/UserScheduleStore';
 import updateBadgeText from '@shared/util/updateBadgeText';
-import { MessageListener } from 'chrome-extension-toolkit';
 
 import onInstall from './events/onInstall';
 import onServiceWorkerAlive from './events/onServiceWorkerAlive';
@@ -58,13 +58,13 @@ const messageListener = new MessageListener<BACKGROUND_MESSAGES>({
 
 messageListener.listen();
 
-UserScheduleStore.listen('schedules', async schedules => {
+UserScheduleStore.subscribe('schedules', async schedules => {
     const index = await UserScheduleStore.get('activeIndex');
     const numCourses = schedules.newValue[index]?.courses?.length;
     updateBadgeText(numCourses || 0);
 });
 
-UserScheduleStore.listen('activeIndex', async ({ newValue }) => {
+UserScheduleStore.subscribe('activeIndex', async ({ newValue }) => {
     const schedules = await UserScheduleStore.get('schedules');
     const numCourses = schedules[newValue]?.courses?.length;
     updateBadgeText(numCourses || 0);

src/pages/background/handler/CESHandler.ts

@@ -1,6 +1,6 @@
 import openNewTab from '@background/util/openNewTab';
+import type { MessageHandler } from '@chrome-extension-toolkit';
 import type CESMessage from '@shared/messages/CESMessage';
-import type { MessageHandler } from 'chrome-extension-toolkit';
 
 const CESFall2023Url = 'https://utexas.bluera.com/utexas/rpvl.aspx?rid=d3db767b-049f-46c5-9a67-29c21c29c580&regl=en-US';
 

src/pages/background/handler/browserActionHandler.ts

@@ -1,5 +1,5 @@
+import type { MessageHandler } from '@chrome-extension-toolkit';
 import type BrowserActionMessages from '@shared/messages/BrowserActionMessages';
-import type { MessageHandler } from 'chrome-extension-toolkit';
 
 const browserActionHandler: MessageHandler<BrowserActionMessages> = {
     disableBrowserAction({ sender, sendResponse }) {

src/pages/background/handler/calendarBackgroundHandler.ts

@@ -1,14 +1,14 @@
 import type { TabWithId } from '@background/util/openNewTab';
 import openNewTab from '@background/util/openNewTab';
+import type { MessageHandler } from '@chrome-extension-toolkit';
 import { tabs } from '@shared/messages';
 import type { CalendarBackgroundMessages } from '@shared/messages/CalendarMessages';
 import { OptionsStore } from '@shared/storage/OptionsStore';
 import { CRX_PAGES } from '@shared/types/CRXPages';
-import type { MessageHandler } from 'chrome-extension-toolkit';
 
 const getAllTabInfos = async () => {
     const openTabs = (await chrome.tabs.query({})).filter((tab): tab is TabWithId => tab.id !== undefined);
-    const results = await Promise.allSettled(openTabs.map(tab => tabs.getTabInfo(undefined, tab.id)));
+    const results = await Promise.allSettled(openTabs.map(tab => tabs.getTabInfo({ tabId: tab.id })));
 
     type TabInfo = PromiseFulfilledResult<Awaited<ReturnType<typeof tabs.getTabInfo>>>;
     return results
@@ -34,7 +34,7 @@ const calendarBackgroundHandler: MessageHandler<CalendarBackgroundMessages> = {
 
             await chrome.tabs.update(tabid, { active: true });
             await chrome.windows.update(openCalendarTabInfo.tab.windowId, { focused: true, drawAttention: true });
-            if (uniqueId !== undefined) await tabs.openCoursePopup({ uniqueId }, tabid);
+            if (uniqueId !== undefined) await tabs.openCoursePopup({ uniqueId }, { tabId: tabid });
 
             sendResponse(openCalendarTabInfo.tab);
         } else {

src/pages/background/handler/gitHubStatsHandler.ts

@@ -1,6 +1,6 @@
+import type { MessageHandler } from '@chrome-extension-toolkit';
 import type GitHubStatsMessages from '@shared/messages/GitHubStatsMessages';
 import { GitHubStatsService } from '@views/lib/getGitHubStats';
-import type { MessageHandler } from 'chrome-extension-toolkit';
 
 const gitHubStatsService = new GitHubStatsService();
 

src/pages/background/handler/tabManagementHandler.ts

@@ -1,6 +1,6 @@
+import type { MessageHandler } from '@chrome-extension-toolkit';
 import openNewTab from '@pages/background/util/openNewTab';
 import type TabManagementMessages from '@shared/messages/TabManagementMessages';
-import type { MessageHandler } from 'chrome-extension-toolkit';
 
 const tabManagementHandler: MessageHandler<TabManagementMessages> = {
     getTabId({ sendResponse, sender }) {

src/pages/background/handler/userScheduleHandler.ts

@@ -1,3 +1,4 @@
+import type { MessageHandler } from '@chrome-extension-toolkit';
 import addCourse from '@pages/background/lib/addCourse';
 import clearCourses from '@pages/background/lib/clearCourses';
 import createSchedule from '@pages/background/lib/createSchedule';
@@ -9,7 +10,6 @@ import switchSchedule from '@pages/background/lib/switchSchedule';
 import type { UserScheduleMessages } from '@shared/messages/UserScheduleMessages';
 import { Course } from '@shared/types/Course';
 import { validateLoginStatus } from '@shared/util/checkLoginStatus';
-import type { MessageHandler } from 'chrome-extension-toolkit';
 
 const userScheduleHandler: MessageHandler<UserScheduleMessages> = {
     addCourse({ data, sendResponse }) {

src/pages/background/lib/createSchedule.ts

@@ -1,7 +1,7 @@
+import type { Serialized } from '@chrome-extension-toolkit';
 import { UserScheduleStore } from '@shared/storage/UserScheduleStore';
 import type { UserSchedule } from '@shared/types/UserSchedule';
 import { generateRandomId } from '@shared/util/random';
-import type { Serialized } from 'chrome-extension-toolkit';
 
 /**
  * Creates a new schedule with the given name

src/pages/background/lib/importSchedule.ts

@@ -1,6 +1,6 @@
+import type { Serialized } from '@chrome-extension-toolkit';
 import { Course } from '@shared/types/Course';
 import type { UserSchedule } from '@shared/types/UserSchedule';
-import type { Serialized } from 'chrome-extension-toolkit';
 
 import addCourse from './addCourse';
 import createSchedule from './createSchedule';

src/pages/calendar/CalendarMain.tsx

@@ -1,3 +1,4 @@
+import { MessageListener } from '@chrome-extension-toolkit';
 import type TabInfoMessages from '@shared/messages/TabInfoMessages';
 import Calendar from '@views/components/calendar/Calendar';
 import DialogProvider from '@views/components/common/DialogProvider/DialogProvider';
@@ -5,7 +6,6 @@ import ExtensionRoot from '@views/components/common/ExtensionRoot/ExtensionRoot'
 import { MigrationDialog } from '@views/components/common/MigrationDialog';
 import { WhatsNewDialog } from '@views/components/common/WhatsNewPopup';
 import SentryProvider from '@views/contexts/SentryContext';
-import { MessageListener } from 'chrome-extension-toolkit';
 import useKC_DABR_WASM from 'kc-dabr-wasm';
 import React, { useEffect } from 'react';