diff --git a/app/components/ConversationFrontend.tsx b/app/components/ConversationFrontend.tsx
index 5a5632f..e6b2684 100644
--- a/app/components/ConversationFrontend.tsx
+++ b/app/components/ConversationFrontend.tsx
@@ -16,23 +16,23 @@ interface ConversationProps {
 const ConversationFrontend = React.forwardRef<HTMLDivElement, ConversationProps>(
   ({ messages, onResendClick, onEditClick, onCopyClick, isClicked }, ref: ForwardedRef<HTMLDivElement>) => {
 
-    const messagesEndRef = useRef<HTMLDivElement | null>(null)
+    const messagesEndRef = useRef<HTMLDivElement|null>(null)
 
-    useEffect(() => {
+    useEffect(() => { 
       messagesEndRef.current?.scrollIntoView()
-    }, [messages])
+    },[messages])
 
     return (
       <div className="output" ref={ref}>
         <div className="conversation resize" id="conversation">
           {messages.map((message, index) => {
-            if (index >= 1) {
+            if (index >= 1){
 
               return (
                 <div
                   key={index}
                   className={message.role === "user" ? 'user-message' : 'ai-message'}
-                >
+                  >
                   <p> {message.content}</p>
                 </div>
               );
@@ -49,10 +49,10 @@ const ConversationFrontend = React.forwardRef<HTMLDivElement, ConversationProps>
             <button type="button" onClick={onCopyClick}>
               <img src="/img/copy.svg" alt="copy" />
             </button>
-            <p id="copiedText" style={{ opacity: isClicked ? "1" : "0", transition: "all 0.3s ease-in-out" }}>Copied!</p>
+            <p id="copiedText" style={{opacity:isClicked?"1":"0", transition:"all 0.3s ease-in-out"}}>Copied!</p>
           </div>
-          <div ref={messagesEndRef} />
         </div>
+          <div ref={messagesEndRef} />
       </div>
     );
   }