diff --git a/app/(authorized)/layout.tsx b/app/(authorized)/layout.tsx
index dd2be7e..a6939f2 100644
--- a/app/(authorized)/layout.tsx
+++ b/app/(authorized)/layout.tsx
@@ -7,6 +7,7 @@ import NavMenu from "@/components/NavMenu";
 import DemoModeControls from "@/components/DemoModeControls";
 import { validateRequest } from "@/lib/auth";
 import { redirect } from "next/navigation";
+import SessionToContextProvider from "@/components/SessionToContextProvider";
 
 const inter = Inter({ subsets: ["latin"] });
 
@@ -29,7 +30,7 @@ export default async function RootLayout({
         className={classNames(inter.className, "container mt-4 default-layout")}
       >
         <Providers>
-          <>
+          <SessionToContextProvider>
             {process.env.NODE_ENV === "development" && (
               <div className="tw-flex tw-flex-row tw-items-center tw-justify-center">
                 <DemoModeControls />
@@ -41,7 +42,7 @@ export default async function RootLayout({
               </div>
               <div className="tw-flex tw-ml-6 !tw-w-full">{children}</div>
             </div>
-          </>
+          </SessionToContextProvider>
         </Providers>
       </body>
     </html>
diff --git a/app/(authorized)/loading.tsx b/app/(authorized)/loading.tsx
index dd12c41..50a2530 100644
--- a/app/(authorized)/loading.tsx
+++ b/app/(authorized)/loading.tsx
@@ -1,6 +1,6 @@
 import Image from "next/image";
 
-const PageLoadingIndicator = () => {
+export default function Loading() {
   return (
     <div className="tw-w-full tw-flex tw-flex-col tw-items-center tw-align-center">
       <Image
@@ -16,6 +16,4 @@ const PageLoadingIndicator = () => {
       </div>
     </div>
   );
-};
-
-export default PageLoadingIndicator;
+}
diff --git a/app/(authorized)/page.tsx b/app/(authorized)/page.tsx
index 7da90c2..ebc7d31 100644
--- a/app/(authorized)/page.tsx
+++ b/app/(authorized)/page.tsx
@@ -1,35 +1,20 @@
 "use client";
 import InstructorDashboard from "@/components/InstructorDashboard";
 import StudentDashboard from "@/components/StudentDashboard";
-import { IUser_Raw } from "@/lib/models/user";
-import { globalStateAtom } from "@/state/globalState";
-import axios from "axios";
-import { useAtom } from "jotai";
-import { useEffect } from "react";
+import { Suspense } from "react";
+import Loading from "./loading";
+import { useGlobalContext } from "@/state/globalContext";
 
 export default function Dashboard() {
-  const [globalState, setGlobalState] = useAtom(globalStateAtom);
+  const [globalState] = useGlobalContext();
 
-  useEffect(() => {
-    async function fetchData() {
-      const res = await axios.get("/api/auth/session");
-      if (!res.data?.user) return;
-      updateStateFromSession(res.data.user);
-    }
-    fetchData();
-  }, []);
-
-  function updateStateFromSession(userData: IUser_Raw) {
-    setGlobalState((prev) => ({
-      ...prev,
-      role: userData?.role,
-      viewAs: userData?.role,
-      courseID: userData?.courses[0] || "",
-    }));
-  }
-
-  if (globalState.viewAs === "instructor") {
-    return <InstructorDashboard course_id={globalState.courseID} />;
-  }
-  return <StudentDashboard course_id={globalState.courseID} />;
+  return (
+    <Suspense fallback={<Loading />}>
+      {globalState.viewAs === "instructor" ? (
+        <InstructorDashboard course_id={globalState.courseID} />
+      ) : (
+        <StudentDashboard course_id={globalState?.courseID ?? ""} />
+      )}
+    </Suspense>
+  );
 }
diff --git a/app/(authorized)/providers.tsx b/app/(authorized)/providers.tsx
index ed68d28..cb1e482 100644
--- a/app/(authorized)/providers.tsx
+++ b/app/(authorized)/providers.tsx
@@ -3,7 +3,7 @@ import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
 import { ReactQueryDevtools } from "@tanstack/react-query-devtools";
 import { useState } from "react";
 import { ReactQueryStreamedHydration } from "@tanstack/react-query-next-experimental";
-import { Provider as JotaiProvider } from "jotai";
+import { GlobalContextProvider } from "@/state/globalContext";
 
 export function Providers(props: { children: React.ReactNode }) {
   const [queryClient] = useState(
@@ -20,13 +20,13 @@ export function Providers(props: { children: React.ReactNode }) {
   );
 
   return (
-    <JotaiProvider>
-      <QueryClientProvider client={queryClient}>
-        <ReactQueryStreamedHydration>
-          {props.children}
-        </ReactQueryStreamedHydration>
-        <ReactQueryDevtools initialIsOpen={false} />
-      </QueryClientProvider>
-    </JotaiProvider>
+      <GlobalContextProvider>
+        <QueryClientProvider client={queryClient}>
+          <ReactQueryStreamedHydration>
+            {props.children}
+          </ReactQueryStreamedHydration>
+          <ReactQueryDevtools initialIsOpen={false} />
+        </QueryClientProvider>
+      </GlobalContextProvider>
   );
 }
diff --git a/app/(authorized)/raw-data/page.tsx b/app/(authorized)/raw-data/page.tsx
index e1fa37e..ad21bb1 100644
--- a/app/(authorized)/raw-data/page.tsx
+++ b/app/(authorized)/raw-data/page.tsx
@@ -1,6 +1,7 @@
 import PageHeader from "@/components/PageHeader";
 import GenericPageContainer from "@/components/GenericPageContainer";
 import RawDataTable from "@/components/RawDataTable";
+import { getCourseRawData } from "@/lib/analytics-functions";
 
 export default function RawDataView() {
   return (
@@ -9,7 +10,7 @@ export default function RawDataView() {
         title="Raw Data View"
         subtitle="Browse all available analytics/performance data for your course."
       />
-      <RawDataTable />
+      <RawDataTable getData={getCourseRawData} />
     </GenericPageContainer>
   );
 }
diff --git a/components/CourseSettings/StudentPermissions.tsx b/components/CourseSettings/StudentPermissions.tsx
index cf721fe..bbc0789 100644
--- a/components/CourseSettings/StudentPermissions.tsx
+++ b/components/CourseSettings/StudentPermissions.tsx
@@ -1,10 +1,10 @@
 "use client";
-import { GlobalState, globalStateAtom } from "@/state/globalState";
-import { useAtom } from "jotai";
+import { GlobalState } from "@/lib/types";
 import React, { useState } from "react";
 import { Button, Form, ListGroup, Toast } from "react-bootstrap";
 import ToastContainer from "../ToastContainer";
 import { Controller, useForm } from "react-hook-form";
+import { useGlobalContext } from "@/state/globalContext";
 
 interface StudentPermissionsProps {
   saveData: (
@@ -16,7 +16,7 @@ interface StudentPermissionsProps {
 const StudentPermissions: React.FC<StudentPermissionsProps> = ({
   saveData,
 }) => {
-  const [globalState, setGlobalState] = useAtom(globalStateAtom);
+  const [globalState, setGlobalState] = useGlobalContext();
   const [saveError, setSaveError] = useState<string | null>(null);
   const [showSuccess, setShowSuccess] = useState(false);
   const [loading, setLoading] = useState(false);
diff --git a/components/DemoModeControls.tsx b/components/DemoModeControls.tsx
index c16b0ce..0ae205b 100644
--- a/components/DemoModeControls.tsx
+++ b/components/DemoModeControls.tsx
@@ -1,18 +1,15 @@
-'use client'
-import { globalStateAtom } from "@/state/globalState";
+"use client";
+import { useGlobalContext } from "@/state/globalContext";
 import { capitalizeFirstLetter } from "@/utils/text-helpers";
-import { useAtom } from "jotai";
-import { useState } from "react";
 
 const DemoModeControls = () => {
-  const [globalState, setGlobalState] = useAtom(globalStateAtom);
-  // const [courseId, setCourseId] = useState(globalState.adaptId);
+  const [globalState, setGlobalState] = useGlobalContext();
 
   return (
     <div className="tw-w-1/3 tw-flex tw-flex-col tw-items-center tw-border tw-border-solid tw-border-white tw-rounded-md tw-py-1 tw-mb-8 tw-bg-libre-blue tw-text-white">
       <div className="tw-flex tw-flex-row tw-items-center tw-mt-0">
         <p className="tw-text-center tw-mb-0">
-          <span className="tw-font-semibold">Viewing as: </span>
+          <span className="tw-font-semibold">(Demo Mode) Viewing as: </span>
           {capitalizeFirstLetter(globalState.viewAs)}
           <button
             onClick={() => {
diff --git a/components/EarlyWarningBanner.tsx b/components/EarlyWarningBanner.tsx
index 3a6206e..df78644 100644
--- a/components/EarlyWarningBanner.tsx
+++ b/components/EarlyWarningBanner.tsx
@@ -55,7 +55,7 @@ const EarlyWarningBanner: React.FC<EarlyWarningBanner> = ({ variant }) => {
     <Card className="tw-shadow-sm">
       <Card.Body>
         <Card.Title>Quick Look</Card.Title>
-        <Card.Text>
+        <Card.Body className="!tw-p-0">
           <>
             <div className="tw-flex tw-flex-row tw-mt-4">
               <div className="tw-mr-4 tw-mt-0.5">{getIcon()}</div>
@@ -65,7 +65,7 @@ const EarlyWarningBanner: React.FC<EarlyWarningBanner> = ({ variant }) => {
               {getMessage()}
             </p>
           </>
-        </Card.Text>
+        </Card.Body>
       </Card.Body>
     </Card>
   );
diff --git a/components/FERPAPrivacySwitch.tsx b/components/FERPAPrivacySwitch.tsx
index 002b48a..03ee67d 100644
--- a/components/FERPAPrivacySwitch.tsx
+++ b/components/FERPAPrivacySwitch.tsx
@@ -1,13 +1,12 @@
 "use client";
 import CustomToggle from "./CustomToggle";
-import { useAtom } from "jotai";
-import { globalStateAtom } from "@/state/globalState";
 import { useQueryClient } from "@tanstack/react-query";
+import { useGlobalContext } from "@/state/globalContext";
 
 interface FERPAPrivacySwitchProps {}
 
 const FERPAPrivacySwitch: React.FC<FERPAPrivacySwitchProps> = () => {
-  const [globalState, setGlobalState] = useAtom(globalStateAtom);
+  const [globalState, setGlobalState] = useGlobalContext();
   const queryClient = useQueryClient();
 
   const handleToggle = () => {
diff --git a/components/InstructorDashboardControls.tsx b/components/InstructorDashboardControls.tsx
index cc20fb1..29bb326 100644
--- a/components/InstructorDashboardControls.tsx
+++ b/components/InstructorDashboardControls.tsx
@@ -1,16 +1,16 @@
+'use client'
 import { Card, Dropdown } from "react-bootstrap";
 import CustomDropdown from "./CustomDropdown";
 import { truncateString } from "@/utils/text-helpers";
 
 import { getAssignments, getStudents } from "@/lib/analytics-functions";
-import { useAtom } from "jotai";
 import { useQuery } from "@tanstack/react-query";
 import { IDWithName } from "@/lib/types";
 import { useEffect, useMemo, useRef } from "react";
-import { globalStateAtom } from "@/state/globalState";
+import { useGlobalContext } from "@/state/globalContext";
 
 const InstructorDashboardControls = () => {
-  const [globalState, setGlobalState] = useAtom(globalStateAtom);
+  const [globalState, setGlobalState] = useGlobalContext();
   const elementRef = useRef<HTMLDivElement>(null);
 
   const { data: students, status: studentsStatus } = useQuery<IDWithName[]>({
diff --git a/components/NavMenu.tsx b/components/NavMenu.tsx
index b33493c..3e3e4a8 100644
--- a/components/NavMenu.tsx
+++ b/components/NavMenu.tsx
@@ -1,16 +1,16 @@
 "use client";
 import { ListGroup } from "react-bootstrap";
 import Links from "./Links";
-import { useAtom } from "jotai";
-import { globalStateAtom } from "@/state/globalState";
-import { usePathname } from "next/navigation";
+import { usePathname, useRouter } from "next/navigation";
 import { useMemo } from "react";
+import { useGlobalContext } from "@/state/globalContext";
 
 const ACTIVE_CLASSES = "tw-bg-light-gray tw-border-none";
 
 const NavMenu = () => {
-  const [globalState] = useAtom(globalStateAtom);
+  const router = useRouter();
   const pathname = usePathname();
+  const [globalState] = useGlobalContext();
 
   const isActive = useMemo(() => {
     return (key: string) => {
@@ -31,7 +31,7 @@ const NavMenu = () => {
           active={isActive("dashboard")}
           className={isActive("dashboard") ? ACTIVE_CLASSES : ""}
           action
-          href={Links.CLIENT.Dashboard}
+          onClick={() => router.push(Links.CLIENT.Dashboard)}
         >
           <span className="tw-text-link-blue">
             {globalState.viewAs === "instructor" ? "Instructor" : "Student"}{" "}
@@ -43,7 +43,7 @@ const NavMenu = () => {
             active={isActive("early-warning")}
             className={isActive("early-warning") ? ACTIVE_CLASSES : ""}
             action
-            href={Links.CLIENT.EarlyWarning}
+            onClick={() => router.push(Links.CLIENT.EarlyWarning)}
           >
             <span className="tw-text-link-blue">Early Warning</span>
           </ListGroup.Item>
@@ -53,7 +53,7 @@ const NavMenu = () => {
             active={isActive("raw-data")}
             className={isActive("raw-data") ? ACTIVE_CLASSES : ""}
             action
-            href={Links.CLIENT.RawData}
+            onClick={() => router.push(Links.CLIENT.RawData)}
           >
             <span className="tw-text-link-blue">Raw Data</span>
           </ListGroup.Item>
@@ -63,7 +63,7 @@ const NavMenu = () => {
             active={isActive("course-settings")}
             className={isActive("course-settings") ? ACTIVE_CLASSES : ""}
             action
-            href={Links.CLIENT.CourseSettings}
+            onClick={() => router.push(Links.CLIENT.CourseSettings)}
           >
             <span className="tw-text-link-blue">Course Settings</span>
           </ListGroup.Item>
@@ -71,7 +71,7 @@ const NavMenu = () => {
       </ListGroup>
       {process.env.NODE_ENV === "development" && (
         <p className="tw-text-center tw-mt-2">
-          Course ID: {globalState.courseID}
+          Course ID: {globalState?.courseID}
         </p>
       )}
     </>
diff --git a/components/PageHeader.tsx b/components/PageHeader.tsx
index 277bbdb..800cd3f 100644
--- a/components/PageHeader.tsx
+++ b/components/PageHeader.tsx
@@ -1,7 +1,6 @@
 "use client";
+import { useGlobalContext } from "@/state/globalContext";
 import FERPAPrivacySwitch from "./FERPAPrivacySwitch";
-import { useAtom } from "jotai";
-import { globalStateAtom } from "@/state/globalState";
 
 interface PageHeaderProps {
   title: string;
@@ -9,7 +8,7 @@ interface PageHeaderProps {
 }
 
 const PageHeader: React.FC<PageHeaderProps> = ({ title, subtitle }) => {
-  const [globalState] = useAtom(globalStateAtom);
+  const [globalState] = useGlobalContext();
 
   return (
     <div className="tw-flex tw-flex-col tw-w-full tw-mb-2">
diff --git a/components/RawDataTable.tsx b/components/RawDataTable.tsx
index 01fc229..1a4b76e 100644
--- a/components/RawDataTable.tsx
+++ b/components/RawDataTable.tsx
@@ -5,81 +5,42 @@ import {
   getCoreRowModel,
   useReactTable,
 } from "@tanstack/react-table";
-import { useState } from "react";
+import { useEffect, useState } from "react";
 import DebouncedInput from "./DebouncedInput";
 import { Search } from "react-bootstrap-icons";
+import { AnalyticsRawData } from "@/lib/types";
+import { truncateString } from "@/utils/text-helpers";
+import { useGlobalContext } from "@/state/globalContext";
 
-interface RawDataTableProps {}
+interface RawDataTableProps {
+  getData: (course_id: string) => Promise<AnalyticsRawData[]>;
+}
 
-const demoData: AnalyticsData[] = [
-  {
-    id: "1",
-    name: "Alice",
-    pagesAccessed: 10,
-    uniqueInteractionDays: 5,
-    avgPercentAssignment: 80,
-    classPercentile: 90,
-    classQuartile: 1,
-  },
-  {
-    id: "2",
-    name: "Bob",
-    pagesAccessed: 20,
-    uniqueInteractionDays: 10,
-    avgPercentAssignment: 70,
-    classPercentile: 80,
-    classQuartile: 2,
-  },
-  {
-    id: "3",
-    name: "Charlie",
-    pagesAccessed: 30,
-    uniqueInteractionDays: 15,
-    avgPercentAssignment: 60,
-    classPercentile: 70,
-    classQuartile: 3,
-  },
-  {
-    id: "4",
-    name: "David",
-    pagesAccessed: 40,
-    uniqueInteractionDays: 20,
-    avgPercentAssignment: 50,
-    classPercentile: 60,
-    classQuartile: 4,
-  },
-  {
-    id: "5",
-    name: "Eve",
-    pagesAccessed: 50,
-    uniqueInteractionDays: 25,
-    avgPercentAssignment: 40,
-    classPercentile: 50,
-    classQuartile: 5,
-  },
-];
+const RawDataTable: React.FC<RawDataTableProps> = ({ getData }) => {
+  const [globalState] = useGlobalContext();
+  const columnHelper = createColumnHelper<AnalyticsRawData>();
 
-type AnalyticsData = {
-  id: string;
-  name: string;
-  pagesAccessed: number;
-  uniqueInteractionDays: number;
-  avgPercentAssignment: number;
-  classPercentile: number;
-  classQuartile: number;
-};
+  const [data, setData] = useState<AnalyticsRawData[]>([]);
+  const [searchInput, setSearchInput] = useState<string>("");
 
-const RawDataTable: React.FC<RawDataTableProps> = () => {
-  const columnHelper = createColumnHelper<AnalyticsData>();
+  useEffect(() => {
+    if (!globalState.courseID) return;
+    fetchData();
+  }, [globalState.courseID]);
 
-  const [data, setData] = useState<AnalyticsData[]>([]);
-  const [searchInput, setSearchInput] = useState<string>("");
+  async function fetchData() {
+    if (!globalState.courseID) return;
+    const _data = await getData(globalState.courseID);
+    setData(_data);
+  }
 
   const defaultColumns = [
     columnHelper.accessor("name", {
       cell: (info) => (
         <div>
-          <span className="tw-font-semibold">{info.getValue()}</span>
+          <span className="tw-font-semibold">
+            {truncateString(info.getValue(), 40)}
+          </span>
         </div>
       ),
       header: "Student",
@@ -107,7 +68,7 @@ const RawDataTable: React.FC<RawDataTableProps> = () => {
   ];
 
   const table = useReactTable({
-    data: demoData,
+    data: data,
     columns: defaultColumns,
     getCoreRowModel: getCoreRowModel(),
   });
diff --git a/components/SessionToContextProvider.tsx b/components/SessionToContextProvider.tsx
new file mode 100644
index 0000000..807c969
--- /dev/null
+++ b/components/SessionToContextProvider.tsx
@@ -0,0 +1,32 @@
+'use client'
+import { useGlobalContext } from "@/state/globalContext";
+import axios from "axios";
+import { useEffect } from "react";
+
+interface SessionToContextProviderProps {
+  children: React.ReactNode;
+}
+
+const SessionToContextProvider: React.FC<SessionToContextProviderProps> = ({
+  children,
+}) => {
+  const [globalState, setGlobalState] = useGlobalContext();
+
+  useEffect(() => {
+    fetchSessionData();
+  }, []);
+
+  async function fetchSessionData() {
+    const res = await axios.get("/api/auth/session");
+    if (!res.data?.user) return;
+    setGlobalState({
+      ...res.data.user,
+      courseID: res.data.user.courses[0] ?? "",
+      viewAs: res.data.user.role,
+    });
+  }
+
+  return <>{children}</>;
+};
+
+export default SessionToContextProvider;
\ No newline at end of file
diff --git a/components/StudentDashboard.tsx b/components/StudentDashboard.tsx
index e25fd7d..7e5cfaf 100644
--- a/components/StudentDashboard.tsx
+++ b/components/StudentDashboard.tsx
@@ -3,13 +3,12 @@ import GenericPageContainer from "@/components/GenericPageContainer";
 import PageHeader from "@/components/PageHeader";
 import VisualizationContainer from "@/components/VisualizationContainer";
 import PerfPerAssignment from "@/components/Visualizations/PerfPerAssignment";
-import { useAtom } from "jotai";
-import { globalStateAtom } from "@/state/globalState";
 import StudentQuickMetrics from "@/components/StudentQuickMetrics";
 import ActivityAccessed from "./Visualizations/ActivityAccessed";
+import { useGlobalContext } from "@/state/globalContext";
 
 const StudentDashboard = ({course_id}:{course_id: string}) => {
-  const [globalState] = useAtom(globalStateAtom);
+  const [globalState] = useGlobalContext();
 
   return (
     <GenericPageContainer>
@@ -17,7 +16,7 @@ const StudentDashboard = ({course_id}:{course_id: string}) => {
         title="Student Dashboard"
         subtitle="View your performance and engagement with the course material."
       />
-      <StudentQuickMetrics studentId={globalState.studentId} />
+      {/* <StudentQuickMetrics studentId={globalState.studentId} /> */}
       <VisualizationContainer
         title="Performance Per Assignment"
         description="Your scores vs. class average for each assignment."
diff --git a/components/VisualizationContainer.tsx b/components/VisualizationContainer.tsx
index 028c49b..5d4838f 100644
--- a/components/VisualizationContainer.tsx
+++ b/components/VisualizationContainer.tsx
@@ -1,14 +1,13 @@
 "use client";
 import React, { cloneElement, useRef, useState } from "react";
 import { Card } from "react-bootstrap";
-import { useAtom } from "jotai";
-import { globalStateAtom } from "@/state/globalState";
 import {
   Download as IconDownload,
   Table as IconTable,
   BarChart as IconBarChart,
 } from "react-bootstrap-icons";
 import { VisualizationInnerRef } from "@/lib/types";
+import { useGlobalContext } from "@/state/globalContext";
 
 interface VisualizationContainerProps {
   title: string;
@@ -24,8 +23,8 @@ const VisualizationContainer: React.FC<VisualizationContainerProps> = ({
   studentMode = false,
 }) => {
   const innerRef = useRef<VisualizationInnerRef | null>(null);
-  const [globalState] = useAtom(globalStateAtom);
   const [tableView, setTableView] = useState(false);
+  const [globalState] = useGlobalContext();
 
   const childWithProps = cloneElement(children as React.ReactElement, {
     selectedStudentId: globalState.studentId,
diff --git a/components/Visualizations/GradeDistribution.tsx b/components/Visualizations/GradeDistribution.tsx
index d7dd8c4..ce2d39d 100644
--- a/components/Visualizations/GradeDistribution.tsx
+++ b/components/Visualizations/GradeDistribution.tsx
@@ -106,7 +106,6 @@ const GradeDistribution: React.FC<GradeDistributionProps> = ({
       .attr("transform", `translate(0, ${height - MARGIN.bottom})`)
       .call(d3.axisBottom(x))
       .selectAll("text")
-      .attr("transform", "rotate(-45)")
       .style("text-anchor", "end")
       .style("font-size", "8px");
 
diff --git a/lib/Analytics.ts b/lib/Analytics.ts
index 2191ad3..5f9612b 100644
--- a/lib/Analytics.ts
+++ b/lib/Analytics.ts
@@ -7,6 +7,7 @@ import LTAnalytics from "@/lib/models/ltanalytics";
 import TextbookInteractionsByDate from "@/lib/models/textbookInteractionsByDate";
 import {
   ActivityAccessed,
+  AnalyticsRawData,
   ArrayElement,
   AssignmentAvgScoreCalc,
   IDWithName,
@@ -32,6 +33,7 @@ import CourseAnalyticsSettings, {
 import CalcADAPTAllAssignments, {
   ICalcADAPTAllAssignments_Raw,
 } from "./models/calcADAPTAllAssignments";
+import ewsActorSummary from "./models/ewsActorSummary";
 
 class Analytics {
   private adaptID: number;
@@ -484,6 +486,56 @@ class Analytics {
       return false;
     }
   }
+
+  public async getRawData(): Promise<AnalyticsRawData[]> {
+    try {
+      await connectDB();
+
+      const res = await ewsActorSummary.find({
+        course_id: this.adaptID.toString(),
+      });
+
+      const actorIds = res.map((d) => d.actor_id);
+
+      const avgScores = await CalcADAPTActorAvgScore.find({
+        courseID: this.adaptID.toString(),
+        actor: { $in: actorIds },
+      });
+
+      // Calculate course percentile and quartile
+      const allScores = res.map((d) => d.course_percent);
+      const sortedScores = allScores.sort((a, b) => a - b);
+
+      const getPercentile = (score: number) =>
+        (sortedScores.indexOf(score) / allScores.length) * 100;
+
+      const getQuartile = (score: number) => {
+        const quartile = Math.floor(
+          (sortedScores.indexOf(score) / allScores.length) * 4
+        );
+        return quartile === 4 ? 3 : quartile;
+      };
+
+      const data = res.map((d) => ({
+        actor_id: d.actor_id,
+        name: d.actor_id,
+        pagesAccessed: 0,
+        uniqueInteractionDays: d.interaction_days,
+        avgPercentAssignment:
+          avgScores.find((a) => a.actor === d.actor_id)?.avg_score ?? 0,
+        percentSeen: d.percent_seen,
+        coursePercent: d.course_percent,
+        // round percentile to two decimal places
+        classPercentile: Math.round(getPercentile(d.course_percent) * 100) / 100,
+        classQuartile: getQuartile(d.course_percent),
+      }));
+
+      return data;
+    } catch (err) {
+      console.error(err);
+      return [];
+    }
+  }
 }
 
 export default Analytics;
diff --git a/lib/analytics-functions.ts b/lib/analytics-functions.ts
index 4dd160d..ea0932b 100644
--- a/lib/analytics-functions.ts
+++ b/lib/analytics-functions.ts
@@ -125,3 +125,9 @@ export async function updateCourseAnalyticsSettings(
   const analytics = new Analytics(course_id);
   await analytics.updateCourseAnalyticsSettings(newSettings);
 }
+
+export async function getCourseRawData(course_id: string) {
+  const analytics = new Analytics(course_id);
+  const rawData = await analytics.getRawData();
+  return rawData;
+}
diff --git a/lib/types/analytics.ts b/lib/types/analytics.ts
index 3b4fe48..ebe61a2 100644
--- a/lib/types/analytics.ts
+++ b/lib/types/analytics.ts
@@ -37,3 +37,15 @@ export type ActivityAccessed = {
   seen: IDWithName[];
   unseen: IDWithName[];
 };
+
+export type AnalyticsRawData = {
+  actor_id: string;
+  name: string;
+  pagesAccessed: number;
+  uniqueInteractionDays: number;
+  avgPercentAssignment: number;
+  percentSeen: number;
+  coursePercent: number;
+  classPercentile: number;
+  classQuartile: number;
+};
\ No newline at end of file
diff --git a/lib/types/globalState.ts b/lib/types/globalState.ts
new file mode 100644
index 0000000..ead374a
--- /dev/null
+++ b/lib/types/globalState.ts
@@ -0,0 +1,9 @@
+import { ICourseAnalyticsSettings_Raw } from "../models/courseAnalyticsSettings";
+
+export type GlobalState = {
+  ferpaPrivacy: boolean;
+  role: string;
+  viewAs: string;
+  studentId: string;
+  assignmentId: string;
+} & ICourseAnalyticsSettings_Raw;
diff --git a/lib/types/index.ts b/lib/types/index.ts
index a2d7bc7..59b0aee 100644
--- a/lib/types/index.ts
+++ b/lib/types/index.ts
@@ -1,2 +1,3 @@
 export * from "./analytics";
-export * from "./misc";
\ No newline at end of file
+export * from "./misc";
+export * from "./globalState";
diff --git a/package-lock.json b/package-lock.json
index 9a37c8f..4fb16ad 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,12 +1,12 @@
 {
   "name": "learning-analytics",
-  "version": "1.1.0",
+  "version": "1.2.0",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "learning-analytics",
-      "version": "1.1.0",
+      "version": "1.2.0",
       "license": "MIT",
       "dependencies": {
         "@lucia-auth/adapter-mongodb": "^1.0.3",
@@ -20,7 +20,6 @@
         "classnames": "^2.5.1",
         "d3": "^7.9.0",
         "date-fns": "^3.6.0",
-        "jotai": "^2.8.0",
         "lucia": "^3.2.0",
         "mongoose": "^8.3.0",
         "next": "14.1.1",
@@ -3359,26 +3358,6 @@
         "url": "https://github.com/sponsors/panva"
       }
     },
-    "node_modules/jotai": {
-      "version": "2.8.0",
-      "resolved": "https://registry.npmjs.org/jotai/-/jotai-2.8.0.tgz",
-      "integrity": "sha512-yZNMC36FdLOksOr8qga0yLf14miCJlEThlp5DeFJNnqzm2+ZG7wLcJzoOyij5K6U6Xlc5ljQqPDlJRgqW0Y18g==",
-      "engines": {
-        "node": ">=12.20.0"
-      },
-      "peerDependencies": {
-        "@types/react": ">=17.0.0",
-        "react": ">=17.0.0"
-      },
-      "peerDependenciesMeta": {
-        "@types/react": {
-          "optional": true
-        },
-        "react": {
-          "optional": true
-        }
-      }
-    },
     "node_modules/js-tokens": {
       "version": "4.0.0",
       "resolved": "https://registry.npmjs.org/js-tokens/-/js-tokens-4.0.0.tgz",
diff --git a/package.json b/package.json
index 1ac5119..370e00d 100644
--- a/package.json
+++ b/package.json
@@ -22,7 +22,6 @@
     "classnames": "^2.5.1",
     "d3": "^7.9.0",
     "date-fns": "^3.6.0",
-    "jotai": "^2.8.0",
     "lucia": "^3.2.0",
     "mongoose": "^8.3.0",
     "next": "14.1.1",
diff --git a/state/globalContext.tsx b/state/globalContext.tsx
new file mode 100644
index 0000000..d826ba1
--- /dev/null
+++ b/state/globalContext.tsx
@@ -0,0 +1,44 @@
+import {
+  Context,
+  createContext,
+  useContext,
+  useState,
+  Dispatch,
+  SetStateAction,
+} from "react";
+import { GlobalState } from "@/lib/types";
+
+const DEFAULT_GLOBAL_STATE: GlobalState = {
+  ferpaPrivacy: false,
+  role: "student",
+  viewAs: "student",
+  studentId: "",
+  assignmentId: "",
+  courseID: "",
+  shareGradeDistribution: false,
+};
+
+const GlobalContext = createContext<
+  [GlobalState, Dispatch<SetStateAction<GlobalState>>]
+>([DEFAULT_GLOBAL_STATE, () => {}]);
+
+interface GlobalContextProviderProps {
+  children: React.ReactNode;
+}
+
+export function GlobalContextProvider({
+  children,
+}: GlobalContextProviderProps) {
+  const [globalState, setGlobalState] =
+    useState<GlobalState>(DEFAULT_GLOBAL_STATE);
+
+  return (
+    <GlobalContext.Provider value={[globalState, setGlobalState]}>
+      {children}
+    </GlobalContext.Provider>
+  );
+}
+
+export function useGlobalContext() {
+  return useContext(GlobalContext);
+}
diff --git a/state/globalState.ts b/state/globalState.ts
deleted file mode 100644
index 33b176c..0000000
--- a/state/globalState.ts
+++ /dev/null
@@ -1,29 +0,0 @@
-import { ICourseAnalyticsSettings_Raw } from "@/lib/models/courseAnalyticsSettings";
-import { SetStateAction, atom } from "jotai";
-
-export type GlobalState = {
-  ferpaPrivacy: boolean;
-  role: string;
-  viewAs: string;
-  studentId: string;
-  assignmentId: string;
-} & ICourseAnalyticsSettings_Raw;
-
-type GlobalStateSetAction = SetStateAction<GlobalState>;
-
-export const initGlobalStateAtom = atom({
-  ferpaPrivacy: false,
-  role: "student",
-  viewAs: "student",
-  studentId: "",
-  assignmentId: "",
-  courseID: "",
-  shareGradeDistribution: false,
-});
-
-export const globalStateAtom = atom(
-  (get) => get(initGlobalStateAtom),
-  (get, set, update: GlobalStateSetAction) => {
-    set(initGlobalStateAtom, update);
-  }
-);