diff --git a/packages/app/src/components/PostCard/components/attachments/index.jsx b/packages/app/src/components/PostCard/components/attachments/index.jsx
index 312b0bde..9c8ece52 100755
--- a/packages/app/src/components/PostCard/components/attachments/index.jsx
+++ b/packages/app/src/components/PostCard/components/attachments/index.jsx
@@ -1,5 +1,5 @@
 import React from "react"
-import { Skeleton } from "antd"
+import { Skeleton, Button } from "antd"
 import { ImageViewer } from "components"
 import Plyr from "plyr-react"
 import mimetypes from "mime"
@@ -130,6 +130,7 @@ const Attachment = React.memo((props) => {
 export default React.memo((props) => {
     const [controller, setController] = React.useState()
     const [carouselState, setCarouselState] = React.useState()
+    const [nsfwAccepted, setNsfwAccepted] = React.useState(false)
 
     React.useEffect(() => {
         // get attachment index from query string
@@ -141,6 +142,19 @@ export default React.memo((props) => {
     }, [])
 
     return <div className="post_attachments">
+        {
+            props.flags && props.flags.includes("nsfw") && !nsfwAccepted &&
+            <div className="nsfw_alert">
+                <h2>
+                    This post may contain sensitive content.
+                </h2>
+
+                <Button onClick={() => setNsfwAccepted(true)}>
+                    Show anyways
+                </Button>
+            </div>
+        }
+
         {
             props.attachments?.length > 0 && <BearCarousel
                 data={props.attachments.map((attachment, index) => {
diff --git a/packages/app/src/components/PostCard/index.jsx b/packages/app/src/components/PostCard/index.jsx
index 2b98042a..7668fefa 100755
--- a/packages/app/src/components/PostCard/index.jsx
+++ b/packages/app/src/components/PostCard/index.jsx
@@ -178,19 +178,6 @@ export default class PostCard extends React.PureComponent {
                     "post_content",
                 )}
             >
-                {
-                    this.state.isNsfw && !this.state.nsfwAccepted &&
-                    <div className="nsfw_alert">
-                        <h2>
-                            This post may contain sensitive content.
-                        </h2>
-
-                        <antd.Button onClick={() => this.setState({ nsfwAccepted: true })}>
-                            Show anyways
-                        </antd.Button>
-                    </div>
-                }
-
                 <div className="message">
                     {
                         processString(messageRegexs)(this.props.data.message ?? "")
@@ -200,8 +187,8 @@ export default class PostCard extends React.PureComponent {
                 {
                     !this.props.disableAttachments && this.props.data.attachments && this.props.data.attachments.length > 0 && <PostAttachments
                         attachments={this.props.data.attachments}
+                        flags={this.props.data.flags}
                     />
-
                 }
             </div>