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

40 lines
1.1 KiB
TypeScript

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 "./PostSegment";
/**
* This is the view for a single post along with its comments.
* @returns {JSXElement} A JSXElement
*/
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>
);
}