removed unusaged package,s more genral cleanup

Author: spotta85

.github/workflows/ci.yml

@@ -4,6 +4,18 @@ name: CI
 on: [push, pull_request]
 
 jobs:
+  test:
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout repository
+        uses: actions/checkout@v3
+      - name: Install bun
+        uses: oven-sh/setup-bun@v1
+      - name: Install dependencies
+        run: bun install
+      - name: Run tests
+        run: bun test
+
   check:
     runs-on: ubuntu-latest
     steps:

.gitignore

@@ -14,6 +14,9 @@ stats-*.json
 .wxt
 web-ext.config.ts
 claude.md
+
+# Bun is the package manager; keep npm's lockfile out
+package-lock.json
 # Editor directories and files
 .vscode/*
 !.vscode/extensions.json

.husky/pre-commit

@@ -0,0 +1,69 @@
+import { Component, type ErrorInfo, type ReactNode } from "react";
+
+interface ErrorBoundaryProps {
+  children: ReactNode;
+  fallback?: ReactNode;
+}
+
+interface ErrorBoundaryState {
+  hasError: boolean;
+  error: Error | null;
+}
+
+/**
+ * Single root-level error boundary. Catches render errors (e.g. getCourseById
+ * throwing on a missing course id) so a bad reference doesn't white-screen the
+ * whole degree-audit page.
+ *
+ * Place one instance at the page root; don't scatter throughout the tree.
+ */
+export default class ErrorBoundary extends Component<
+  ErrorBoundaryProps,
+  ErrorBoundaryState
+> {
+  state: ErrorBoundaryState = { hasError: false, error: null };
+
+  static getDerivedStateFromError(error: Error): ErrorBoundaryState {
+    return { hasError: true, error };
+  }
+
+  componentDidCatch(error: Error, info: ErrorInfo) {
+    console.error("[Degree Audit Plus] Render error caught by ErrorBoundary:", error, info);
+  }
+
+  handleReset = () => {
+    this.setState({ hasError: false, error: null });
+  };
+
+  render() {
+    if (this.state.hasError) {
+      if (this.props.fallback) return this.props.fallback;
+
+      return (
+        <div className="flex min-h-screen w-full flex-col items-center justify-center gap-4 bg-background px-6 text-center text-text">
+          <h1 className="text-2xl font-bold text-dap-primary">
+            Something went wrong
+          </h1>
+          <p className="max-w-md text-sm text-dap-gray-light">
+            An unexpected error occurred while rendering your degree audit.
+            Re-run your audit from the popup to refresh the data, or click the
+            button below to try again.
+          </p>
+          {this.state.error && (
+            <pre className="max-w-lg rounded bg-gray-100 px-4 py-2 text-left text-xs text-red-600 dark:bg-gray-800">
+              {this.state.error.message}
+            </pre>
+          )}
+          <button
+            onClick={this.handleReset}
+            className="rounded-md bg-dap-primary px-4 py-2 text-sm font-semibold text-white hover:opacity-90"
+          >
+            Try again
+          </button>
+        </div>
+      );
+    }
+
+    return this.props.children;
+  }
+}

bun.lock

@@ -1,6 +1,6 @@
 import "@/entrypoints/styles/content.css";
 import { seedDatabase } from "@/features/catalog/seed-catalog";
-import clsx from "clsx";
+import { cn } from "@/lib/utils";
 import React from "react";
 import ReactDOM from "react-dom/client";
 import { HStack, VStack } from "@/components/ui/stack";
@@ -14,6 +14,7 @@ import {
   PreferencesProvider,
   usePreferences,
 } from "@/features/preferences/preferences-provider";
