diff --git a/src/components/post/index.tsx b/src/components/post/index.tsx
index d8a2cb728..134c9b2fd 100644
--- a/src/components/post/index.tsx
+++ b/src/components/post/index.tsx
@@ -64,7 +64,7 @@ export const Post = React.memo(({ event }: PostProps) => {
-
+
diff --git a/src/components/post/post-contents.tsx b/src/components/post/post-contents.tsx
index 0405720b0..de4042369 100644
--- a/src/components/post/post-contents.tsx
+++ b/src/components/post/post-contents.tsx
@@ -1,16 +1,20 @@
import React from "react";
-import { AspectRatio, Box, Image, ImageProps, Link, useDisclosure } from "@chakra-ui/react";
+import { AspectRatio, Box, Image, ImageProps, Link, PinInputField, useDisclosure } from "@chakra-ui/react";
import { InlineInvoiceCard } from "../inline-invoice-card";
import { TweetEmbed } from "../tweet-embed";
import { UserLink } from "../user-link";
import { normalizeToHex } from "../../helpers/nip-19";
+import { NostrEvent } from "../../types/nostr-event";
const BlurredImage = (props: ImageProps) => {
const { isOpen, onToggle } = useDisclosure();
return ;
};
-const embeds: { regexp: RegExp; render: (match: RegExpMatchArray, trusted: boolean) => JSX.Element | string }[] = [
+const embeds: {
+ regexp: RegExp;
+ render: (match: RegExpMatchArray, event?: NostrEvent, trusted?: boolean) => JSX.Element | string;
+}[] = [
// Lightning Invoice
{
regexp: /(lightning:)?(LNBC[A-Za-z0-9]+)/im,
@@ -105,6 +109,20 @@ const embeds: { regexp: RegExp; render: (match: RegExpMatchArray, trusted: boole
}
},
},
+ // Nostr Embeds
+ {
+ regexp: /#\[(\d+)\]/,
+ render: (match, event) => {
+ const index = parseInt(match[1]);
+ const tag = event?.tags[index];
+
+ if (tag && tag[0] === "p" && tag[1]) {
+ return ;
+ }
+
+ return match[0];
+ },
+ },
// bold text
{
regexp: /\*\*([^\n]+)\*\*/im,
@@ -112,26 +130,30 @@ const embeds: { regexp: RegExp; render: (match: RegExpMatchArray, trusted: boole
},
];
-function embedContent(content: string, trusted: boolean): (string | JSX.Element)[] {
+function embedContent(content: string, event?: NostrEvent, trusted: boolean = false): (string | JSX.Element)[] {
for (const { regexp, render } of embeds) {
const match = content.match(regexp);
if (match && match.index !== undefined) {
const before = content.slice(0, match.index);
const after = content.slice(match.index + match[0].length, content.length);
- return [...embedContent(before, trusted), render(match, trusted ?? false), ...embedContent(after, trusted)];
+ return [
+ ...embedContent(before, event, trusted),
+ render(match, event, trusted ?? false),
+ ...embedContent(after, event, trusted),
+ ];
}
}
return [content];
}
export type PostContentsProps = {
- content: string;
+ event: NostrEvent;
trusted?: boolean;
};
-export const PostContents = React.memo(({ content, trusted }: PostContentsProps) => {
- const parts = embedContent(content, trusted ?? false);
+export const PostContents = React.memo(({ event, trusted }: PostContentsProps) => {
+ const parts = embedContent(event.content, event, trusted ?? false);
return (
{parts.map((part) => (typeof part === "string" ? {part} : part))}