diff --git a/eduaid_web/package-lock.json b/eduaid_web/package-lock.json
index 265257c..eed1fd7 100644
--- a/eduaid_web/package-lock.json
+++ b/eduaid_web/package-lock.json
@@ -11,12 +11,13 @@
         "@testing-library/jest-dom": "^5.17.0",
         "@testing-library/react": "^13.4.0",
         "@testing-library/user-event": "^13.5.0",
+        "dotenv": "^16.4.7",
         "pdf-lib": "^1.17.1",
         "react": "^18.3.1",
         "react-dom": "^18.3.1",
         "react-icons": "^5.2.1",
         "react-router-dom": "^6.26.0",
-        "react-scripts": "5.0.1",
+        "react-scripts": "^5.0.1",
         "react-switch": "^7.0.0",
         "web-vitals": "^2.1.4"
       },
@@ -7136,11 +7137,15 @@
       }
     },
     "node_modules/dotenv": {
-      "version": "10.0.0",
-      "resolved": "https://registry.npmjs.org/dotenv/-/dotenv-10.0.0.tgz",
-      "integrity": "sha512-rlBi9d8jpv9Sf1klPjNfFAuWDjKLwTIJJ/VxtoTwIR6hnZxcEOQCZg2oIL3MWBYw5GpUDKOEnND7LXTbIpQ03Q==",
+      "version": "16.6.1",
+      "resolved": "https://registry.npmjs.org/dotenv/-/dotenv-16.6.1.tgz",
+      "integrity": "sha512-uBq4egWHTcTt33a72vpSG0z3HnPuIl6NqYcTrKEg2azoEyl2hpW0zqlxysq2pK9HlDIHyHyakeYaYnSAwd8bow==",
+      "license": "BSD-2-Clause",
       "engines": {
-        "node": ">=10"
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://dotenvx.com"
       }
     },
     "node_modules/dotenv-expand": {
@@ -15053,6 +15058,7 @@
       "version": "5.0.1",
       "resolved": "https://registry.npmjs.org/react-scripts/-/react-scripts-5.0.1.tgz",
       "integrity": "sha512-8VAmEm/ZAwQzJ+GOMLbBsTdDKOpuZh7RPs0UymvBR2vRk4iZWCskjbFnxqjrzoIvlNNRZ3QJFx6/qDSi6zSnaQ==",
+      "license": "MIT",
       "dependencies": {
         "@babel/core": "^7.16.0",
         "@pmmmwh/react-refresh-webpack-plugin": "^0.5.3",
@@ -15121,6 +15127,15 @@
         }
       }
     },
+    "node_modules/react-scripts/node_modules/dotenv": {
+      "version": "10.0.0",
+      "resolved": "https://registry.npmjs.org/dotenv/-/dotenv-10.0.0.tgz",
+      "integrity": "sha512-rlBi9d8jpv9Sf1klPjNfFAuWDjKLwTIJJ/VxtoTwIR6hnZxcEOQCZg2oIL3MWBYw5GpUDKOEnND7LXTbIpQ03Q==",
+      "license": "BSD-2-Clause",
+      "engines": {
+        "node": ">=10"
+      }
+    },
     "node_modules/react-switch": {
       "version": "7.0.0",
       "resolved": "https://registry.npmjs.org/react-switch/-/react-switch-7.0.0.tgz",
diff --git a/eduaid_web/package.json b/eduaid_web/package.json
index 6cc891b..f4f7694 100644
--- a/eduaid_web/package.json
+++ b/eduaid_web/package.json
@@ -12,7 +12,7 @@
     "react-dom": "^18.3.1",
     "react-icons": "^5.2.1",
     "react-router-dom": "^6.26.0",
-    "react-scripts": "5.0.1",
+    "react-scripts": "^5.0.1",
     "react-switch": "^7.0.0",
     "web-vitals": "^2.1.4"
   },
diff --git a/eduaid_web/src/pages/Text_Input.jsx b/eduaid_web/src/pages/Text_Input.jsx
index 73a2f9b..3d431d4 100644
--- a/eduaid_web/src/pages/Text_Input.jsx
+++ b/eduaid_web/src/pages/Text_Input.jsx
@@ -8,11 +8,11 @@ import Switch from "react-switch";
 
 const Text_Input = () => {
   const [text, setText] = useState("");
+  const [errorText, setErrorText] = useState("");
   const [difficulty, setDifficulty] = useState("Easy Difficulty");
   const [numQuestions, setNumQuestions] = useState(10);
   const [loading, setLoading] = useState(false);
   const fileInputRef = useRef(null);
-  const [fileContent, setFileContent] = useState("");
   const [docUrl, setDocUrl] = useState("");
   const [isToggleOn, setIsToggleOn] = useState(0);
 
@@ -32,10 +32,15 @@ const Text_Input = () => {
           body: formData,
         });
         const data = await response.json();
-        setText(data.content || data.error);
+        if (data.content) {
+          setText(data.content);
+          setErrorText("");
+        } else {
+          setErrorText(data.error || "Unknown error");
+        }
       } catch (error) {
         console.error("Error uploading file:", error);
-        setText("Error uploading file");
+        setErrorText("Error uploading file");
       }
     }
   };
@@ -61,18 +66,22 @@ const Text_Input = () => {
           },
           body: JSON.stringify({ document_url: docUrl }),
         });
-
         if (response.ok) {
           const data = await response.json();
           setDocUrl("");
-          setText(data || "Error in retrieving");
+          if (data?.content) {
+            setText(data.content);
+            setErrorText("");
+          } else {
+            setErrorText(data?.error || "Error retrieving Google Doc content");
+          }
         } else {
           console.error("Error retrieving Google Doc content");
-          setText("Error retrieving Google Doc content");
+          setErrorText("Error retrieving Google Doc content");
         }
       } catch (error) {
         console.error("Error:", error);
-        setText("Error retrieving Google Doc content");
+        setErrorText("Error retrieving Google Doc content");
       } finally {
         setLoading(false);
       }
@@ -169,6 +178,24 @@ const Text_Input = () => {
         </div>
       )}
 
+      {/*Pop up to display when error occurs while uploading tthe file*/}
+      {errorText && (
+        <div className="fixed inset-0 z-50 flex items-center justify-center bg-[#02000F] bg-opacity-40 backdrop-blur-sm">
+          <div className="bg-gradient-to-r from-[#7600F2] to-[#00CBE7] rounded-2xl p-1 max-w-md w-full">
+            <div className="bg-black rounded-2xl p-6 text-center text-white">
+              <div className="text-xl font-extrabold mb-3">Error</div>
+              <div className="mb-6 text-white/90">{errorText}</div>
+              <button
+                className="bg-gradient-to-r from-[#7600F2] to-[#00CBE7] hover:opacity-90 transition rounded-xl px-5 py-2 font-semibold"
+                onClick={() => setErrorText("")}
+              >
+                Close
+              </button>
+            </div>
+          </div>
+        </div>
+      )}
+
       <div className={`w-full h-full bg-cust bg-opacity-50 ${loading ? "pointer-events-none" : ""}`}>
         {/* Header */}
         <a href="/" className="block">