diff --git a/apps/desktop2/src/components/note/content.tsx b/apps/desktop2/src/components/note/content.tsx
index e0095ee0..f2d647b4 100644
--- a/apps/desktop2/src/components/note/content.tsx
+++ b/apps/desktop2/src/components/note/content.tsx
@@ -1,7 +1,7 @@
import { cn } from "@lume/utils";
import { useRouteContext } from "@tanstack/react-router";
import { nanoid } from "nanoid";
-import { type ReactNode, useMemo } from "react";
+import { type ReactNode, useMemo, useState } from "react";
import reactStringReplace from "react-string-replace";
import { Hashtag } from "./mentions/hashtag";
import { MentionNote } from "./mentions/note";
@@ -23,6 +23,8 @@ export function NoteContent({
}) {
const { settings } = useRouteContext({ strict: false });
const event = useNoteContext();
+
+ const warning = useMemo(() => event.warning, [event]);
const content = useMemo(() => {
try {
// Get parsed meta
@@ -91,8 +93,29 @@ export function NoteContent({
}
}, [event.content]);
+ const [blurred, setBlurred] = useState(() => warning?.length > 0);
+
return (
-
+
+ {blurred ? (
+
+
+
+ The content is hidden because the author
+
+ marked it with a warning for a reason:
+
+
{warning}
+
+
+
+ ) : null}
{content}
- {settings.display_media && event.meta?.images.length ? (
-
- ) : null}
- {settings.display_media && event.meta?.videos.length ? (
-
+ {settings.display_media ? (
+ <>
+ {event.meta?.images.length ? (
+
+ ) : null}
+ {event.meta?.videos.length ? (
+
+ ) : null}
+ >
) : null}
);
diff --git a/packages/system/src/event.ts b/packages/system/src/event.ts
index 3fee7b67..4f9866ad 100644
--- a/packages/system/src/event.ts
+++ b/packages/system/src/event.ts
@@ -25,11 +25,6 @@ export class LumeEvent {
Object.assign(this, event);
}
- get isWarning() {
- const tag = this.tags.find((tag) => tag[0] === "content-warning");
- return tag?.[1]; // return: reason;
- }
-
get isQuote() {
return this.tags.filter((tag) => tag[0] === "q").length > 0;
}
@@ -95,6 +90,26 @@ export class LumeEvent {
return { id, relayHint };
}
+ get warning() {
+ const warningTag = this.tags.filter(
+ (tag) => tag[0] === "content-warning",
+ )?.[0];
+
+ if (warningTag) {
+ return warningTag[1];
+ } else {
+ const nsfwTag = this.tags.filter(
+ (tag) => tag[0] === "t" && tag[1] === "NSFW",
+ )?.[0];
+
+ if (nsfwTag) {
+ return "NSFW";
+ } else {
+ return null;
+ }
+ }
+ }
+
public async getAllReplies() {
const query = await commands.getReplies(this.id);