From 6be8925970b7f2a3253577928c73dfed3be2f281 Mon Sep 17 00:00:00 2001
From: Hollgy <karlgustav.ek@hotmail.com>
Date: Sun, 24 Mar 2024 21:40:57 +0100
Subject: [PATCH] Refactor of comments and posts

---
 client-solid/src/Components/Comment.tsx     | 10 ++++------
 client-solid/src/Components/PostSegment.tsx | 18 +++++++++---------
 2 files changed, 13 insertions(+), 15 deletions(-)

diff --git a/client-solid/src/Components/Comment.tsx b/client-solid/src/Components/Comment.tsx
index 94fda21..4e64063 100644
--- a/client-solid/src/Components/Comment.tsx
+++ b/client-solid/src/Components/Comment.tsx
@@ -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" />
diff --git a/client-solid/src/Components/PostSegment.tsx b/client-solid/src/Components/PostSegment.tsx
index 197d3cd..cf5c6c2 100644
--- a/client-solid/src/Components/PostSegment.tsx
+++ b/client-solid/src/Components/PostSegment.tsx
@@ -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>