From 21effd3fecd0b757086052d32070776abda25e99 Mon Sep 17 00:00:00 2001
From: Shivam Gaur <128178418+shivamgaur99@users.noreply.github.com>
Date: Thu, 1 Aug 2024 22:20:10 +0530
Subject: [PATCH 1/4] =?UTF-8?q?=F0=9F=8D=81=20Bug=20Fixed:=20The=20respect?=
 =?UTF-8?q?ive=20image=20should=20appear=20in=20the=20Recent&Previous=20Br?=
 =?UTF-8?q?oadcast=20Cards=20(#1100)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../Broadcast/Component/Carousel/Carousel.jsx     | 15 ++++++++-------
 .../Component/Carousel/carousel.module.scss       |  3 +--
 2 files changed, 9 insertions(+), 9 deletions(-)

diff --git a/frontend/src/pages/Broadcast/Component/Carousel/Carousel.jsx b/frontend/src/pages/Broadcast/Component/Carousel/Carousel.jsx
index 543cc423..1dff6d64 100644
--- a/frontend/src/pages/Broadcast/Component/Carousel/Carousel.jsx
+++ b/frontend/src/pages/Broadcast/Component/Carousel/Carousel.jsx
@@ -63,9 +63,10 @@ export function Carousel(props) {
     const style = {
       height: "13em",
       backgroundSize: "cover",
+      backgroundPosition: "center",
       backgroundBlendMode: "screen",
-      clipPath: "polygon(0 0, 100% 0, 100% 70%, 50% 100%, 0 70%)",
-      backgroundImage: `linear-gradient(45deg,rgba(255, 0, 90, 1) 0%,rgba(10, 24, 61, 1) 90%),url(${item.link})`,
+      backgroundImage: `linear-gradient(45deg,rgba(255, 0, 90, 1) 0%,
+      rgba(10, 24, 61, 1) 90%), url(${item.imageUrl[0]})`,
     };
     return style;
   });
@@ -74,11 +75,11 @@ export function Carousel(props) {
     const style = {
       height: "13em",
       backgroundSize: "cover",
+      backgroundPosition: "center",
       backgroundBlendMode: "screen",
-      clipPath: "polygon(0 0, 100% 0, 100% 70%, 50% 100%, 0 70%)",
       backgroundImage: `linear-gradient(45deg, 
         #4e4376 0%, 
-        #2b5876 90%),url(${item.link})`,
+        #2b5876 90%),url(${item.imageUrl[0]})`,
     };
     return style;
   });
@@ -149,13 +150,13 @@ export function Carousel(props) {
                 handleOpen(item.content, item.title, item.imageUrl[0], item?.link)
               }
             >
-              <div
+              <div 
                 style={dark ? cardImageArrayDark[i] : cardImageArrayLight[i]}
               ></div>
-
+              
               <h3 className={style["card-head"]}>{item.title}</h3>
               <div className={style["card-text"]} 
-              dangerouslySetInnerHTML={{__html: DOMPurify.sanitize(truncatedContent(item.content, 250)),}} />
+              dangerouslySetInnerHTML={{__html: DOMPurify.sanitize(truncatedContent(item.content, 170)),}} />
             </div>
           ))}
         </OwlCarousel>
