diff --git a/frontend/src/conversation/Conversation.tsx b/frontend/src/conversation/Conversation.tsx index e1888e25..f4511fc3 100644 --- a/frontend/src/conversation/Conversation.tsx +++ b/frontend/src/conversation/Conversation.tsx @@ -387,7 +387,7 @@ export default function Conversation() { className="flex w-full items-center rounded-[40px] border border-silver bg-white dark:bg-raisin-black" > - {t('modals.uploadDoc.upload')} + {t('modals.uploadDoc.label')} @@ -398,7 +398,7 @@ export default function Conversation() { ref={inputRef} tabIndex={1} placeholder={t('inputPlaceholder')} - className={`inputbox-style w-full overflow-y-auto overflow-x-hidden whitespace-pre-wrap rounded-full bg-transparent py-5 text-base leading-tight opacity-100 focus:outline-none dark:bg-transparent dark:text-bright-gray`} + className={`inputbox-style w-full overflow-y-auto overflow-x-hidden whitespace-pre-wrap rounded-full bg-transparent py-5 text-base leading-tight opacity-100 focus:outline-none dark:bg-transparent dark:text-bright-gray dark:placeholder-bright-gray dark:placeholder-opacity-50`} onInput={handleInput} onKeyDown={(e) => { if (e.key === 'Enter' && !e.shiftKey) { diff --git a/frontend/src/locale/en.json b/frontend/src/locale/en.json index 9f9cbb21..79fa1097 100644 --- a/frontend/src/locale/en.json +++ b/frontend/src/locale/en.json @@ -70,7 +70,8 @@ "daily": "Daily", "weekly": "Weekly", "monthly": "Monthly" - } + }, + "actions": "Actions" }, "apiKeys": { "label": "Chatbots", @@ -91,7 +92,14 @@ "apiGeneratedConversations": "API generated / chatbot conversations" }, "tools": { - "label": "Tools" + "label": "Tools", + "searchPlaceholder": "Search tools...", + "addTool": "Add Tool", + "noToolsFound": "No tools found", + "settingsIconAlt": "Settings icon", + "configureToolAria": "Configure {toolName}", + "toggleToolAria": "Toggle {toolName}", + "selectToolSetup": "Select a tool to set up" } }, "modals": { diff --git a/frontend/src/settings/Documents.tsx b/frontend/src/settings/Documents.tsx index 71ba63f6..cdde16fe 100644 --- a/frontend/src/settings/Documents.tsx +++ b/frontend/src/settings/Documents.tsx @@ -151,6 +151,9 @@ const Documents: React.FC = ({ + + {t('settings.documents.searchPlaceholder')} + = ({ onChange={(e) => { setSearchTerm(e.target.value); setCurrentPage(1); - // refreshDocs(sortField, 1, rowsPerPage); - // do not call refreshDocs here the state is async - // so it will not have the updated value - }} // Handle search input change + }} /> = ({ - {' '} + {t('settings.documents.actions')} diff --git a/frontend/src/settings/Logs.tsx b/frontend/src/settings/Logs.tsx index 0f452e97..f1ebfe72 100644 --- a/frontend/src/settings/Logs.tsx +++ b/frontend/src/settings/Logs.tsx @@ -67,9 +67,12 @@ export default function Logs() { - + {t('settings.logs.filterByChatbot')} - + {loadingChatbots ? ( ) : ( diff --git a/frontend/src/settings/Tools.tsx b/frontend/src/settings/Tools.tsx index f58487a3..3dc31e35 100644 --- a/frontend/src/settings/Tools.tsx +++ b/frontend/src/settings/Tools.tsx @@ -1,4 +1,5 @@ import React from 'react'; +import { useTranslation } from 'react-i18next'; import userService from '../api/services/userService'; import CogwheelIcon from '../assets/cogwheel.svg'; @@ -18,6 +19,7 @@ export default function Tools() { React.useState('INACTIVE'); const [userTools, setUserTools] = React.useState([]); const [selectedTool, setSelectedTool] = React.useState(null); + const { t } = useTranslation(); const getUserTools = () => { userService @@ -70,12 +72,15 @@ export default function Tools() { + + {t('settings.tools.searchPlaceholder')} + setSearchTerm(e.target.value)} /> @@ -86,7 +91,7 @@ export default function Tools() { setAddToolModalState('ACTIVE'); }} > - Add Tool + {t('settings.tools.addTool')} @@ -98,10 +103,10 @@ export default function Tools() { - No tools found + {t('settings.tools.noToolsFound')} ) : ( userTools @@ -119,15 +124,19 @@ export default function Tools() { handleSettingsClick(tool)} + aria-label={t('settings.tools.configureToolAria', { + toolName: tool.displayName, + })} > @@ -146,6 +155,11 @@ export default function Tools() { htmlFor={`toolToggle-${index}`} className="relative inline-block h-6 w-10 cursor-pointer rounded-full bg-gray-300 dark:bg-[#D2D5DA33]/20 transition [-webkit-tap-highlight-color:_transparent] has-[:checked]:bg-[#0C9D35CC] has-[:checked]:dark:bg-[#0C9D35CC]" > + + {t('settings.tools.toggleToolAria', { + toolName: tool.displayName, + })} +
+ {t('settings.logs.filterByChatbot')} -