changes

Author: TheAdich

backend/.env

@@ -1,4 +1,5 @@
 TOKEN_SECRET="shivamgupta"
 CLIENT_ID=540174704725-dh2d8m3i11jikb8l724b44q2rql5cnmn.apps.googleusercontent.com
 CLIENT_SECRET=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
-PORT=5000
+PORT=5000
+DB_URI="mongodb+srv://testing_node:test1234@cluster0.jriry7x.mongodb.net/Zcoder?retryWrites=true&w=majority&appName=Cluster0"

backend/config/database.js

@@ -1,8 +1,11 @@
 const mongoose=require('mongoose')
+const dotenv=require('dotenv');
+dotenv.config();
+const mongo_uri=process.env.DB_URI;
 const connect = async ()=>{
     try {
         console.log('Connecting to database')
-        await mongoose.connect("mongodb+srv://testing_node:test1234@cluster0.jriry7x.mongodb.net/Zcoder?retryWrites=true&w=majority&appName=Cluster0"
+        await mongoose.connect(mongo_uri
         ).then(()=>{
             console.log('Database connected');
         }).catch((err)=>{

backend/index.js

@@ -3,7 +3,8 @@ const app = express();
 const {createServer}=require('http');
 const {Server}=require('socket.io')
 const cors=require('cors');
-const port =process.env.PORT || 10000;
+
+
 const connect = require('./config/database');
 const auth=require('./middleware/auth');
 //const userRouter=require('./routes/userRoute');
@@ -20,6 +21,7 @@ const middleware=require('./middleware/auth');
 dotenv.config();
 const profile = require('./pages/profile/profile');
 const ask = require('./pages/problem/problem')
+const port =process.env.PORT;
 app.use(express.json());    
 app.use(express.urlencoded({ extended: false }));
 app.use(session({

frontend-next/app/components/ui/textareaeditor.jsx

@@ -2,34 +2,35 @@
 import { useEffect, useState } from "react";
 import axios from "axios";
 
-const Testareaanswer = ({_id}) => {
+const Testareaanswer = ({ _id, onAnswerPosted }) => {
     console.log(_id)
     const [addAnswer, setAddAnswer] = useState({
         user_id: "",
         name: "",
         answer: "",
     });
     useEffect(() => {
-    const userdetails=async()=>{
-        const token = window.sessionStorage.getItem("token");
-        try {
-            const res = await axios.get("https://zcoder-backend-dm5b.onrender.com/api/getAuth", {
-                headers: {
-                    'Authorization': `${token}`,
-                },
-            });
-            console.log(res.data);
-            setAddAnswer({...addAnswer,user_id:res.data._id,name:res.data.name});
-        } catch (err) {
-            console.log(err);
+        const userdetails = async () => {
+            const token = window.sessionStorage.getItem("token");
+            try {
+                const res = await axios.get("https://zcoder-backend-dm5b.onrender.com/api/getAuth", {
+                    headers: {
+                        'Authorization': `${token}`,
+                    },
+                });
+                console.log(res.data);
+                setAddAnswer({ ...addAnswer, user_id: res.data._id, name: res.data.name });
+            } catch (err) {
+                console.log(err);
+            }
         }
-    }
-    userdetails();
-},[]);
-    const handleanswer = async () => {
+        userdetails();
+    }, []);
+    const handleanswer = async (e) => {
+        e.preventDefault();
         const token = window.sessionStorage.getItem("token");
         try {
-            if(addAnswer.answer===""){
+            if (addAnswer.answer === "") {
                 alert("Please enter the answer first");
                 return;
             }
@@ -39,27 +40,34 @@ const Testareaanswer = ({_id}) => {
                 },
             });
             console.log(res.data);
-            setAddAnswer("");
+            if (res.status === 200) {
+                onAnswerPosted();
+                setAddAnswer((prev) => ({
+                    ...prev,
+                    answer: ""
+                }));
+            }
+
             // window.location.reload();
         } catch (err) {
             console.log(err);
         }
     }
     return (
         <>
-            <form className="answerbox my-5">
+            <div className="answerbox my-5">
                 <div className="w-full border border-gray-200 rounded-lg bg-gray-50 dark:bg-gray-700 dark:border-gray-600">
                     <div className="px-4 py-2 bg-white rounded-t-lg dark:bg-gray-800">
                         <label htmlFor="comment" className="sr-only">Your answer</label>
-                        <textarea id="comment" rows="4" className="w-full px-0 text-sm text-gray-900 bg-white border-0 dark:bg-gray-800 focus:ring-0 dark:text-white dark:placeholder-gray-400 h-56" placeholder="Write a answer..." required onChange={(e)=>setAddAnswer({...addAnswer,answer:e.target.value})}></textarea>
+                        <textarea id="comment" rows="4" className="w-full px-0 text-sm text-gray-900 bg-white border-0 dark:bg-gray-800 focus:ring-0 dark:text-white dark:placeholder-gray-400 h-56" placeholder="Write a answer..." required value={addAnswer?.answer} onChange={(e) => setAddAnswer({ ...addAnswer, answer: e.target.value })}></textarea>
                     </div>
                     <div className="flex items-center justify-between px-3 py-2 border-t dark:border-gray-600">
-                        <button type="submit" className="inline-flex items-center py-2.5 px-4 text-xs font-medium text-center text-white bg-blue-700 rounded-lg focus:ring-4 focus:ring-blue-200 dark:focus:ring-blue-900 hover:bg-blue-800" onClick={handleanswer}>
+                        <button type="button" className="inline-flex items-center py-2.5 px-4 text-xs font-medium text-center text-white bg-blue-700 rounded-lg focus:ring-4 focus:ring-blue-200 dark:focus:ring-blue-900 hover:bg-blue-800" onClick={handleanswer}>
                             Post Answer
                         </button>
                     </div>
                 </div>
-            </form>
+            </div>
 
         </>
     )

frontend-next/app/joinroom/page.jsx

@@ -14,7 +14,7 @@ const JoinRoom = () => {
 
     const getAllrooms = async () => {
       try {
-        const res = await axios.get('https://zback-49lo.onrender.com/api/room/getallrooms');
+        const res = await axios.get('https://zcoder-backend-dm5b.onrender.com/api/room/getallrooms');
         setRoomList(res.data);
       } catch (err) {
         console.log(err);
@@ -25,7 +25,7 @@ const JoinRoom = () => {
     const getAuthUser = async () => {
       const token = window.sessionStorage.getItem('token');
       const instance = axios.create({
-          baseURL: 'https://zback-49lo.onrender.com/api',
+          baseURL: 'https://zcoder-backend-dm5b.onrender.com/api',
           withCredentials: true,
           headers: {
               'Content-Type': 'application/json',
@@ -48,7 +48,7 @@ const JoinRoom = () => {
   const handleJoinRoom = async (room) => {
     console.log(room);
     try {
-      const res = await axios.post("https://zback-49lo.onrender.com/api/room/joinroom", { roomName:room.roomName, roomPassword:room.roomPassword,member:authUser._id });
+      const res = await axios.post("https://zcoder-backend-dm5b.onrender.com/api/room/joinroom", { roomName:room.roomName, roomPassword:room.roomPassword,member:authUser._id });
       console.log(res.data);
       setAlertStatus('success');
       window.location.href = `/room?id=${res.data._id}`

frontend-next/app/page.jsx

@@ -27,6 +27,7 @@ const Home = () => {
         fetch();
 
     }, []);
+
     console.log(problems);
 
     return (

frontend-next/app/question/[id]/page.jsx

@@ -13,8 +13,8 @@ const QuestionPage = ({ params }) => {
     const [question_, setQuestion_] = useState(null);
     const [loading, setLoading] = useState(true);
     const [error, setError] = useState(null);
-    useEffect(() => {
-        const fetchQuestion = async () => {
+
+    const fetchQuestion = async () => {
             const token = window.sessionStorage.getItem("token");
             try {
                 const response = await axios.get(`https://zcoder-backend-dm5b.onrender.com/api/problem/${_id}`, {
@@ -29,20 +29,28 @@ const QuestionPage = ({ params }) => {
                 setLoading(false);
             }
         };
+
+
+    useEffect(() => {
+        
         fetchQuestion();
     }, []);
 
-    if (loading) {
-        return (<div>Loading...</div>); // Show a loading state while the data is being fetched
-    }
+    // if (loading) {
+    //     return (<div>Loading...</div>); // Show a loading state while the data is being fetched
+    // }
 
     if (error) {
         return (<div>Error: {error.message}</div>); // Show an error message if the request fails
     }
 
+    
+
     if (!question_) {
-        return (<div>No data found</div>); // Handle the case where no question data is returned
+        return (<div>We are fetching.</div>); // Handle the case where no question data is returned
     }
+
+
     console.log(question_);
     const { title, question, answers, tag, date,name } = question_.problems;
     const currentTime = new Date();
@@ -125,7 +133,7 @@ const QuestionPage = ({ params }) => {
                 )}
                 <div className="answereditor mt-6">
                     <div className="text-sm font-medium mt-4">Write your answer here</div>
-                    <Testareaanswer _id={_id}/>
+                    <Testareaanswer _id={_id} onAnswerPosted={fetchQuestion}/>
                 </div>
             </div>
             </div>
@@ -136,4 +144,4 @@ const QuestionPage = ({ params }) => {
     );
 }
 
-export default auth(QuestionPage);
+export default QuestionPage;