From 559a0237435a2d98d75fff0e03c47c1a884f65af Mon Sep 17 00:00:00 2001
From: srgooglo <srgooglo@ragestudio.net>
Date: Sun, 16 Oct 2022 19:33:03 +0200
Subject: [PATCH] show warning on `nsfw` flag

---
 .../PostCard/components/content/index.jsx     | 23 +++++++++++++++++--
 .../PostCard/components/content/index.less    | 21 +++++++++++++++++
 2 files changed, 42 insertions(+), 2 deletions(-)

diff --git a/packages/app/src/components/PostCard/components/content/index.jsx b/packages/app/src/components/PostCard/components/content/index.jsx
index ceb761e4..293b661f 100755
--- a/packages/app/src/components/PostCard/components/content/index.jsx
+++ b/packages/app/src/components/PostCard/components/content/index.jsx
@@ -1,4 +1,5 @@
 import React from "react"
+import classnames from "classnames"
 import * as antd from "antd"
 import Plyr from "plyr-react"
 
@@ -11,7 +12,11 @@ import PostAttachments from "../attachments"
 import "./index.less"
 
 export default React.memo((props) => {
-    let { message, attachments, type, data } = props.data
+    let { message, attachments, type, data, flags } = props.data
+
+    const [nsfwAccepted, setNsfwAccepted] = React.useState(false)
+
+    const isNSFW = flags?.includes("nsfw")
 
     if (typeof data === "string") {
         try {
@@ -105,7 +110,21 @@ export default React.memo((props) => {
         }
     }
 
-    return <div className="post_content">
+    return <div
+        className="post_content"
+    >
+        {isNSFW && !nsfwAccepted &&
+            <div className="nsfw_alert">
+                <h2>
+                    This post may contain sensitive content.
+                </h2>
+
+                <antd.Button onClick={() => setNsfwAccepted(true)}>
+                    Show anyways
+                </antd.Button>
+            </div>
+        }
+
         {renderContent()}
     </div>
 })
\ No newline at end of file
diff --git a/packages/app/src/components/PostCard/components/content/index.less b/packages/app/src/components/PostCard/components/content/index.less
index c25b5383..1c1a6613 100755
--- a/packages/app/src/components/PostCard/components/content/index.less
+++ b/packages/app/src/components/PostCard/components/content/index.less
@@ -1,4 +1,5 @@
 .post_content {
+    position: relative;
     display: inline-flex;
     flex-direction: column;
     align-items: flex-start;
@@ -12,6 +13,26 @@
 
     transition: all 0.2s ease-in-out;
 
+    .nsfw_alert {
+        position: absolute;
+
+        display: flex;
+        flex-direction: column;
+
+        align-items: center;
+        justify-content: center;
+
+        width: 100%;
+        height: 100%;
+
+        backdrop-filter: blur(25px);
+        background-color: rgba(0, 0, 0, 0.5);
+
+        border-radius: 8px;
+
+        z-index: 200;
+    }
+
     .message {
         width: 100%;