SWA-Project/SWA-frontend
2
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

show anonymousID in Posts and Comments

Browse Source
This commit is contained in:
Pete-Gerlach
2024-06-14 16:27:02 +02:00
parent 1ca4235283
commit 3f13bbdd19
2 changed files with 31 additions and 31 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
src/App.js
View File

@@ -23,7 +23,7 @@ const App = () => {
if(selectedPost) {
selectPost(posts.find(post => post.id === selectedPost.id));
}
}, [posts]);
}, [posts, selectedPost]);
const reload = async () => {

60
src/components/Post.js
View File

@@ -7,7 +7,6 @@ import {
faAngleUp,
faAngleDown
} from '@fortawesome/free-solid-svg-icons';
import {faMessage} from "@fortawesome/free-solid-svg-icons/faMessage";
import {postApi} from "../api/posts.api";
const Post = ({ post, recursionDepth, selectPost, reload }) => {
@@ -45,7 +44,10 @@ const Post = ({ post, recursionDepth, selectPost, reload }) => {
<div className="post" onClick={click => {if (!(click.target instanceof HTMLButtonElement)) setShowComments(!showComments)}}>
<div className="post-container">
{post.id === post.parent && <div className="post-title">
<h3>{post.title}</h3>
<h3>{post.title}<span style={{color: 'gray'}}> von {post.anonymousID}</span></h3>
</div>}
{post.id !== post.parent && <div className="post-title">
<h3>Kommentar<span style={{color: 'gray'}}> von {post.anonymousID}</span></h3>
</div>}
<div className="post-content">
<p>{post.content}</p>
@@ -57,37 +59,35 @@ const Post = ({ post, recursionDepth, selectPost, reload }) => {
</div>}
<div className="post-right">
<div className="post-date">
{post.date.slice(8, 10) + "." + post.date.slice(5, 7) + "." + post.date.slice(0, 4)}
</div>
<div className="row">
<div className="votes">
<button onClick={(e) => {
e.stopPropagation();
upvote();
}}>
{post.reaction === true ? <FontAwesomeIcon icon={faCaretUp}/> : <FontAwesomeIcon icon={faAngleUp} />}
</button>
<span>{post.reactions.positive - post.reactions.negative}</span>
<button onClick={(e) => {
e.stopPropagation();
downVote();
}}>
{post.reaction === false ? <FontAwesomeIcon icon={faCaretDown}/> : <FontAwesomeIcon icon={faAngleDown} />}
</button>
</div>
</div>
{recursionDepth !== 0 && <button onClick={() => selectPost(post)}>Antworten</button>}
{post.date.slice(8, 10) + "." + post.date.slice(5, 7) + "." + post.date.slice(0, 4)}
</div>
</div>
<div className="comment">
{recursionDepth !== 0 && showComments && post.comments.map(post => <Post key={post.id} post={post}
recursionDepth={recursionDepth - 1}
selectPost={selectPost}
reload={reload} />)}
<div className="row">
<div className="votes">
<button onClick={(e) => {
e.stopPropagation();
upvote();
}}>
{post.reaction === true ? <FontAwesomeIcon icon={faCaretUp}/> : <FontAwesomeIcon icon={faAngleUp} />}
</button>
<span>{post.reactions.positive - post.reactions.negative}</span>
<button onClick={(e) => {
e.stopPropagation();
downVote();
}}>
{post.reaction === false ? <FontAwesomeIcon icon={faCaretDown}/> : <FontAwesomeIcon icon={faAngleDown} />}
</button>
</div>
</div>
{recursionDepth !== 0 && <button onClick={() => selectPost(post)}>Antworten</button>}
</div>
</div>
)
;
<div className="comment">
{recursionDepth !== 0 && showComments && post.comments.map(post =>
<Post key={post.id} post={post} recursionDepth={recursionDepth - 1} selectPost={selectPost} reload={reload} />
)}
</div>
</div>
);
};
export default Post;