FrostByte/client-solid/src/Components/SinglePost.tsx

import { useParams } from "@solidjs/router";
import {
  JSXElement,
  Show,
  Suspense,
  createResource,
  useContext,
} from "solid-js";

import { LoginContext } from "../Context/GlobalState";
import { loadSpinner } from "../Util/Icons";
import { getPost } from "../Util/api";
import { CommentSection } from "./CommentSection";
import { NewCommentInputArea } from "./NewComment";
import { PostSegment } from "./Posts";

export function SinglePost(): JSXElement {
  const params = useParams();
  const [post] = createResource(params.postid, getPost);
  const login_ctx = useContext(LoginContext)!; // Assuming login context is always available

  return (
    <Suspense fallback={loadSpinner()}>
      <Show when={post()}>
        <PostSegment post={post()!} />
        <Show when={login_ctx.loggedIn()}>
          <NewCommentInputArea parentCommentId={null} parentPostId={parseInt(params.postid)} />
        </Show>
        <CommentSection postId={params.postid} />
      </Show>
    </Suspense>
  );
}