import { useParams } from "@solidjs/router";
import type { Component } from "solid-js";
import Scaffold from "../material/Scaffold";
import TootThread from "./TootThread";
import { AppBar, Toolbar } from "@suid/material";
import { Title } from "../material/typography";

const TootBottomSheet: Component = (props) => {
  const params = useParams()
  return <Scaffold
  topbar={
    <AppBar position="static">
      <Toolbar variant="dense" sx={{paddingTop: "var(--safe-area-inset-top, 0px)"}}>
        <Title>A Toot</Title>
      </Toolbar>
    </AppBar>
  }
  >
    <p>{params.acct}/{params.id}</p>
  </Scaffold>;
};

export default TootBottomSheet;