diff --git a/api/app/chatgpt-custom.js b/api/app/chatgpt-custom.js
index a356ba4b1a..9eabb80ccd 100644
--- a/api/app/chatgpt-custom.js
+++ b/api/app/chatgpt-custom.js
@@ -17,7 +17,7 @@ const customClient = async ({ text, progressCallback, convo, promptPrefix, chatG
 
   clientOptions.chatGptLabel = chatGptLabel;
 
-  if (promptPrefix.length > 0) {
+  if (promptPrefix?.length > 0) {
     clientOptions.promptPrefix = promptPrefix;
   }
 
diff --git a/client/src/components/Messages/HoverButtons.jsx b/client/src/components/Messages/HoverButtons.jsx
index b88c69470d..860023ed2f 100644
--- a/client/src/components/Messages/HoverButtons.jsx
+++ b/client/src/components/Messages/HoverButtons.jsx
@@ -4,16 +4,16 @@ import EditIcon from '../svg/EditIcon';
 
 export default function HoverButtons({ user }) {
   return (
-
-      <div className="visible mt-2 flex justify-center gap-3 self-end text-gray-400 md:gap-4 lg:absolute lg:top-0 lg:right-0 lg:mt-0 lg:translate-x-full lg:gap-1 lg:self-center lg:pl-2">
-        {user && (
-          <button className="rounded-md p-1 hover:bg-gray-100 hover:text-gray-700 dark:text-gray-400 dark:hover:bg-gray-700 dark:hover:text-gray-200 disabled:dark:hover:text-gray-400">
-            <EditIcon />
-          </button>
-        )}
-        {/* <button className="rounded-md p-1 hover:bg-gray-100 hover:text-gray-700 dark:text-gray-400 dark:hover:bg-gray-700 dark:hover:text-gray-200 disabled:dark:hover:text-gray-400">
+    <div className="visible mt-2 flex justify-center gap-3 self-end text-gray-400 md:gap-4 lg:absolute lg:top-0 lg:right-0 lg:mt-0 lg:translate-x-full lg:gap-1 lg:self-center lg:pl-2">
+      {user && (
+        <button className="rounded-md p-1 hover:bg-gray-100 hover:text-gray-700 dark:text-gray-400 dark:hover:bg-gray-700 dark:hover:text-gray-200 disabled:dark:hover:text-gray-400 md:invisible md:group-hover:visible">
+          {/* <button className="rounded-md p-1 hover:bg-gray-100 hover:text-gray-700 dark:text-gray-400 dark:hover:bg-gray-700 dark:hover:text-gray-200 disabled:dark:hover:text-gray-400"> */}
+          <EditIcon />
+        </button>
+      )}
+      {/* <button className="rounded-md p-1 hover:bg-gray-100 hover:text-gray-700 dark:text-gray-400 dark:hover:bg-gray-700 dark:hover:text-gray-200 disabled:dark:hover:text-gray-400">
           <Clipboard />
         </button> */}
-      </div>
+    </div>
   );
-}
\ No newline at end of file
+}
diff --git a/client/src/components/Messages/Message.jsx b/client/src/components/Messages/Message.jsx
index 9413f21856..ecb929b902 100644
--- a/client/src/components/Messages/Message.jsx
+++ b/client/src/components/Messages/Message.jsx
@@ -14,7 +14,6 @@ export default function Message({
 }) {
   const { isSubmitting } = useSelector((state) => state.submit);
   const [abortScroll, setAbort] = useState(false);
-  const [isHovering, setIsHovering] = useState(false);
   const notUser = sender.toLowerCase() !== 'user';
   const blinker = isSubmitting && last && notUser;
 
@@ -32,14 +31,6 @@ export default function Message({
     }
   };
 
-  const handleMouseOver = () => {
-    setIsHovering(true);
-  };
-
-  const handleMouseOut = () => {
-    setIsHovering(false);
-  };
-
   const props = {
     className:
       'w-full border-b border-black/10 dark:border-gray-900/50 text-gray-800 bg-white dark:text-gray-100 group dark:bg-gray-800'
@@ -49,7 +40,7 @@ export default function Message({
     chatgpt: 'rgb(16, 163, 127)',
     chatgptBrowser: 'rgb(25, 207, 207)',
     bingai: '',
-    sydney: '',
+    sydney: ''
   };
 
   const isBing = sender === 'bingai' || sender === 'sydney';
@@ -65,7 +56,11 @@ export default function Message({
   if ((notUser && backgroundColor) || isBing) {
     icon = (
       <div
-        style={isBing ? { background: 'radial-gradient(circle at 90% 110%, #F0F0FA, #D0E0F9)' } : { backgroundColor }}
+        style={
+          isBing
+            ? { background: 'radial-gradient(circle at 90% 110%, #F0F0FA, #D0E0F9)' }
+            : { backgroundColor }
+        }
         className="relative flex h-[30px] w-[30px] items-center justify-center rounded-sm p-1 text-white"
       >
         {isBing ? <BingIcon /> : <GPTIcon />}
@@ -84,12 +79,14 @@ export default function Message({
     <div
       {...props}
       onWheel={handleWheel}
-      onMouseOver={handleMouseOver}
-      onMouseOut={handleMouseOut}
     >
       <div className="m-auto flex gap-4 p-4 text-base md:max-w-2xl md:gap-6 md:py-6 lg:max-w-2xl lg:px-0 xl:max-w-3xl">
-        <strong className="relative flex w-[30px] flex-col items-end text-right">
-          {icon}
+        <strong className="relative flex w-[30px] flex-col items-end text-right text-xs md:text-sm">
+          {typeof icon === 'string' && icon.match(/[^\u0000-\u007F]+/) ? (
+            <span className=" direction-rtl w-40 overflow-x-scroll">{icon}</span>
+          ) : (
+            icon
+          )}
         </strong>
         <div className="relative flex w-[calc(100%-50px)] flex-col gap-1 whitespace-pre-wrap md:gap-3 lg:w-[calc(100%-115px)]">
           <div className="flex flex-grow flex-col gap-3">
@@ -109,9 +106,7 @@ export default function Message({
               </div>
             )}
           </div>
-          <div className="flex justify-between">
-            {isHovering && <HoverButtons user={!notUser} />}
-          </div>
+            <HoverButtons user={!notUser} />
         </div>
       </div>
     </div>
diff --git a/client/src/mobile.css b/client/src/mobile.css
index e633ecaea3..78fff342c5 100644
--- a/client/src/mobile.css
+++ b/client/src/mobile.css
@@ -36,7 +36,7 @@
         left: calc(-100%);;
         top: 0;
         bottom: 0;
-        max-width: 400px;
+        max-width: 320px;
         width: calc(100% - 60px);
         opacity: 0;
     }