front-fix-small-bugs (#15)

Co-authored-by: polina.t <polina.t@ati.su>

Author: SoullessCaat

frontend/src/components/Autosuggest/Autosuggest.css

@@ -1,7 +1,3 @@
-.dropdown {
-  flex-grow: 1;
-}
-
 .dropdown-content.menu .user-option {
   display: flex;
   flex-direction: row;
@@ -18,7 +14,6 @@ ul.users-list {
   width: max-content;
 }
 
-.clear-button.btn :active:not(.btn-active) {
+.clear-button.btn:active:not(.btn-active) {
   transform: none;
-  translate: none;
 }

frontend/src/components/Autosuggest/Autosuggest.tsx

@@ -88,7 +88,7 @@ const Autosuggest = ({ externalString, onSelect, autocompleteFn }: Props) => {
       />
       {searchString && (
         <button
-          className="clear-button btn btn-square btn-ghost bg-transparent hover:bg-transparent absolute right-1 top-1/2 transform -translate-y-1/2 shadow-none border-none"
+          className="clear-button btn btn-square btn-ghost bg-transparent hover:bg-transparent absolute right-2 top-1 shadow-none border-none h-6 w-6"
           onClick={clearInput}
           aria-label="Очистить"
         >
@@ -98,18 +98,16 @@ const Autosuggest = ({ externalString, onSelect, autocompleteFn }: Props) => {
       {!!filteredItems?.length && (
         <ul
           tabIndex={0}
-          className="users-list dropdown-content z-[2] menu p-2 shadow bg-base-200 rounded-box w-52 flex-nowrap overflow-auto"
+          className="users-list dropdown-content z-[2] menu p-2 shadow bg-base-200 rounded-box w-52 flex-nowrap overflow-auto absolute left-1/2 -translate-x-1/2"
         >
-          {filteredItems.map((user) => {
-            return (
-              <li key={user.id} className="user-option">
-                <Avatar width={2} />
-                <a onClick={(event) => handleItemClick(event, user)}>
-                  {user.display}
-                </a>
-              </li>
-            );
-          })}
+          {filteredItems.map((user) => (
+            <li key={user.id} className="user-option">
+              <Avatar width={2} />
+              <a onClick={(event) => handleItemClick(event, user)}>
+                {user.display}
+              </a>
+            </li>
+          ))}
         </ul>
       )}
     </div>

frontend/src/components/Layout/Layout.css

@@ -2,3 +2,9 @@ main {
   max-width: 1440px;
   margin: 20px auto 60px;
 }
+
+@media (max-width: 1460px) {
+  main { 
+    margin: 20px 10px 60px;
+  }
+}

frontend/src/pages/Report/components/Bug/components/Chat/Chat.tsx

@@ -46,6 +46,28 @@ export const Chat = ({ reportId, bugId }: BugChatProps) => {
     }
   }, [newCommentText]);
 
+  const parseMessage = (text: string) => {
+    const urlRegex = /(https?:\/\/[^\s]+|www\.[^\s]+)/g;
+  
+    return text.split(urlRegex).map((part, index) => {
+      if (part.match(urlRegex)) {
+        const href = part.startsWith("http") ? part : `https://${part}`;
+        return (
+          <a 
+            key={index} 
+            href={href} 
+            target="_blank" 
+            rel="noopener noreferrer"
+            className="text-blue-500 underline"
+          >
+            {part}
+          </a>
+        );
+      }
+      return part; // Оставляем обычный текст
+    });
+  };
+
   return (
     <div className="flex flex-col w-full h-full">
       <div className="flex-1 overflow-auto mb-4 space-y-2">
@@ -55,7 +77,7 @@ export const Chat = ({ reportId, bugId }: BugChatProps) => {
             className="border bg-base-100 border-gray-300 p-2 rounded flex flex-col"
           >
             <div className="font-semibold text-sm">{comment.creator?.name}</div>
-            <div className="text-sm whitespace-pre-wrap">{comment.text}</div>
+            <div className="text-sm whitespace-pre-wrap">{parseMessage(comment.text)}</div>
           </div>
         ))}
       </div>