diff --git a/frontend/src/components/Login.jsx b/frontend/src/components/Login.jsx
index 0fae113..b206a98 100644
--- a/frontend/src/components/Login.jsx
+++ b/frontend/src/components/Login.jsx
@@ -1,83 +1,102 @@
import React, { useState } from "react";
import { Link, useNavigate } from "react-router-dom";
-import axios from 'axios';
-import { useRecoilState } from 'recoil';
-import { userloggedin } from '../atom/userAtom';
+import axios from "axios";
+import { useRecoilState } from "recoil";
+import { userloggedin } from "../atom/userAtom";
export default function Login() {
- const [name, setName] = useState("");
- const [password, setPassword] = useState("");
- const [user, setUser] = useRecoilState(userloggedin);
- const navigate = useNavigate();
+ const [name, setName] = useState("");
+ const [password, setPassword] = useState("");
+ const [user, setUser] = useRecoilState(userloggedin);
+ const navigate = useNavigate();
- const handleSubmit = async (e) => {
- e.preventDefault();
- await axios.post("http://localhost:3001/login", { name, password })
- .then(result => {
- if (result.data.stat === "Success") {
- // console.log(result); //log
- setUser(result.data.name);
- // localStorage.setItem('user', JSON.stringify(user)); // locally storing the logged in user
- navigate("/");
- alert('Login successful: ' + result.data.name); //using result.data.name instead of user because useRecoilState is a asyncronous function taking time in updating the user variable
- } else {
- alert("Invalid credentials. Please try again.");
- }
- })
- .catch(err => {
- console.error(err);
- alert("An error occurred. Please try again.");
- });
- }
+ const handleSubmit = async (e) => {
+ e.preventDefault();
+ await axios
+ .post(
+ "https://sankha-chatappb-serveit.codecult.tech/login",
+ //.post("http://localhost:3001/login", //for local development
+ {
+ name,
+ password,
+ }
+ )
+ .then((result) => {
+ if (result.data.stat === "Success") {
+ // console.log(result); //log
+ setUser(result.data.name);
+ // localStorage.setItem('user', JSON.stringify(user)); // locally storing the logged in user
+ navigate("/");
+ alert("Login successful: " + result.data.name); //using result.data.name instead of user because useRecoilState is a asyncronous function taking time in updating the user variable
+ } else {
+ alert("Invalid credentials. Please try again.");
+ }
+ })
+ .catch((err) => {
+ console.error(err);
+ alert("An error occurred. Please try again.");
+ });
+ };
- return (
-
-
-
Login to your account
-
+ return (
+
+
+
+ Login to your account
+
+
+
+
+
+ );
+}
diff --git a/frontend/src/components/OnlineUsers.jsx b/frontend/src/components/OnlineUsers.jsx
index 1fea643..05da825 100644
--- a/frontend/src/components/OnlineUsers.jsx
+++ b/frontend/src/components/OnlineUsers.jsx
@@ -1,51 +1,54 @@
import { io } from "socket.io-client";
-import React, { useEffect, useMemo } from 'react';
+import React, { useEffect, useMemo } from "react";
import { useRecoilState } from "recoil";
import { onlineUsersData } from "../atom/onlineUsersAtom";
-const socket = io.connect("http://localhost:3001");
+// const socket = io.connect("http://localhost:3001"); //for local development
+const socket = io.connect("https://sankha-chatappb-serveit.codecult.tech"); //for production
const OnlineUsers = React.memo(() => {
- const [onlineUsersList, setOnlineUsersList] = useRecoilState(onlineUsersData);
+ const [onlineUsersList, setOnlineUsersList] = useRecoilState(onlineUsersData);
- useEffect(() => {
- socket.on("online-users", (data) => {
- setOnlineUsersList(data);
- });
- return () => {
- socket.off("online-users"); //run before component removed from the ui
- };
- }, [onlineUsersList]); //tracking onlineUsers array
+ useEffect(() => {
+ socket.on("online-users", (data) => {
+ setOnlineUsersList(data);
+ });
+ return () => {
+ socket.off("online-users"); //run before component removed from the ui
+ };
+ }, [onlineUsersList]); //tracking onlineUsers array
- const memoizedUsers = useMemo(() => {
- return onlineUsersList.map((user, index) => (
-
- {index + 1}.
- {user}
-
- ));
- }, [onlineUsersList]);
+ const memoizedUsers = useMemo(() => {
+ return onlineUsersList.map((user, index) => (
+
+ {index + 1}.
+ {user}
+
+ ));
+ }, [onlineUsersList]);
- return (
- <>
-
-
Online Users Socket Id [{Math.floor(onlineUsersList.length / 2)}]
-
- {
- onlineUsersList.length === 0 ? (
Fetching ...
) :
- (
-
- {memoizedUsers}
-
- )
- }
-
-
- >
- )
+ return (
+ <>
+
+
+ Online Users Socket Id [{Math.floor(onlineUsersList.length / 2)}]
+
+
+ {onlineUsersList.length === 0 ? (
+
Fetching ...
+ ) : (
+
{memoizedUsers}
+ )}
+
+
+ >
+ );
});
-export default OnlineUsers;
\ No newline at end of file
+export default OnlineUsers;
diff --git a/frontend/src/components/Signup.jsx b/frontend/src/components/Signup.jsx
index 3e981c3..fec1381 100644
--- a/frontend/src/components/Signup.jsx
+++ b/frontend/src/components/Signup.jsx
@@ -1,94 +1,109 @@
import React, { useState } from "react";
import { Link, useNavigate } from "react-router-dom";
-import axios from 'axios';
+import axios from "axios";
export default function Signup() {
- const [name, setName] = useState("");
- const [email, setEmail] = useState("");
- const [password, setPassword] = useState("");
- const navigate = useNavigate();
+ const [name, setName] = useState("");
+ const [email, setEmail] = useState("");
+ const [password, setPassword] = useState("");
+ const navigate = useNavigate();
- const handleSubmit = async (e) => {
- e.preventDefault();
- const response = await axios.post("http://localhost:3001/register", { name, email, password })
- .then(result => {
- console.log(result);
- localStorage.setItem('userData', JSON.stringify(result.data));
- // navigate("/login");
- })
- .catch(err => {
- console.error(err);
- alert("An error occurred. Please try again." + err);
- });
- // localStorage.setItem('userData', JSON.stringify(response));
+ const handleSubmit = async (e) => {
+ e.preventDefault();
+ const response = await axios
+ .post(
+ "https://sankha-chatappb-serveit.codecult.tech/register",
+ // .post("http://localhost:3001/register", //for local development
+ { name, email, password }
+ )
+ .then((result) => {
+ console.log(result);
+ localStorage.setItem("userData", JSON.stringify(result.data));
+ // navigate("/login");
+ })
+ .catch((err) => {
+ console.error(err);
+ alert("An error occurred. Please try again." + err);
+ });
+ // localStorage.setItem('userData', JSON.stringify(response));
+ };
- }
-
- return (
-
-
-
Create an account
-
+ return (
+
+
+
+ Create an account
+
+
+
+
+
+ );
+}