💭 fix: Message Labels and Typing Issues (#3602)

* 💭 fix: message labels due to typing issues

* feat: Fix empty message text in MessageRender component
This commit is contained in:
Danny Avila 2024-08-09 17:59:51 -04:00 committed by GitHub
parent 1ff4841603
commit 22c8b6f699
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
4 changed files with 15 additions and 10 deletions

View file

@ -8,7 +8,7 @@ import Icon from '~/components/Endpoints/Icon';
function MessageIcon( function MessageIcon(
props: Pick<TMessageProps, 'message' | 'conversation'> & { props: Pick<TMessageProps, 'message' | 'conversation'> & {
assistant?: false | Assistant; assistant?: Assistant;
}, },
) { ) {
const { data: endpointsConfig } = useGetEndpointsQuery(); const { data: endpointsConfig } = useGetEndpointsQuery();
@ -21,19 +21,19 @@ function MessageIcon(
() => ({ () => ({
...(conversation ?? {}), ...(conversation ?? {}),
...({ ...({
...message, ...(message ?? {}),
iconURL: message?.iconURL ?? '', iconURL: message?.iconURL ?? '',
} as TMessage), } as TMessage),
}), }),
[conversation, message], [conversation, message],
); );
const iconURL = messageSettings?.iconURL; const iconURL = messageSettings.iconURL;
let endpoint = messageSettings?.endpoint; let endpoint = messageSettings.endpoint;
endpoint = getIconEndpoint({ endpointsConfig, iconURL, endpoint }); endpoint = getIconEndpoint({ endpointsConfig, iconURL, endpoint });
const endpointIconURL = getEndpointField(endpointsConfig, endpoint, 'iconURL'); const endpointIconURL = getEndpointField(endpointsConfig, endpoint, 'iconURL');
if (!message?.isCreatedByUser && iconURL && iconURL.includes('http')) { if (message?.isCreatedByUser !== true && iconURL != null && iconURL.includes('http')) {
return ( return (
<ConvoIconURL <ConvoIconURL
preset={messageSettings as typeof messageSettings & TPreset} preset={messageSettings as typeof messageSettings & TPreset}

View file

@ -23,7 +23,9 @@ export default function Message({ message }: Pick<TMessageProps, 'message'>) {
let messageLabel = ''; let messageLabel = '';
if (isCreatedByUser) { if (isCreatedByUser) {
messageLabel = UsernameDisplay ? user?.name || user?.username : localize('com_user_message'); messageLabel = UsernameDisplay
? (user?.name ?? '') || user?.username
: localize('com_user_message');
} else { } else {
messageLabel = message.sender; messageLabel = message.sender;
} }

View file

@ -114,7 +114,10 @@ const MessageRender = memo(
</div> </div>
</div> </div>
<div <div
className={cn('relative flex w-11/12 flex-col', msg.isCreatedByUser ? '' : 'agent-turn')} className={cn(
'relative flex w-11/12 flex-col',
msg.isCreatedByUser === true ? '' : 'agent-turn',
)}
> >
<h2 className={cn('select-none font-semibold', fontSize)}>{messageLabel}</h2> <h2 className={cn('select-none font-semibold', fontSize)}>{messageLabel}</h2>
<div className="flex-col gap-1 md:gap-3"> <div className="flex-col gap-1 md:gap-3">
@ -124,10 +127,10 @@ const MessageRender = memo(
ask={ask} ask={ask}
edit={edit} edit={edit}
isLast={isLast} isLast={isLast}
text={msg.text ?? ''} text={msg.text || ''}
message={msg} message={msg}
enterEdit={enterEdit} enterEdit={enterEdit}
error={!!error} error={!!(error ?? false)}
isSubmitting={isSubmitting} isSubmitting={isSubmitting}
unfinished={unfinished ?? false} unfinished={unfinished ?? false}
isCreatedByUser={isCreatedByUser ?? true} isCreatedByUser={isCreatedByUser ?? true}

View file

@ -73,7 +73,7 @@ export default function useMessageActions(props: TMessageActions) {
const messageLabel = useMemo(() => { const messageLabel = useMemo(() => {
if (message?.isCreatedByUser === true) { if (message?.isCreatedByUser === true) {
return UsernameDisplay ? user?.name != null || user?.username : localize('com_user_message'); return UsernameDisplay ? (user?.name ?? '') || user?.username : localize('com_user_message');
} else if (assistant) { } else if (assistant) {
return assistant.name ?? 'Assistant'; return assistant.name ?? 'Assistant';
} else { } else {