diff --git a/apps/chat/src/components/Chat/ChatMessage/ChatMessage.tsx b/apps/chat/src/components/Chat/ChatMessage/ChatMessage.tsx index 2bc8398d1..410a38a85 100644 --- a/apps/chat/src/components/Chat/ChatMessage/ChatMessage.tsx +++ b/apps/chat/src/components/Chat/ChatMessage/ChatMessage.tsx @@ -121,6 +121,7 @@ export const ChatMessage: FC = memo( }} toggleEditing={toggleEditing} isEditing={isEditing} + editDisabled={editDisabled} toggleEditingTemplates={toggleEditingTemplates} isEditingTemplates={isTemplateModalOpened} messageCopied={messageCopied} @@ -152,6 +153,7 @@ export const ChatMessage: FC = memo( isLastMessage={isLastMessage} messageIndex={messageIndex} conversation={conversation} + editDisabled={editDisabled} isEditing={isEditing} toggleEditing={toggleEditing} toggleEditingTemplates={toggleEditingTemplates} diff --git a/apps/chat/src/components/Chat/ChatMessage/ChatMessageContent/AssistantMessage.tsx b/apps/chat/src/components/Chat/ChatMessage/ChatMessageContent/AssistantMessage.tsx index a7d581484..f26fa5b3b 100644 --- a/apps/chat/src/components/Chat/ChatMessage/ChatMessageContent/AssistantMessage.tsx +++ b/apps/chat/src/components/Chat/ChatMessage/ChatMessageContent/AssistantMessage.tsx @@ -13,7 +13,7 @@ import { useAppSelector } from '@/src/store/hooks'; import { SettingsSelectors } from '@/src/store/settings/settings.reducers'; import { MessageAssistantButtons } from '@/src/components/Chat/ChatMessage/MessageButtons'; -import { AssistantSchema } from '@/src/components/Chat/ChatMessage/MessageSchema/AssistantSchema'; +import { AssistantSchema } from '@/src/components/Chat/ChatMessage/MessageSchema/MessageSchema'; import { MessageAttachments } from '@/src/components/Chat/MessageAttachments'; import { MessageStages } from '@/src/components/Chat/MessageStages'; import { ErrorMessage } from '@/src/components/Common/ErrorMessage'; diff --git a/apps/chat/src/components/Chat/ChatMessage/ChatMessageContent/UserMessage.tsx b/apps/chat/src/components/Chat/ChatMessage/ChatMessageContent/UserMessage.tsx index 51cd36c16..abcd7fcb8 100644 --- a/apps/chat/src/components/Chat/ChatMessage/ChatMessageContent/UserMessage.tsx +++ b/apps/chat/src/components/Chat/ChatMessage/ChatMessageContent/UserMessage.tsx @@ -37,7 +37,7 @@ import { FOLDER_ATTACHMENT_CONTENT_TYPE } from '@/src/constants/folders'; import { ChatInputAttachments } from '@/src/components/Chat/ChatInput/ChatInputAttachments'; import { AdjustedTextarea } from '@/src/components/Chat/ChatMessage/AdjustedTextarea'; import { MessageUserButtons } from '@/src/components/Chat/ChatMessage/MessageButtons'; -import { UserSchema } from '@/src/components/Chat/ChatMessage/MessageSchema/UserSchema'; +import { UserSchema } from '@/src/components/Chat/ChatMessage/MessageSchema/MessageSchema'; import { MessageAttachments } from '@/src/components/Chat/MessageAttachments'; import { AttachButton } from '@/src/components/Files/AttachButton'; diff --git a/apps/chat/src/components/Chat/ChatMessage/MessageSchema/MessageSchema.tsx b/apps/chat/src/components/Chat/ChatMessage/MessageSchema/MessageSchema.tsx new file mode 100644 index 000000000..7d0098b97 --- /dev/null +++ b/apps/chat/src/components/Chat/ChatMessage/MessageSchema/MessageSchema.tsx @@ -0,0 +1,35 @@ +import { useTranslation } from 'next-i18next'; + +import { Translation } from '@/src/types/translation'; + +import { withErrorBoundary } from '@/src/components/Common/ErrorBoundary'; +import { ErrorMessage } from '@/src/components/Common/ErrorMessage'; + +import { AssistantSchema as MemoAssistantSchema } from './AssistantSchema'; +import { UserSchema as MemoUserSchema } from './UserSchema'; + +const InvalidSchemaMessage = () => { + const { t } = useTranslation(Translation.Chat); + + return ( +
+ +
+ ); +}; + +const config = { + errorLogMessage: 'Invalid schema error:', +}; + +export const UserSchema = withErrorBoundary( + MemoUserSchema, + , + config, +); + +export const AssistantSchema = withErrorBoundary( + MemoAssistantSchema, + , + config, +); diff --git a/apps/chat/src/components/Chat/ChatMessage/MessageSchema/UserSchema.tsx b/apps/chat/src/components/Chat/ChatMessage/MessageSchema/UserSchema.tsx index 031f1bdca..cc07ce373 100644 --- a/apps/chat/src/components/Chat/ChatMessage/MessageSchema/UserSchema.tsx +++ b/apps/chat/src/components/Chat/ChatMessage/MessageSchema/UserSchema.tsx @@ -87,7 +87,13 @@ export const UserSchema = memo(function UserSchema({ if (isEditing) return ( - + ); return userForm.length ? ( diff --git a/apps/chat/src/components/Common/ErrorBoundary.tsx b/apps/chat/src/components/Common/ErrorBoundary.tsx new file mode 100644 index 000000000..aff4a2b2d --- /dev/null +++ b/apps/chat/src/components/Common/ErrorBoundary.tsx @@ -0,0 +1,56 @@ +import { Component, ComponentType, ReactNode } from 'react'; + +interface ErrorBoundaryProps { + children: ReactNode; + fallback?: ReactNode; + config?: { + errorLogMessage?: string; + }; +} + +interface ErrorBoundaryState { + hasError: boolean; +} + +export class ErrorBoundary extends Component< + ErrorBoundaryProps, + ErrorBoundaryState +> { + constructor(props: ErrorBoundaryProps) { + super(props); + this.state = { hasError: false }; + } + + static getDerivedStateFromError(): ErrorBoundaryState { + return { hasError: true }; + } + + componentDidCatch(error: Error) { + if (this.props.config?.errorLogMessage) { + console.error(this.props.config.errorLogMessage, ': ', error); + } + } + + render() { + if (this.state.hasError) { + return this.props.fallback ?? this.props.children; + } + return this.props.children; + } +} + +export function withErrorBoundary( + Component: ComponentType, + fallback?: ReactNode, + config?: ErrorBoundaryProps['config'], +) { + const ErrorBoundaryWrapper = (props: T) => ( + + + + ); + + ErrorBoundaryWrapper.displayName = 'ErrorBoundaryWrapper'; + + return ErrorBoundaryWrapper; +}