Bitbox-Connect · AdityaP700 · Oct 24, 2024 · Oct 24, 2024 · Oct 25, 2024
diff --git a/client/index.html b/client/index.html
@@ -1,11 +1,50 @@
 <!DOCTYPE html>
 <html lang="en">
+<<<<<<< HEAD
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <link
+      rel="shortcut icon"
+      href="./favicon_io/favicon.ico"
+      type="image/x-icon"
+    />
+    <title>Bitbox - Where Projects Find Solutions Together</title>
+    <!--Socket.IO is a library that enables low-latency, bidirectional and event-based communication between a client and a server. -->
+    <script defer src="http://localhost:5000/socket.io/socket.io.js"></script>
+    <!-- Bootstrap CSS -->
+    <link
+      href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css"
+      rel="stylesheet"
+      integrity="sha384-T3c6CoIi6uLrA9TneNEoa7RxnatzjcDSCmG1MXxSR1GAsXEV/Dwwykc2MPK8M2HN"
+      crossorigin="anonymous"
+    />
+    <!-- Importing EXO 2 font from Google font    -->
+    <link
+      href="https://fonts.googleapis.com/css2?family=Exo+2:wght@400;700&display=swap"
+      rel="stylesheet"
+    />
+  </head>
+  <body>   
+    <div id="root"></div>
+    <script type="module" src="/src/main.jsx"></script>
+  </body>
+  <!-- Bootstrap Script -->
+  <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
+  <script src="https://stackpath.bootstrapcdn.com/bootstrap/5.1.3/js/bootstrap.bundle.min.js"></script>
+  <script
+    src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js"
+    integrity="sha384-C6RzsynM9kWDrMNeT87bh95OGNyZPhcTNXj1NW7RuBCsyN/o0jlpcV8Qyq46cDfL"
+    crossorigin="anonymous"
+  ></script>
+=======
 
 <head>
   <meta charset="UTF-8" />
   <meta name="viewport" content="width=device-width, initial-scale=1.0" />
   <link rel="shortcut icon" href="./favicon_io/favicon.ico" type="image/x-icon" />
   <title>Bitbox - Where Projects Find Solutions Together</title>
+>>>>>>> upstream/main
 
   <!-- Updated Socket.IO script for production URL -->
   <script defer src="https://bitbox-uxbo.onrender.com/socket.io/socket.io.js"></script>

diff --git a/client/src/App.jsx b/client/src/App.jsx
@@ -8,6 +8,37 @@ import {
   useLocation,
 } from "react-router-dom";
 import PropTypes from "prop-types";
+<<<<<<< HEAD
+import LoadingBar from 'react-top-loading-bar';
+import About from './component/About';
+import Alert from './component/Alert';
+import Footer from './component/Footer';
+import Preloader from './component/Preloader'
+import Home from './component/Home';
+import Login from './component/Login';
+import Navbar from './component/Navbar';
+import Signup from './component/Signup';
+import ProjectState from './context/ProjectState';
+import ProfileState from './context/ProfileState';
+import CodeOfConduct from './component/Footers/Codeofconduct';
+import Feedback from './component/Footers/Feedback';
+import ContactUs from './component/Footers/Contactus';
+import PrivacyPolicy from './component/Footers/Privacypolicy';
+import TermOfUse from './component/Footers/TermOfUse';
+import Community from './component/Community';
+import MyProfile from './component/MyProfile';
+import ScrollTop from './component/ScrollTop';
+import EditProfile from './component/EditProfile';
+import Contributers from './component/Contributers';
+import Discussion from './component/Discussion';
+import { useAtom } from 'jotai';
+import { modeAtom } from './atom/Atom';
+import ForgotPassword from './component/forgotpass';
+import VerifyEmail from './component/Verify';
+import NotFound from './component/NotFound';
+import MiniChatbot from './component/MiniChatbot'
+import ProgressBar from './component/ProgressBar/ProgressBar';
+=======
 import LoadingBar from "react-top-loading-bar";
 import About from "./component/About";
 import BlogPage from "./component/Blog";
@@ -39,6 +70,7 @@ import MiniChatbot from "./component/MiniChatbot";
 import ProgressBar from "./component/ProgressBar/ProgressBar";
 import ProtectedRoute from '../../client/src/component/ProtectedRoute'
 
