Update getCourseInfo and getCoursesList queries to use graphql (#907)

* added apollo client + some helper funcs

* added some helper funcs

* attempt at converting timetable.ts to use graphql to handle term details

* updated getCoursesList with gql for initial review

* improvement: integrated gql for getCoursesList

* updated getCourseInfo to use graphql query (#906)

* feat: make graphql query to get course info

* format graphql output to match rest api output

* use graphql data instead of rest api data

* removed unnecessary fields from qraphql query

* clean up code

* clean up code

* clean up code

* clean up code

* clean up code

* removed references to old timetable scraper

* removed unused logic from timetable.ts + removed 'lastUpdated' status from footer

---------

Co-authored-by: ray <[email protected]>
Co-authored-by: Shaam <[email protected]>
Co-authored-by: jordansbenjamin <[email protected]>

Author: 4 people

client/package.json

@@ -16,6 +16,7 @@
     "style": "prettier --write 'src/**/*.{ts,tsx}' && eslint --fix 'src/**/*.{ts,tsx}'"
   },
   "dependencies": {
+    "@apollo/client": "3.11.8",
     "@date-io/date-fns": "3.0.0",
     "@emotion/react": "11.13.0",
     "@emotion/styled": "11.13.0",

client/pnpm-lock.yaml

@@ -115,7 +115,6 @@ const App: React.FC = () => {
     setTermsData,
     setTermNumber,
     setCoursesList,
-    setLastUpdated,
     selectedTimetable,
     displayTimetables,
     setDisplayTimetables,
@@ -204,9 +203,8 @@ const App: React.FC = () => {
      * Retrieves the list of all courses from the scraper backend
      */
     const fetchCoursesList = async () => {
-      const { courses, lastUpdated } = await getCoursesList(year, term);
+      const { courses } = await getCoursesList(term);
       setCoursesList(courses);
-      setLastUpdated(lastUpdated);
     };
 
     if (year !== invalidYearFormat) fetchReliably(fetchCoursesList);
@@ -294,7 +292,7 @@ const App: React.FC = () => {
     const codes: string[] = Array.isArray(data) ? data : [data];
     Promise.all(
       codes.map((code) =>
-        getCourseInfo(year, term, code, isConvertToLocalTimezone).catch((err) => {
+        getCourseInfo(term, code, isConvertToLocalTimezone).catch((err) => {
           return err;
         }),
       ),

client/src/App.tsx

@@ -1,3 +1,5 @@
+import { ApolloClient, InMemoryCache } from '@apollo/client';
+
 export enum Env {
   DEV = 'development',
   TEST = 'test',
@@ -10,14 +12,16 @@ interface Config {
   auto: string;
   server: string;
 }
-
+const HASURAGRES_GRAPHQL_API = 'https://graphql.csesoc.app/v1/graphql';
 const LOCAL = 'http://localhost:3001';
-const LIVE = 'https://timetable.devsoc.app';
+
+export const client = new ApolloClient({
+  uri: HASURAGRES_GRAPHQL_API,
+  cache: new InMemoryCache(),
+});
 
 const API_CONFIG: Record<string, Config> = Object.freeze({
   [Env.DEV]: { timetable: `${LOCAL}/api`, auto: `${LOCAL}/api/auto`, server: `${LOCAL}/api` },
   [Env.TEST]: { timetable: `${LOCAL}/api`, auto: `${LOCAL}/api/auto`, server: `${LOCAL}/api` },
-  [Env.MOCK]: { timetable: `${LIVE}/api`, auto: `${LOCAL}/api/auto`, server: `${LOCAL}/api` },
-  [Env.PROD]: { timetable: `${LIVE}/api`, auto: `/api/auto`, server: `/api` },
 });
 export const API_URL: Config = API_CONFIG[import.meta.env.VITE_APP_ENVIRONMENT || Env.DEV];