wip: tired...

2024-02-14 15:51:06 +07:00
parent 60fd09000b
commit 6171b9bed1
87 changed files with 2380 additions and 3667 deletions
@@ -0,0 +1,47 @@
+import { PinIcon } from "@lume/icons";
+import { cn } from "@lume/utils";
+import { useTranslation } from "react-i18next";
+import { Link } from "react-router-dom";
+import { Note } from ".";
+import { useNoteContext } from "./provider";
+import { useArk } from "@lume/ark";
+
+export function NoteThread({ className }: { className?: string }) {
+  const ark = useArk();
+  const event = useNoteContext();
+  const thread = ark.parse_event_thread({
+    content: event.content,
+    tags: event.tags,
+  });
+
+  const { t } = useTranslation();
+
+  if (!thread) return null;
+
+  return (
+    <div className={cn("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}
+        <div className="inline-flex items-center justify-between">
+          <Link
+            to={`/events/${thread?.rootEventId || thread?.replyEventId}`}
+            className="self-start text-blue-500 hover:text-blue-600"
+          >
+            {t("note.showThread")}
+          </Link>
+          <button
+            type="button"
+            className="inline-flex size-6 items-center justify-center rounded-md bg-neutral-200 text-neutral-600 hover:bg-neutral-300 dark:bg-neutral-800 dark:text-neutral-400 dark:hover:bg-neutral-700"
+          >
+            <PinIcon className="size-4" />
+          </button>
+        </div>
+      </div>
+    </div>
+  );
+}