Merge pull request #46 from hotungkhanh/kan-87/connect-deployed-backend

feat: connect frontend to deployed backend
hotungkhanh · Oct 9, 2024 · 07bd394 · 07bd394
2 parents dc793d0 + 4e8c382
commit 07bd394
Show file tree

Hide file tree

Showing 5 changed files with 14 additions and 11 deletions.
diff --git a/frontend/src/pages/Enrolment.tsx b/frontend/src/pages/Enrolment.tsx
@@ -5,7 +5,7 @@ import Header from "../components/Header.tsx";
 import Footer from "../components/Footer.tsx";
 import Photo from "../assets/frontpage.jpg";
 import { useEffect } from "react";
-import { LOCAL_API_URL, TimetableSolution } from "../scripts/api.ts";
+import { REMOTE_API_URL, TimetableSolution } from "../scripts/api.ts";
 import { useAuthContext } from "../security/AuthContext.tsx";
 import SkipButton from "../components/SkipButton.tsx";
 
@@ -26,7 +26,7 @@ export default function StarterPage() {
   };
   const { authHeader } = useAuthContext();
   useEffect(() => {
-    fetch(LOCAL_API_URL + "/timetabling/view", {
+    fetch(REMOTE_API_URL + "/timetabling/view", {
       headers: { Authorization: authHeader },
     })
       .then((response) => {

diff --git a/frontend/src/pages/LoginPage.tsx b/frontend/src/pages/LoginPage.tsx
@@ -3,7 +3,7 @@ import { useNavigate } from 'react-router-dom';
 import { AuthHeader, useAuthContext } from '../security/AuthContext';
 import '../styles/login.css';
 import VIT_Logo from '../assets/logo.png';
-import { LOCAL_API_URL } from '../scripts/api';
+import { REMOTE_API_URL } from '../scripts/api';
 import LoadingButton from '../components/LoadingButton';
 
 export default function LoginPage() {
@@ -22,7 +22,7 @@ export default function LoginPage() {
 
     try {
       // Send a request to the backend to validate credentials
-      const response = await fetch(LOCAL_API_URL + "/login", {
+      const response = await fetch(REMOTE_API_URL + "/login", {
         method: 'GET',
         headers: {
           'Authorization': encodedHeader,

diff --git a/frontend/src/pages/SendData.tsx b/frontend/src/pages/SendData.tsx
@@ -25,6 +25,9 @@ export default function SendData() {
 
   function generateTimetable() {
     setLoading(true);
+    setTimeout(() => {
+      setLoading(false);
+    }, 120000);
     Promise.all([getSpreadsheetData(DB_ROOMS), getSpreadsheetData(DB_UNITS)])
     .then((responses) => {
       const [roomData, unitData] = [...responses];
@@ -41,11 +44,11 @@ export default function SendData() {
     })
     .then((solutions) => {
       console.log(solutions);
-      setLoading(false);
+      // setLoading(false);
     })
     .catch((error) => {
       alert(error);
-      setLoading(false);
+      // setLoading(false);
     })
   }
 

diff --git a/frontend/src/pages/TimetableMod.tsx b/frontend/src/pages/TimetableMod.tsx
@@ -5,7 +5,7 @@ import Footer from "../components/Footer";
 import BackButton from "../components/BackButton";
 import { Outlet } from "react-router-dom";
 import ModSidebar from "../components/ModSiderbar";
-import { LOCAL_API_URL, TimetableSolution } from "../scripts/api";
+import { REMOTE_API_URL, TimetableSolution } from "../scripts/api";
 import { useAuthContext } from "../security/AuthContext";
 
 /**
@@ -20,7 +20,7 @@ export default function TimetableMod() {
   const { authHeader } = useAuthContext();
 
   useEffect(() => {
-    fetch(LOCAL_API_URL + "/timetabling/view", { headers: { 'Authorization': authHeader } })
+    fetch(REMOTE_API_URL + "/timetabling/view", { headers: { 'Authorization': authHeader } })
       .then((response) => {
         if (!response.ok) {
           throw new Error("Network response was not ok");

diff --git a/frontend/src/scripts/api.ts b/frontend/src/scripts/api.ts
@@ -1,7 +1,7 @@
 import { AuthHeader } from "../security/AuthContext";
 
 /* Timetable solver backend endpoint URL */
-export const API_URL = "http://localhost:8080";
+export const REMOTE_API_URL = "https://jetedge-backend-e1eeff4b0c04.herokuapp.com";
 export const LOCAL_API_URL = "http://localhost:8080";
 
 /* =========================================== Defining types =========================================== */
@@ -64,7 +64,7 @@ export type Time = string;
  */
 export async function fetchTimetableSolution(problem: TimetableProblem, authHeader: AuthHeader, url?: string): Promise<TimetableSolution | null> {
   try {
-    let api_url = API_URL;
+    let api_url = REMOTE_API_URL;
     if (url !== undefined) {
       api_url = url;
     }
@@ -79,7 +79,7 @@ export async function fetchTimetableSolution(problem: TimetableProblem, authHead
 
     if (!response.ok) {
       if (response.status === 500) {
-        alert(response.statusText + " " + response.status + ": server was not able to solve the problem. Please check for missing input (i.e. make sure there are at least 1 available room and no rooms with duplicate ID).");
+        alert(response.statusText + " " + response.status + ": server was not able to solve the problem.");
       }
       throw new Error(`HTTP error! Status: ${response.status} ${response.statusText}`);
     }