From c3be8425a2a0b4e1d462cd67dbb3009d12af1791 Mon Sep 17 00:00:00 2001
From: Lukas <lukas.budginas@gmail.com>
Date: Fri, 3 Jan 2025 16:51:39 +0200
Subject: [PATCH] Create separate compoennts for post content and post comments
---
components/post/PostComments.tsx | 28 +++++++++++++++++++
components/post/PostContent.tsx | 48 ++++++++++++++++++++++++++++++++
2 files changed, 76 insertions(+)
create mode 100644 components/post/PostComments.tsx
create mode 100644 components/post/PostContent.tsx
diff --git a/components/post/PostComments.tsx b/components/post/PostComments.tsx
new file mode 100644
index 00000000..7c137afb
--- /dev/null
+++ b/components/post/PostComments.tsx
@@ -0,0 +1,28 @@
+import Hive from "@/types/Hive";
+import PostContent from "./PostContent";
+
+interface PostCommentsProps {
+ comments: Hive.Content[];
+}
+
+const PostComments: React.FC<PostCommentsProps> = ({ comments }) => {
+ if (!comments || !comments.length) return null;
+
+ return comments.map((comment) => {
+ return (
+ <div
+ className="flex mt-4 justify-center"
+ key={comment.id}
+ >
+ <div className="w-[70%]">
+ <PostContent
+ active_votes={comment.active_votes}
+ data={comment}
+ />
+ </div>
+ </div>
+ );
+ });
+};
+
+export default PostComments;
diff --git a/components/post/PostContent.tsx b/components/post/PostContent.tsx
new file mode 100644
index 00000000..8d70d319
--- /dev/null
+++ b/components/post/PostContent.tsx
@@ -0,0 +1,48 @@
+import { useState } from "react";
+
+import Hive from "@/types/Hive";
+import PostContentCard from "./PostContentCard";
+import PostPropertiesTable from "./PostPropertiesTable";
+import VoteDetailsTable from "./VoteDetailsTable";
+
+interface PostContentProps {
+ active_votes: Hive.PostPageVoteDetails[];
+ data: Hive.Content;
+}
+
+const PostContent: React.FC<PostContentProps> = ({ active_votes, data }) => {
+ const [isPropertiesOpen, setIsPropertiesOpen] = useState(false);
+ const [isVoteDetailsOpen, setIsVoteDetailsOpen] = useState(false);
+
+ const handlePropertiesToggle = () => setIsPropertiesOpen(!isPropertiesOpen);
+ const handleVoteDetailsToggle = () =>
+ setIsVoteDetailsOpen(!isVoteDetailsOpen);
+
+ const voters = active_votes.map((vote) => vote.voter) ?? [];
+
+ return (
+ <>
+ <PostContentCard
+ isPropertiesOpen={isPropertiesOpen}
+ isVoteDetailsOpen={isVoteDetailsOpen}
+ handlePropertiesToggle={handlePropertiesToggle}
+ handleVoteDetailsToggle={handleVoteDetailsToggle}
+ voteDetailsLength={active_votes.length ?? 0}
+ voters={voters}
+ data={data}
+ />
+ <PostPropertiesTable
+ isPropertiesOpen={isPropertiesOpen}
+ data={data}
+ />
+ {active_votes.length && (
+ <VoteDetailsTable
+ isVoteDetailsOpen={isVoteDetailsOpen}
+ voteDetails={active_votes}
+ />
+ )}
+ </>
+ );
+};
+
+export default PostContent;
--
GitLab