Digital human video added

Backend/Node/output.txt

-Abstraction is a very important feature of OOPs that allows displaying only the important information and hiding the implementation details. For example, while riding a bike, you know that if you raise the accelerator, the speed will increase, but you don’t know how it actually happens. This is abstraction as the implementation details are hidden from the rider.
\ No newline at end of file
+I didn't get that. Can you say it again?
\ No newline at end of file

frontend/src/digitalHuman/digitalHuman.js

@@ -9,7 +9,6 @@ import Card from "./sections/cardChat";
 import './styles/digitalHuman.css';
 import { FaMicrophone } from "react-icons/fa";
 import { IoSend } from "react-icons/io5";
-import image from "./images/avatar.png";
 
 const SpeechRecognition =
     window.SpeechRecognition || window.webkitSpeechRecognition
@@ -188,32 +187,34 @@ function DigitalHuman() {
     return (
         <div className='digitalHuamn'>
             <div className='avatar'>
-                <img src={image} width='100%'/>
+                <video height='520px' autoPlay>
+                    <source src='/video/result_voice.mp4' type="video/mp4" />
+                </video>
             </div>
             <div className='avatar'>
-            <div className='chat' style={{
-            height: `465px`,
-            overflow: "scroll",
-            
-          }}>
-                <div className='chat_body'>
-                    {renderMessage(messagesFromRedux)}
+                <div className='chat' style={{
+                    height: `465px`,
+                    overflow: "scroll",
+
+                }}>
+                    <div className='chat_body'>
+                        {renderMessage(messagesFromRedux)}
+                    </div>
+                    <div className='chat_footer'>
+                        <button className={cls} onClick={() => { setCls((cls) => (cls === "red" ? "green" : "red")); setIsListening(prevState => !prevState); }}>
+                            <FaMicrophone style={{ color: 'black' }} />
+                        </button>
+                        <input
+                            placeholder="Send a message..."
+                            onKeyPress={keyPressHanlder}
+                            type="text"
+                            value={note}
+                        />
+                        <button className='send' style={{ backgroundColor: 'transparent' }} onClick={onClicksHanlder} disabled={!note}>
+                            <IoSend style={{ color: '#F05454', width: '40px', fontSize: '2em' }} />
+                        </button>
+                    </div>
                 </div>
-                <div className='chat_footer'>
-                    <button className={cls} onClick={() => { setCls((cls) => (cls === "red" ? "green" : "red")); setIsListening(prevState => !prevState); }}>
-                        <FaMicrophone style={{ color: 'black' }} />
-                    </button>
-                    <input
-                        placeholder="Send a message..."
-                        onKeyPress={keyPressHanlder}
-                        type="text"
-                        value={note}
-                    />
-                    <button className='send' style={{ backgroundColor: 'transparent' }} onClick={onClicksHanlder} disabled={!note}>
-                        <IoSend style={{ color: '#F05454', width: '40px', fontSize: '2em' }} />
-                    </button>
-                </div>
-            </div>
             </div>
         </div>
     )