+>>>>>>> upstream/main
 // Main Layout Component
 
 const Layout = ({ children, mode, setProgress, toggleMode, showAlert }) => {
@@ -77,7 +109,19 @@ const Layout = ({ children, mode, setProgress, toggleMode, showAlert }) => {
 };
 
 function App() {
+<<<<<<< HEAD
+  const [isPreloaderVisible, SetIsPreloaderVisible] = useState(true);
+  useEffect(() => {
+    const timer = setTimeout(() => {
+      SetIsPreloaderVisible(false);
+    }, 5000)
+    return()=> clearTimeout(timer);
+  }, []);
+
+  const [mode, setMode] = useAtom(modeAtom)
+=======
   const [mode, setMode] = useAtom(modeAtom);
+>>>>>>> upstream/main
   const [alert, setAlert] = useState(null);
   const showAlert = (message, type) => {
     setAlert({ msg: message, type: type });
@@ -126,7 +170,14 @@ function App() {
   };
 
   return (
+<<<<<<< HEAD
+    <div>
+      {isPreloaderVisible ?(
+        <Preloader />
+      ):(
+=======
     <div className="h-full w-screen">
+>>>>>>> upstream/main
       <ProjectState>
         <ProfileState>
           <Router>
@@ -289,13 +340,21 @@ function App() {
                 />
                 <Route exact path='/verify/:token' element={<VerifyEmail />} />
                 {/* 404 Route */}
+<<<<<<< HEAD
+                <Route exact path="/*" element={<NotFound />} />
+              </Routes>
+
+=======
                 <Route exact path='/*' element={<NotFound />} />
               </Routes>
+>>>>>>> upstream/main
             </Layout>
           </Router>
         </ProfileState>
       </ProjectState>
+      )}
     </div>
+
   );
 }
 

diff --git a/client/src/component/Home.css b/client/src/component/Home.css
@@ -8,4 +8,3 @@
     }
   }
 
-
diff --git a/client/src/component/Login.jsx b/client/src/component/Login.jsx
@@ -50,6 +50,33 @@ const Login = ({ mode, showAlert, isloggedin, setloggedin }) => {
       console.error("Error during login:", error);
     } finally {
       setLoading(false);
+<<<<<<< HEAD
+    }
+  };
+
+  const handleForgotPassword = async () => {
+    try {
+      const response = await fetch(`${host}/api/auth/ResetByEmail`, {
+        method: "POST",
+        headers: {
+          "Content-Type": "application/json",
+        },
+        body: JSON.stringify({ email: forgotEmail }),
+      });
+
+      const data = await response.json();
+      if (response.ok) {
+        toast.success(data.message || "Reset email sent successfully!");
+        setForgotPasswordModalVisible(false);
+        setForgotEmail("");
+      } else {
+        showAlert(data.message || "Failed to send reset email", "danger");
+      }
+    } catch (error) {
+      console.error("Error during password reset:", error);
+      showAlert("An error occurred. Please try again later.", "danger");
+=======
+>>>>>>> upstream/main
     }
   };
 
@@ -58,12 +85,121 @@ const Login = ({ mode, showAlert, isloggedin, setloggedin }) => {
   };
 
   return (
+<<<<<<< HEAD
+    <div
+      className="wrapper"
+      style={{
+        backgroundColor: mode === "dark" ? "#1A1A1A" : "white", // Dark background
+        color: mode === "dark" ? "white" : "black",
+      }}
+    >
+      <form
+        onSubmit={handleSubmit}
+        className="form"
+        style={{
+          backgroundColor: mode === "dark" ? "#1A1A1A" : "white",
+          color: mode === "dark" ? "white" : "black",
+          border: mode === "dark" ? "2px solid #6366F1" : "none", // Border for dark theme
+          borderRadius: "15px",
+          padding: "40px", // Add padding for better aesthetics
+          boxShadow: mode === "dark" ? "0 8px 16px rgba(255, 255, 255, 0.1)" : "0 8px 16px rgba(0, 0, 0, 0.2)"
+        }}
+      >
+        <h1 className="title">Login</h1>
+        <span className="title-line"></span>
+        <div className="inp">
+          <Input
+            prefix={<UserOutlined />}
+            type="email"
+            placeholder="Email"
+            name="email"
+            value={credentials.email}
+            onChange={onChange}
+            autoComplete="on"
+            required
+            style={{
+              border: mode === "dark" ? "1px solid #6366F1" : "1px solid #ddd", 
+            }}
+          />
+        </div>
+
+        <div className="inp">
+          <Input.Password
+            prefix={<LockOutlined />}
+            placeholder="Password"
+            name="password"
+            value={credentials.password}
+            onChange={onChange}
+            autoComplete="on"
+            iconRender={(visible) =>
+              visible ? <EyeTwoTone /> : <EyeInvisibleOutlined />
+            }
+            style={{
+              border: mode === "dark" ? "1px solid #6366F1" : "1px solid #ddd", 
+            }}
+            required
+          />
+        </div>
+
+        <Button className="submit" type="submit" disabled={loading}>
+          {loading ? <Spin size="small" /> : "Login"}
+        </Button>
+
+        <p className="footer" style={{
+          color: mode === "dark" ? "white" : "black",
+        }}>
+          Don&apos;t have an account?
+          <Link className="link" to="/Signup">
+            {" "}
+            Sign Up
+          </Link>
+        </p>
+
+        <Button
+          style={{ backgroundColor: "#6366f1", color: "#FFFFFF" }}
+          onClick={() => setForgotPasswordModalVisible(true)}
+          className="mt-3"
+        >
+          Forgot Password?
+        </Button>
+      </form>
+
+      <div className="banner">
+        <h1 className="wel_text" style={{
+          color: mode === "dark" ? "white" : "black",
+        }}>
+          WELCOME
+          <br />
+          BACK!
+        </h1>
+        <p className="para" style={{
+          color: mode === "dark" ? "white" : "black",
+        }}>
+          Please Sign In here
+          <br />
+          with your real info
+        </p>
+      </div>
+
+      <Modal
+        title="Reset Password"
+        visible={forgotPasswordModalVisible}
+        onOk={handleForgotPassword}
+        onCancel={() => setForgotPasswordModalVisible(false)}
+        okText="Submit"
+        okButtonProps={{
+          style: { backgroundColor: "#6366f1", color: "#000" },
+        }}
+        cancelButtonProps={{
+          style: { backgroundColor: "#000000" },
+=======
     <div className="h-screen flex items-center justify-center">
       <div
         className="wrapper h-3/4 mt-10"
         style={{
           backgroundColor: mode === "dark" ? "black" : "white",
           color: mode === "dark" ? "white" : "black",
+>>>>>>> upstream/main
         }}
       >