+import ErrorBoundary from "@/components/error-boundary";
 
 const App = () => {
   return (
@@ -36,7 +37,7 @@ const MainContent = () => {
   return (
     <VStack
       x="center"
-      className={clsx(
+      className={cn(
         "w-full min-w-0 h-screen overflow-hidden transition-[margin-left] duration-300 ease-out",
         {
           "ml-[365px]": sidebarIsOpen,
@@ -64,7 +65,9 @@ async function bootstrap() {
 
   root.render(
     <React.StrictMode>
-      <App />
+      <ErrorBoundary>
+        <App />
+      </ErrorBoundary>
     </React.StrictMode>,
   );
 }

components/error-boundary.tsx

@@ -35,6 +35,12 @@
   --color-course-applied: #b8c5a3;
   --color-course-in-progress: #f5f0dc;
   --color-course-unknown: #e5e7eb;
+  --color-course-completed-bg: #ecf8d0;
+  --color-course-completed-border: #9fca5b;
+  --color-course-planned-bg: #dbeafe;
+  --color-course-planned-border: #93c5fd;
+  --color-course-in-progress-bg: #fef9c3;
+  --color-course-in-progress-border: #fde047;
 
   /* Gray scale */
   --color-dap-gray-light: #9cadb7;
@@ -53,6 +59,19 @@
   --color-ut-charcoal: #333f48;
   --color-ut-off-white: #d6d2c4;
 
+  /* Planned-course greens (course-add-modal, semester-dropdowns, requirement-breakdown) */
+  --color-dap-plan-green: #579d42;
+  --color-dap-plan-green-hover: #4c8f3b;
+  --color-dap-plan-green-dark: #4a7c59;
+  --color-dap-plan-green-light: #5ba753;
+
+  /* Status / UI grays */
+  --color-dap-status-slate: #4a5568;
+  --color-dap-slate-blue: #b7c6d1;
+
+  /* Destructive */
+  --color-dap-delete: #c63636;
+
   /* Fonts */
   --font-family-staatliches: Staatliches, cursive;
   --font-family-roboto-flex: "Roboto Flex", sans-serif;

entrypoints/degree-audit/main.tsx

@@ -35,6 +35,12 @@
   --color-course-applied: #b8c5a3;
   --color-course-in-progress: #f5f0dc;
   --color-course-unknown: #e5e7eb;
+  --color-course-completed-bg: #ecf8d0;
+  --color-course-completed-border: #9fca5b;
+  --color-course-planned-bg: #dbeafe;
+  --color-course-planned-border: #93c5fd;
+  --color-course-in-progress-bg: #fef9c3;
+  --color-course-in-progress-border: #fde047;
 
   /* Gray scale */
   --color-dap-gray-light: #9cadb7;
@@ -57,6 +63,19 @@
   --color-ut-charcoal: #333f48;
   --color-ut-off-white: #d6d2c4;
 
+  /* Planned-course greens (course-add-modal, semester-dropdowns, requirement-breakdown) */
+  --color-dap-plan-green: #579d42;
+  --color-dap-plan-green-hover: #4c8f3b;
+  --color-dap-plan-green-dark: #4a7c59;
+  --color-dap-plan-green-light: #5ba753;
+
+  /* Status / UI grays */
+  --color-dap-status-slate: #4a5568;
+  --color-dap-slate-blue: #b7c6d1;
+
+  /* Destructive */
+  --color-dap-delete: #c63636;
+
   /* Fonts */
   --font-family-staatliches: Staatliches, cursive;
   --font-family-roboto-flex: "Roboto Flex", sans-serif;

entrypoints/popup-app/style.css

@@ -1,5 +1,7 @@
 import js from "@eslint/js";
+import type { ESLint } from "eslint";
 import pluginReact from "eslint-plugin-react";
+import reactHooks from "eslint-plugin-react-hooks";
 import { defineConfig } from "eslint/config";
 import globals from "globals";
 import tseslint from "typescript-eslint";
@@ -15,10 +17,16 @@ export default defineConfig([
   tseslint.configs.recommended,
   pluginReact.configs.flat.recommended,
   {
+    plugins: { "react-hooks": reactHooks as unknown as ESLint.Plugin },
     rules: {
       "react/react-in-jsx-scope": "off",
-      "@typescript-eslint/no-unused-vars": "off",
+      "@typescript-eslint/no-unused-vars": [
+        "error",
+        { argsIgnorePattern: "^_", varsIgnorePattern: "^_" },
+      ],
       "@typescript-eslint/no-explicit-any": "warn",
+      "react-hooks/rules-of-hooks": "error",
+      "react-hooks/exhaustive-deps": "warn",
     },
   },
 ]);

entrypoints/styles/content.css

@@ -105,7 +105,7 @@ export function AuditContextProvider({
     () => getCompositeAuditRequirements(compositeAuditData),
     [compositeAuditData],
   );
-  const courseMap = auditData?.courses ?? {};
+  const courseMap = useMemo(() => auditData?.courses ?? {}, [auditData]);
   const progresses = useMemo(
     () => calculateWeightedDegreeCompletion(sections, courseMap),
     [courseMap, sections],
@@ -157,7 +157,7 @@ export function AuditContextProvider({
     return () => {
       cancelled = true;
     };
-  }, [currentAuditId]);
+  }, [currentAuditId, updateLastAuditId]);
 
   const value = useMemo<AuditContextValue>(() => {
     const persist = async (auditId: string, updated: CachedAuditData) => {