generating calendar html

package-lock.json

@@ -9,7 +9,7 @@
             "version": "0.0.0",
             "dependencies": {
                 "@types/sql.js": "^1.4.4",
-                "chrome-extension-toolkit": "^0.0.49",
+                "chrome-extension-toolkit": "^0.0.50",
                 "classnames": "^2.3.2",
                 "clean-webpack-plugin": "^4.0.0",
                 "highcharts": "^10.3.3",
@@ -4815,9 +4815,9 @@
             }
         },
         "node_modules/chrome-extension-toolkit": {
-            "version": "0.0.49",
-            "resolved": "https://registry.npmjs.org/chrome-extension-toolkit/-/chrome-extension-toolkit-0.0.49.tgz",
-            "integrity": "sha512-cXtbYXuGuDdozB3q9xbX/bIsr/z/9LYQbekjkLG6OA647Xn/m39DLNxY/YPN0k+pxPlfUm7bjxav8SC4lJTFUQ==",
+            "version": "0.0.50",
+            "resolved": "https://registry.npmjs.org/chrome-extension-toolkit/-/chrome-extension-toolkit-0.0.50.tgz",
+            "integrity": "sha512-dS/0LYvaug8LkozGA3uFHyV9EEGH1YQGNqq+C/gfU30XkRnY2E1naV6/otpnhdfM6P5elda7qK0XDU887dbBXg==",
             "dependencies": {
                 "react": "^18.2.0",
                 "react-dom": "^18.2.0"
@@ -21249,9 +21249,9 @@
             }
         },
         "chrome-extension-toolkit": {
-            "version": "0.0.49",
-            "resolved": "https://registry.npmjs.org/chrome-extension-toolkit/-/chrome-extension-toolkit-0.0.49.tgz",
-            "integrity": "sha512-cXtbYXuGuDdozB3q9xbX/bIsr/z/9LYQbekjkLG6OA647Xn/m39DLNxY/YPN0k+pxPlfUm7bjxav8SC4lJTFUQ==",
+            "version": "0.0.50",
+            "resolved": "https://registry.npmjs.org/chrome-extension-toolkit/-/chrome-extension-toolkit-0.0.50.tgz",
+            "integrity": "sha512-dS/0LYvaug8LkozGA3uFHyV9EEGH1YQGNqq+C/gfU30XkRnY2E1naV6/otpnhdfM6P5elda7qK0XDU887dbBXg==",
             "requires": {
                 "react": "^18.2.0",
                 "react-dom": "^18.2.0"

package.json

@@ -14,7 +14,7 @@
     },
     "dependencies": {
         "@types/sql.js": "^1.4.4",
-        "chrome-extension-toolkit": "^0.0.49",
+        "chrome-extension-toolkit": "^0.0.50",
         "classnames": "^2.3.2",
         "clean-webpack-plugin": "^4.0.0",
         "highcharts": "^10.3.3",

src/views/index.tsx

@@ -7,6 +7,7 @@ import getSiteSupport, { SiteSupport } from './lib/getSiteSupport';
 import PopupMain from './components/PopupMain';
 
 const support = getSiteSupport(window.location.href);
+
 if (!support) {
     throw new Error('UT Registration Plus does not support this page, even though it should...');
 }
@@ -15,6 +16,10 @@ if (support === SiteSupport.EXTENSION_POPUP) {
     render(<PopupMain />, document.getElementById('root'));
 }
 
+if (support === SiteSupport.MY_CALENDAR) {
+    render(<div>My Calendar</div>, document.getElementById('root'));
+}
+
 if (support === SiteSupport.COURSE_CATALOG_DETAILS || support === SiteSupport.COURSE_CATALOG_LIST) {
     const shadowDom = createShadowDOM('ut-registration-plus-container');
     render(<CourseCatalogMain support={support} />, shadowDom.shadowRoot);

src/views/lib/getSiteSupport.ts

@@ -1,4 +1,4 @@
-import { isExtensionPopup } from 'chrome-extension-toolkit';
+import { isExtensionPage, isExtensionPopup } from 'chrome-extension-toolkit';
 
 /**
  * An enum that represents the different types of pages that we support
@@ -10,6 +10,7 @@ export enum SiteSupport {
     UT_PLANNER = 'UT_PLANNER',
     WAITLIST = 'WAITLIST',
     EXTENSION_POPUP = 'EXTENSION_POPUP',
+    MY_CALENDAR = 'MY_CALENDAR',
 }
 
 /**
@@ -21,6 +22,9 @@ export default function getSiteSupport(url: string): SiteSupport | null {
     if (isExtensionPopup()) {
         return SiteSupport.EXTENSION_POPUP;
     }
+    if (isExtensionPage('MyCalendar.html')) {
+        return SiteSupport.MY_CALENDAR;
+    }
     if (url.includes('utexas.collegescheduler.com')) {
         return SiteSupport.UT_PLANNER;
     }

webpack/plugins/buildProcessPlugins.ts

@@ -46,7 +46,7 @@ export function getBuildPlugins(mode: Environment, htmlEntries: EntryId[], manif
                 hash: false,
                 filename: `${entryId}.html`,
                 chunks: [entryId],
-                title: `${manifest.short_name} ${entryId} `,
+                title: `${entryId} `,
                 template: path.resolve('webpack', 'plugins', 'template.html'),
             })
         );

webpack/webpack.config.ts

@@ -9,6 +9,7 @@ export interface Entries {
     content: string[];
     background: string[];
     popup: string[];
+    myCalendar: string[];
     // only used in development
     debug?: string[];
 }
@@ -28,19 +29,23 @@ export default function config(mode: Environment, manifest: chrome.runtime.Manif
     const entry: Entries = {
         content: [path.resolve('src', 'views')],
         popup: [path.resolve('src', 'views')],
+        myCalendar: [path.resolve('src', 'views')],
         background: [path.resolve('src', 'background', 'background')],
     };
 
     // the entries that need an html file to be generated
-    const htmlEntries: EntryId[] = mode === 'development' ? ['popup', 'debug'] : ['popup'];
+    const htmlEntries: EntryId[] = ['popup', 'myCalendar'];
 
     if (mode === 'development') {
+        // create an html file for the debug entry
+        htmlEntries.push('debug');
         // TODO: add hot reloading script to the debug entry
         entry.debug = [path.resolve('src', 'debug')];
 
-        // we need to import react-devtools before the react code in development
+        // we need to import react-devtools before the react code in development so that it can hook into react
         entry.content = [path.resolve('src', 'debug', 'reactDevtools'), ...entry.content];
         entry.popup = [path.resolve('src', 'debug', 'reactDevtools'), ...entry.popup];
+        entry.myCalendar = [path.resolve('src', 'debug', 'reactDevtools'), ...entry.myCalendar];
     }
 
     /** @see https://webpack.js.org/configuration for documentation */