diff --git a/CHANGELOG.md b/CHANGELOG.md index 6acf2696..44fce3fd 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -11,6 +11,7 @@ and this project adheres to ### Changed - 🔥(frontend) drop unused vendored ConnectionObserver +- 🐛(frontend) vendor formatChatMessageLinks and trim surrounding newlines ### Fixed diff --git a/src/frontend/src/features/chat/components/ChatMessageBody.tsx b/src/frontend/src/features/chat/components/ChatMessageBody.tsx index 67381ea4..f9decfdc 100644 --- a/src/frontend/src/features/chat/components/ChatMessageBody.tsx +++ b/src/frontend/src/features/chat/components/ChatMessageBody.tsx @@ -1,6 +1,6 @@ import { ChatRow } from '@/stores/chat' import React, { useMemo } from 'react' -import { formatChatMessageLinks } from '@livekit/components-react' +import { formatChatMessageLinks } from '../utils' import { css } from '@/styled-system/css' import { Text } from '@/primitives' diff --git a/src/frontend/src/features/chat/utils.tsx b/src/frontend/src/features/chat/utils.tsx new file mode 100644 index 00000000..7542e3b1 --- /dev/null +++ b/src/frontend/src/features/chat/utils.tsx @@ -0,0 +1,32 @@ +import { tokenize, createDefaultGrammar } from '@livekit/components-core' +import { ReactNode } from 'react' + +const defaultGrammar = Object.freeze(createDefaultGrammar()) + +export function formatChatMessageLinks(message: string): ReactNode { + const trimmedMessage = message.replace(/^[\r\n]+|[\r\n]+$/g, '') + return tokenize(trimmedMessage, defaultGrammar).map((tok, i) => { + if (typeof tok === `string`) { + return tok + } else { + const content = tok.content.toString() + const href = + tok.type === `url` + ? /^http(s?):\/\//.test(content) + ? content + : `https://${content}` + : `mailto:${content}` + return ( + + {content} + + ) + } + }) +}