diff --git a/src/components/ReqViewer.tsx b/src/components/ReqViewer.tsx index 7aa45ea..9f258fa 100644 --- a/src/components/ReqViewer.tsx +++ b/src/components/ReqViewer.tsx @@ -18,6 +18,7 @@ import { Sparkles, Link as LinkIcon, Check, + Target, } from "lucide-react"; import { Virtuoso } from "react-virtuoso"; import { useReqTimelineEnhanced } from "@/hooks/useReqTimelineEnhanced"; @@ -90,6 +91,27 @@ const MemoizedFeedEvent = memo( (prev, next) => prev.event.id === next.event.id, ); +/** + * Compact event ID display in query dropdown + * Shows truncated ID with click to open + */ +function EventIdPreview({ eventId }: { eventId: string }) { + const { addWindow } = useGrimoire(); + + const handleClick = useCallback(() => { + addWindow("open", { pointer: { id: eventId } }); + }, [eventId, addWindow]); + + return ( + + {eventId.slice(0, 8)}...{eventId.slice(-4)} + + ); +} + interface ReqViewerProps { filter: NostrFilter; relays?: string[]; @@ -120,11 +142,15 @@ function QueryDropdown({ const { copy: handleCopy, copied } = useCopy(); // Expandable lists state + const [showAllIds, setShowAllIds] = useState(false); const [showAllAuthors, setShowAllAuthors] = useState(false); const [showAllPTags, setShowAllPTags] = useState(false); const [showAllETags, setShowAllETags] = useState(false); const [showAllTTags, setShowAllTTags] = useState(false); + // Get IDs for direct lookup (from -i flag) + const eventIds = filter.ids || []; + // Get pubkeys for authors and #p tags const authorPubkeys = filter.authors || []; const pTagPubkeys = filter["#p"] || []; @@ -154,6 +180,7 @@ function QueryDropdown({ // Determine if we should use accordion for complex queries const isComplexQuery = (filter.kinds?.length || 0) + + eventIds.length + authorPubkeys.length + (filter.search ? 1 : 0) + tagCount > @@ -170,6 +197,7 @@ function QueryDropdown({ type="multiple" defaultValue={[ "kinds", + "ids", "authors", "mentions", "time", @@ -203,6 +231,35 @@ function QueryDropdown({ )} + {/* IDs Section (direct event lookup) */} + {eventIds.length > 0 && ( + + +
+ + Event IDs ({eventIds.length}) +
+
+ +
+ {eventIds + .slice(0, showAllIds ? undefined : 3) + .map((eventId) => ( + + ))} + {eventIds.length > 3 && ( + + )} +
+
+
+ )} + {/* Time Range Section */} {(filter.since || filter.until) && ( @@ -469,6 +526,31 @@ function QueryDropdown({ )} + {/* Event IDs (direct lookup) */} + {eventIds.length > 0 && ( +
+
+ + Event IDs ({eventIds.length}) +
+
+ {eventIds + .slice(0, showAllIds ? undefined : 3) + .map((eventId) => ( + + ))} + {eventIds.length > 3 && ( + + )} +
+
+ )} + {/* Time Range */} {(filter.since || filter.until) && (