+
- {new Date(a.created_at * 1000).toLocaleString()}
+ {new Date(a.created_at * 1000).toLocaleString()}
- = ({ text }) => {
+ const segments = getSegments(text);
+
+ return (
+ }) {
}, [params]);
return (
- }) {
return (
-
+
-
Write a Comment
- - +
+
);
}
diff --git a/src/element/profile-image.tsx b/src/element/profile-image.tsx
index e6f38ab..320030f 100644
--- a/src/element/profile-image.tsx
+++ b/src/element/profile-image.tsx
@@ -26,7 +26,7 @@ export function ProfileImage({ pubkey, size, withName, children, ...props }: Pro
>
{withName === true && <>{profile?.name}}
diff --git a/src/element/rich-text-content.tsx b/src/element/rich-text-content.tsx
new file mode 100644
index 0000000..db77a99
--- /dev/null
+++ b/src/element/rich-text-content.tsx
@@ -0,0 +1,73 @@
+import React from 'react';
+
+interface RichTextContentProps {
+ text: string;
+}
+
+// Helper function to check if a string is an image URL
+const isImageUrl = (string: string): boolean => /\.(jpeg|jpg|gif|png)$/.test(string);
+
+// Helper function to check if a string is a web URL
+const isWebUrl = (string: string): boolean => {
+ const urlPattern = new RegExp('^(https?:\\/\\/)' + // protocol
+ '((([a-z\\d]([a-z\\d-]*[a-z\\d])*)\\.)+[a-z]{2,}|' + // domain name
+ '((\\d{1,3}\\.){3}\\d{1,3}))' + // OR IP (v4) address
+ '(\\:\\d+)?(\\/[-a-z\\d%_.~+]*)*' + // port and path
+ '(\\?[;&a-z\\d%_.~+=-]*)?' + // query string
+ '(\\#[-a-z\\d_]*)?$', 'i'); // fragment locator
+ return !!urlPattern.test(string);
+};
+
+// Function to split the text into segments
+const getSegments = (text: string): { type: 'text' | 'image' | 'link', content: string }[] => {
+ const words = text.match(/(\S+|\s+)/g) || [];
+ const segments: { type: 'text' | 'image' | 'link', content: string }[] = [];
+ let currentTextSegment = '';
+
+ words.forEach(word => {
+ const trimmedWord = word.trim();
+ if (isImageUrl(trimmedWord)) {
+ if (currentTextSegment) {
+ segments.push({ type: 'text', content: currentTextSegment });
+ currentTextSegment = '';
+ }
+ segments.push({ type: 'image', content: trimmedWord });
+ } else if (isWebUrl(trimmedWord)) {
+ if (currentTextSegment) {
+ segments.push({ type: 'text', content: currentTextSegment });
+ currentTextSegment = '';
+ }
+ segments.push({ type: 'link', content: trimmedWord });
+ } else {
+ currentTextSegment += word;
+ }
+ });
+
+ if (currentTextSegment) {
+ segments.push({ type: 'text', content: currentTextSegment });
+ }
+
+ return segments;
+};
+
+const RichTextContent: React.FC
+
+
+
+
+
+
+
+ {segments.map((segment, index) => {
+ switch(segment.type) {
+ case 'image':
+ return 
;
+ case 'link':
+ return {segment.content};
+ default:
+ return {segment.content};
+ }
+ })}
+
+ );
+};
+
+export default RichTextContent;
+
diff --git a/src/element/search.tsx b/src/element/search.tsx
index d2460d3..188716e 100644
--- a/src/element/search.tsx
+++ b/src/element/search.tsx
@@ -12,19 +12,17 @@ export function Search(params: { term?: string; tags?: Array
- setTerm(e.target.value)}
- onKeyDown={(e) => {
- if (e.key == "Enter") {
- navigate(`/search/${encodeURIComponent(term)}${tags.length > 0 ? `?tags=${tags.join(",")}` : ""}`);
- }
- }}
- />
-
+ setTerm(e.target.value)}
+ onKeyDown={(e) => {
+ if (e.key == "Enter") {
+ navigate(`/search/${encodeURIComponent(term)}${tags.length > 0 ? `?tags=${tags.join(",")}` : ""}`);
+ }
+ }}
+ />
);
}
diff --git a/src/element/torrent-list.css b/src/element/torrent-list.css
index bc21b33..8559597 100644
--- a/src/element/torrent-list.css
+++ b/src/element/torrent-list.css
@@ -1,11 +1,12 @@
.torrent-list {
width: 100%;
border-collapse: collapse;
+ font-size: 14px;
+ font-weight: 400;
}
.torrent-list td,
.torrent-list th {
- border: 1px solid #333;
- padding: 0px 5px;
- font-size: 14px;
+ border-bottom: 1px solid #222;
+ padding: 0px 6px;
}
diff --git a/src/element/torrent-list.tsx b/src/element/torrent-list.tsx
index 7f4b68a..21e9959 100644
--- a/src/element/torrent-list.tsx
+++ b/src/element/torrent-list.tsx
@@ -4,18 +4,19 @@ import { FormatBytes } from "../const";
import { Link } from "react-router-dom";
import { MagnetLink } from "./magnet";
import { Mention } from "./mention";
+import { useMemo } from "react";
export function TorrentList({ items }: { items: Array| Category | +|||||||||
|---|---|---|---|---|---|---|---|---|---|
| Category | Name | Uploaded | Size | -From | +From | ||||
| - {item.tags - .filter((a) => a[0] === "t") - .slice(0, 3) - .map((a, i, arr) => ( - <> - b[1]) - .join(","), - )}`} - > - {a[1]} - - {arr.length !== i + 1 && " > "} - - ))} + <> + {tag[1]} + {tags.length !== startIndex + 1 && " > "} + + ); +} + +function TorrentTableEntry({ item }: { item: TaggedNostrEvent }) { + const { name, size } = useMemo(() => { + const name = item.tags.find((a) => a[0] === "title")?.at(1); + const size = item.tags + .filter((a) => a[0] === "file") + .map((a) => Number(a[2])) + .reduce((acc, v) => (acc += v), 0); + return { name, size }; + }, [item]); + + return ( + | |||||||||
|
+ |
- + | {name} | -{new Date(item.created_at * 1000).toLocaleDateString()} | +{new Date(item.created_at * 1000).toLocaleDateString()} |
|
- {FormatBytes(size)} | -+ | {FormatBytes(size)} | +
|
