feat: Add More Translation Text & Minor UI Fixes (#861)

* config token translation

* more translation and fix

* fix conflict

* fix(DialogTemplate) bug with the spec.tsx, localize hooks need to be in a recoil root

* small clean up

* fix(NewTopic) in endpoint

* fix(RecoilRoot)

* test(DialogTemplate.spec) used data-testid

* fix(DialogTemplate)

* some cleanup

---------

Co-authored-by: Danny Avila <110412045+danny-avila@users.noreply.github.com>

client/src/components/Endpoints/EditPresetDialog.tsx

@@ -59,7 +59,9 @@ const EditPresetDialog = ({ open, onOpenChange, preset: _preset, title }: TEditP
   return (
     <Dialog open={open} onOpenChange={onOpenChange}>
       <DialogTemplate
-        title={`${title || localize('com_endpoint_edit_preset')} - ${preset?.title}`}
+        title={`${title || localize('com_ui_edit') + ' ' + localize('com_endpoint_preset')} - ${
+          preset?.title
+        }`}
         className="h-full max-w-full overflow-y-auto pb-4 sm:w-[680px] sm:pb-0 md:h-[720px] md:w-[750px] md:overflow-y-hidden lg:w-[950px] xl:h-[720px]"
         main={
           <div className="flex w-full flex-col items-center gap-2 md:h-[530px]">

client/src/components/Endpoints/SaveAsPresetDialog.tsx

@@ -58,7 +58,7 @@ const SaveAsPresetDialog = ({ open, onOpenChange, preset }: TEditPresetProps) =>
         selection={{
           selectHandler: submitPreset,
           selectClasses: 'bg-green-600 hover:bg-green-700 dark:hover:bg-green-800 text-white',
-          selectText: 'Save',
+          selectText: localize('com_ui_save'),
         }}
       />
     </Dialog>

client/src/components/Endpoints/Settings/Anthropic.tsx

@@ -12,8 +12,10 @@ import {
 } from '~/components/ui';
 import OptionHover from './OptionHover';
 import { cn, defaultTextProps, optionText, removeFocusOutlines } from '~/utils/';
+import { useLocalize } from '~/hooks';
 
 export default function Settings({ conversation, setOption, models, readonly }: TModelSelectProps) {
+  const localize = useLocalize();
   if (!conversation) {
     return null;
   }
@@ -43,14 +45,15 @@ export default function Settings({ conversation, setOption, models, readonly }:
         </div>
         <div className="grid w-full items-center gap-2">
           <Label htmlFor="modelLabel" className="text-left text-sm font-medium">
-            Custom Name <small className="opacity-40">(default: blank)</small>
+            {localize('com_endpoint_custom_name')}{' '}
+            <small className="opacity-40">({localize('com_endpoint_default_blank')})</small>
           </Label>
           <Input
             id="modelLabel"
             disabled={readonly}
             value={modelLabel || ''}
             onChange={(e) => setModelLabel(e.target.value ?? null)}
-            placeholder="Set a custom name for Claude"
+            placeholder={localize('com_endpoint_anthropic_custom_name_placeholder')}
             className={cn(
               defaultTextProps,
               'flex h-10 max-h-10 w-full resize-none px-3 py-2',
@@ -60,14 +63,15 @@ export default function Settings({ conversation, setOption, models, readonly }:
         </div>
         <div className="grid w-full items-center gap-2">
           <Label htmlFor="promptPrefix" className="text-left text-sm font-medium">
-            Prompt Prefix <small className="opacity-40">(default: blank)</small>
+            {localize('com_endpoint_prompt_prefix')}{' '}
+            <small className="opacity-40">({localize('com_endpoint_default_blank')})</small>
           </Label>
           <TextareaAutosize
             id="promptPrefix"
             disabled={readonly}
             value={promptPrefix || ''}
             onChange={(e) => setPromptPrefix(e.target.value ?? null)}
-            placeholder="Set custom instructions or context. Ignored if empty."
+            placeholder={localize('com_endpoint_prompt_prefix_placeholder')}
             className={cn(
               defaultTextProps,
               'flex max-h-[300px] min-h-[100px] w-full resize-none px-3 py-2 ',
@@ -80,7 +84,8 @@ export default function Settings({ conversation, setOption, models, readonly }:
           <HoverCardTrigger className="grid w-full items-center gap-2">
             <div className="flex justify-between">
               <Label htmlFor="temp-int" className="text-left text-sm font-medium">
-                Temperature <small className="opacity-40">(default: 1)</small>
+                {localize('com_endpoint_temperature')}{' '}
+                <small className="opacity-40">({localize('com_endpoint_default')}: 0.2)</small>
               </Label>
               <InputNumber
                 id="temp-int"
@@ -116,9 +121,10 @@ export default function Settings({ conversation, setOption, models, readonly }:
         <HoverCard openDelay={300}>
           <HoverCardTrigger className="grid w-full items-center gap-2">
             <div className="flex justify-between">
-              <Label htmlFor="top-p-int" className="text-left text-sm font-medium">
+              {localize('com_endpoint_top_p')}{' '}
-                Top P <small className="opacity-40">(default: 0.7)</small>
+              <small className="opacity-40">
-              </Label>
+                ({localize('com_endpoint_default_with_num', '0.7')})
+              </small>
               <InputNumber
                 id="top-p-int"
                 disabled={readonly}
@@ -155,7 +161,10 @@ export default function Settings({ conversation, setOption, models, readonly }:
           <HoverCardTrigger className="grid w-full items-center gap-2">
             <div className="flex justify-between">
               <Label htmlFor="top-k-int" className="text-left text-sm font-medium">
-                Top K <small className="opacity-40">(default: 5)</small>
+                {localize('com_endpoint_top_k')}{' '}
+                <small className="opacity-40">
+                  ({localize('com_endpoint_default_with_num', '5')})
+                </small>
               </Label>
               <InputNumber
                 id="top-k-int"
@@ -191,9 +200,10 @@ export default function Settings({ conversation, setOption, models, readonly }:
         <HoverCard openDelay={300}>
           <HoverCardTrigger className="grid w-full items-center gap-2">
             <div className="flex justify-between">
-              <Label htmlFor="max-tokens-int" className="text-left text-sm font-medium">
+              {localize('com_endpoint_max_output_tokens')}{' '}
-                Max Output Tokens <small className="opacity-40">(default: 1024)</small>
+              <small className="opacity-40">
-              </Label>
+                ({localize('com_endpoint_default_with_num', '1024')})
+              </small>
               <InputNumber
                 id="max-tokens-int"
                 disabled={readonly}

client/src/components/Endpoints/Settings/Google.tsx

@@ -75,7 +75,7 @@ export default function Settings({ conversation, setOption, models, readonly }:
                 disabled={readonly}
                 value={promptPrefix || ''}
                 onChange={(e) => setPromptPrefix(e.target.value ?? null)}
-                placeholder={localize('com_endpoint_google_prompt_prefix_placeholder')}
+                placeholder={localize('com_endpoint_prompt_prefix_placeholder')}
                 className={cn(
                   defaultTextProps,
                   'flex max-h-[300px] min-h-[100px] w-full resize-none px-3 py-2 ',

client/src/components/Input/EndpointMenu/EndpointMenu.jsx

@@ -165,7 +165,7 @@ export default function NewConversationMenu() {
             }
           >
             {icon}
-            <span className="max-w-0 overflow-hidden whitespace-nowrap px-0 text-slate-600 transition-all group-hover:max-w-[80px] group-hover:px-2 group-data-[state=open]:max-w-[80px] group-data-[state=open]:px-2 dark:text-slate-300">
+            <span className="max-w-0 overflow-hidden whitespace-nowrap px-0 text-slate-600 transition-all group-data-[state=open]:max-w-[80px] group-data-[state=open]:px-2 dark:text-slate-300">
               {localize('com_endpoint_new_topic')}
             </span>
           </Button>
@@ -209,7 +209,7 @@ export default function NewConversationMenu() {
               onClick={() => setShowPresets((prev) => !prev)}
             >
               {showPresets ? localize('com_endpoint_hide') : localize('com_endpoint_show')}{' '}
-              {localize('com_endpoint_examples')}
+              {localize('com_endpoint_presets')}
             </span>
             <FileUpload onFileSelected={onFileSelected} />
             <Dialog>
@@ -223,18 +223,19 @@ export default function NewConversationMenu() {
                   className="h-auto bg-transparent px-2 py-1 text-xs font-medium font-normal text-red-700 hover:bg-slate-200 hover:text-red-700 dark:bg-transparent dark:text-red-400 dark:hover:bg-gray-800 dark:hover:text-red-400"
                 > */}
                   <Trash2 className="mr-1 flex w-[22px] items-center stroke-1" />
-                  {localize('com_endpoint_clear_all')}
+                  {localize('com_ui_clear')} {localize('com_ui_all')}
                   {/* </Button> */}
                 </label>
               </DialogTrigger>
               <DialogTemplate
-                title="Clear presets"
+                title={`${localize('com_ui_clear')} ${localize('com_endpoint_presets')}`}
-                description="Are you sure you want to clear all presets? This is irreversible."
+                description={localize('com_endpoint_presets_clear_warning')}
                 selection={{
                   selectHandler: clearAllPresets,
                   selectClasses: 'bg-red-600 hover:bg-red-700 dark:hover:bg-red-800 text-white',
-                  selectText: 'Clear',
+                  selectText: localize('com_ui_clear'),
                 }}
+                className="max-w-[500px]"
               />
             </Dialog>
           </DropdownMenuLabel>

client/src/components/Input/EndpointMenu/FileUpload.tsx

@@ -1,6 +1,7 @@
 import React, { useState } from 'react';
 import { FileUp } from 'lucide-react';
 import { cn } from '~/utils/';
+import { useLocalize } from '~/hooks';
 
 type FileUploadProps = {
   onFileSelected: (event: React.ChangeEvent<HTMLInputElement>) => void;
@@ -23,6 +24,7 @@ const FileUpload: React.FC<FileUploadProps> = ({
 }) => {
   const [statusColor, setStatusColor] = useState<string>('text-gray-600');
   const [status, setStatus] = useState<null | string>(null);
+  const localize = useLocalize();
 
   const handleFileChange = (event: React.ChangeEvent<HTMLInputElement>): void => {
     const file = event.target.files?.[0];
@@ -59,7 +61,11 @@ const FileUpload: React.FC<FileUploadProps> = ({
     >
       <FileUp className="mr-1 flex w-[22px] items-center stroke-1" />
       <span className="flex text-xs ">
-        {!status ? text || 'Import' : status === 'success' ? successText : invalidText}
+        {!status
+          ? text || localize('com_endpoint_import')
+          : status === localize('com_ui_succes')
+            ? successText
+            : invalidText}
       </span>
       <input
         id={`file-upload-${id}`}

client/src/components/Input/SetTokenDialog/GoogleConfig.tsx

@@ -1,14 +1,16 @@
 import React from 'react';
 import FileUpload from '../EndpointMenu/FileUpload';
+import { useLocalize } from '~/hooks';
 
 const GoogleConfig = ({ setToken }: { setToken: React.Dispatch<React.SetStateAction<string>> }) => {
+  const localize = useLocalize();
   return (
     <FileUpload
       id="googleKey"
       className="w-full"
-      text="Import Service Account JSON Key"
+      text={localize('com_endpoint_config_token_import_json_key')}
-      successText="Successfully Imported Service Account JSON Key"
+      successText={localize('com_endpoint_config_token_import_json_key_succesful')}
-      invalidText="Invalid Service Account JSON Key, Did you import the correct file?"
+      invalidText={localize('com_endpoint_config_token_import_json_key_invalid')}
       validator={(credentials) => {
         if (!credentials) {
           return false;

client/src/components/Input/SetTokenDialog/HelpText.tsx

@@ -1,10 +1,12 @@
 import React from 'react';
+import { useLocalize } from '~/hooks';
 
 function HelpText({ endpoint }: { endpoint: string }) {
+  const localize = useLocalize();
   const textMap = {
     bingAI: (
       <small className="break-all text-gray-600">
-        {'To get your Access token for Bing, login to '}
+        {localize('com_endpoint_config_token_get_edge_key')}{' '}
         <a
           target="_blank"
           href="https://www.bing.com"
@@ -13,22 +15,22 @@ function HelpText({ endpoint }: { endpoint: string }) {
         >
           https://www.bing.com
         </a>
-        {`. Use dev tools or an extension while logged into the site to copy the content of the _U cookie.
+        {'. '}
-      If this fails, follow these `}
+        {localize('com_endpoint_config_token_get_edge_key_dev_tool')}{' '}
         <a
           target="_blank"
           href="https://github.com/waylaidwanderer/node-chatgpt-api/issues/378#issuecomment-1559868368"
           rel="noreferrer"
           className="text-blue-600 underline"
         >
-          instructions
+          {localize('com_endpoint_config_token_edge_instructions')}
-        </a>
+        </a>{' '}
-        {' to provide the full cookie strings.'}
+        {localize('com_endpoint_config_token_edge_full_token_string')}
       </small>
     ),
     chatGPTBrowser: (
       <small className="break-all text-gray-600">
-        {'To get your Access token For ChatGPT \'Free Version\', login to '}
+        {localize('com_endpoint_config_token_chatgpt')}{' '}
         <a
           target="_blank"
           href="https://chat.openai.com"
@@ -37,7 +39,8 @@ function HelpText({ endpoint }: { endpoint: string }) {
         >
           https://chat.openai.com
         </a>
-        , then visit{' '}
+        {', '}
+        {localize('com_endpoint_config_token_chatgpt_then_visit')}{' '}
         <a
           target="_blank"
           href="https://chat.openai.com/api/auth/session"
@@ -46,31 +49,32 @@ function HelpText({ endpoint }: { endpoint: string }) {
         >
           https://chat.openai.com/api/auth/session
         </a>
-        . Copy access token.
+        {'. '}
+        {localize('com_endpoint_config_token_chatgpt_copy_token')}
       </small>
     ),
     google: (
       <small className="break-all text-gray-600">
-        You need to{' '}
+        {localize('com_endpoint_config_token_google_need_to')}{' '}
         <a
           target="_blank"
           href="https://console.cloud.google.com/vertex-ai"
           rel="noreferrer"
           className="text-blue-600 underline"
         >
-          Enable Vertex AI
+          {localize('com_endpoint_config_token_google_vertex_ai')}
         </a>{' '}
-        API on Google Cloud, then{' '}
+        {localize('com_endpoint_config_token_google_vertex_api')}{' '}
         <a
           target="_blank"
           href="https://console.cloud.google.com/projectselector/iam-admin/serviceaccounts/create?walkthrough_id=iam--create-service-account#step_index=1"
           rel="noreferrer"
           className="text-blue-600 underline"
         >
-          Create a Service Account
+          {localize('com_endpoint_config_token_google_service_account')}
         </a>
-        {`. Make sure to click 'Create and Continue' to give at least the 'Vertex AI User' role.
+        {'. '}
-      Lastly, create a JSON key to import here.`}
+        {localize('com_endpoint_config_token_google_vertex_api_role')}
       </small>
     ),
   };

client/src/components/Input/SetTokenDialog/InputWithLabel.tsx

@@ -1,6 +1,7 @@
 import React, { ChangeEvent, FC } from 'react';
 import { Input, Label } from '~/components';
 import { cn, defaultTextPropsLabel, removeFocusOutlines } from '~/utils/';
+import { useLocalize } from '~/hooks';
 
 interface InputWithLabelProps {
   value: string;
@@ -10,6 +11,7 @@ interface InputWithLabelProps {
 }
 
 const InputWithLabel: FC<InputWithLabelProps> = ({ value, onChange, label, id }) => {
+  const localize = useLocalize();
   return (
     <>
       <Label htmlFor={id} className="text-left text-sm font-medium">
@@ -21,7 +23,7 @@ const InputWithLabel: FC<InputWithLabelProps> = ({ value, onChange, label, id })
         id={id}
         value={value || ''}
         onChange={onChange}
-        placeholder={`Enter ${label}`}
+        placeholder={`${localize('com_ui_enter')} ${label}`}
         className={cn(
           defaultTextPropsLabel,
           'flex h-10 max-h-10 w-full resize-none px-3 py-2',

client/src/components/Input/SetTokenDialog/OtherConfig.tsx

@@ -1,5 +1,6 @@
 import React from 'react';
 import InputWithLabel from './InputWithLabel';
+import { useLocalize } from '~/hooks';
 
 type ConfigProps = {
   token: string;
@@ -7,12 +8,13 @@ type ConfigProps = {
 };
 
 const OtherConfig = ({ token, setToken }: ConfigProps) => {
+  const localize = useLocalize();
   return (
     <InputWithLabel
       id={'chatGPTLabel'}
       value={token || ''}
       onChange={(e: React.ChangeEvent<HTMLInputElement>) => setToken(e.target.value || '')}
-      label={'Token Name'}
+      label={localize('com_endpoint_config_token_name')}
     />
   );
 };

client/src/components/Input/SetTokenDialog/SetTokenDialog.tsx

@@ -7,8 +7,10 @@ import { Dialog } from '~/components/ui';
 import DialogTemplate from '~/components/ui/DialogTemplate';
 import { alternateName } from '~/utils';
 import store from '~/store';
+import { useLocalize } from '~/hooks';
 
 const SetTokenDialog = ({ open, onOpenChange, endpoint }) => {
+  const localize = useLocalize();
   const [token, setToken] = useState('');
   const { saveToken } = store.useToken(endpoint);
 
@@ -30,21 +32,21 @@ const SetTokenDialog = ({ open, onOpenChange, endpoint }) => {
   return (
     <Dialog open={open} onOpenChange={onOpenChange}>
       <DialogTemplate
-        title={`Set Token for ${alternateName[endpoint] ?? endpoint}`}
+        title={`${localize('com_endpoint_config_token_for')} ${
+          alternateName[endpoint] ?? endpoint
+        }`}
         className="w-full max-w-[650px] sm:w-3/4 md:w-3/4 lg:w-3/4"
         main={
           <div className="grid w-full items-center gap-2">
             <EndpointComponent token={token} setToken={setToken} endpoint={endpoint} />
-            <small className="text-red-600">
+            <small className="text-red-600">{localize('com_endpoint_config_token_server')}</small>
-              Your token will be sent to the server, but not saved.
-            </small>
             <HelpText endpoint={endpoint} />
           </div>
         }
         selection={{
           selectHandler: submit,
           selectClasses: 'bg-green-600 hover:bg-green-700 dark:hover:bg-green-800 text-white',
-          selectText: 'Submit',
+          selectText: localize('com_ui_submit'),
         }}
       />
     </Dialog>

client/src/components/Input/SubmitButton.jsx

@@ -3,6 +3,7 @@ import { StopGeneratingIcon } from '~/components';
 import { Settings } from 'lucide-react';
 import { SetTokenDialog } from './SetTokenDialog';
 import store from '~/store';
+import { useLocalize } from '~/hooks';
 
 export default function SubmitButton({
   endpoint,
@@ -17,6 +18,7 @@ export default function SubmitButton({
 
   const isTokenProvided = endpointsConfig?.[endpoint]?.userProvide ? !!getToken() : true;
   const endpointsToHideSetTokens = new Set(['openAI', 'azureOpenAI', 'bingAI']);
+  const localize = useLocalize();
 
   const clickHandler = (e) => {
     e.preventDefault();
@@ -50,7 +52,7 @@ export default function SubmitButton({
           <div className="flex items-center justify-center rounded-md text-xs group-hover:bg-gray-100 group-disabled:hover:bg-transparent dark:group-hover:bg-gray-900 dark:group-hover:text-gray-400 dark:group-disabled:hover:bg-transparent">
             <div className="m-0 mr-0 flex items-center justify-center rounded-md p-2 sm:p-2">
               <Settings className="mr-1 inline-block h-auto w-[18px]" />
-              Set Token First
+              {localize('com_endpoint_config_token_name_placeholder')}
             </div>
           </div>
         </button>

client/src/components/Messages/Content/EditMessage.tsx

@@ -4,6 +4,7 @@ import { useUpdateMessageMutation } from 'librechat-data-provider';
 import type { TEditProps } from '~/common';
 import store from '~/store';
 import Container from './Container';
+import { useLocalize } from '~/hooks';
 
 const EditMessage = ({
   text,
@@ -18,6 +19,7 @@ const EditMessage = ({
   const textEditor = useRef<HTMLDivElement | null>(null);
   const { conversationId, parentMessageId, messageId } = message;
   const updateMessageMutation = useUpdateMessageMutation(conversationId ?? '');
+  const localize = useLocalize();
 
   const resubmitMessage = () => {
     const text = textEditor?.current?.innerText ?? '';
@@ -91,17 +93,17 @@ const EditMessage = ({
           disabled={isSubmitting}
           onClick={resubmitMessage}
         >
-          Save & Submit
+          {localize('com_ui_save')} {'&'} {localize('com_ui_submit')}
         </button>
         <button
           className="btn btn-secondary relative mr-2"
           disabled={isSubmitting}
           onClick={updateMessage}
         >
-          Save
+          {localize('com_ui_save')}
         </button>
         <button className="btn btn-neutral relative" onClick={() => enterEdit(true)}>
-          Cancel
+          {localize('com_ui_cancel')}
         </button>
       </div>
     </Container>

client/src/components/Messages/HoverButtons.tsx

@@ -1,7 +1,7 @@
 import { useState } from 'react';
 import type { TConversation, TMessage } from 'librechat-data-provider';
 import { Clipboard, CheckMark, EditIcon, RegenerateIcon, ContinueIcon } from '~/components/svg';
-import { useGenerations } from '~/hooks';
+import { useGenerations, useLocalize } from '~/hooks';
 import { cn } from '~/utils';
 
 type THoverButtons = {
@@ -25,6 +25,7 @@ export default function HoverButtons({
   regenerate,
   handleContinue,
 }: THoverButtons) {
+  const localize = useLocalize();
   const { endpoint } = conversation ?? {};
   const [isCopied, setIsCopied] = useState(false);
   const { hideEditButton, regenerateEnabled, continueSupported } = useGenerations({
@@ -57,7 +58,7 @@ export default function HoverButtons({
         )}
         onClick={onEdit}
         type="button"
-        title="edit"
+        title={localize('com_ui_edit')}
         disabled={hideEditButton}
       >
         <EditIcon />
@@ -69,7 +70,9 @@ export default function HoverButtons({
         )}
         onClick={() => copyToClipboard(setIsCopied)}
         type="button"
-        title={isCopied ? 'Copied to clipboard' : 'Copy to clipboard'}
+        title={
+          isCopied ? localize('com_ui_copied_to_clipboard') : localize('com_ui_copy_to_clipboard')
+        }
       >
         {isCopied ? <CheckMark /> : <Clipboard />}
       </button>
@@ -78,7 +81,7 @@ export default function HoverButtons({
           className="hover-button active 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"
           onClick={regenerate}
           type="button"
-          title="regenerate"
+          title={localize('com_ui_regenerate')}
         >
           <RegenerateIcon className="hover:text-gray-700 dark:hover:bg-gray-700 dark:hover:text-gray-200 disabled:dark:hover:text-gray-400" />
         </button>
@@ -88,7 +91,7 @@ export default function HoverButtons({
           className="hover-button active 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 "
           onClick={handleContinue}
           type="button"
-          title="continue"
+          title={localize('com_ui_continue')}
         >
           <ContinueIcon className="h-4 w-4 hover:text-gray-700 dark:hover:bg-gray-700 dark:hover:text-gray-200 disabled:dark:hover:text-gray-400" />
         </button>

client/src/components/Messages/MessageHeader.tsx

@@ -4,6 +4,7 @@ import type { TPreset } from 'librechat-data-provider';
 import { Plugin } from '~/components/svg';
 import EndpointOptionsDialog from '../Endpoints/EndpointOptionsDialog';
 import { cn, alternateName } from '~/utils/';
+import { useLocalize } from '~/hooks';
 
 import store from '~/store';
 
@@ -11,6 +12,7 @@ const MessageHeader = ({ isSearchView = false }) => {
   const [saveAsDialogShow, setSaveAsDialogShow] = useState(false);
   const conversation = useRecoilValue(store.conversation);
   const searchQuery = useRecoilValue(store.searchQuery);
+  const localize = useLocalize();
 
   if (!conversation) {
     return null;
@@ -31,7 +33,7 @@ const MessageHeader = ({ isSearchView = false }) => {
         beta
       </span>
       <span className="px-1">•</span> */}
-      Model: {model}
+      {localize('com_ui_model')}: {model}
     </>
   );
 

client/src/components/Nav/SettingsTabs/General.tsx

@@ -3,11 +3,11 @@ import { CheckIcon } from 'lucide-react';
 import { DialogButton } from '~/components/ui';
 import React, { useState, useContext, useEffect, useCallback } from 'react';
 import { useClearConversationsMutation } from 'librechat-data-provider';
-import { useRecoilValue, useRecoilState } from 'recoil';
+import { useRecoilState } from 'recoil';
 import store from '~/store';
 import { ThemeContext } from '~/hooks';
 import { cn } from '~/utils';
-import { localize } from '~/localization/Translation';
+import { useLocalize } from '~/hooks';
 
 export const ThemeSelector = ({
   theme,
@@ -16,19 +16,19 @@ export const ThemeSelector = ({
   theme: string;
   onChange: (value: string) => void;
 }) => {
-  const lang = useRecoilValue(store.lang);
+  const localize = useLocalize();
 
   return (
     <div className="flex items-center justify-between">
-      <div>{localize(lang, 'com_nav_theme')}</div>
+      <div>{localize('com_nav_theme')}</div>
       <select
         className="w-24 rounded border border-black/10 bg-transparent text-sm dark:border-white/20 dark:bg-gray-900"
         onChange={(e) => onChange(e.target.value)}
         value={theme}
       >
-        <option value="system">{localize(lang, 'com_nav_theme_system')}</option>
+        <option value="system">{localize('com_nav_theme_system')}</option>
-        <option value="dark">{localize(lang, 'com_nav_theme_dark')}</option>
+        <option value="dark">{localize('com_nav_theme_dark')}</option>
-        <option value="light">{localize(lang, 'com_nav_theme_light')}</option>
+        <option value="light">{localize('com_nav_theme_light')}</option>
       </select>
     </div>
   );
@@ -45,11 +45,11 @@ export const ClearChatsButton = ({
   showText: boolean;
   onClick: () => void;
 }) => {
-  const lang = useRecoilValue(store.lang);
+  const localize = useLocalize();
 
   return (
     <div className="flex items-center justify-between">
-      {showText && <div>{localize(lang, 'com_nav_clear_all_chats')}</div>}
+      {showText && <div>{localize('com_nav_clear_all_chats')}</div>}
       <DialogButton
         id="clearConvosBtn"
         onClick={onClick}
@@ -70,7 +70,7 @@ export const ClearChatsButton = ({
             id="clearConvosTxt"
             data-testid="clear-convos-confirm"
           >
-            <CheckIcon className="h-5 w-5" /> {localize(lang, 'com_nav_confirm_clear')}
+            <CheckIcon className="h-5 w-5" /> {localize('com_nav_confirm_clear')}
           </div>
         ) : (
           <div
@@ -78,7 +78,7 @@ export const ClearChatsButton = ({
             id="clearConvosTxt"
             data-testid="clear-convos-initial"
           >
-            {localize(lang, 'com_nav_clear')}
+            {localize('com_ui_clear')}
           </div>
         )}
 
@@ -95,25 +95,25 @@ export const LangSelector = ({
   langcode: string;
   onChange: (value: string) => void;
 }) => {
-  const lang = useRecoilValue(store.lang);
+  const localize = useLocalize();
 
   return (
     <div className="flex items-center justify-between">
-      <div>{localize(lang, 'com_nav_language')}</div>
+      <div>{localize('com_nav_language')}</div>
       <select
         className="w-24 rounded border border-black/10 bg-transparent text-sm dark:border-white/20 dark:bg-gray-900"
         onChange={(e) => onChange(e.target.value)}
         value={langcode}
       >
-        <option value="en">{localize(lang, 'com_nav_lang_english')}</option>
+        <option value="en">{localize('com_nav_lang_english')}</option>
-        <option value="cn">{localize(lang, 'com_nav_lang_chinese')}</option>
+        <option value="cn">{localize('com_nav_lang_chinese')}</option>
-        <option value="de">{localize(lang, 'com_nav_lang_german')}</option>
+        <option value="de">{localize('com_nav_lang_german')}</option>
-        <option value="es">{localize(lang, 'com_nav_lang_spanish')}</option>
+        <option value="es">{localize('com_nav_lang_spanish')}</option>
-        <option value="fr">{localize(lang, 'com_nav_lang_french')}</option>
+        <option value="fr">{localize('com_nav_lang_french')}</option>
-        <option value="it">{localize(lang, 'com_nav_lang_italian')}</option>
+        <option value="it">{localize('com_nav_lang_italian')}</option>
-        <option value="pl">{localize(lang, 'com_nav_lang_polish')}</option>
+        <option value="pl">{localize('com_nav_lang_polish')}</option>
-        <option value="br">{localize(lang, 'com_nav_lang_brazilian_portuguese')}</option>
+        <option value="br">{localize('com_nav_lang_brazilian_portuguese')}</option>
-        <option value="ru">{localize(lang, 'com_nav_lang_russian')}</option>
+        <option value="ru">{localize('com_nav_lang_russian')}</option>
       </select>
     </div>
   );

client/src/components/ui/DialogTemplate.spec.tsx

@@ -4,6 +4,7 @@ import { render, fireEvent } from '@testing-library/react';
 import '@testing-library/jest-dom/extend-expect';
 import DialogTemplate from './DialogTemplate';
 import { Dialog } from '@radix-ui/react-dialog';
+import { RecoilRoot } from 'recoil';
 
 describe('DialogTemplate', () => {
   let mockSelectHandler;
@@ -14,21 +15,24 @@ describe('DialogTemplate', () => {
 
   it('renders correctly with all props', () => {
     const { getByText } = render(
-      <Dialog
+      <RecoilRoot>
-        open
+        <Dialog
-        onOpenChange={() => {
+          open
-          return;
+          data-testid="test-dialog"
-        }}
+          onOpenChange={() => {
-      >
+            return;
-        <DialogTemplate
+          }}
-          title="Test Dialog"
+        >
-          description="Test Description"
+          <DialogTemplate
-          main={<div>Main Content</div>}
+            title="Test Dialog"
-          buttons={<button>Button</button>}
+            description="Test Description"
-          leftButtons={<button>Left Button</button>}
+            main={<div>Main Content</div>}
-          selection={{ selectHandler: mockSelectHandler, selectText: 'Select' }}
+            buttons={<button>Button</button>}
-        />
+            leftButtons={<button>Left Button</button>}
-      </Dialog>,
+            selection={{ selectHandler: mockSelectHandler, selectText: 'Select' }}
+          />
+        </Dialog>
+      </RecoilRoot>,
     );
 
     expect(getByText('Test Dialog')).toBeInTheDocument();
@@ -41,39 +45,41 @@ describe('DialogTemplate', () => {
   });
 
   it('renders correctly without optional props', () => {
-    const { getByText, queryByText } = render(
+    const { queryByText } = render(
-      <Dialog
+      <RecoilRoot>
-        open
+        <Dialog
-        onOpenChange={() => {
+          open
-          return;
+          onOpenChange={() => {
-        }}
+            return;
-      >
+          }}
-        <DialogTemplate title="Test Dialog" />
+        ></Dialog>
-      </Dialog>,
+      </RecoilRoot>,
     );
 
-    expect(getByText('Test Dialog')).toBeInTheDocument();
+    expect(queryByText('Test Dialog')).toBeNull();
     expect(queryByText('Test Description')).not.toBeInTheDocument();
     expect(queryByText('Main Content')).not.toBeInTheDocument();
     expect(queryByText('Button')).not.toBeInTheDocument();
     expect(queryByText('Left Button')).not.toBeInTheDocument();
-    expect(getByText('Cancel')).toBeInTheDocument();
+    expect(queryByText('Cancel')).not.toBeInTheDocument();
     expect(queryByText('Select')).not.toBeInTheDocument();
   });
 
   it('calls selectHandler when the select button is clicked', () => {
     const { getByText } = render(
-      <Dialog
+      <RecoilRoot>
-        open
+        <Dialog
-        onOpenChange={() => {
+          open
-          return;
+          onOpenChange={() => {
-        }}
+            return;
-      >
+          }}
-        <DialogTemplate
+        >
-          title="Test Dialog"
+          <DialogTemplate
-          selection={{ selectHandler: mockSelectHandler, selectText: 'Select' }}
+            title="Test Dialog"
-        />
+            selection={{ selectHandler: mockSelectHandler, selectText: 'Select' }}
-      </Dialog>,
+          />
+        </Dialog>
+      </RecoilRoot>,
     );
 
     fireEvent.click(getByText('Select'));

client/src/components/ui/DialogTemplate.tsx

@@ -8,6 +8,7 @@ import {
   DialogTitle,
 } from './';
 import { cn } from '~/utils/';
+import { useLocalize } from '~/hooks';
 
 type SelectionProps = {
   selectHandler?: () => void;
@@ -27,9 +28,11 @@ type DialogTemplateProps = {
 };
 
 const DialogTemplate = forwardRef((props: DialogTemplateProps, ref: Ref<HTMLDivElement>) => {
+  const localize = useLocalize();
   const { title, description, main, buttons, leftButtons, selection, className, headerClassName } =
     props;
   const { selectHandler, selectClasses, selectText } = selection || {};
+  const Cancel = localize('com_ui_cancel');
 
   const defaultSelect =
     'bg-gray-900 text-white transition-colors hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-gray-400 focus:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 dark:bg-gray-100 dark:text-gray-900 dark:hover:bg-gray-200 dark:focus:ring-gray-400 dark:focus:ring-offset-gray-900';
@@ -49,7 +52,7 @@ const DialogTemplate = forwardRef((props: DialogTemplateProps, ref: Ref<HTMLDivE
       <DialogFooter>
         <div>{leftButtons ? leftButtons : null}</div>
         <div className="flex h-auto gap-2">
-          <DialogClose className="dark:hover:gray-400 border-gray-700">Cancel</DialogClose>
+          <DialogClose className="dark:hover:gray-400 border-gray-700">{Cancel}</DialogClose>
           {buttons ? buttons : null}
           {selection ? (
             <DialogClose

client/src/components/ui/SelectDropDown.tsx

@@ -2,6 +2,7 @@ import React from 'react';
 import CheckMark from '../svg/CheckMark';
 import { Listbox, Transition } from '@headlessui/react';
 import { cn } from '~/utils/';
+import { useLocalize } from '~/hooks';
 
 type SelectDropDownProps = {
   id?: string;
@@ -18,7 +19,7 @@ type SelectDropDownProps = {
 };
 
 function SelectDropDown({
-  title = 'Model',
+  title,
   value,
   disabled,
   setValue,
@@ -29,10 +30,16 @@ function SelectDropDown({
   subContainerClassName,
   className,
 }: SelectDropDownProps) {
+  const localize = useLocalize();
   const transitionProps = { className: 'top-full mt-3' };
   if (showAbove) {
     transitionProps.className = 'bottom-full mb-3';
   }
+
+  if (!title) {
+    title = localize('com_ui_model');
+  }
+
   return (
     <div className={cn('flex items-center justify-center gap-2', containerClassName ?? '')}>
       <div className={cn('relative w-full', subContainerClassName ?? '')}>

client/src/localization/languages/Br.tsx

@@ -151,7 +151,6 @@ export default {
   com_endpoint_export: 'Exportar',
   com_endpoint_save_as_preset: 'Salvar como Configuração',
   com_endpoint_not_implemented: 'Não implementado',
-  com_endpoint_edit_preset: 'Editar Configuração',
   com_endpoint_view_options: 'Ver Opções',
   com_endpoint_my_preset: 'Minha Configuração',
   com_endpoint_agent_model: 'Modelo do Agente (Recomendado: GPT-3.5)',

client/src/localization/languages/De.tsx

@@ -159,7 +159,6 @@ export default {
   com_endpoint_export: 'Exportieren',
   com_endpoint_save_as_preset: 'Als Preset speichern',
   com_endpoint_not_implemented: 'Nicht implementiert',
-  com_endpoint_edit_preset: 'Bearbeite Preset',
   com_endpoint_view_options: 'Optionen',
   com_endpoint_save_convo_as_preset: 'Speichere Chat als Preset',
   com_endpoint_my_preset: 'Meine Presets',

client/src/localization/languages/Eng.tsx

@@ -28,6 +28,19 @@ export default {
   com_ui_of: 'of',
   com_ui_entries: 'Entries',
   com_ui_pay_per_call: 'All AI conversations in one place. Pay per call and not per month',
+  com_ui_enter: 'Enter',
+  com_ui_submit: 'Submit',
+  com_ui_cancel: 'Cancel',
+  com_ui_save: 'Save',
+  com_ui_copy_to_clipboard: 'Copy to clipboard',
+  com_ui_copied_to_clipboard: 'Copied to clipboard',
+  com_ui_regenerate: 'Regenerate',
+  com_ui_continue: 'Continue',
+  com_ui_edit: 'Edit',
+  com_ui_success: 'Success',
+  com_ui_all: 'all',
+  com_ui_clear: 'Clear',
+  com_ui_chats: 'chats',
   com_ui_delete: 'Delete',
   com_ui_delete_conversation: 'Delete chat?',
   com_ui_delete_conversation_confirm: 'This will delete',
@@ -109,8 +122,7 @@ export default {
   com_endpoint_google_maxoutputtokens:
     ' 	Maximum number of tokens that can be generated in the response. Specify a lower value for shorter responses and a higher value for longer responses.',
   com_endpoint_google_custom_name_placeholder: 'Set a custom name for PaLM2',
-  com_endpoint_google_prompt_prefix_placeholder:
+  com_endpoint_prompt_prefix_placeholder: 'Set custom instructions or context. Ignored if empty.',
-    'Set custom instructions or context. Ignored if empty.',
   com_endpoint_custom_name: 'Custom Name',
   com_endpoint_prompt_prefix: 'Prompt Prefix',
   com_endpoint_temperature: 'Temperature',
@@ -139,6 +151,7 @@ export default {
     'Top-k changes how the model selects tokens for output. A top-k of 1 means the selected token is the most probable among all tokens in the model\'s vocabulary (also called greedy decoding), while a top-k of 3 means that the next token is selected from among the 3 most probable tokens (using temperature).',
   com_endpoint_anthropic_maxoutputtokens:
     'Maximum number of tokens that can be generated in the response. Specify a lower value for shorter responses and a higher value for longer responses.',
+  com_endpoint_anthropic_custom_name_placeholder: 'Set a custom name for Anthropic',
   com_endpoint_frequency_penalty: 'Frequency Penalty',
   com_endpoint_presence_penalty: 'Presence Penalty',
   com_endpoint_plug_use_functions: 'Use Functions',
@@ -147,24 +160,27 @@ export default {
   com_endpoint_disabled_with_tools_placeholder: 'Disabled with Tools Selected',
   com_endpoint_plug_set_custom_instructions_for_gpt_placeholder:
     'Set custom instructions to include in System Message. Default: none',
+  com_endpoint_import: 'Import',
   com_endpoint_set_custom_name: 'Set a custom name, in case you can find this preset',
+  com_endpoint_preset: 'preset',
+  com_endpoint_presets: 'presets',
   com_endpoint_preset_name: 'Preset Name',
   com_endpoint_new_topic: 'New Topic',
   com_endpoint: 'Endpoint',
   com_endpoint_hide: 'Hide',
   com_endpoint_show: 'Show',
-  com_endpoint_examples: ' Examples',
+  com_endpoint_examples: ' Presets',
   com_endpoint_completion: 'Completion',
   com_endpoint_agent: 'Agent',
   com_endpoint_show_what_settings: 'Show {0} Settings',
   com_endpoint_save: 'Save',
   com_endpoint_export: 'Export',
   com_endpoint_save_as_preset: 'Save As Preset',
+  com_endpoint_presets_clear_warning:
+    'Are you sure you want to clear all presets? This is irreversible.',
   com_endpoint_not_implemented: 'Not implemented',
-  com_endpoint_edit_preset: 'Edit Preset',
   com_endpoint_no_presets: 'No preset yet',
   com_endpoint_not_available: 'No endpoint available',
-  com_endpoint_clear_all: 'Clear All',
   com_endpoint_view_options: 'View Options',
   com_endpoint_save_convo_as_preset: 'Save Conversation as Preset',
   com_endpoint_my_preset: 'My Preset',
@@ -174,6 +190,29 @@ export default {
   com_endpoint_skip_hover:
     'Enable skipping the completion step, which reviews the final answer and generated steps',
   com_endpoint_config_token: 'Config Token',
+  com_endpoint_config_token_for: 'Config Token for',
+  com_endpoint_config_token_name: 'Token Name',
+  com_endpoint_config_token_name_placeholder: 'Set token first',
+  com_endpoint_config_token_server: 'Your token will be sent to the server, but not saved.',
+  com_endpoint_config_token_import_json_key: 'Import Service Account JSON Key.',
+  com_endpoint_config_token_import_json_key_succesful: 'Import Service Account JSON Key.',
+  com_endpoint_config_token_import_json_key_invalid:
+    'Invalid Service Account JSON Key, Did you import the correct file?',
+  com_endpoint_config_token_get_edge_key: 'To get your Access token for Bing, login to',
+  com_endpoint_config_token_get_edge_key_dev_tool:
+    'Use dev tools or an extension while logged into the site to copy the content of the _U cookie. If this fails, follow these',
+  com_endpoint_config_token_edge_instructions: 'instructions',
+  com_endpoint_config_token_edge_full_token_string: 'to provide the full cookie strings.',
+  com_endpoint_config_token_chatgpt:
+    'To get your Access token For ChatGPT \'Free Version\', login to',
+  com_endpoint_config_token_chatgpt_then_visit: 'then visit',
+  com_endpoint_config_token_chatgpt_copy_token: 'Copy access token.',
+  com_endpoint_config_token_google_need_to: 'You need to',
+  com_endpoint_config_token_google_vertex_ai: 'Enable Vertex AI',
+  com_endpoint_config_token_google_vertex_api: 'API on Google Cloud, then',
+  com_endpoint_config_token_google_service_account: 'Create a Service Account',
+  com_endpoint_config_token_google_vertex_api_role:
+    'Make sure to click \'Create and Continue\' to give at least the \'Vertex AI User\' role. Lastly, create a JSON key to import here.',
   com_nav_export_filename: 'Filename',
   com_nav_export_filename_placeholder: 'Set the filename',
   com_nav_export_type: 'Type',
@@ -188,7 +227,6 @@ export default {
   com_nav_theme_system: 'System',
   com_nav_theme_dark: 'Dark',
   com_nav_theme_light: 'Light',
-  com_nav_clear: 'Clear',
   com_nav_clear_all_chats: 'Clear all chats',
   com_nav_confirm_clear: 'Confirm Clear',
   com_nav_close_sidebar: 'Close sidebar',

client/src/localization/languages/Es.tsx

@@ -17,7 +17,8 @@ export default {
     'Puede producir ocasionalmente instrucciones perjudiciales o contenido sesgado',
   com_ui_limitation_limited_2021:
     'Conocimiento limitado sobre el mundo y eventos posteriores a 2021',
-  com_ui_pay_per_call: 'Todas las conversaciones de IA en un solo lugar. Pague por llamada y no por mes.',
+  com_ui_pay_per_call:
+    'Todas las conversaciones de IA en un solo lugar. Pague por llamada y no por mes.',
   com_ui_input: 'Entrada',
   com_ui_close: 'Cerrar',
   com_ui_model: 'Modelo',
@@ -151,7 +152,6 @@ export default {
   com_endpoint_export: 'Exportar',
   com_endpoint_save_as_preset: 'Guardar como Configuración',
   com_endpoint_not_implemented: 'No implementado',
-  com_endpoint_edit_preset: 'Editar Configuración',
   com_endpoint_view_options: 'Ver Opciones',
   com_endpoint_my_preset: 'Mi Configuración',
   com_endpoint_agent_model: 'Modelo del Agente (Recomendado: GPT-3.5)',

client/src/localization/languages/Fr.tsx

@@ -161,7 +161,6 @@ export default {
   com_endpoint_export: 'Exporter',
   com_endpoint_save_as_preset: 'Enregistrer comme préréglage',
   com_endpoint_not_implemented: 'Non implémenté',
-  com_endpoint_edit_preset: 'Modifier le préréglage',
   com_endpoint_view_options: 'Voir les options',
   com_endpoint_save_convo_as_preset: 'Enregistrer la conversation comme préréglage',
   com_endpoint_my_preset: 'Mon préréglage',

client/src/localization/languages/It.tsx

@@ -1,20 +1,21 @@
-// Frasi in inglese
+// Traduzione in italiano
 
 export default {
   com_ui_examples: 'Esempi',
   com_ui_new_chat: 'Nuova chat',
   com_ui_example_quantum_computing: 'Spiega il calcolo quantistico in termini semplici',
-  com_ui_example_10_year_old_b_day: 'Hai idee creative per il compleanno di un bambino di 10 anni?',
+  com_ui_example_10_year_old_b_day:
-  com_ui_example_http_in_js: 'Come faccio una richiesta HTTP in Javascript?',
+    'Hai qualche idea creativa per il compleanno di un bambino di 10 anni?',
+  com_ui_example_http_in_js: 'Come posso fare una richiesta HTTP in Javascript?',
   com_ui_capabilities: 'Capacità',
   com_ui_capability_remember: 'Ricorda ciò che l\'utente ha detto in precedenza nella conversazione',
-  com_ui_capability_correction: 'Consente all\'utente di fornire correzioni aggiuntive',
+  com_ui_capability_correction: 'Permette all\'utente di fornire correzioni di seguito',
   com_ui_capability_decline_requests: 'Addestrato a rifiutare richieste inappropriate',
   com_ui_limitations: 'Limitazioni',
-  com_ui_limitation_incorrect_info: 'Può occasionalmente generare informazioni errate',
+  com_ui_limitation_incorrect_info: 'Può occasionalmente generare informazioni scorrette',
   com_ui_limitation_harmful_biased:
-    'Può occasionalmente produrre istruzioni dannose o contenuti tendenziosi',
+    'Può occasionalmente produrre istruzioni dannose o contenuti prevenuti',
-  com_ui_limitation_limited_2021: 'Conoscenza limitata del mondo e degli eventi dopo il 2021',
+  com_ui_limitation_limited_2021: 'Conoscenza limitata del mondo e degli eventi successivi al 2021',
   com_ui_input: 'Input',
   com_ui_close: 'Chiudi',
   com_ui_model: 'Modello',
@@ -23,16 +24,28 @@ export default {
   com_ui_prev: 'Precedente',
   com_ui_next: 'Successivo',
   com_ui_prompt_templates: 'Modelli di prompt',
-  com_ui_hide_prompt_templates: 'Nascondi i modelli di prompt',
+  com_ui_hide_prompt_templates: 'Nascondi modelli di prompt',
-  com_ui_showing: 'Mostrando',
+  com_ui_showing: 'Visualizzazione',
   com_ui_of: 'di',
   com_ui_entries: 'Voci',
   com_ui_pay_per_call:
-    'Tutte le conversazioni con l\'IA in un unico posto. Paga per chiamata e non al mese',
+    'Tutte le conversazioni AI in un unico posto. Paga per chiamata e non al mese',
+  com_ui_enter: 'Inserisci',
+  com_ui_submit: 'Invia',
+  com_ui_cancel: 'Annulla',
+  com_ui_save: 'Salva',
+  com_ui_copy_to_clipboard: 'Copia negli appunti',
+  com_ui_copied_to_clipboard: 'Copiato negli appunti',
+  com_ui_regenerate: 'Rigenera',
+  com_ui_edit: 'Modifica',
+  com_ui_success: 'Successo',
+  com_ui_all: 'tutti',
+  com_ui_clear: 'Cancella',
+  com_ui_chats: 'chat',
   com_ui_delete_conversation: 'Elimina chat?',
   com_ui_delete_conversation_confirm: 'Questo eliminerà',
   com_auth_error_login:
-    'Impossibile effettuare l\'accesso con le informazioni fornite. Controlla le tue credenziali e riprova.',
+    'Impossibile accedere con le informazioni fornite. Controlla le tue credenziali e riprova.',
   com_auth_no_account: 'Non hai un account?',
   com_auth_sign_up: 'Registrati',
   com_auth_sign_in: 'Accedi',
@@ -41,44 +54,44 @@ export default {
   com_auth_github_login: 'Accedi con Github',
   com_auth_discord_login: 'Accedi con Discord',
   com_auth_email: 'Email',
-  com_auth_email_required: 'L\'email è obbligatoria',
+  com_auth_email_required: 'Email necessaria',
-  com_auth_email_min_length: 'L\'email deve contenere almeno 6 caratteri',
+  com_auth_email_min_length: 'L\'email deve essere di almeno 6 caratteri',
-  com_auth_email_max_length: 'L\'email non deve superare i 120 caratteri',
+  com_auth_email_max_length: 'L\'email non deve essere più lunga di 120 caratteri',
   com_auth_email_pattern: 'Devi inserire un indirizzo email valido',
   com_auth_email_address: 'Indirizzo email',
   com_auth_password: 'Password',
-  com_auth_password_required: 'La password è obbligatoria',
+  com_auth_password_required: 'Password necessaria',
-  com_auth_password_min_length: 'La password deve contenere almeno 8 caratteri',
+  com_auth_password_min_length: 'La password deve essere di almeno 8 caratteri',
-  com_auth_password_max_length: 'La password deve contenere meno di 128 caratteri',
+  com_auth_password_max_length: 'La password deve essere meno di 128 caratteri',
-  com_auth_password_forgot: 'Password dimenticata?',
+  com_auth_password_forgot: 'Hai dimenticato la Password?',
   com_auth_password_confirm: 'Conferma password',
   com_auth_password_not_match: 'Le password non corrispondono',
   com_auth_continue: 'Continua',
   com_auth_create_account: 'Crea il tuo account',
   com_auth_error_create:
-    'Si è verificato un errore durante il tentativo di registrazione dell\'account. Riprova.',
+    'Si è verificato un errore durante la registrazione del tuo account. Per favore, riprova.',
   com_auth_full_name: 'Nome completo',
-  com_auth_name_required: 'Il nome è obbligatorio',
+  com_auth_name_required: 'Nome necessario',
-  com_auth_name_min_length: 'Il nome deve contenere almeno 3 caratteri',
+  com_auth_name_min_length: 'Il nome deve essere di almeno 3 caratteri',
-  com_auth_name_max_length: 'Il nome non deve superare gli 80 caratteri',
+  com_auth_name_max_length: 'Il nome deve essere meno di 80 caratteri',
-  com_auth_username: 'Nome utente',
+  com_auth_username: 'Nome utente (opzionale)',
-  com_auth_username_required: 'Il nome utente è obbligatorio',
+  com_auth_username_required: 'Nome utente obbligatorio',
-  com_auth_username_min_length: 'Il nome utente deve contenere almeno 3 caratteri',
+  com_auth_username_min_length: 'Il nome utente deve essere di almeno 2 caratteri',
-  com_auth_username_max_length: 'Il nome utente non deve superare i 20 caratteri',
+  com_auth_username_max_length: 'Il nome utente deve essere meno di 20 caratteri',
   com_auth_already_have_account: 'Hai già un account?',
   com_auth_login: 'Accedi',
-  com_auth_reset_password: 'Reimposta la password',
+  com_auth_reset_password: 'Resetta la tua password',
   com_auth_click: 'Clicca',
   com_auth_here: 'QUI',
   com_auth_to_reset_your_password: 'per reimpostare la tua password.',
   com_auth_reset_password_link_sent: 'Email inviata',
   com_auth_reset_password_email_sent:
-    'È stata inviata un\'email con ulteriori istruzioni per reimpostare la password.',
+    'Ti è stata inviata un\'email con ulteriori istruzioni per resettare la tua password.',
   com_auth_error_reset_password:
-    'Si è verificato un problema durante la reimpostazione della password. Non è stato trovato alcun utente con l\'indirizzo email fornito. Riprova.',
+    'Si è verificato un problema durante il reset della tua password. Non è stato trovato alcun utente con l\'indirizzo email fornito. Per favore, riprova.',
-  com_auth_reset_password_success: 'Reimpostazione della password riuscita',
+  com_auth_reset_password_success: 'Reset della password riuscito',
   com_auth_login_with_new_password: 'Ora puoi accedere con la tua nuova password.',
-  com_auth_error_invalid_reset_token: 'Questo token di reimpostazione password non è più valido.',
+  com_auth_error_invalid_reset_token: 'Questo token per il reset della password non è più valido.',
   com_auth_click_here: 'Clicca qui',
   com_auth_to_try_again: 'per riprovare.',
   com_auth_submit_registration: 'Invia registrazione',
@@ -87,9 +100,9 @@ export default {
   com_endpoint_bing_to_enable_sydney: 'Per abilitare Sydney',
   com_endpoint_bing_jailbreak: 'Jailbreak',
   com_endpoint_bing_context_placeholder:
-    'Bing può utilizzare fino a 7.000 token per \'contesto\', a cui può fare riferimento per la conversazione. Il limite specifico non è noto, ma potrebbe verificarsi un errore superando i 7.000 token',
+    'Bing può utilizzare fino a 7k token per il \'contesto\', che può citare per la conversazione. Il limite specifico non è noto ma potrebbe incorrere in errori superando i 7k token',
   com_endpoint_bing_system_message_placeholder:
-    'ATTENZIONE: l\'uso improprio di questa funzionalità può comportare il DIVIETO di utilizzo di Bing! Fai clic su \'Messaggio di sistema\' per le istruzioni complete e il messaggio predefinito, se omesso, che è il preset \'Sydney\' considerato sicuro.',
+    'ATTENZIONE: l\'uso improprio di questa funzione può farti BANNARE dall\'uso di Bing! Clicca su \'Messaggio di sistema\' per le istruzioni complete e il messaggio predefinito se omesso, che è il preset \'Sydney\' considerato sicuro.',
   com_endpoint_system_message: 'Messaggio di sistema',
   com_endpoint_default_blank: 'predefinito: vuoto',
   com_endpoint_default_false: 'predefinito: falso',
@@ -97,95 +110,121 @@ export default {
   com_endpoint_default_empty: 'predefinito: vuoto',
   com_endpoint_default_with_num: 'predefinito: {0}',
   com_endpoint_context: 'Contesto',
-
+  com_endpoint_tone_style: 'Stile del tono',
-  com_endpoint_tone_style: 'Stile tonale',
+  com_endpoint_token_count: 'Conteggio dei token',
-  com_endpoint_token_count: 'Conteggio token',
   com_endpoint_output: 'Output',
   com_endpoint_google_temp:
-    'Valori più alti = più casualità, valori più bassi = più focalizzati e deterministici. Consigliamo di modificare questo parametro o il parametro Top P, ma non entrambi.',
+    'Valori più alti = più casuali, mentre valori più bassi = più focalizzati e deterministici. Consigliamo di modificare questo o Top P ma non entrambi.',
   com_endpoint_google_topp:
-    'Top P modifica il modo in cui il modello seleziona i token in uscita. I token vengono selezionati in base alla probabilità più alta a più bassa fino a quando la somma delle loro probabilità raggiunge il valore top-p.',
+    'Top-p cambia come il modello seleziona i token per l\'output. I token vengono selezionati da più probabili a meno probabili (vedi parametro topK) fino a quando la somma delle loro probabilità equivale al valore top-p.',
   com_endpoint_google_topk:
-    'Top K modifica il modo in cui il modello seleziona i token in uscita. Un top-k di 1 significa che il token selezionato è il più probabile tra tutti i token nel vocabolario del modello (detto anche decoding greedy), mentre un top-k di 3 significa che il token successivo viene selezionato tra i 3 token più probabili (usando la temperatura).',
+    'Top-k cambia come il modello seleziona i token per l\'output. Un top-k di 1 significa che il token selezionato è il più probabile tra tutti i token nel vocabolario del modello (chiamato anche decodifica avida), mentre un top-k di 3 significa che il token successivo viene selezionato tra i 3 token più probabili (usando la temperatura).',
   com_endpoint_google_maxoutputtokens:
-    'Numero massimo di token che possono essere generati nella risposta. Specificare un valore più basso per risposte più brevi e un valore più alto per risposte più lunghe.',
+    ' 	Massimo numero di token che possono essere generati nella risposta. Specificare un valore inferiore per risposte più brevi e un valore superiore per risposte più lunghe.',
   com_endpoint_google_custom_name_placeholder: 'Imposta un nome personalizzato per PaLM2',
-  com_endpoint_google_prompt_prefix_placeholder:
+  com_endpoint_prompt_prefix_placeholder:
-    'Imposta istruzioni o contesto personalizzati. Ignorato se vuoto.',
+    'Imposta istruzioni o contesto personalizzato. Ignorato se vuoto.',
   com_endpoint_custom_name: 'Nome personalizzato',
   com_endpoint_prompt_prefix: 'Prefisso del prompt',
   com_endpoint_temperature: 'Temperatura',
   com_endpoint_default: 'predefinito',
   com_endpoint_top_p: 'Top P',
   com_endpoint_top_k: 'Top K',
-  com_endpoint_max_output_tokens: 'Token di output massimi',
+  com_endpoint_max_output_tokens: 'Max Output Tokens',
   com_endpoint_openai_temp:
-    'Valori più alti = più casualità, valori più bassi = più focalizzati e deterministici. Consigliamo di modificare questo parametro o il parametro Top P, ma non entrambi.',
+    'Valori più alti = più casuali, mentre valori più bassi = più focalizzati e deterministici. Consigliamo di modificare questo o Top P ma non entrambi.',
   com_endpoint_openai_max:
-    'Il numero massimo di token da generare. La lunghezza totale dei token di input e dei token generati è limitata dalla lunghezza del contesto del modello.',
+    'Il massimo di token da generare. La lunghezza totale dei token di input e dei token generati è limitata dalla lunghezza del contesto del modello.',
   com_endpoint_openai_topp:
-    'Un\'alternativa alla generazione casuale con temperatura, chiamata campionamento di nucleo, in cui il modello considera i risultati dei token con una massa di probabilità top-p. Quindi 0,1 significa che vengono considerati solo i token che costituiscono il 10% superiore della probabilità. Consigliamo di modificare questo parametro o la temperatura, ma non entrambi.',
+    'Un\'alternativa al campionamento con temperatura, chiamata campionamento del nucleo, dove il modello considera i risultati dei token con la massa di probabilità top_p. Quindi 0,1 significa che vengono considerati solo i token che compongono la massa di probabilità dell\'1%',
   com_endpoint_openai_freq:
-    'Numero compreso tra -2,0 e 2,0. I valori positivi penalizzano i nuovi token in base alla loro frequenza nel testo finora, diminuendo la probabilità che il modello ripeta la stessa frase identica.',
+    'Numero tra -2.0 e 2.0. I valori positivi penalizzano i nuovi token in base alla loro frequenza esistente nel testo finora, diminuendo la probabilità del modello di ripetere la stessa linea alla lettera.',
   com_endpoint_openai_pres:
-    'Numero compreso tra -2,0 e 2,0. I valori positivi penalizzano i nuovi token in base alla loro presenza nel testo finora, aumentando la probabilità che il modello parli di nuovi argomenti.',
+    'Numero tra -2.0 e 2.0. I valori positivi penalizzano i nuovi token in base al fatto che compaiono nel testo finora, aumentando la probabilità del modello di parlare di nuovi argomenti.',
   com_endpoint_openai_custom_name_placeholder: 'Imposta un nome personalizzato per ChatGPT',
   com_endpoint_openai_prompt_prefix_placeholder:
-    'Imposta istruzioni personalizzate da includere nel messaggio di sistema. Predefinito: nessuno',
+    'Imposta istruzioni personalizzate da includere nel Messaggio di Sistema. Predefinito: nessuno',
   com_endpoint_anthropic_temp:
-    'Varia da 0 a 1. Utilizzare una temperatura più vicina a 0 per compiti analitici/multipla scelta e più vicina a 1 per compiti creativi e generativi. Consigliamo di modificare questo parametro o il parametro Top P, ma non entrambi.',
+    'Varia da 0 a 1. Usa temp più vicino a 0 per analitico / scelta multipla, e più vicino a 1 per compiti creativi e generativi. Consigliamo di modificare questo o Top P ma non entrambi.',
   com_endpoint_anthropic_topp:
-    'Top P modifica il modo in cui il modello seleziona i token in uscita. I token vengono selezionati in base alla probabilità più alta a più bassa fino a quando la somma delle loro probabilità raggiunge il valore top-p.',
+    'Top-p cambia come il modello seleziona i token per l\'output. I token vengono selezionati da più probabili a meno probabili (vedi parametro topK) fino a quando la somma delle loro probabilità equivale al valore top-p.',
   com_endpoint_anthropic_topk:
-    'Top K modifica il modo in cui il modello seleziona i token in uscita. Un top-k di 1 significa che il token selezionato è il più probabile tra tutti i token nel vocabolario del modello (detto anche decoding greedy), mentre un top-k di 3 significa che il token successivo viene selezionato tra i 3 token più probabili (usando la temperatura).',
+    'Top-k cambia come il modello seleziona i token per l\'output. Un top-k di 1 significa che il token selezionato è il più probabile tra tutti i token nel vocabolario del modello (chiamato anche decodifica avida), mentre un top-k di 3 significa che il token successivo viene selezionato tra i 3 token più probabili (usando la temperatura).',
   com_endpoint_anthropic_maxoutputtokens:
-    'Numero massimo di token che possono essere generati nella risposta. Specificare un valore più basso per risposte più brevi e un valore più alto per risposte più lunghe.',
+    ' Massimo numero di token che possono essere generati nella risposta. Specifica un valore inferiore per risposte più brevi e un valore superiore per risposte più lunghe.',
+  com_endpoint_anthropic_custom_name_placeholder: 'Imposta un nome personalizzato per Anthropic',
   com_endpoint_frequency_penalty: 'Penalità di frequenza',
   com_endpoint_presence_penalty: 'Penalità di presenza',
-  com_endpoint_plug_use_functions: 'Usa le funzioni',
+  com_endpoint_plug_use_functions: 'Usa funzioni',
-  com_endpoint_plug_skip_completion: 'Salta il completamento',
+  com_endpoint_plug_skip_completion: 'Salta completamento',
   com_endpoint_disabled_with_tools: 'disabilitato con strumenti',
-  com_endpoint_disabled_with_tools_placeholder: 'Disabilitato con strumenti selezionati',
+  com_endpoint_disabled_with_tools_placeholder: 'Disabilitato con gli strumenti selezionati',
   com_endpoint_plug_set_custom_instructions_for_gpt_placeholder:
-    'Imposta istruzioni personalizzate da includere nel messaggio di sistema. Predefinito: nessuno',
+    'Imposta istruzioni personalizzate da includere nel Messaggio di Sistema. Predefinito: nessuno',
   com_endpoint_set_custom_name:
-    'Imposta un nome personalizzato, nel caso in cui tu possa trovare questo preset',
+    'Imposta un nome personalizzato, nel caso in cui tu possa trovare questo preimpostato.',
-  com_endpoint_preset_name: 'Nome del preset',
+  com_endpoint_import: 'Importa',
+  com_endpoint_preset: 'Preimpostazione',
+  com_endpoint_presets: 'Preimpostazioni',
+  com_endpoint_preset_name: 'Nome preimpostato',
   com_endpoint_new_topic: 'Nuovo argomento',
   com_endpoint: 'Endpoint',
   com_endpoint_hide: 'Nascondi',
   com_endpoint_show: 'Mostra',
-  com_endpoint_examples: 'Esempi',
   com_endpoint_completion: 'Completamento',
   com_endpoint_agent: 'Agente',
-  com_endpoint_show_what_settings: 'Mostra le impostazioni di {0}',
+  com_endpoint_show_what_settings: 'Mostra impostazioni {0}',
   com_endpoint_save: 'Salva',
   com_endpoint_export: 'Esporta',
-  com_endpoint_save_as_preset: 'Salva come preset',
+  com_endpoint_save_as_preset: 'Salva come preimpostato',
+  com_endpoint_presets_clear_warning:
+    'Sei sicuro di voler cancellare tutti i preset? Questo sarà irriversibile.',
   com_endpoint_not_implemented: 'Non implementato',
-  com_endpoint_edit_preset: 'Modifica preset',
   com_endpoint_no_presets: 'Nessun preset ancora',
   com_endpoint_not_available: 'Nessun endpoint disponibile',
   com_endpoint_clear_all: 'Cancella tutto',
   com_endpoint_view_options: 'Visualizza opzioni',
-  com_endpoint_save_convo_as_preset: 'Salva la conversazione come preset',
+  com_endpoint_save_convo_as_preset: 'Salva conversazione come preset',
-  com_endpoint_my_preset: 'Mio preset',
+  com_endpoint_my_preset: 'Il mio preimpostato',
   com_endpoint_agent_model: 'Modello Agente (Consigliato: GPT-3.5)',
   com_endpoint_completion_model: 'Modello Completamento (Consigliato: GPT-4)',
-  com_endpoint_func_hover: 'Abilita l\'uso dei plugin come funzioni di OpenAI',
+  com_endpoint_func_hover: 'Abilitare l\'uso dei Plugin come funzioni OpenAI',
   com_endpoint_skip_hover:
     'Abilita la possibilità di saltare la fase di completamento, che rivede la risposta finale e le fasi generate',
-  com_endpoint_config_token: 'Configura Token',
+  com_endpoint_config_token: 'Imposta Token',
-  com_nav_export_filename: 'Nome file',
+  com_endpoint_config_token_for: 'Token per',
+  com_endpoint_config_token_name: 'nome del token',
+  com_endpoint_config_token_name_placeholder: 'Prima imposta il token',
+  com_endpoint_config_token_server: 'Il tuo token verrà inviato al server, ma non verrà salvato.',
+  com_endpoint_config_token_import_json_key: 'Importa Chiave JSON del Service Account.',
+  com_endpoint_config_token_import_json_key_succesful: 'Importa Chiave JSON del Service Account.',
+  com_endpoint_config_token_import_json_key_invalid:
+    'Chiave JSON del Service Account non valida, hai importato il file corretto?',
+  com_endpoint_config_token_get_edge_key: 'Per ottenere il tuo token di accesso per Bing, accedi a',
+  com_endpoint_config_token_get_edge_key_dev_tool:
+    'Usa gli strumenti di sviluppo o un\'estensione mentre sei loggato nel sito per copiare il contenuto del cookie _U. Se ciò fallisce, segui queste',
+  com_endpoint_config_token_edge_instructions: 'istruzioni',
+  com_endpoint_config_token_edge_full_token_string: 'per fornire le stringhe dei cookie complete.',
+  com_endpoint_config_token_chatgpt:
+    'Per ottenere il tuo token di accesso per ChatGPT \'Versione Gratuita\', accedi a',
+  com_endpoint_config_token_chatgpt_then_visit: 'poi visita',
+  com_endpoint_config_token_chatgpt_copy_token: 'Copia token di accesso.',
+  com_endpoint_config_token_google_need_to: 'Hai bisogno di',
+  com_endpoint_config_token_google_vertex_ai: 'Abilitare Vertex AI',
+  com_endpoint_config_token_google_vertex_api: 'API su Google Cloud, poi',
+  com_endpoint_config_token_google_service_account: 'Crea un Service Account',
+  com_endpoint_config_token_google_vertex_api_role:
+    'Assicurati di fare clic su \'Crea e continua\' per dare almeno il ruolo \'Utente Vertex AI\'. Infine, crea una chiave JSON da importare qui.',
+  com_nav_export_filename: 'Nome del file',
   com_nav_export_filename_placeholder: 'Imposta il nome del file',
   com_nav_export_type: 'Tipo',
-  com_nav_export_include_endpoint_options: 'Includi le opzioni dell\'endpoint',
+  com_nav_export_include_endpoint_options: 'Includi opzioni dell\'endpoint',
   com_nav_enabled: 'Abilitato',
   com_nav_not_supported: 'Non supportato',
-  com_nav_export_all_message_branches: 'Esporta tutti i rami del messaggio',
+  com_nav_export_all_message_branches: 'Esporta tutti i rami dei messaggi',
   com_nav_export_recursive_or_sequential: 'Ricorsivo o sequenziale?',
   com_nav_export_recursive: 'Ricorsivo',
-  com_nav_export_conversation: 'Esporta la conversazione',
+  com_nav_export_conversation: 'Esporta conversazione',
   com_nav_theme: 'Tema',
   com_nav_theme_system: 'Sistema',
   com_nav_theme_dark: 'Scuro',
@@ -197,10 +236,10 @@ export default {
   com_nav_open_sidebar: 'Apri la barra laterale',
   com_nav_log_out: 'Esci',
   com_nav_user: 'UTENTE',
-  com_nav_clear_conversation: 'Cancella le conversazioni',
+  com_nav_clear_conversation: 'Cancella conversazioni',
   com_nav_clear_conversation_confirm_message:
-    'Sei sicuro di voler cancellare tutte le conversazioni? Questa operazione è irreversibile.',
+    'Sei sicuro di voler cancellare tutte le conversazioni? Questa azione è irreversibile.',
-  com_nav_help_faq: 'Aiuto e FAQ',
+  com_nav_help_faq: 'Aiuto & FAQ',
   com_nav_settings: 'Impostazioni',
   com_nav_search_placeholder: 'Cerca messaggi',
   com_nav_setting_general: 'Generale',

client/src/localization/languages/Pl.tsx

@@ -158,7 +158,6 @@ export default {
   com_endpoint_export: 'Eksportuj',
   com_endpoint_save_as_preset: 'Zapisz jako predefiniowane ustawienie',
   com_endpoint_not_implemented: 'Nie zaimplementowano',
-  com_endpoint_edit_preset: 'Edytuj predefiniowane ustawienie',
   com_endpoint_no_presets: 'Brak zapisanych predefiniowanych ustawień',
   com_endpoint_not_available: 'Punkt końcowy niedostępny',
   com_endpoint_clear_all: 'Usuń wszystko',

client/src/localization/languages/Ru.tsx

@@ -158,7 +158,6 @@ export default {
   com_endpoint_export: 'Экспорт',
   com_endpoint_save_as_preset: 'Сохранить как предустановку',
   com_endpoint_not_implemented: 'Не реализовано',
-  com_endpoint_edit_preset: 'Редактировать предустановку',
   com_endpoint_no_presets: 'Пока нет предустановок',
   com_endpoint_not_available: 'Нет доступных конечных точек',
   com_endpoint_clear_all: 'Очистить все',

client/src/localization/languages/Zh.tsx

@@ -140,7 +140,6 @@ export default {
   com_endpoint_export: '导出',
   com_endpoint_save_as_preset: '保存为预设',
   com_endpoint_not_implemented: '未实现功能',
-  com_endpoint_edit_preset: '预设编辑',
   com_endpoint_view_options: '查看选项',
   com_endpoint_my_preset: '我的预设',
   com_endpoint_agent_model: '代理模型 (推荐: GPT-3.5)',