Merged master

src/components/newsEntry.js

@@ -0,0 +1,67 @@
+import React from 'react'
+
+import ReactButton from './reactButton.js'
+import Comments from './comments.js'
+
+import styles from './newsEntry.module.css'
+
+export default function NewsEntry({
+  newsItem,
+  uid,
+  onReact,
+  onComment,
+  onDelete,
+  onPostDelete,
+}) {
+  const { reacts, title, content, user, comments, date, admin } = newsItem
+
+  return (
+    <div className={styles.newsRoot}>
+      <div className={`${styles.newsContainer} ${admin && styles.adminPost}`}>
+        <div className={styles.newsHeader}>
+          <div
+            className={styles.newsTitle}
+            dangerouslySetInnerHTML={{ __html: title }}
+          />
+          <div className={styles.user}>
+            <div>User #{user}</div>
+            <div className={styles.newsDate}>{date}</div>
+          </div>
+        </div>
+        <div
+          className={styles.newsBody}
+          dangerouslySetInnerHTML={{ __html: content }}
+        />
+      </div>
+      <div className={'actions'}>
+        {uid === user ? (
+          <span
+            onClick={() => {
+              onPostDelete()
+            }}
+          >
+            Delete
+          </span>
+        ) : null}
+        <ReactButton
+          existingReacts={reacts}
+          uid={uid}
+          onClick={(reaction, isDelete) => {
+            onReact({ type: 'news', reaction, isDelete })
+          }}
+        />
+      </div>
+      <Comments
+        uid={uid}
+        onReact={(path, reaction, isDelete) => {
+          onReact({ type: 'comment', path, reaction, isDelete })
+        }}
+        onComment={onComment}
+        onDelete={onDelete}
+        comments={comments}
+      />
+      <hr />
+      <hr />
+    </div>
+  )
+}