Merge pull request #2795 from arc53/ui-scan

UI refinements

frontend/src/agents/workflow/WorkflowBuilder.tsx

@@ -1587,7 +1587,7 @@ function WorkflowBuilderInner() {
                 size="icon-sm"
                 onClick={() => setShowWorkflowSettings(!showWorkflowSettings)}
                 className="text-muted-foreground hover:bg-accent hover:text-foreground size-auto p-1"
-                aria-label="Workflow settings"
+                aria-label="Edit workflow details"
                 title={
                   workflowDescription
                     ? `${workflowName || 'New Workflow'} — ${workflowDescription}`

frontend/src/components/ActionButtons.tsx

@@ -1,4 +1,4 @@
-import { ExternalLink, Plus } from 'lucide-react';
+import { Plus, Share } from 'lucide-react';
 import { useTranslation } from 'react-i18next';
 import { useSelector } from 'react-redux';
 import { ShareConversationModal } from '../modals/ShareConversationModal';
@@ -73,11 +73,7 @@ export default function ActionButtons({
               onClick={() => setShareModalState(true)}
               className="text-muted-foreground hover:text-foreground rounded-full"
             >
-              <ExternalLink
+              <Share className="size-5" strokeWidth={1.75} aria-label="share" />
-                className="size-5"
-                strokeWidth={1.75}
-                aria-label="share"
-              />
             </Button>
             {isShareModalOpen && (
               <ShareConversationModal

frontend/src/components/message-input/AttachFileButton.tsx

@@ -22,7 +22,7 @@ export default function AttachFileButton({ onChange }: AttachFileButtonProps) {
       <img
         src={ClipIcon}
         alt="Attach"
-        className="mr-1 h-3.5 w-3.5 sm:mr-1.5 sm:h-4 sm:w-4"
+        className="mr-1 h-3.5 w-3.5 sm:mr-1.5 sm:h-4 sm:w-4 dark:invert"
       />
       <span className="xs:text-xs dark:text-foreground text-muted-foreground text-xs font-medium sm:text-sm">
         {t('conversation.attachments.attach')}

frontend/src/components/message-input/SourcesTrigger.tsx

@@ -61,7 +61,7 @@ export default function SourcesTrigger({
           <img
             src={SourceIcon}
             alt="Sources"
-            className="mr-1 h-3.5 w-3.5 shrink-0 sm:mr-1.5 sm:h-4"
+            className="mr-1 h-3.5 w-3.5 shrink-0 sm:mr-1.5 sm:h-4 sm:w-4 dark:invert"
           />
           <span className="xs:text-xs dark:text-foreground text-muted-foreground truncate overflow-hidden text-xs font-medium sm:text-sm">
             {selectedDocs && selectedDocs.length > 0

frontend/src/components/message-input/ToolsTrigger.tsx

@@ -62,7 +62,7 @@ export default function ToolsTrigger({
           <img
             src={ToolIcon}
             alt="Tools"
-            className="mr-1 h-3.5 w-3.5 shrink-0 sm:mr-1.5 sm:h-4 sm:w-4"
+            className="mr-1 h-3.5 w-3.5 shrink-0 sm:mr-1.5 sm:h-4 sm:w-4 dark:invert"
           />
           <span className="xs:text-xs dark:text-foreground text-muted-foreground truncate overflow-hidden text-xs font-medium sm:text-sm">
             {t('settings.tools.label')}

frontend/src/conversation/ConversationTile.tsx

@@ -1,4 +1,4 @@
-import { ExternalLink, X } from 'lucide-react';
+import { Share, X } from 'lucide-react';
 import {
   SyntheticEvent,
   useCallback,
@@ -135,7 +135,7 @@ export default function ConversationTile({
 
   const menuOptions: ConversationMenuOption[] = [
     {
-      icon: <ExternalLink className="size-3.5" strokeWidth={1.75} />,
+      icon: <Share className="size-4" strokeWidth={1.75} />,
       label: t('convTile.share'),
       onClick: (event: SyntheticEvent) => {
         event.stopPropagation();
@@ -216,11 +216,13 @@ export default function ConversationTile({
           <div className="dark:text-muted-foreground flex text-white">
             {isEdit ? (
               <div className="flex gap-1">
-                <img
+                <Button
-                  src={CheckMark2}
+                  type="button"
-                  alt="Edit"
+                  variant="ghost"
-                  className="mr-2 h-4 w-4 cursor-pointer text-white hover:opacity-50"
+                  size="icon-sm"
-                  id={`img-${conversation.id}`}
+                  aria-label={t('convTile.save')}
+                  title={t('convTile.save')}
+                  className="mr-2 h-auto w-auto bg-transparent p-0 hover:bg-transparent hover:opacity-50"
                   onClick={(event: SyntheticEvent) => {
                     event.stopPropagation();
                     handleSaveConversation({
@@ -228,12 +230,15 @@ export default function ConversationTile({
                       name: conversationName,
                     });
                   }}
-                />
+                >
+                  <img src={CheckMark2} alt="" className="h-4 w-4" />
+                </Button>
                 <Button
                   type="button"
                   variant="ghost"
                   size="icon-sm"
-                  aria-label="Exit"
+                  aria-label={t('cancel')}
+                  title={t('cancel')}
                   id={`img-${conversation.id}`}
                   className="mt-px mr-4 h-auto w-auto bg-transparent p-0 hover:bg-transparent hover:opacity-50"
                   onClick={(event: SyntheticEvent) => {

frontend/src/locale/de.json

@@ -1063,6 +1063,7 @@
     "share": "Teilen",
     "delete": "Löschen",
     "rename": "Umbenennen",
+    "save": "Speichern",
     "deleteWarning": "Bist du sicher, dass du diese Konversation löschen möchtest?"
   },
   "pagination": {

frontend/src/locale/en.json

@@ -1068,6 +1068,7 @@
     "share": "Share",
     "delete": "Delete",
     "rename": "Rename",
+    "save": "Save",
     "deleteWarning": "Are you sure you want to delete this conversation?"
   },
   "pagination": {

frontend/src/locale/es.json

@@ -1063,6 +1063,7 @@
     "share": "Compartir",
     "delete": "Eliminar",
     "rename": "Renombrar",
+    "save": "Guardar",
     "deleteWarning": "¿Está seguro de que desea eliminar esta conversación?"
   },
   "pagination": {

frontend/src/locale/jp.json

@@ -1063,6 +1063,7 @@
     "share": "共有",
     "delete": "削除",
     "rename": "名前変更",
+    "save": "保存",
     "deleteWarning": "この会話を削除してもよろしいですか？"
   },
   "pagination": {

frontend/src/locale/ru.json

@@ -1063,6 +1063,7 @@
     "share": "Поделиться",
     "delete": "Удалить",
     "rename": "Переименовать",
+    "save": "Сохранить",
     "deleteWarning": "Вы уверены, что хотите удалить этот разговор?"
   },
   "pagination": {

frontend/src/locale/zh-TW.json

@@ -1063,6 +1063,7 @@
     "share": "分享",
     "delete": "刪除",
     "rename": "重新命名",
+    "save": "儲存",
     "deleteWarning": "您確定要刪除這個對話嗎？"
   },
   "pagination": {

frontend/src/locale/zh.json

@@ -1063,6 +1063,7 @@
     "share": "分享",
     "delete": "删除",
     "rename": "重命名",
+    "save": "保存",
     "deleteWarning": "您确定要删除此对话吗？"
   },
   "pagination": {

frontend/src/modals/MoveToFolderModal.tsx

@@ -269,7 +269,7 @@ export default function MoveToFolderModal({
                       <img
                         src={ChevronRight}
                         alt="expand"
-                        className={`h-3 w-3 ${selectedFolderId === folder.id ? 'brightness-0 invert' : ''}`}
+                        className={`h-3 w-3 ${selectedFolderId === folder.id ? 'brightness-0 invert' : 'dark:invert'}`}
                       />
                     </span>
                   )}

frontend/src/settings/Logs.tsx

@@ -402,7 +402,7 @@ function Log({
         <img
           src={ChevronRight}
           alt="Expand log entry"
-          className={`mt-[3px] h-3 w-3 transition duration-300 ${isOpen ? 'rotate-90' : ''}`}
+          className={`mt-[3px] h-3 w-3 transition duration-300 dark:invert ${isOpen ? 'rotate-90' : ''}`}
         />
         <span className="flex flex-row flex-wrap gap-2">
           <h2 className="dark:text-foreground text-xs text-black/60">{`${log.timestamp}`}</h2>

frontend/src/settings/ToolConfig.tsx

@@ -484,7 +484,7 @@ export default function ToolConfig({
                           <img
                             src={ChevronRight}
                             alt="expand"
-                            className={`h-4 w-4 opacity-60 transition-transform duration-200 ${isExpanded ? 'rotate-90' : ''}`}
+                            className={`h-4 w-4 opacity-60 transition-transform duration-200 dark:invert ${isExpanded ? 'rotate-90' : ''}`}
                           />
                           <p className="text-foreground dark:text-foreground font-semibold">
                             {action.name}
@@ -919,7 +919,7 @@ function APIToolConfig({
                   <img
                     src={ChevronRight}
                     alt="expand"
-                    className={`h-4 w-4 opacity-60 transition-transform duration-200 ${isExpanded ? 'rotate-90' : ''}`}
+                    className={`h-4 w-4 opacity-60 transition-transform duration-200 dark:invert ${isExpanded ? 'rotate-90' : ''}`}
                   />
                   <span
                     className={`rounded px-2 py-0.5 text-xs font-medium ${getMethodColorClass(action.method)}`}

frontend/src/settings/components/RetrievalOptions.tsx

@@ -792,7 +792,7 @@ export default function RetrievalOptions({
         <img
           src={ChevronRight}
           alt=""
-          className={`h-3 w-3 transform transition-transform ${
+          className={`h-3 w-3 transform transition-transform dark:invert ${
             expanded ? 'rotate-90' : ''
           }`}
         />

frontend/src/teams/TeamSwitcher.tsx

@@ -3,11 +3,11 @@ import { useTranslation } from 'react-i18next';
 import { useDispatch, useSelector } from 'react-redux';
 import { useNavigate } from 'react-router-dom';
 import {
-  Building2,
   Check,
   ChevronsUpDown,
   Plus,
   Settings as SettingsIcon,
+  User,
   Users,
 } from 'lucide-react';
 
@@ -149,7 +149,7 @@ export default function TeamSwitcher({
             {currentTeam ? (
               <Users className="size-4" strokeWidth={1.75} />
             ) : (
-              <Building2 className="size-4" strokeWidth={1.75} />
+              <User className="size-4" strokeWidth={1.75} />
             )}
           </span>
           <span className="min-w-0 flex-1">
@@ -174,7 +174,7 @@ export default function TeamSwitcher({
         {/* Personal account entry */}
         {currentTeam && (
           <DropdownMenuItem onSelect={() => selectTeam(null)}>
-            <Building2 className="size-4" strokeWidth={1.75} />
+            <User className="size-4" strokeWidth={1.75} />
             <span className="min-w-0 flex-1 truncate">
               {t('teams.switcher.personal')}
             </span>

frontend/src/upload/Upload.tsx

@@ -1086,7 +1086,7 @@ function Upload({
                   <img
                     src={ChevronRight}
                     alt="back"
-                    className="h-3 w-3 rotate-180 transform"
+                    className="h-3 w-3 rotate-180 transform dark:invert"
                   />
                   <span>{t('modals.uploadDoc.back')}</span>
                 </Button>