Merge branch 'main' into jessica

.gitignore

-<<<<<<< HEAD
 env
 .env
-=======
-.DS_Store
-.idea/
-.idea/*
-.vs_code/
-.vs_code/*
-node_modules
-node_modules/*
-public/
-public/*
->>>>>>> 81817af8f7ce49e492d2a4bed110d9620b09cbfe

frontend/src/App.js

 
 
+
 import React, { useState } from 'react';
 import './App.css';
 import Login from './components/auth/login';
@@ -33,6 +34,7 @@ function App() {
         <Route path="login" element={<Login/>} />
         <Route path="register" element={<Register/>}/>
       </Routes>
+
     </div>
   );
 }

frontend/src/components/home.jsx

+import React, { useState, useEffect, useRef } from "react";
+import Editor from "@monaco-editor/react";
+
+import React, { useState } from "react";
+import "./App.css";
+
+const homeComponent = () => {
+  const [showScreen, setShowScreen] = useState(false);
+  const [uploadedFileName, setUploadedFileName] = useState("");
+
+  const handleImageClick = () => {
+    setShowScreen(true);
+  };
+
+  const handleFileUpload = (event) => {
+    const file = event.target.files[0];
+    if (file) {
+      console.log("Uploaded file:", file.name);
+      setUploadedFileName(file.name);
+    }
+  };
+
+  return showScreen ? (
+    <div className="new-screen">
+      <h1 className="greeting2">Past Uploads</h1>
+      <img src="assets/icon.jpg" alt="sm" className="small-image2" />
+      <p className="profileinfo">
+        Alice Li <br />
+      </p>
+      <p className="profileinfo2">
+        <strong>username:</strong> alice_li409 <br />
+        <strong>email: </strong> alice_li409@illinois.edu
+      </p>
+      <div className="parent-container">
+        <div className="text-box-container">
+          <div className="text-box">file1.c</div>
+          <div className="text-box">file2.c</div>
+          <div className="text-box">file3.c</div>
+          <div className="text-box">file4.c</div>
+        </div>
+        <div className="text-box-container2">
+          <div className="text-box2">Score: 1/10</div>
+          <div className="text-box2">Score: 5/10</div>
+          <div className="text-box2">Score: 7/10</div>
+          <div className="text-box2">Score: 2/10</div>
+        </div>
+      </div>
+      <button onClick={() => setShowScreen(false)}>Go Back</button>
+    </div>
+  ) : (
+    <div className="App">
+      <h1 className="greeting">Hello, xyz!</h1>
+      <img
+        src="/images/small-image.jpg"
+        alt="Small"
+        className="small-image"
+        onClick={handleImageClick}
+      />
+      <div className="center-content">
+        <label className="upload-button">
+          Upload Files
+          <input type="file" onChange={handleFileUpload} />
+        </label>
+      </div>
+      <div className="image-container">
+        <img
+          src="/images/large-image.jpg"
+          alt="Large"
+          className="large-image"
+        />
+      </div>
+    </div>
+  );
+};
+
+export default homeComponent;