Refactor of comments and posts
This commit is contained in:
parent
2fe0090422
commit
6be8925970
2 changed files with 13 additions and 15 deletions
|
@ -2,16 +2,14 @@ import { JSXElement, splitProps } from "solid-js";
|
|||
|
||||
import { PublicComment } from "../Util/api";
|
||||
|
||||
interface CommentProps {
|
||||
comment: PublicComment;
|
||||
}
|
||||
|
||||
export function Comment(props: CommentProps): JSXElement {
|
||||
export function Comment(props: { comment: PublicComment }): JSXElement {
|
||||
const [local] = splitProps(props, ["comment"]);
|
||||
const dateOfCreation = new Date(local.comment.created_at).toDateString();
|
||||
|
||||
return (
|
||||
<>
|
||||
<div class="py-5">
|
||||
<time class="text-xs opacity-50">{local.comment.created_at}</time>
|
||||
<time class="text-xs opacity-50">{dateOfCreation}</time>
|
||||
</div>
|
||||
<div class="">{local.comment.content}</div>
|
||||
<div class="divider" />
|
||||
|
|
|
@ -1,4 +1,4 @@
|
|||
import { JSXElement, Show } from "solid-js";
|
||||
import { JSXElement, Show, splitProps } from "solid-js";
|
||||
|
||||
import { Post } from "../Util/api";
|
||||
import CommentsButton from "./Buttons/CommentsButton";
|
||||
|
@ -8,9 +8,9 @@ import ReportButton from "./Buttons/Report";
|
|||
import ToPostButton from "./Buttons/ToPost";
|
||||
|
||||
export function PostSegment(props: { post: Post }): JSXElement {
|
||||
const { post } = props; // Destructuring the post object from props
|
||||
const dateOfCreation = new Date(post.createdAt).toDateString();
|
||||
const isEdited = !(post.createdAt == post.updatedAt);
|
||||
const [local] = splitProps(props, ["post"]);
|
||||
const dateOfCreation = new Date(local.post.createdAt).toDateString();
|
||||
const isEdited = !(local.post.createdAt == local.post.updatedAt);
|
||||
|
||||
return (
|
||||
<div class="card compact w-full flex-grow border-b-2 border-b-primary bg-base-200 text-base-content transition-all hover:bg-base-300">
|
||||
|
@ -24,7 +24,7 @@ export function PostSegment(props: { post: Post }): JSXElement {
|
|||
<ReportButton />
|
||||
</li>
|
||||
<li>
|
||||
<RemovePostButton postId={post.id} />
|
||||
<RemovePostButton postId={local.post.id} />
|
||||
</li>
|
||||
</ul>
|
||||
</details>
|
||||
|
@ -32,13 +32,13 @@ export function PostSegment(props: { post: Post }): JSXElement {
|
|||
<Show when={isEdited}>
|
||||
<p>This post has been edited</p>
|
||||
</Show>
|
||||
<p class="my-1 text-base">{post.content}</p>
|
||||
<p class="my-1 text-base">{local.post.content}</p>
|
||||
<div class="card-actions justify-between">
|
||||
<div class="flex">
|
||||
<EngagementButton postId={post.id} />
|
||||
<CommentsButton postId={post.id} />
|
||||
<EngagementButton postId={local.post.id} />
|
||||
<CommentsButton postId={local.post.id} />
|
||||
</div>
|
||||
<ToPostButton post={post} />
|
||||
<ToPostButton post={local.post} />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
Loading…
Reference in a new issue