39 lines
1.1 KiB
TypeScript
39 lines
1.1 KiB
TypeScript
import { twMerge } from 'tailwind-merge';
|
|
import { useWidget } from '@libs/ark';
|
|
import { WIDGET_KIND } from '@utils/constants';
|
|
import { Note } from '.';
|
|
|
|
export function NoteThread({
|
|
thread,
|
|
className,
|
|
}: {
|
|
thread: { rootEventId: string; replyEventId: string };
|
|
className?: string;
|
|
}) {
|
|
const { addWidget } = useWidget();
|
|
|
|
if (!thread) return null;
|
|
|
|
return (
|
|
<div className={twMerge('w-full px-3', className)}>
|
|
<div className="flex h-min w-full flex-col gap-3 rounded-lg bg-neutral-100 p-3 dark:bg-neutral-900">
|
|
{thread.rootEventId ? <Note.Child eventId={thread.rootEventId} isRoot /> : null}
|
|
{thread.replyEventId ? <Note.Child eventId={thread.replyEventId} /> : null}
|
|
<button
|
|
type="button"
|
|
onClick={() =>
|
|
addWidget.mutate({
|
|
kind: WIDGET_KIND.thread,
|
|
title: 'Thread',
|
|
content: thread.rootEventId,
|
|
})
|
|
}
|
|
className="self-start text-blue-500 hover:text-blue-600"
|
|
>
|
|
Show full thread
|
|
</button>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|