TootBottomSheet: fix main toot not links profile

src/timelines/toot-components/BoostIcon.css

@@ -0,0 +1,11 @@
+.icon__boost {
+  padding: 0;
+  display: inline-block;
+  border-radius: 2px;
+
+  > :global(svg) {
+    color: green;
+    font-size: 1rem;
+    vertical-align: middle;
+  }
+}

src/timelines/toot-components/BoostIcon.tsx

@@ -0,0 +1,22 @@
+import {
+  splitProps,
+  type Component,
+  type JSX,
+} from "solid-js";
+
+import {
+  Repeat,
+} from "@suid/icons-material";
+import "./BoostIcon.css";
+
+
+const BoostIcon: Component<JSX.HTMLElementTags["i"]> = (props) => {
+  const [managed, rest] = splitProps(props, ["class"]);
+  return (
+    <i class={["icon__boost", managed.class].join(" ")} {...rest}>
+      <Repeat />
+    </i>
+  );
+};
+
+export default BoostIcon;

src/timelines/toot-components/TootContent.tsx

@@ -0,0 +1,61 @@
+import type { mastodon } from "masto";
+import {
+  splitProps,
+  type Component,
+  type JSX,
+  createRenderEffect,
+  createMemo,
+} from "solid-js";
+import { resolveCustomEmoji } from "../../masto/toot.js";
+import { makeAcctText, useDefaultSession } from "../../masto/clients";
+
+function preventDefault(event: Event) {
+  event.preventDefault();
+}
+
+export type TootContentProps = {
+  source?: string;
+  emojis?: mastodon.v1.CustomEmoji[];
+  mentions: mastodon.v1.StatusMention[];
+} & JSX.HTMLAttributes<HTMLDivElement>;
+
+const TootContent: Component<TootContentProps> = (props) => {
+  const session = useDefaultSession();
+  const [managed, rest] = splitProps(props, ["source", "emojis", "mentions"]);
+
+  const clientFinder = createMemo(() =>
+    session() ? makeAcctText(session()!) : undefined,
+  );
+
+  return (
+    <div
+      ref={(ref) => {
+        createRenderEffect(() => {
+          ref.innerHTML = managed.source
+            ? managed.emojis
+              ? resolveCustomEmoji(managed.source, managed.emojis)
+              : managed.source
+            : "";
+        });
+
+        createRenderEffect(() => {
+          const finder = clientFinder();
+          for (const mention of props.mentions) {
+            const elements = ref.querySelectorAll<HTMLAnchorElement>(
+              `a[href='${mention.url}']`,
+            );
+            for (const e of elements) {
+              e.onclick = preventDefault;
+              e.dataset.action = "acct";
+              e.dataset.client = finder;
+              e.dataset.acctId = mention.id.toString();
+            }
+          }
+        });
+      }}
+      {...rest}
+    ></div>
+  );
+};
+
+export default TootContent;