mirror of
https://github.com/luminous-devs/lume.git
synced 2024-09-19 19:46:34 +00:00
use new note parser for channel message
This commit is contained in:
parent
dfd1333db8
commit
90bcabf27b
@ -2,10 +2,12 @@ import MessageHideButton from '@lume/app/channel/components/messages/hideButton'
|
||||
import MessageMuteButton from '@lume/app/channel/components/messages/muteButton';
|
||||
import MessageReplyButton from '@lume/app/channel/components/messages/replyButton';
|
||||
import ChannelMessageUser from '@lume/app/channel/components/messages/user';
|
||||
import { messageParser } from '@lume/utils/parser';
|
||||
import { noteParser } from '@lume/app/note/components/parser';
|
||||
|
||||
import { useMemo } from 'react';
|
||||
|
||||
export default function ChannelMessageItem({ data }: { data: any }) {
|
||||
const content = messageParser(data.content);
|
||||
const content = useMemo(() => noteParser(data), [data]);
|
||||
|
||||
return (
|
||||
<div className="group relative flex h-min min-h-min w-full select-text flex-col px-5 py-2 hover:bg-black/20">
|
||||
@ -13,8 +15,8 @@ export default function ChannelMessageItem({ data }: { data: any }) {
|
||||
<ChannelMessageUser pubkey={data.pubkey} time={data.created_at} />
|
||||
<div className="-mt-[17px] pl-[48px]">
|
||||
<div className="flex flex-col gap-2">
|
||||
<div className="whitespace-pre-line break-words break-words text-sm leading-tight">
|
||||
{data.hide ? <span className="italic text-zinc-400">[hided message]</span> : content}
|
||||
<div className="whitespace-pre-line break-words text-sm leading-tight">
|
||||
{data.hide ? <span className="italic text-zinc-400">[hided message]</span> : content.parsed}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
@ -19,7 +19,7 @@ export const ChatMessageItem = memo(function MessageListItem({
|
||||
<div className="flex flex-col">
|
||||
<ChatMessageUser pubkey={data.pubkey} time={data.created_at} />
|
||||
<div className="-mt-[17px] pl-[48px]">
|
||||
<div className="whitespace-pre-line break-words break-words text-sm leading-tight">{content}</div>
|
||||
<div className="whitespace-pre-line break-words text-sm leading-tight">{content}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
@ -57,12 +57,5 @@ export const noteParser = (event: Event) => {
|
||||
}
|
||||
});
|
||||
|
||||
// make sure no unnessary spaces are left
|
||||
content.parsed.forEach((item: string, index: string) => {
|
||||
if (typeof item === 'string') {
|
||||
content.parsed[index] = item.replace(/^\x20+|\x20+$/gm, '');
|
||||
}
|
||||
});
|
||||
|
||||
return content;
|
||||
};
|
||||
|
@ -1,11 +0,0 @@
|
||||
import { WRITEONLY_RELAYS } from '@lume/stores/constants';
|
||||
|
||||
import { getEventHash, signEvent } from 'nostr-tools';
|
||||
|
||||
export const broadcast = ({ pool, data, privkey }: { pool: any; data: any; privkey: string }) => {
|
||||
const event = data;
|
||||
event.id = getEventHash(event);
|
||||
event.sig = signEvent(event, privkey);
|
||||
|
||||
pool.publish(event, WRITEONLY_RELAYS);
|
||||
};
|
@ -1,37 +0,0 @@
|
||||
import ImagePreview from '@lume/shared/preview/image';
|
||||
import VideoPreview from '@lume/shared/preview/video';
|
||||
import YoutubePreview from '@lume/shared/preview/youtube';
|
||||
|
||||
import reactStringReplace from 'react-string-replace';
|
||||
|
||||
export const messageParser = (noteContent: any) => {
|
||||
let parsedContent = noteContent.trim();
|
||||
|
||||
// handle urls
|
||||
parsedContent = reactStringReplace(parsedContent, /(https?:\/\/\S+)/g, (match, i) => {
|
||||
if (match.match(/\.(jpg|jpeg|gif|png|webp)$/i)) {
|
||||
// image url
|
||||
return <ImagePreview key={match + i} url={match} size="small" />;
|
||||
} else if (match.match(/(http:|https:)?(\/\/)?(www\.)?(youtube.com|youtu.be)\/(watch|embed)?(\?v=|\/)?(\S+)?/)) {
|
||||
// youtube
|
||||
return <YoutubePreview key={match + i} url={match} size="small" />;
|
||||
} else if (match.match(/\.(mp4|webm)$/i)) {
|
||||
// video
|
||||
return <VideoPreview key={match + i} url={match} size="small" />;
|
||||
} else {
|
||||
return (
|
||||
<a key={match + i} href={match} className="cursor-pointer text-fuchsia-500" target="_blank" rel="noreferrer">
|
||||
{match}
|
||||
</a>
|
||||
);
|
||||
}
|
||||
});
|
||||
// handle #-hashtags
|
||||
parsedContent = reactStringReplace(parsedContent, /#(\w+)/g, (match, i) => (
|
||||
<span key={match + i} className="cursor-pointer text-fuchsia-500">
|
||||
#{match}
|
||||
</span>
|
||||
));
|
||||
|
||||
return parsedContent;
|
||||
};
|
Loading…
Reference in New Issue
Block a user