refactor: extract imeta directly in text parser
This commit is contained in:
parent
29ca482511
commit
a54924f339
@ -8,7 +8,7 @@ import useImgProxy from "@/Hooks/useImgProxy";
|
|||||||
interface SpotlightMediaProps {
|
interface SpotlightMediaProps {
|
||||||
media: Array<string>;
|
media: Array<string>;
|
||||||
idx: number;
|
idx: number;
|
||||||
className: string;
|
className?: string;
|
||||||
onClose: () => void;
|
onClose: () => void;
|
||||||
onNext?: () => void;
|
onNext?: () => void;
|
||||||
onPrev?: () => void;
|
onPrev?: () => void;
|
||||||
|
@ -1,6 +1,6 @@
|
|||||||
import "./Text.css";
|
import "./Text.css";
|
||||||
|
|
||||||
import { HexKey, ParsedFragment, parseIMeta } from "@snort/system";
|
import { HexKey, IMeta, ParsedFragment } from "@snort/system";
|
||||||
import classNames from "classnames";
|
import classNames from "classnames";
|
||||||
import { ReactNode, useState } from "react";
|
import { ReactNode, useState } from "react";
|
||||||
|
|
||||||
@ -100,9 +100,7 @@ export default function Text({
|
|||||||
const [imageIdx, setImageIdx] = useState(0);
|
const [imageIdx, setImageIdx] = useState(0);
|
||||||
|
|
||||||
const elements = useTextTransformer(id, content, tags);
|
const elements = useTextTransformer(id, content, tags);
|
||||||
|
|
||||||
const images = elements.filter(a => a.type === "media" && a.mimeType?.startsWith("image")).map(a => a.content);
|
const images = elements.filter(a => a.type === "media" && a.mimeType?.startsWith("image")).map(a => a.content);
|
||||||
const iMeta = parseIMeta(tags);
|
|
||||||
|
|
||||||
function renderContentWithHighlightedText(content: string, textToHighlight: string) {
|
function renderContentWithHighlightedText(content: string, textToHighlight: string) {
|
||||||
const textToHighlightArray = textToHighlight.trim().toLowerCase().split(" ");
|
const textToHighlightArray = textToHighlight.trim().toLowerCase().split(" ");
|
||||||
@ -139,8 +137,8 @@ export default function Text({
|
|||||||
</a>
|
</a>
|
||||||
);
|
);
|
||||||
|
|
||||||
const RevealMediaInstance = ({ content }: { content: string }) => {
|
const RevealMediaInstance = ({ content, data }: { content: string, data?: object }) => {
|
||||||
const imeta = iMeta?.[content];
|
const imeta = data as IMeta;
|
||||||
return (
|
return (
|
||||||
<RevealMedia
|
<RevealMedia
|
||||||
key={content}
|
key={content}
|
||||||
@ -198,7 +196,7 @@ export default function Text({
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
if (galleryImages.length === 1) {
|
if (galleryImages.length === 1) {
|
||||||
chunks.push(<RevealMediaInstance content={galleryImages[0].content} />);
|
chunks.push(<RevealMediaInstance content={galleryImages[0].content} data={galleryImages[0]} />);
|
||||||
} else {
|
} else {
|
||||||
// We build a grid layout to render the grouped images
|
// We build a grid layout to render the grouped images
|
||||||
const imagesWithGridConfig = galleryImages.map((gi, index) => {
|
const imagesWithGridConfig = galleryImages.map((gi, index) => {
|
||||||
@ -211,6 +209,7 @@ export default function Text({
|
|||||||
|
|
||||||
return {
|
return {
|
||||||
content: gi.content,
|
content: gi.content,
|
||||||
|
data: gi.data,
|
||||||
gridColumn: config ? config[index][0] : 1,
|
gridColumn: config ? config[index][0] : 1,
|
||||||
gridRow: config ? config[index][1] : 1,
|
gridRow: config ? config[index][1] : 1,
|
||||||
height,
|
height,
|
||||||
@ -227,7 +226,7 @@ export default function Text({
|
|||||||
gridColumn: `span ${img.gridColumn}`,
|
gridColumn: `span ${img.gridColumn}`,
|
||||||
gridRow: `span ${img.gridRow}`,
|
gridRow: `span ${img.gridRow}`,
|
||||||
}}>
|
}}>
|
||||||
<RevealMediaInstance content={img.content} />
|
<RevealMediaInstance content={img.content} data={img.data} />
|
||||||
</div>
|
</div>
|
||||||
))}
|
))}
|
||||||
</div>
|
</div>
|
||||||
|
@ -32,7 +32,6 @@ export * from "./pow-util";
|
|||||||
export * from "./query-optimizer";
|
export * from "./query-optimizer";
|
||||||
export * from "./encrypted";
|
export * from "./encrypted";
|
||||||
export * from "./outbox-model";
|
export * from "./outbox-model";
|
||||||
export { parseIMeta } from "./utils";
|
|
||||||
|
|
||||||
export * from "./impl/nip4";
|
export * from "./impl/nip4";
|
||||||
export * from "./impl/nip44";
|
export * from "./impl/nip44";
|
||||||
|
@ -11,6 +11,7 @@ import {
|
|||||||
} from "./const";
|
} from "./const";
|
||||||
import { NostrLink, validateNostrLink } from "./nostr-link";
|
import { NostrLink, validateNostrLink } from "./nostr-link";
|
||||||
import { splitByUrl } from "./utils";
|
import { splitByUrl } from "./utils";
|
||||||
|
import { IMeta } from "./nostr";
|
||||||
|
|
||||||
export interface ParsedFragment {
|
export interface ParsedFragment {
|
||||||
type:
|
type:
|
||||||
@ -27,6 +28,7 @@ export interface ParsedFragment {
|
|||||||
content: string;
|
content: string;
|
||||||
mimeType?: string;
|
mimeType?: string;
|
||||||
language?: string;
|
language?: string;
|
||||||
|
data?: object;
|
||||||
}
|
}
|
||||||
|
|
||||||
export type Fragment = string | ParsedFragment;
|
export type Fragment = string | ParsedFragment;
|
||||||
@ -81,10 +83,12 @@ function extractLinks(fragments: Fragment[]) {
|
|||||||
return "unknown";
|
return "unknown";
|
||||||
}
|
}
|
||||||
})();
|
})();
|
||||||
|
const data = parseInlineMetaHack(url);
|
||||||
return {
|
return {
|
||||||
type: "media",
|
type: "media",
|
||||||
content: a,
|
content: data ? `${url.protocol}//${url.host}${url.pathname}${url.search}` : a,
|
||||||
mimeType: `${mediaType}/${extension[1]}`,
|
mimeType: `${mediaType}/${extension[1]}`,
|
||||||
|
data,
|
||||||
} as ParsedFragment;
|
} as ParsedFragment;
|
||||||
} else {
|
} else {
|
||||||
return {
|
return {
|
||||||
@ -249,6 +253,57 @@ function extractMarkdownCode(fragments: Fragment[]): (string | ParsedFragment)[]
|
|||||||
.flat();
|
.flat();
|
||||||
}
|
}
|
||||||
|
|
||||||
|
export function parseIMeta(tags: Array<Array<string>>) {
|
||||||
|
let ret: Record<string, IMeta> | undefined;
|
||||||
|
const imetaTags = tags.filter(a => a[0] === "imeta");
|
||||||
|
for (const imetaTag of imetaTags) {
|
||||||
|
ret ??= {};
|
||||||
|
let imeta: IMeta = {};
|
||||||
|
let url = "";
|
||||||
|
for (const t of imetaTag.slice(1)) {
|
||||||
|
const [k, v] = t.split(" ");
|
||||||
|
if (k === "url") {
|
||||||
|
url = v;
|
||||||
|
}
|
||||||
|
if (k === "dim") {
|
||||||
|
const [w, h] = v.split("x");
|
||||||
|
imeta.height = Number(h);
|
||||||
|
imeta.width = Number(w);
|
||||||
|
}
|
||||||
|
if (k === "blurhash") {
|
||||||
|
imeta.blurHash = v;
|
||||||
|
}
|
||||||
|
if (k === "x") {
|
||||||
|
imeta.sha256 = v;
|
||||||
|
}
|
||||||
|
if (k === "alt") {
|
||||||
|
imeta.alt = v;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
ret[url] = imeta;
|
||||||
|
}
|
||||||
|
return ret;
|
||||||
|
}
|
||||||
|
|
||||||
|
export function parseInlineMetaHack(u: URL) {
|
||||||
|
if (u.hash) {
|
||||||
|
const params = new URLSearchParams(u.hash.substring(1));
|
||||||
|
|
||||||
|
let imeta: IMeta = {};
|
||||||
|
const dim = params.get("dim");
|
||||||
|
if (dim) {
|
||||||
|
const [w, h] = dim.split("x");
|
||||||
|
imeta.height = Number(h);
|
||||||
|
imeta.width = Number(w);
|
||||||
|
}
|
||||||
|
imeta.blurHash = params.get("blurhash") ?? undefined;
|
||||||
|
imeta.sha256 = params.get("x") ?? undefined;
|
||||||
|
imeta.alt = params.get("alt") ?? undefined;
|
||||||
|
|
||||||
|
return imeta;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
export function transformText(body: string, tags: Array<Array<string>>) {
|
export function transformText(body: string, tags: Array<Array<string>>) {
|
||||||
let fragments = extractLinks([body]);
|
let fragments = extractLinks([body]);
|
||||||
fragments = extractMentions(fragments);
|
fragments = extractMentions(fragments);
|
||||||
@ -258,7 +313,7 @@ export function transformText(body: string, tags: Array<Array<string>>) {
|
|||||||
fragments = extractCashuTokens(fragments);
|
fragments = extractCashuTokens(fragments);
|
||||||
fragments = extractCustomEmoji(fragments, tags);
|
fragments = extractCustomEmoji(fragments, tags);
|
||||||
fragments = extractMarkdownCode(fragments);
|
fragments = extractMarkdownCode(fragments);
|
||||||
fragments = removeUndefined(
|
const frags = removeUndefined(
|
||||||
fragments.map(a => {
|
fragments.map(a => {
|
||||||
if (typeof a === "string") {
|
if (typeof a === "string") {
|
||||||
if (a.length > 0) {
|
if (a.length > 0) {
|
||||||
@ -269,5 +324,17 @@ export function transformText(body: string, tags: Array<Array<string>>) {
|
|||||||
}
|
}
|
||||||
}),
|
}),
|
||||||
);
|
);
|
||||||
return fragments as Array<ParsedFragment>;
|
|
||||||
|
const imeta = parseIMeta(tags);
|
||||||
|
if (imeta) {
|
||||||
|
for (const f of frags) {
|
||||||
|
if (f.type === "media") {
|
||||||
|
const ix = imeta[f.content];
|
||||||
|
if (ix) {
|
||||||
|
f.data = ix;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
return frags;
|
||||||
}
|
}
|
||||||
|
@ -51,38 +51,6 @@ export function splitByUrl(str: string) {
|
|||||||
return str.split(urlRegex);
|
return str.split(urlRegex);
|
||||||
}
|
}
|
||||||
|
|
||||||
export function parseIMeta(tags: Array<Array<string>>) {
|
|
||||||
let ret: Record<string, IMeta> | undefined;
|
|
||||||
const imetaTags = tags.filter(a => a[0] === "imeta");
|
|
||||||
for (const imetaTag of imetaTags) {
|
|
||||||
ret ??= {};
|
|
||||||
let imeta: IMeta = {};
|
|
||||||
let url = "";
|
|
||||||
for (const t of imetaTag.slice(1)) {
|
|
||||||
const [k, v] = t.split(" ");
|
|
||||||
if (k === "url") {
|
|
||||||
url = v;
|
|
||||||
}
|
|
||||||
if (k === "dim") {
|
|
||||||
const [w, h] = v.split("x");
|
|
||||||
imeta.height = Number(h);
|
|
||||||
imeta.width = Number(w);
|
|
||||||
}
|
|
||||||
if (k === "blurhash") {
|
|
||||||
imeta.blurHash = v;
|
|
||||||
}
|
|
||||||
if (k === "x") {
|
|
||||||
imeta.sha256 = v;
|
|
||||||
}
|
|
||||||
if (k === "alt") {
|
|
||||||
imeta.alt = v;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
ret[url] = imeta;
|
|
||||||
}
|
|
||||||
return ret;
|
|
||||||
}
|
|
||||||
|
|
||||||
export function getHex64(json: string, field: string): string {
|
export function getHex64(json: string, field: string): string {
|
||||||
let len = field.length + 3;
|
let len = field.length + 3;
|
||||||
let idx = json.indexOf(`"${field}":`) + len;
|
let idx = json.indexOf(`"${field}":`) + len;
|
||||||
|
Loading…
Reference in New Issue
Block a user