diff --git a/src/timelines/TootBottomSheet.tsx b/src/timelines/TootBottomSheet.tsx
index a4d72c6..6408e69 100644
--- a/src/timelines/TootBottomSheet.tsx
+++ b/src/timelines/TootBottomSheet.tsx
@@ -3,12 +3,19 @@ import {
createEffect,
createRenderEffect,
createResource,
+ For,
Show,
type Component,
} from "solid-js";
import Scaffold from "../material/Scaffold";
import TootThread from "./TootThread";
-import { AppBar, Avatar, IconButton, Toolbar } from "@suid/material";
+import {
+ AppBar,
+ Avatar,
+ CircularProgress,
+ IconButton,
+ Toolbar,
+} from "@suid/material";
import { Title } from "../material/typography";
import { Close as CloseIcon, Send } from "@suid/icons-material";
import { isiOS } from "../platform/host";
@@ -63,6 +70,22 @@ const TootBottomSheet: Component = (props) => {
const toot = () => remoteToot() ?? getCache(acctText(), params.id);
+ const [tootContext] = createResource(
+ () => [session().client, params.id] as const,
+ async ([client, id]) => {
+ return await client.v1.statuses.$select(id).context.fetch();
+ },
+ );
+
+ const ancestors = () => tootContext()?.ancestors ?? [];
+ const descendants = () => tootContext()?.descendants ?? [];
+
+ createEffect(() => {
+ if (ancestors().length > 0) {
+ document.querySelector(`#toot-${toot()!.id}`)?.scrollIntoView();
+ }
+ });
+
const tootTitle = () => {
const t = toot();
if (t) {
@@ -111,10 +134,22 @@ const TootBottomSheet: Component = (props) => {
}
>
+