src/material/AppTopBar.css

@@ -1,5 +0,0 @@
-.AppTopBar {
-  & > .toolbar {
-    padding-top: var(--safe-area-inset-top, 0px);
-  }
-}

src/material/AppTopBar.tsx

@@ -1,31 +0,0 @@
-import { AppBar, Toolbar } from "@suid/material";
-import { splitProps, type JSX, type ParentComponent } from "solid-js";
-import "./AppTopBar.css";
-import { useWindowSize } from "@solid-primitives/resize-observer";
-
-const AppTopBar: ParentComponent<{
-  class?: string;
-  style?: JSX.HTMLAttributes<HTMLElement>["style"];
-}> = (oprops) => {
-  const [props, rest] = splitProps(oprops, ["children", "class"]);
-  const windowSize = useWindowSize();
-
-  return (
-    <AppBar
-      class={`AppTopBar ${props.class || ""}`}
-      elevation={1}
-      position="static"
-      {...rest}
-    >
-      <Toolbar
-        variant={windowSize.width > windowSize.height ? "dense" : "regular"}
-        class="toolbar"
-        sx={{ paddingTop: "var(--safe-area-inset-top, 0px)" }}
-      >
-        {props.children}
-      </Toolbar>
-    </AppBar>
-  );
-};
-
-export default AppTopBar;

src/timelines/TootBottomSheet.tsx

@@ -29,10 +29,6 @@ import TootList from "./TootList";
 import "./TootBottomSheet.css";
 import { useNavigator } from "~platform/StackedRouter";
 import BackButton from "~platform/BackButton";
-import ItemSelectionProvider, {
-  createSingluarItemSelection,
-} from "./toots/ItemSelectionProvider";
-import AppTopBar from "~material/AppTopBar";
 
 let cachedEntry: [string, mastodon.v1.Status] | undefined;
 
@@ -48,11 +44,13 @@ function getCache(acct: string, id: string) {
 
 const TootBottomSheet: Component = (props) => {
   const params = useParams<{ acct: string; id: string }>();
-  const { push } = useNavigator();
+  const location = useLocation<{
+    tootReply?: boolean;
+  }>();
+  const { pop, push } = useNavigator();
   const time = createTimeSource();
   const acctText = () => decodeURIComponent(params.acct);
   const session = useSessionForAcctStr(acctText);
-  const [, selectionState] = createSingluarItemSelection();
 
   const [remoteToot, { mutate: setRemoteToot }] = createResource(
     () => [session().client, params.id] as const,
@@ -249,18 +247,25 @@ const TootBottomSheet: Component = (props) => {
   return (
     <Scaffold
       topbar={
-        <AppTopBar
-          style={{
-            "background-color": "var(--tutu-color-surface)",
+        <AppBar
+          sx={{
+            backgroundColor: "var(--tutu-color-surface)",
             color: "var(--tutu-color-on-surface)",
           }}
+          elevation={1}
+          position="static"
         >
-          <BackButton color="inherit" />
-          <Title component="div" class="name" use:solid-styled>
-            <span innerHTML={tootDisplayName() ?? "Someone"}></span>
-            <span>'s toot</span>
-          </Title>
-        </AppTopBar>
+          <Toolbar
+            variant="dense"
+            sx={{ paddingTop: "var(--safe-area-inset-top, 0px)" }}
+          >
+            <BackButton color="inherit" />
+            <Title component="div" class="name" use:solid-styled>
+              <span innerHTML={tootDisplayName() ?? "Someone"}></span>
+              <span>'s toot</span>
+            </Title>
+          </Toolbar>
+        </AppBar>
       }
       class="TootBottomSheet"
     >
@@ -317,13 +322,11 @@ const TootBottomSheet: Component = (props) => {
             </div>
           </Show>
 
-          <ItemSelectionProvider value={selectionState}>
-            <TootList
-              threads={descendants.list}
-              onUnknownThread={descendants.getPath}
-              onChangeToot={descendants.set}
-            />
-          </ItemSelectionProvider>
+          <TootList
+            threads={descendants.list}
+            onUnknownThread={descendants.getPath}
+            onChangeToot={descendants.set}
+          />
         </TimeSourceProvider>
       </div>
     </Scaffold>

src/timelines/toots/TootContent.tsx

@@ -17,7 +17,7 @@ function preventDefault(event: Event) {
   event.preventDefault();
 }
 
-export type TootContentProps = JSX.HTMLAttributes<HTMLElement> & {
+export type TootContentProps = JSX.HTMLAttributes<HTMLDivElement> & {
   source?: string;
   emojis?: mastodon.v1.CustomEmoji[];
   mentions: mastodon.v1.StatusMention[];
@@ -58,7 +58,7 @@ const TootContent: Component<TootContentProps> = (oprops) => {
   };
 
   return (
-    <section
+    <div
       ref={(ref) => {
         createRenderEffect(() => {
           const finder = clientFinder();
@@ -104,7 +104,7 @@ const TootContent: Component<TootContentProps> = (oprops) => {
           }
         ></div>
       </Show>
-    </section>
+    </div>
   );
 };