diff --git a/frontend/src/pages/Broadcast/Component/Carousel/carousel.module.scss b/frontend/src/pages/Broadcast/Component/Carousel/carousel.module.scss
index 150d9b18..279c9e7c 100644
--- a/frontend/src/pages/Broadcast/Component/Carousel/carousel.module.scss
+++ b/frontend/src/pages/Broadcast/Component/Carousel/carousel.module.scss
@@ -29,7 +29,7 @@
 
 .slide-card {
   position: relative;
-  min-height: 31em;
+  height: 31em;
   min-width: 20em;
   border-radius: 15px;
   margin: 30px;
@@ -65,7 +65,6 @@
 .card-text {
   line-height: 1.4;
   padding: 1em;
-  padding-top: 2em;
   text-align: justify;
   text-justify: distribute-all-lines;
   font-size: 14px;

From 4bceade3651a62866f30b8fcc93b3e05dde449bd Mon Sep 17 00:00:00 2001
From: Balaharisankar Lakshmanaperumal
 <114602603+BHS-Harish@users.noreply.github.com>
Date: Thu, 1 Aug 2024 22:21:11 +0530
Subject: [PATCH 2/4] =?UTF-8?q?=F0=9F=8D=80=20The=20Q&A=20should=20show=20?=
 =?UTF-8?q?approved=20questions=20fixed=20(#1097)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

* Upvote and Downvotes fixed

* Q&A page fixed
---
 frontend/src/pages/Q&A/Q&A.jsx | 109 ++++++++++++++++++---------------
 1 file changed, 59 insertions(+), 50 deletions(-)

diff --git a/frontend/src/pages/Q&A/Q&A.jsx b/frontend/src/pages/Q&A/Q&A.jsx
index 0423c21d..90ef356f 100644
--- a/frontend/src/pages/Q&A/Q&A.jsx
+++ b/frontend/src/pages/Q&A/Q&A.jsx
@@ -122,14 +122,18 @@ function Ques(props) {
     }
   };
 
+  const filterApprovedQuestions = (questions) => {
+    return questions.filter((question) => question.isApproved == true)
+  }
+
   const [getQuestions, setQuestions] = useState([]);
   const fetchQuestions = () => {
     getAllQuestion(setToast).then((data) => {
-      setLoading(false);
+      setLoading(true);
       data = data.map((item) => {
         return { ...item, tags: item.tags[0] };
       });
-      setQuestions(data);
+      setQuestions(filterApprovedQuestions(data));
     });
   };
 
@@ -144,6 +148,7 @@ function Ques(props) {
   };
 
   useEffect(() => {
+    setLoading(false)
     fetchQuestions();
   }, []);
 
@@ -152,55 +157,59 @@ function Ques(props) {
       className="popup-creator"
       style={{ background: dark ? "#171717" : "white" }}
     >
-      {getQuestions.length <= 0 ? (
-        <Loader />
-      ) : (
-        <div className="question-cards">
-          {getQuestions?.map((item, key) => {
-            let tags = [...Object.values(item.tags)];
-            return (
-              <div className="question-card" key={key}>
-                <div className="card-up">
-                  <p>{item.title}</p>
-                  <p>{item.description}</p>
-                  <div className="tags-container">
-                    {tags.map((i, index) => {
-                      if (i == true)
-                        return (
-                          <span className="tag-space" key={index}>
-                            {i === true ? `#${Tags[index].value}` : ""}
-                          </span>
-                        );
-                    })}
-                  </div>
-                </div>
-                <div className="card-down">
-                  <div>
-                    <p>
-                      Created At {new Date(item.createdAt).toLocaleString()}
-                    </p>
-                  </div>
-                  <div>
-                    <button
-                      className="vote-btn"
-                      onClick={() => handleUpvote(item._id)}
-                    >
-                      👍{item.upvotes}
-                    </button>
-                    <button
-                      className="vote-btn"
-                      onClick={() => handleDownvote(item._id)}
-                    >
-                      👎 {item?.downvotes}
-                    </button>
+      {
+        !loading ?
+          <Loader /> :
+          getQuestions.length == 0 ?
+            <div>
+              <h1 className="py-5 text-center">No Questions Found !</h1>
+            </div>
+            :
+            <div className="question-cards">
+              {getQuestions?.map((item, key) => {
+                let tags = [...Object.values(item.tags)];
+                return (
+                  <div className="question-card" key={key}>
+                    <div className="card-up">
+                      <p>{item.title}</p>
+                      <p>{item.description}</p>
+                      <div className="tags-container">
+                        {tags.map((i, index) => {
+                          if (i == true)
+                            return (
+                              <span className="tag-space" key={index}>
+                                {i === true ? `#${Tags[index].value}` : ""}
+                              </span>
+                            );
+                        })}
+                      </div>
+                    </div>
+                    <div className="card-down">
+                      <div>
+                        <p>
+                          Created At {new Date(item.createdAt).toLocaleString()}
+                        </p>
+                      </div>
+                      <div>
+                        <button
+                          className="vote-btn"
+                          onClick={() => handleUpvote(item._id)}
+                        >
+                          👍{item.upvotes}
+                        </button>
+                        <button
+                          className="vote-btn"
+                          onClick={() => handleDownvote(item._id)}
+                        >
+                          👎 {item?.downvotes}
+                        </button>
+                      </div>
+                    </div>
                   </div>
-                </div>
-              </div>
-            );
-          })}
-        </div>
-      )}
-
+                );
+              })}
+            </div>
+      }
       {toast.toastStatus && (
         <SimpleToast
           open={toast.toastStatus}

From 934ae7f8e71720e47481ec0218f2c52228718290 Mon Sep 17 00:00:00 2001
From: Shivam Gaur <128178418+shivamgaur99@users.noreply.github.com>
Date: Fri, 2 Aug 2024 21:00:39 +0530
Subject: [PATCH 3/4] =?UTF-8?q?=F0=9F=8D=81=20Bug=20Fixed:=20Question=20ta?=
 =?UTF-8?q?gs=20are=20not=20getting=20saved=20correctly.=20(#1101)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 frontend/src/pages/Q&A/Q&A.jsx | 116 ++++++++++++++++-----------------
 1 file changed, 57 insertions(+), 59 deletions(-)

diff --git a/frontend/src/pages/Q&A/Q&A.jsx b/frontend/src/pages/Q&A/Q&A.jsx
index 90ef356f..f3d92d0b 100644
--- a/frontend/src/pages/Q&A/Q&A.jsx
+++ b/frontend/src/pages/Q&A/Q&A.jsx
@@ -59,8 +59,17 @@ function Ques(props) {
     );
 
     setCheckedState(updatedCheckedState);
-    formdata.tags.length = 0;
-    formdata.tags.push(checkedState);
+
+    const selectedTags = updatedCheckedState
+      .map((currentState, index) => {
+        if (currentState === true) {
+          return Tags[index].value;
+        }
+        return null;
+      })
+      .filter((item) => item !== null);
+
+    setFormData({ ...formdata, tags: selectedTags });
   };
 
   const schema = {
@@ -130,9 +139,6 @@ function Ques(props) {
   const fetchQuestions = () => {
     getAllQuestion(setToast).then((data) => {
       setLoading(true);
-      data = data.map((item) => {
-        return { ...item, tags: item.tags[0] };
-      });
       setQuestions(filterApprovedQuestions(data));
     });
   };
@@ -154,61 +160,53 @@ function Ques(props) {
 
   return (
     <div
-      className="popup-creator"
-      style={{ background: dark ? "#171717" : "white" }}
-    >
-      {
-        !loading ?
-          <Loader /> :
-          getQuestions.length == 0 ?
-            <div>
-              <h1 className="py-5 text-center">No Questions Found !</h1>
-            </div>
-            :
-            <div className="question-cards">
-              {getQuestions?.map((item, key) => {
-                let tags = [...Object.values(item.tags)];
-                return (
-                  <div className="question-card" key={key}>
-                    <div className="card-up">
-                      <p>{item.title}</p>
-                      <p>{item.description}</p>
-                      <div className="tags-container">
-                        {tags.map((i, index) => {
-                          if (i == true)
-                            return (
-                              <span className="tag-space" key={index}>
-                                {i === true ? `#${Tags[index].value}` : ""}
-                              </span>
-                            );
-                        })}
-                      </div>
-                    </div>
-                    <div className="card-down">
-                      <div>
-                        <p>
-                          Created At {new Date(item.createdAt).toLocaleString()}
-                        </p>
-                      </div>
-                      <div>
-                        <button
-                          className="vote-btn"
-                          onClick={() => handleUpvote(item._id)}
-                        >
-                          👍{item.upvotes}
-                        </button>
-                        <button
-                          className="vote-btn"
-                          onClick={() => handleDownvote(item._id)}
-                        >
-                          👎 {item?.downvotes}
-                        </button>
-                      </div>
-                    </div>
+    className="popup-creator"
+    style={{ background: dark ? "#171717" : "white" }}
+  >
+    {
+      !loading ?
+        <Loader /> :
+        getQuestions.length == 0 ?
+          <div>
+            <h1 className="py-5 text-center">No Questions Found !</h1>
+          </div>
+          :
+          <div className="question-cards">
+            {getQuestions?.map((item, key) => (
+              <div className="question-card" key={key}>
+                <div className="card-up">
+                  <p>{item.title}</p>
+                  <p>{item.description}</p>
+                  <div className="tags-container">
+                    {item.tags.map((tag, index) => (
+                      <span className="tag-space" key={index}>
+                        #{tag}
+                      </span>
+                    ))}
                   </div>
-                );
-              })}
-            </div>
+                </div>
+                <div className="card-down">
+                  <div>
+                    <p>Created At {new Date(item.createdAt).toLocaleString()}</p>
+                  </div>
+                  <div>
+                    <button
+                      className="vote-btn"
+                      onClick={() => handleUpvote(item._id)}
+                    >
+                      👍{item.upvotes}
+                    </button>
+                    <button
+                      className="vote-btn"
+                      onClick={() => handleDownvote(item._id)}
+                    >
+                      👎 {item?.downvotes}
+                    </button>
+                  </div>
+                </div>
+              </div>
+            ))}
+        </div>
       }
       {toast.toastStatus && (
         <SimpleToast

From 33a9c76f9372857701a656bfff1ee1554ac9966d Mon Sep 17 00:00:00 2001
From: Balaharisankar Lakshmanaperumal
 <114602603+BHS-Harish@users.noreply.github.com>
Date: Sun, 4 Aug 2024 07:11:26 +0530
Subject: [PATCH 4/4] =?UTF-8?q?=E2=9A=99=EF=B8=8F=20UI=20to=20answer=20the?=
 =?UTF-8?q?=20questions=20in=20Q&A=20Section=20Added=20(#1104)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

* Upvote and Downvotes fixed

* Feat: Post answer added in Q&A Section
---
 .../src/pages/Q&A/AnswerModel/AnswerModel.jsx | 92 +++++++++++++++++++
 .../pages/Q&A/AnswerModel/AnswerModel.scss    | 84 +++++++++++++++++
 frontend/src/pages/Q&A/AnswerModel/index.js   |  1 +
 frontend/src/pages/Q&A/Q&A.jsx                | 17 +++-
 frontend/src/pages/Q&A/Ques.scss              | 14 +++
 frontend/src/service/Faq.jsx                  | 23 +++++
 6 files changed, 227 insertions(+), 4 deletions(-)
 create mode 100644 frontend/src/pages/Q&A/AnswerModel/AnswerModel.jsx
 create mode 100644 frontend/src/pages/Q&A/AnswerModel/AnswerModel.scss
 create mode 100644 frontend/src/pages/Q&A/AnswerModel/index.js

diff --git a/frontend/src/pages/Q&A/AnswerModel/AnswerModel.jsx b/frontend/src/pages/Q&A/AnswerModel/AnswerModel.jsx
new file mode 100644
index 00000000..a0f7bfc4
--- /dev/null
+++ b/frontend/src/pages/Q&A/AnswerModel/AnswerModel.jsx
@@ -0,0 +1,92 @@
+import React, { useState } from "react";
+import { Modal, Backdrop, Fade } from '@material-ui/core';
+import { SimpleToast } from '../../../components/util/Toast'
+import {postAnswer} from '../../../service/Faq'
+import style from './AnswerModel.scss'
+
+export function AnswerModel(props) {
+    const [answer, setAnswer] = useState("")
+    const [toast, setToast] = useState({
+        toastStatus: false,
+        toastType: "",
+        toastMessage: "",
+    });
+    const Tags = [
+        { value: "ml" },
+        { value: "open-source" },
+        { value: "deap-learning" },
+        { value: "cp" },
+        { value: "block-chain" },
+        { value: "mern" },
+        { value: "android" },
+        { value: "mean" },
+        { value: "javascript" },
+        { value: "java" },
+        { value: "c++" },
+        { value: "python" },
+    ];
+    function handleSubmit(e) {
+        e.preventDefault()
+        if(answer!=""){
+            let data={question_id:props.data._id,answer,created_on:new Date(),created_by:"Anonymous"}
+            postAnswer(data,setToast)
+            setAnswer("")
+            props.handleClose(false)
+        }else{
+            setToast({toastStatus:true,toastMessage:"Please enter your answer",toastType:"error"})
+        }
+    }
+    return (
+        <div>
+            {toast.toastStatus && (
+                <SimpleToast
+                    open={toast.toastStatus}
+                    message={toast.toastMessage}
+                    handleCloseToast={()=>{setToast({toastMessage:"",toastStatus:false,toastType:""})}}
+                    severity={toast.toastType}
+                />
+            )}
+            <Modal
+                aria-labelledby="transition-modal-title"
+                aria-describedby="transition-modal-description"
+                className="modal"
+                open={props.open}
+                onClose={props.handleClose}
+                closeAfterTransition
+                BackdropComponent={Backdrop}
+                BackdropProps={{
+                    timeout: 500,
+                }}
+            >
+                <Fade in={props.open}>
+                    <div className={"modal-container"}>
+                        <div className="close-icon-container">
+                            <span onClick={() => { 
+                                setAnswer("")
+                                props.handleClose(false)
+                             }}>
+                                <i class="fas fa-times close-icon"></i>
+                            </span>
+                        </div>
+                        <h2 className="ques-title">{props.data?.title}</h2>
+                        <p className="ques-description">{props.data?.description}</p>
+                        <div className="tag-container">
+                            {
+                                props && props.data?.tags?.map((tag, index) => {
+                                    if (tag)
+                                        return (
+                                            <p key={index}>#{Tags[index].value}</p>
+                                        )
+                                })
+                            }
+                        </div>
+                        <form className="answer-form" onSubmit={handleSubmit}>
+                            <input className="answer-field" onChange={(e) => { setAnswer(e.target.value) }} value={answer} type="text" placeholder="Post your answer" />
+                            <button className="post-answer-btn">Post</button>
+                        </form>
+                    </div>
+                </Fade>
+            </Modal>
+        </div>
+    )
+}
diff --git a/frontend/src/pages/Q&A/AnswerModel/AnswerModel.scss b/frontend/src/pages/Q&A/AnswerModel/AnswerModel.scss
new file mode 100644
index 00000000..a087fd0f
--- /dev/null
+++ b/frontend/src/pages/Q&A/AnswerModel/AnswerModel.scss
@@ -0,0 +1,84 @@
+:root{
+    font-family: "Futura LT Book";
+}
+.modal-container {
+    width: 70%;
+    height: auto;
+    background-color: white;
+    outline: none !important;
+    padding: 20px 20px;
+    border-radius: 12px;
+    h2{
+        margin: 0;
+    }
+}
+
+.modal {
+    display: flex;
+    position: fixed;
+    align-items: center;
+    justify-content: center;
+    align-items: center;
+    overflow-y: scroll;
+    outline: none !important;
+}
+.close-icon-container{
+    display: flex;
+    justify-content: end;
+}
+.close-icon{
+    font-size: 24px;
+    padding-right: 20px;
+    cursor: pointer;
+    color:#243e74;
+}
+.ques-title{
+    color:#243e74;
+}
+.ques-description{
+    font-size: 16px;
+    margin: 10px auto;
+}
+.tag-container{
+    width: 100%;
+    display: flex;
+    gap: 8px;
+    flex-wrap: wrap;
+}
+.answer-form{
+    width: 100%;
+    margin: 14px auto;
+    display: flex;
+    justify-content: space-between;
+    gap: 8px;
+}
+.answer-field{
+    width: 85%;
+    padding: 10px 20px;
+    outline: none;
+    border: 1px solid #ccc;
+    border-radius: 8px;
+}
+.post-answer-btn{
+    width: 15%;
+    padding: 10px 20px;
+    background-color: #243e74;
+    border: none;
+    color: #fff;
+    border-radius: 8px;
+    outline: none;
+}
+@media screen and (max-width:768px) {
+    .modal-container{
+        width: 90%;
+    }
+    .close-icon{
+        padding-right: 5px;
+    }
+    .answer-field{
+        width: 70%;
+    }
+    .post-answer-btn{
+        width: 25%;
+    }
+}
\ No newline at end of file
diff --git a/frontend/src/pages/Q&A/AnswerModel/index.js b/frontend/src/pages/Q&A/AnswerModel/index.js
new file mode 100644
index 00000000..6d8342de
--- /dev/null
+++ b/frontend/src/pages/Q&A/AnswerModel/index.js
@@ -0,0 +1 @@
+export * from './AnswerModel'
\ No newline at end of file
diff --git a/frontend/src/pages/Q&A/Q&A.jsx b/frontend/src/pages/Q&A/Q&A.jsx
index f3d92d0b..26698e49 100644
--- a/frontend/src/pages/Q&A/Q&A.jsx
+++ b/frontend/src/pages/Q&A/Q&A.jsx
@@ -12,6 +12,7 @@ import {
   downvote,
 } from "../../service/Faq";
 import { showToast, hideToast } from "../../service/toastService";
+import { AnswerModel } from './AnswerModel/index'
 
 function Ques(props) {
   let dark = props.theme;
@@ -36,6 +37,8 @@ function Ques(props) {
   const [checkedState, setCheckedState] = useState(
     new Array(Tags.length).fill(false)
   );
+  const [open, setOpen] = useState(false)
+  const [currentQuestion, setCurrentQuestion] = useState({})
   const [toast, setToast] = useState({
     toastStatus: false,
     toastType: "",
@@ -160,9 +163,10 @@ function Ques(props) {
 
   return (
     <div
-    className="popup-creator"
-    style={{ background: dark ? "#171717" : "white" }}
-  >
+      className="popup-creator"
+      style={{ background: dark ? "#171717" : "white" }}
+    >
+      <AnswerModel theme={dark} open={open} data={currentQuestion} handleClose={setOpen} />
     {
       !loading ?
         <Loader /> :
@@ -204,8 +208,13 @@ function Ques(props) {
                     </button>
                   </div>
                 </div>
+                <button className="answer-btn" onClick={() => {
+                  setCurrentQuestion(item)
+                  setOpen(true)
+                }}>Answers</button>
               </div>
-            ))}
+            )
+            )};
         </div>
       }
       {toast.toastStatus && (
diff --git a/frontend/src/pages/Q&A/Ques.scss b/frontend/src/pages/Q&A/Ques.scss
index 6b531ff6..cb60ecde 100644
--- a/frontend/src/pages/Q&A/Ques.scss
+++ b/frontend/src/pages/Q&A/Ques.scss
@@ -69,6 +69,7 @@
   display: flex;
   flex-direction: column;
   justify-content: space-between;
+  position: relative;
 }
 
 .card-up {
@@ -137,3 +138,16 @@
   justify-content: center;
   align-items: center;
 }
+.answer-btn{
+  position: absolute;
+  bottom: 12px;
+  right: 12px;
+  padding: 5px 8px;
+  border: none;
+  outline: none !important;
+  background-color: white;
+  font-family: "Futura LT Book";
+  border-radius: 8px;
+  font-weight: 600;
+  font-size: 12px;
+}
\ No newline at end of file
diff --git a/frontend/src/service/Faq.jsx b/frontend/src/service/Faq.jsx
index d3ee876c..981fe9cc 100644
--- a/frontend/src/service/Faq.jsx
+++ b/frontend/src/service/Faq.jsx
@@ -326,3 +326,26 @@ export const downvote = async (questionId, handleToast) => {
     throw new Error("Failed to downvote question");
   }
 };
+
+export const postAnswer = async (data, setToast) => {
+  try {
+    showToast(setToast,"Posting...","info")
+    const url = `${END_POINT}/answers/`;
+    const response = await fetch(url, {
+      method: "POST",
+      headers: {
+        "content-type": "application/json",
+      },
+      body: JSON.stringify(data),
+    });
+    const res = await response.json();
+    if(response.status==200)
+      showToast(setToast, "Thanks for answering, it has been sent to admins for review and will appear here on approval","success");
+    else
+      showToast(setToast, "Failed to Post Answer", "error");
+    return res;
+  } catch (error) {
+    showToast(setToast, "Failed to Post Answer", "error");
+    throw new Error("Failed to post answer");
+  }
+}