diff --git a/client/src/components/Audio/Voices.tsx b/client/src/components/Audio/Voices.tsx index ff37efaa7d..ab6b0a8609 100644 --- a/client/src/components/Audio/Voices.tsx +++ b/client/src/components/Audio/Voices.tsx @@ -3,6 +3,7 @@ import { useRecoilState } from 'recoil'; import type { Option } from '~/common'; import DropdownNoState from '~/components/ui/DropdownNoState'; import { useLocalize, useTTSBrowser, useTTSEdge, useTTSExternal } from '~/hooks'; +import { Dropdown } from '~/components/ui'; import { logger } from '~/utils'; import store from '~/store'; @@ -22,13 +23,12 @@ export function EdgeVoiceDropdown() { return (
{localize('com_nav_voice_select')}
-
@@ -51,13 +51,12 @@ export function BrowserVoiceDropdown() { return (
{localize('com_nav_voice_select')}
-
@@ -80,13 +79,12 @@ export function ExternalVoiceDropdown() { return (
{localize('com_nav_voice_select')}
-
diff --git a/client/src/components/Chat/ExportAndShareMenu.tsx b/client/src/components/Chat/ExportAndShareMenu.tsx index 7ef6c2ba2d..52684b0b1a 100644 --- a/client/src/components/Chat/ExportAndShareMenu.tsx +++ b/client/src/components/Chat/ExportAndShareMenu.tsx @@ -70,7 +70,7 @@ export default function ExportAndShareMenu({ diff --git a/client/src/components/Chat/Input/ChatForm.tsx b/client/src/components/Chat/Input/ChatForm.tsx index a4a0ca61af..fdc8763188 100644 --- a/client/src/components/Chat/Input/ChatForm.tsx +++ b/client/src/components/Chat/Input/ChatForm.tsx @@ -131,6 +131,14 @@ const ChatForm = ({ index = 0 }) => { const endpointSupportsFiles: boolean = supportsFiles[endpointType ?? endpoint ?? ''] ?? false; const isUploadDisabled: boolean = endpointFileConfig?.disabled ?? false; + const baseClasses = + 'md:py-3.5 m-0 w-full resize-none bg-surface-tertiary py-[13px] placeholder-black/50 dark:placeholder-white/50 [&:has(textarea:focus)]:shadow-[0_2px_6px_rgba(0,0,0,.05)] max-h-[65vh] md:max-h-[75vh]'; + + const uploadActive = endpointSupportsFiles && !isUploadDisabled; + const speechClass = isRTL + ? `pr-${uploadActive ? '12' : '4'} pl-12` + : `pl-${uploadActive ? '12' : '4'} pr-12`; + return (
submitMessage(data))} @@ -177,15 +185,7 @@ const ChatForm = ({ index = 0 }) => { data-testid="text-input" style={{ height: 44, overflowY: 'auto' }} rows={1} - className={cn( - endpointSupportsFiles && !isUploadDisabled - ? 'pl-10 md:pl-[55px]' - : 'pl-3 md:pl-4', - 'md:py-3.5- m-0 w-full resize-none bg-surface-tertiary py-[13px] placeholder-black/50 dark:placeholder-white/50 [&:has(textarea:focus)]:shadow-[0_2px_6px_rgba(0,0,0,.05)]', - SpeechToText && !isRTL ? 'pr-20 md:pr-[85px]' : 'pr-10 md:pr-12', - 'max-h-[65vh] md:max-h-[75vh]', - removeFocusRings, - )} + className={cn(baseClasses, speechClass, removeFocusRings)} /> )} diff --git a/client/src/components/Chat/Input/Files/AttachFile.tsx b/client/src/components/Chat/Input/Files/AttachFile.tsx index e02aeae092..49e5c650de 100644 --- a/client/src/components/Chat/Input/Files/AttachFile.tsx +++ b/client/src/components/Chat/Input/Files/AttachFile.tsx @@ -24,7 +24,7 @@ const AttachFile = ({ disabled={isUploadDisabled} className={cn( 'absolute flex size-[35px] items-center justify-center rounded-full p-1 transition-colors hover:bg-surface-hover', - isRTL ? 'bottom-2 right-2' : 'bottom-2 left-2', + isRTL ? 'bottom-2 right-2' : 'bottom-2 left-1 md:left-2', )} description={localize('com_sidepanel_attach_files')} > diff --git a/client/src/components/Chat/Input/StopButton.tsx b/client/src/components/Chat/Input/StopButton.tsx index 6c785811cd..36cf471c9a 100644 --- a/client/src/components/Chat/Input/StopButton.tsx +++ b/client/src/components/Chat/Input/StopButton.tsx @@ -12,7 +12,7 @@ export default function StopButton({ stop, setShowStopButton }) { diff --git a/client/src/components/Nav/Settings.tsx b/client/src/components/Nav/Settings.tsx index 19f8fe13e7..7ad5fc1866 100644 --- a/client/src/components/Nav/Settings.tsx +++ b/client/src/components/Nav/Settings.tsx @@ -120,7 +120,9 @@ export default function Settings({ open, onOpenChange }: TDialogProps) { aria-label="Settings" className={cn( 'min-w-auto max-w-auto relative -ml-[8px] flex flex-shrink-0 flex-col flex-nowrap overflow-auto sm:max-w-none', - isSmallScreen ? 'flex-row rounded-xl bg-surface-secondary' : '', + isSmallScreen + ? 'flex-row rounded-xl bg-surface-secondary' + : 'sticky top-0 h-full', )} onKeyDown={handleKeyDown} > diff --git a/client/src/components/Nav/SettingsTabs/Account/Account.tsx b/client/src/components/Nav/SettingsTabs/Account/Account.tsx index a0fd53445e..374a6b996e 100644 --- a/client/src/components/Nav/SettingsTabs/Account/Account.tsx +++ b/client/src/components/Nav/SettingsTabs/Account/Account.tsx @@ -1,43 +1,19 @@ import React from 'react'; -import { useRecoilState } from 'recoil'; -import HoverCardSettings from '../HoverCardSettings'; +import DisplayUsernameMessages from './DisplayUsernameMessages'; import DeleteAccount from './DeleteAccount'; -import { Switch } from '~/components/ui'; -import { useLocalize } from '~/hooks'; import Avatar from './Avatar'; -import store from '~/store'; - -function Account({ onCheckedChange }: { onCheckedChange?: (value: boolean) => void }) { - const [UsernameDisplay, setUsernameDisplay] = useRecoilState(store.UsernameDisplay); - const localize = useLocalize(); - - const handleCheckedChange = (value: boolean) => { - setUsernameDisplay(value); - if (onCheckedChange) { - onCheckedChange(value); - } - }; +function Account() { return (
-
+
-
+
-
-
-
{localize('com_nav_user_name_display')}
- -
- +
+
); diff --git a/client/src/components/Nav/SettingsTabs/Account/DisplayUsernameMessages.tsx b/client/src/components/Nav/SettingsTabs/Account/DisplayUsernameMessages.tsx new file mode 100644 index 0000000000..b72adcdb3f --- /dev/null +++ b/client/src/components/Nav/SettingsTabs/Account/DisplayUsernameMessages.tsx @@ -0,0 +1,31 @@ +import React from 'react'; +import { useRecoilState } from 'recoil'; +import HoverCardSettings from '../HoverCardSettings'; +import { Switch, Label } from '~/components/ui'; +import { useLocalize } from '~/hooks'; +import store from '~/store'; + +export default function DisplayUsernameMessages() { + const localize = useLocalize(); + const [UsernameDisplay, setUsernameDisplay] = useRecoilState(store.UsernameDisplay); + + const handleCheckedChange = (checked: boolean) => { + setUsernameDisplay(checked); + }; + + return ( +
+
+ + +
+ +
+ ); +} diff --git a/client/src/components/Nav/SettingsTabs/Beta/Beta.tsx b/client/src/components/Nav/SettingsTabs/Beta/Beta.tsx index d687efbbd3..268bba2323 100644 --- a/client/src/components/Nav/SettingsTabs/Beta/Beta.tsx +++ b/client/src/components/Nav/SettingsTabs/Beta/Beta.tsx @@ -4,7 +4,7 @@ import CodeArtifacts from './CodeArtifacts'; function Beta() { return (
-
+
diff --git a/client/src/components/Nav/SettingsTabs/Beta/CodeArtifacts.tsx b/client/src/components/Nav/SettingsTabs/Beta/CodeArtifacts.tsx index a37b96866c..dd985a86af 100644 --- a/client/src/components/Nav/SettingsTabs/Beta/CodeArtifacts.tsx +++ b/client/src/components/Nav/SettingsTabs/Beta/CodeArtifacts.tsx @@ -86,7 +86,7 @@ function SwitchItem({ id={id} checked={checked} onCheckedChange={onCheckedChange} - className="ml-4 mt-2" + className="ml-4" data-testid={id} disabled={disabled} /> diff --git a/client/src/components/Nav/SettingsTabs/Chat/Chat.tsx b/client/src/components/Nav/SettingsTabs/Chat/Chat.tsx index 71369ce59b..54728f8aab 100644 --- a/client/src/components/Nav/SettingsTabs/Chat/Chat.tsx +++ b/client/src/components/Nav/SettingsTabs/Chat/Chat.tsx @@ -11,26 +11,26 @@ import SaveDraft from './SaveDraft'; function Chat() { return (
-
+
-
+
-
+
-
+
-
+
-
+
-
+
diff --git a/client/src/components/Nav/SettingsTabs/Chat/EnterToSend.tsx b/client/src/components/Nav/SettingsTabs/Chat/EnterToSend.tsx index 9e727379cb..b2e1931f65 100644 --- a/client/src/components/Nav/SettingsTabs/Chat/EnterToSend.tsx +++ b/client/src/components/Nav/SettingsTabs/Chat/EnterToSend.tsx @@ -29,7 +29,7 @@ export default function SendMessageKeyEnter({ id="enterToSend" checked={enterToSend} onCheckedChange={handleCheckedChange} - className="ml-4 mt-2" + className="ml-4" data-testid="enterToSend" />
diff --git a/client/src/components/Nav/SettingsTabs/Chat/ForkSettings.tsx b/client/src/components/Nav/SettingsTabs/Chat/ForkSettings.tsx index 84ecc9bb50..a44b3d63c6 100644 --- a/client/src/components/Nav/SettingsTabs/Chat/ForkSettings.tsx +++ b/client/src/components/Nav/SettingsTabs/Chat/ForkSettings.tsx @@ -19,34 +19,36 @@ export const ForkSettings = () => { return ( <> -
-
-
-
{localize('com_ui_fork_change_default')}
- -
- -
-
-
+
{localize('com_ui_fork_default')}
-
+ {remember && ( +
+
+
+
{localize('com_ui_fork_change_default')}
+ +
+ +
+
+ )} +
{localize('com_ui_fork_split_target_setting')}
@@ -56,7 +58,7 @@ export const ForkSettings = () => { id="splitAtTarget" checked={splitAtTarget} onCheckedChange={setSplitAtTarget} - className="ml-4 mt-2" + className="ml-4" data-testid="splitAtTarget" />
diff --git a/client/src/components/Nav/SettingsTabs/Chat/LaTeXParsing.tsx b/client/src/components/Nav/SettingsTabs/Chat/LaTeXParsing.tsx index 1dd2aa61e3..cabe4f006a 100644 --- a/client/src/components/Nav/SettingsTabs/Chat/LaTeXParsing.tsx +++ b/client/src/components/Nav/SettingsTabs/Chat/LaTeXParsing.tsx @@ -29,7 +29,7 @@ export default function LaTeXParsingSwitch({ id="LaTeXParsing" checked={LaTeXParsing} onCheckedChange={handleCheckedChange} - className="ml-4 mt-2" + className="ml-4" data-testid="LaTeXParsing" />
diff --git a/client/src/components/Nav/SettingsTabs/Chat/ModularChat.tsx b/client/src/components/Nav/SettingsTabs/Chat/ModularChat.tsx index 5bc84f5ea9..efb001d7ea 100644 --- a/client/src/components/Nav/SettingsTabs/Chat/ModularChat.tsx +++ b/client/src/components/Nav/SettingsTabs/Chat/ModularChat.tsx @@ -25,7 +25,7 @@ export default function ModularChatSwitch({ id="modularChat" checked={modularChat} onCheckedChange={handleCheckedChange} - className="ml-4 mt-2" + className="ml-4" data-testid="modularChat" />
diff --git a/client/src/components/Nav/SettingsTabs/Chat/SaveDraft.tsx b/client/src/components/Nav/SettingsTabs/Chat/SaveDraft.tsx index 3fa232688f..b5e64ebee7 100644 --- a/client/src/components/Nav/SettingsTabs/Chat/SaveDraft.tsx +++ b/client/src/components/Nav/SettingsTabs/Chat/SaveDraft.tsx @@ -29,7 +29,7 @@ export default function SaveDraft({ id="saveDrafts" checked={saveDrafts} onCheckedChange={handleCheckedChange} - className="ml-4 mt-2" + className="ml-4" data-testid="saveDrafts" />
diff --git a/client/src/components/Nav/SettingsTabs/Chat/ShowCodeSwitch.tsx b/client/src/components/Nav/SettingsTabs/Chat/ShowCodeSwitch.tsx index 85681e8c4d..bb4f7f97f7 100644 --- a/client/src/components/Nav/SettingsTabs/Chat/ShowCodeSwitch.tsx +++ b/client/src/components/Nav/SettingsTabs/Chat/ShowCodeSwitch.tsx @@ -26,7 +26,7 @@ export default function ShowCodeSwitch({ id="showCode" checked={showCode} onCheckedChange={handleCheckedChange} - className="ml-4 mt-2" + className="ml-4" data-testid="showCode" />
diff --git a/client/src/components/Nav/SettingsTabs/Commands/AtCommandSwitch.tsx b/client/src/components/Nav/SettingsTabs/Commands/AtCommandSwitch.tsx index 175aebfa49..1c4b8242ab 100644 --- a/client/src/components/Nav/SettingsTabs/Commands/AtCommandSwitch.tsx +++ b/client/src/components/Nav/SettingsTabs/Commands/AtCommandSwitch.tsx @@ -18,7 +18,7 @@ export default function AtCommandSwitch() { id="atCommand" checked={atCommand} onCheckedChange={handleCheckedChange} - className="ml-4 mt-2" + className="ml-4" data-testid="atCommand" />
diff --git a/client/src/components/Nav/SettingsTabs/Commands/Commands.tsx b/client/src/components/Nav/SettingsTabs/Commands/Commands.tsx index 72894d6bc0..8f7b92ed57 100644 --- a/client/src/components/Nav/SettingsTabs/Commands/Commands.tsx +++ b/client/src/components/Nav/SettingsTabs/Commands/Commands.tsx @@ -28,16 +28,16 @@ function Commands() {
-
+
{hasAccessToMultiConvo === true && ( -
+
)} {hasAccessToPrompts === true && ( -
+
)} diff --git a/client/src/components/Nav/SettingsTabs/Commands/PlusCommandSwitch.tsx b/client/src/components/Nav/SettingsTabs/Commands/PlusCommandSwitch.tsx index 4dac34769d..12cf428ae1 100644 --- a/client/src/components/Nav/SettingsTabs/Commands/PlusCommandSwitch.tsx +++ b/client/src/components/Nav/SettingsTabs/Commands/PlusCommandSwitch.tsx @@ -18,7 +18,8 @@ export default function PlusCommandSwitch() { id="plusCommand" checked={plusCommand} onCheckedChange={handleCheckedChange} - className="ml-4 mt-2" + f + className="ml-4" data-testid="plusCommand" />
diff --git a/client/src/components/Nav/SettingsTabs/Commands/SlashCommandSwitch.tsx b/client/src/components/Nav/SettingsTabs/Commands/SlashCommandSwitch.tsx index b612d14963..2051fd033a 100644 --- a/client/src/components/Nav/SettingsTabs/Commands/SlashCommandSwitch.tsx +++ b/client/src/components/Nav/SettingsTabs/Commands/SlashCommandSwitch.tsx @@ -18,7 +18,7 @@ export default function SlashCommandSwitch() { id="slashCommand" checked={slashCommand} onCheckedChange={handleCheckedChange} - className="ml-4 mt-2" + f data-testid="slashCommand" />
diff --git a/client/src/components/Nav/SettingsTabs/Data/Data.tsx b/client/src/components/Nav/SettingsTabs/Data/Data.tsx index 18c30d14a6..f2ee695504 100644 --- a/client/src/components/Nav/SettingsTabs/Data/Data.tsx +++ b/client/src/components/Nav/SettingsTabs/Data/Data.tsx @@ -13,19 +13,19 @@ function Data() { return (
-
+
-
+
-
+
-
+
-
+
diff --git a/client/src/components/Nav/SettingsTabs/General/AutoScrollSwitch.tsx b/client/src/components/Nav/SettingsTabs/General/AutoScrollSwitch.tsx index 294d7ac043..f7cde12eef 100644 --- a/client/src/components/Nav/SettingsTabs/General/AutoScrollSwitch.tsx +++ b/client/src/components/Nav/SettingsTabs/General/AutoScrollSwitch.tsx @@ -26,7 +26,7 @@ export default function AutoScrollSwitch({ checked={autoScroll} aria-label="Auto-Scroll to latest message on chat open" onCheckedChange={handleCheckedChange} - className="ml-4 mt-2 ring-ring-primary" + className="ml-4" data-testid="autoScroll" />
diff --git a/client/src/components/Nav/SettingsTabs/General/General.tsx b/client/src/components/Nav/SettingsTabs/General/General.tsx index 905862d3bb..bf9ff3d8fb 100644 --- a/client/src/components/Nav/SettingsTabs/General/General.tsx +++ b/client/src/components/Nav/SettingsTabs/General/General.tsx @@ -1,14 +1,12 @@ import { useRecoilState } from 'recoil'; import Cookies from 'js-cookie'; import React, { useContext, useCallback } from 'react'; -import type { TDangerButtonProps } from '~/common'; import UserMsgMarkdownSwitch from './UserMsgMarkdownSwitch'; import HideSidePanelSwitch from './HideSidePanelSwitch'; import { ThemeContext, useLocalize } from '~/hooks'; import AutoScrollSwitch from './AutoScrollSwitch'; import ArchivedChats from './ArchivedChats'; import { Dropdown } from '~/components/ui'; -import DangerButton from '../DangerButton'; import store from '~/store'; export const ThemeSelector = ({ @@ -41,34 +39,6 @@ export const ThemeSelector = ({ ); }; -export const ClearChatsButton = ({ - confirmClear, - className = '', - showText = true, - mutation, - onClick, -}: Pick< - TDangerButtonProps, - 'confirmClear' | 'mutation' | 'className' | 'showText' | 'onClick' ->) => { - return ( - - ); -}; - export const LangSelector = ({ langcode, onChange, @@ -78,7 +48,6 @@ export const LangSelector = ({ }) => { const localize = useLocalize(); - // Create an array of options for the Dropdown const languageOptions = [ { value: 'auto', label: localize('com_nav_lang_auto') }, { value: 'en-US', label: localize('com_nav_lang_english') }, @@ -147,22 +116,22 @@ function General() { return (
-
+
-
+
-
+
-
+
-
+
-
+
diff --git a/client/src/components/Nav/SettingsTabs/General/HideSidePanelSwitch.tsx b/client/src/components/Nav/SettingsTabs/General/HideSidePanelSwitch.tsx index d5854a50ce..645cb0c55e 100644 --- a/client/src/components/Nav/SettingsTabs/General/HideSidePanelSwitch.tsx +++ b/client/src/components/Nav/SettingsTabs/General/HideSidePanelSwitch.tsx @@ -27,7 +27,7 @@ export default function HideSidePanelSwitch({ checked={hideSidePanel} aria-label="Hide right-most side panel" onCheckedChange={handleCheckedChange} - className="ml-4 mt-2" + className="ml-4" data-testid="hideSidePanel" />
diff --git a/client/src/components/Nav/SettingsTabs/General/UserMsgMarkdownSwitch.tsx b/client/src/components/Nav/SettingsTabs/General/UserMsgMarkdownSwitch.tsx index 411692c515..e751f3cb90 100644 --- a/client/src/components/Nav/SettingsTabs/General/UserMsgMarkdownSwitch.tsx +++ b/client/src/components/Nav/SettingsTabs/General/UserMsgMarkdownSwitch.tsx @@ -27,7 +27,7 @@ export default function UserMsgMarkdownSwitch({ id="enableUserMsgMarkdown" checked={enableUserMsgMarkdown} onCheckedChange={handleCheckedChange} - className="ml-4 mt-2 ring-ring-primary" + className="ml-4" data-testid="enableUserMsgMarkdown" />
diff --git a/client/src/components/Nav/SettingsTabs/index.ts b/client/src/components/Nav/SettingsTabs/index.ts index a87546c88f..59d28f7675 100644 --- a/client/src/components/Nav/SettingsTabs/index.ts +++ b/client/src/components/Nav/SettingsTabs/index.ts @@ -1,6 +1,5 @@ export { default as General } from './General/General'; export { default as Chat } from './Chat/Chat'; -export { ClearChatsButton } from './General/General'; export { default as Data } from './Data/Data'; export { default as Beta } from './Beta/Beta'; export { default as Commands } from './Commands/Commands'; diff --git a/client/src/components/ui/OGDialogTemplate.tsx b/client/src/components/ui/OGDialogTemplate.tsx index cda5075cb7..4f6d43ead7 100644 --- a/client/src/components/ui/OGDialogTemplate.tsx +++ b/client/src/components/ui/OGDialogTemplate.tsx @@ -81,7 +81,7 @@ const OGDialogTemplate = forwardRef((props: DialogTemplateProps, ref: Ref {selectText}