51 lines
1.4 KiB
TypeScript
51 lines
1.4 KiB
TypeScript
import { Content } from '@components/note/content';
|
|
import { RootNote } from '@components/note/root';
|
|
|
|
import destr from 'destr';
|
|
import { useRouter } from 'next/router';
|
|
import { memo, useMemo, useRef } from 'react';
|
|
|
|
export const Note = memo(function Note({ event }: { event: any }) {
|
|
const router = useRouter();
|
|
const tags = destr(event.tags);
|
|
const rootEventID = useRef(null);
|
|
|
|
const fetchRootEvent = useMemo(() => {
|
|
if (tags.length > 0) {
|
|
if (tags[0][0] === 'e' || tags[0][2] === 'root') {
|
|
rootEventID.current = tags[0][1];
|
|
return <RootNote id={tags[0][1]} />;
|
|
} else {
|
|
tags.every((tag) => {
|
|
if (tag[0] === 'e' && tag[2] === 'root') {
|
|
rootEventID.current = tag[1];
|
|
return <RootNote id={tag[1]} />;
|
|
}
|
|
return <></>;
|
|
});
|
|
}
|
|
} else {
|
|
return <></>;
|
|
}
|
|
}, [tags]);
|
|
|
|
const openThread = (e) => {
|
|
const selection = window.getSelection();
|
|
if (selection.toString().length === 0) {
|
|
router.push(`/newsfeed/${rootEventID.current || event.id}`);
|
|
} else {
|
|
e.stopPropagation();
|
|
}
|
|
};
|
|
|
|
return (
|
|
<div
|
|
onClick={(e) => openThread(e)}
|
|
className="relative z-10 flex h-min min-h-min w-full select-text flex-col border-b border-zinc-800 py-5 px-3 hover:bg-black/20"
|
|
>
|
|
<>{fetchRootEvent}</>
|
|
<Content data={event} />
|
|
</div>
|
|
);
|
|
});
|