It is now possible to vote via chat box.

Author: 0xkerem

app/src/App.css

@@ -854,3 +854,19 @@
   padding: 8px;
   border-radius: 5px;
 }
+
+.chat-buttons > button {
+  background-color: transparent;
+  border: none;
+  cursor: pointer;
+  padding: 5px;
+  margin: 2px;
+  font-weight: 600;
+}
+
+.chat-buttons {
+  display: flex;
+  justify-content: center;
+  width: 30%;
+  margin-right: 5px;
+}

app/src/components/Chat.js

@@ -25,9 +25,32 @@ export default function Chat({ botId }) {
     // Copy code to clipboard (implementation required)
     // Alert message (implementation required)
   };
+  
+  const votePositive = () => {
+    sendVote(1);
+  };
+
+  const voteNegative = () => {
+    sendVote(-1);
+  };
+
+  const sendVote = (vote) => {
+    // Determine the chatId for the vote
+    const chatId = messages.length > 0 ? messages[messages.length - 1].chatId : -1;
+
+    // Sending a POST request to vote
+    axios.post(`http://localhost:8080/api/botdata/${botId}/chats/${chatId}/${vote}`)
+      .then(response => {
+        // Handle successful vote response if needed
+        console.log(`Voted ${vote === 1 ? 'positive' : 'negative'}`);
+      })
+      .catch(error => {
+        console.error('Error sending vote:', error);
+      });
+  };
 
   const sendMessage = (e) => {
-    e.preventDefault(); // Prevents the default form submission behavior
+    e.preventDefault();
 
     if (inputText.trim() === '') return;
 
@@ -40,7 +63,6 @@ export default function Chat({ botId }) {
     const chatId = messages.length === 0 ? -1 : messages[messages.length - 1].chatId;
     axios.post(`http://localhost:8080/api/bots/${botId}/chat/${chatId}`, {
         question: inputText,
-        // Include any necessary data for the message
       })
       .then(response => {
         let newAssistantMessage = response.data.answer.content;
@@ -62,12 +84,22 @@ export default function Chat({ botId }) {
       });
   };
 
-
   return (
     <div className='message-body'>
         <div className="chat-header">
           <span style={{ margin: '15px' }}>{botName}</span>
-          <button style={{ margin: '15px' }} onClick={generateCode}>{'</>'}</button>
+          <div className='chat-buttons'>
+            <button style={{ color: 'white' }} onClick={generateCode}>{'</>'}</button>
+            <button onClick={votePositive}>
+              <span style={{ color: 'white', display: 'flex', alignItems: 'center' }}
+                className="material-symbols-outlined">thumb_up</span>
+            </button>
+            <button onClick={voteNegative}>
+              <span style={{ color: 'white', display: 'flex', alignItems: 'center' }} 
+                className="material-symbols-outlined">thumb_down
+              </span>
+            </button>
+          </div>
         </div>
         <div className='chat-main'>
           <div className="chat-messages">
@@ -92,7 +124,7 @@ export default function Chat({ botId }) {
               onChange={(e) => setInputText(e.target.value)}
             />
             <button className="message-send-btn" type="submit">
-              <span style={{ color: 'white', display: 'flex', alignItems: 'center' }} class="material-symbols-outlined">send</span>
+              <span style={{ color: 'white', display: 'flex', alignItems: 'center' }} className="material-symbols-outlined">send</span>
             </button>
           </form>
         </div>

app/src/components/ChatDetailBox.js

@@ -43,11 +43,11 @@ export default function ChatDetailBox({ chatBotId, onChatClick }) {
           <div className='cdb-2'>{chat.date}</div>
           <div className='cdb-3' 
           style={{
-            color: chat.vote === "\"1\"" ? 'green' : chat.vote ===  "\"-1\"" ? 'red' : 'inherit'
+            color: chat.vote === "1" ? 'green' : chat.vote ===  "-1" ? 'tomato' : 'inherit'
           }}
-          >{chat.vote === "\"1\"" ? <span className="material-symbols-outlined">
+          >{chat.vote === "1" ? <span className="material-symbols-outlined">
           sentiment_satisfied
-          </span> : chat.vote === "\"-1\"" ? <span className="material-symbols-outlined">
+          </span> : chat.vote === "-1" ? <span className="material-symbols-outlined">
           sentiment_dissatisfied
           </span> : ''}
           </div>

app/src/components/Dashboard.js

@@ -162,11 +162,11 @@ export default function Dashboard({ userData }) {
                   <div className='db-ch-chatid'>#{chatID}</div>
                   <div className='db-ch-chatvote'
                   style={{
-                    color: chatVote === "\"1\"" ? 'green' : chatVote ===  "\"-1\"" ? 'red' : 'inherit'
+                    color: chatVote === "1" ? 'green' : chatVote ===  "-1" ? 'tomato' : 'inherit'
                   }}
                   >{
-                    chatVote === "\"1\"" ? <span class="material-symbols-outlined">sentiment_satisfied</span>
-                      : chatVote === "\"-1\"" ? <span class="material-symbols-outlined">sentiment_dissatisfied</span> : ''}</div>
+                    chatVote === "1" ? <span class="material-symbols-outlined">sentiment_satisfied</span>
+                      : chatVote === "-1" ? <span class="material-symbols-outlined">sentiment_dissatisfied</span> : ''}</div>
                 </div>
               </center>
               <center>

server/src/main/java/com/semantiq/server/controller/BotDataController.java

@@ -1,7 +1,5 @@
 package com.semantiq.server.controller;
 
-import com.fasterxml.jackson.databind.node.JsonNodeFactory;
-import com.fasterxml.jackson.databind.node.ObjectNode;
 import com.semantiq.server.DTO.VoteDto;
 import com.semantiq.server.entity.BotData;
 import com.semantiq.server.entity.ChatBot;
@@ -14,8 +12,6 @@
 import org.springframework.web.bind.annotation.*;
 
 import java.security.InvalidParameterException;
-import java.time.LocalDate;
-import java.util.ArrayList;
 import java.util.List;
 import java.util.Map;
 
@@ -33,8 +29,8 @@ public BotDataController(BotDataService botDataService, ChatBotService chatBotSe
         this.chatService = chatService;
     }
 
-    @PostMapping("/voteBot/{chatBotId}/{vote}")
-    public ResponseEntity<?> voteBot(@PathVariable int chatBotId, @PathVariable String vote, @PathVariable int chatId){
+    @PostMapping("/{chatBotId}/chats/{chatId}/{vote}")
+    public ResponseEntity<?> voteBot(@PathVariable int chatBotId, @PathVariable int vote, @PathVariable int chatId){
         ChatBot chatBot = chatBotService.findChatBotById(chatBotId);
         if (chatBot == null) {
             return new ResponseEntity<>("ChatBot not found", HttpStatus.NOT_FOUND);

server/src/main/java/com/semantiq/server/service/BotDataService.java

@@ -24,13 +24,13 @@ public void saveBotData(BotData botData) {
         botDataRepo.save(botData);
     }
 
-    public void voteBot(BotData botData, String vote){
+    public void voteBot(BotData botData, int vote){
         int newCount;
-        if(vote == "1"){
+        if(vote == 1){
             newCount = botData.getCountPos() + 1;
             botData.setCountPos(newCount);
         }
-        else if (vote == "-1"){
+        else if (vote == -1){
             newCount = botData.getCountNeg() + 1;
             botData.setCountNeg(newCount);
         }

server/src/main/java/com/semantiq/server/service/ChatService.java

@@ -26,10 +26,9 @@ public List<Chat> findAllChatsForBot(int botId) {
         return chatRepo.findAllByBotId(botId);
     }
 
-    public void setVote(int chatId, String vote) {
+    public void setVote(int chatId, int vote) {
         Chat chat = findChatById(chatId);
-        if (vote.equals("1")) chat.setVote("1");
-        else if (vote.equals("-1")) chat.setVote("-1");
+        chat.setVote(String.valueOf(vote)); // Convert int to String
 
         chatRepo.save(chat);
     }