diff --git a/frontend/src/pages/Q&A/AnswerModel/AnswerModel.jsx b/frontend/src/pages/Q&A/AnswerModel/AnswerModel.jsx index f7d087e4..e8ba4d77 100644 --- a/frontend/src/pages/Q&A/AnswerModel/AnswerModel.jsx +++ b/frontend/src/pages/Q&A/AnswerModel/AnswerModel.jsx @@ -9,6 +9,7 @@ export function AnswerModel(props) { const [answer, setAnswer] = useState("") const [author, setAuthor] = useState("") const [answers, setAnswers] = useState([]) + const[maxUpvote,setMaxUpvote]=useState(0) const [toast, setToast] = useState({ toastStatus: false, toastType: "", @@ -19,6 +20,7 @@ export function AnswerModel(props) { } async function fetchAnswers() { const data = await getAnswers(props.data._id, setToast) + setMaxUpvote(data.map(function(o) { return o.upvotes; }).sort().reverse()[0]) setAnswers(filterAnswers(data)) } useEffect(() => { @@ -28,7 +30,7 @@ export function AnswerModel(props) { function timeStampFormatter(time) { const months = ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"] const messageTime = new Date(time) - return `${String(messageTime.getDate())} ${String(months[messageTime.getMonth()])} ${String(messageTime.getFullYear())} ${String(messageTime.getHours() % 12 || 12).padStart(2, '0')}:${String(messageTime.getMinutes()).padStart(2, '0')} ${messageTime.getHours() >= 12 ? 'pm' : 'am'}` + return `${String(messageTime.getDate())} ${String(months[messageTime.getMonth()])} ${String(messageTime.getFullYear())}` } const Tags = [ { value: "ml" }, @@ -126,6 +128,7 @@ export function AnswerModel(props) {
{ans.created_by || "Anonymous"}

{timeStampFormatter(ans.created_on)}

+ {(maxUpvote!=0&&maxUpvote==ans.upvotes)&&

Most relevant

}

{ans.answer}

diff --git a/frontend/src/pages/Q&A/AnswerModel/AnswerModel.scss b/frontend/src/pages/Q&A/AnswerModel/AnswerModel.scss index 0f486d26..a1f28c1a 100644 --- a/frontend/src/pages/Q&A/AnswerModel/AnswerModel.scss +++ b/frontend/src/pages/Q&A/AnswerModel/AnswerModel.scss @@ -123,7 +123,14 @@ margin: 5px; cursor: pointer; } - +.most-relevant-label{ + width: fit-content; + background-color: #243e74; + font-size: 12px !important; + color: white; + padding: 3px 8px; + border-radius: 8px; +} @media screen and (max-width:768px) { .modal-container {