Amplify yml force

frontend/src/Bell.tsx

@@ -1,6 +1,7 @@
 import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
 import { faBell } from "@fortawesome/free-solid-svg-icons";
 import { useEffect, useState } from "react";
+import { api } from "./api";
 
 // get current user id
 // const currUserID = sessionStorage.getItem('userId');
@@ -20,8 +21,8 @@ const BellButton = () => {
 
   // function that handles when button is clicked and fetches notifications
   const handleClick = async () => {
-    const response = await fetch(
-      `http://localhost:3001/notifications/user/${currUserID}`,
+    const response = await api(
+      `/notifications/user/${currUserID}`,
       {
         method: "GET",
       }

frontend/src/GrantSearch.tsx

@@ -4,6 +4,7 @@ import { useEffect, useState } from "react";
 import Fuse from "fuse.js";
 import "./styles/GrantSearch.css";
 import { Grant } from "../../middle-layer/types/Grant";
+import { api } from "./api";
 
 function GrantSearch({ onGrantSelect }: any) {
   const [userInput, setUserInput] = useState("");
@@ -21,7 +22,7 @@ function GrantSearch({ onGrantSelect }: any) {
 
   const fetchGrants = async () => {
     try {
-      const response = await fetch(`http://localhost:3001/grant`, { method: "GET" });
+      const response = await api(`/grant`, { method: "GET" });
       const data: Grant[] = await response.json();
       const formattedData: Grant[] = data.map((grant: any) => ({
         ...grant,

frontend/src/Profile.tsx

@@ -4,6 +4,7 @@ import { useAuthContext } from "./context/auth/authContext";
 import { updateUserProfile } from "./external/bcanSatchel/actions";
 import { toJS } from 'mobx';
 import { Link } from "react-router-dom";
+import { api } from "./api";
 
 /**
  * Current logged in user's profile
@@ -20,7 +21,7 @@ const Profile = observer(() => {
     e.preventDefault();
 
     try {
-      const response = await fetch("http://localhost:3001/auth/update-profile", {
+      const response = await api("/auth/update-profile", {
         method: "POST",
         headers: {
           "Content-Type": "application/json",

frontend/src/Register.tsx

@@ -3,6 +3,7 @@ import { setAuthState } from "./external/bcanSatchel/actions";
 import { observer } from "mobx-react-lite";
 import { useNavigate } from "react-router-dom";
 import logo from "./images/bcan_logo.svg";
+import { api } from "./api";
 
 /**
  * Register a new BCAN user
@@ -17,7 +18,7 @@ const Register = observer(() => {
     e.preventDefault();
 
     try {
-      const response = await fetch("http://localhost:3001/auth/register", {
+      const response = await api("/auth/register", {
         method: "POST",
         headers: { "Content-Type": "application/json" },
         body: JSON.stringify({ username, password, email }),
@@ -31,7 +32,7 @@ const Register = observer(() => {
       }
 
       // If registration succeeded, automatically log in the user
-      const loginResponse = await fetch("http://localhost:3001/auth/login", {
+      const loginResponse = await api("/auth/login", {
         method: "POST",
         headers: { "Content-Type": "application/json" },
         body: JSON.stringify({ username, password }),

frontend/src/api.ts

@@ -0,0 +1,6 @@
+// src/api.ts
+const API = import.meta.env.VITE_API_URL;
+
+export function api(path: string, init?: RequestInit) {
+  return fetch(`${API}${path.startsWith('/') ? '' : '/'}${path}`, init);
+}

frontend/src/context/auth/authContext.tsx

@@ -3,6 +3,7 @@ import { getAppStore } from '../../external/bcanSatchel/store';
 import { setAuthState, logoutUser } from '../../external/bcanSatchel/actions'
 import { observer } from 'mobx-react-lite';
 import { User } from '../../../../middle-layer/types/User'
+import { api } from '@/api';
 
 /**
  * Available authenticated user options
@@ -33,7 +34,7 @@ export const AuthProvider = observer(({ children }: { children: ReactNode }) =>
    * Attempt to log in the user
    */
   const login = async (username: string, password: string) => {
-    const response = await fetch('http://localhost:3001/auth/login', {
+    const response = await api('/auth/login', {
       method: 'POST',
       headers: { 'Content-Type': 'application/json' },
       body: JSON.stringify({ username, password }),
@@ -54,7 +55,7 @@ export const AuthProvider = observer(({ children }: { children: ReactNode }) =>
    * Register a new user and automatically log them in
    */
   const register = async (username: string, password: string, email: string) => {
-    const response = await fetch('http://localhost:3001/auth/register', {
+    const response = await fetch('/auth/register', {
       method: 'POST',
       headers: { 'Content-Type': 'application/json' },
       body: JSON.stringify({ username, password, email }),

frontend/src/grant-info/components/GrantItem.tsx

@@ -8,6 +8,7 @@ import { Grant } from "../../../../middle-layer/types/Grant";
 import { DoesBcanQualifyText } from "../../translations/general";
 import RingButton, { ButtonColorOption } from "../../custom/RingButton";
 import { Status } from "../../../../middle-layer/types/Status";
+import { api } from "../../api";
 
 interface GrantItemProps {
   grant: Grant;
@@ -40,7 +41,7 @@ const GrantItem: React.FC<GrantItemProps> = ({ grant, defaultExpanded = false })
     if (isEditing) {
       // Save changes when exiting edit mode.
       try {
-        const response = await fetch("http://localhost:3001/grant/save", {
+        const response = await api("/grant/save", {
           method: "PUT",
           headers: {
             "Content-Type": "application/json",

frontend/src/grant-info/components/GrantList/processGrantData.ts

@@ -4,11 +4,12 @@ import { fetchAllGrants } from "../../../external/bcanSatchel/actions";
 import { Grant } from "../../../../../middle-layer/types/Grant";
 import {dateRangeFilter, filterGrants, statusFilter} from "./grantFilters";
 import { sortGrants } from "./grantSorter.ts";
+import { api } from "../../../api.ts";
 
 // GET request for all grants
 const fetchGrants = async () => {
     try {
-        const response = await fetch("http://localhost:3001/grant");
+        const response = await api("/grant");
         if (!response.ok) {
             throw new Error(`HTTP Error, Status: ${response.status}`);
         }

frontend/src/grant-info/components/NewGrantModal.tsx

@@ -6,6 +6,7 @@ import POCEntry from "./POCEntry";
 import { Grant } from "../../../../middle-layer/types/Grant";
 import { TDateISO } from "../../../../backend/src/utils/date";
 import { Status } from "../../../../middle-layer/types/Status";
+import { api } from "../../api";
 
 /** Attachment type from your middle layer */
 enum AttachmentType {
@@ -162,7 +163,7 @@ const NewGrantModal: React.FC<{ onClose: () => void }> = ({ onClose }) => {
     };
     console.log(newGrant);
     try {
-      const response = await fetch("http://localhost:3001/grant/new-grant", {
+      const response = await api("/grant/new-grant", {
         method: "POST",
         headers: { "Content-Type": "application/json" },
         body: JSON.stringify(newGrant),
@@ -175,7 +176,7 @@ const NewGrantModal: React.FC<{ onClose: () => void }> = ({ onClose }) => {
       }
 
       // Re-fetch the full list of grants
-      const grantsResponse = await fetch("http://localhost:3001/grant");
+      const grantsResponse = await api("/grant");
       if (!grantsResponse.ok) {
         throw new Error("Failed to re-fetch grants.");
       }