more console changes

src/views/tools/event-console/event-row.tsx

@@ -0,0 +1,41 @@
+import { Code, Flex, Text, useDisclosure } from "@chakra-ui/react";
+import { NostrEvent } from "nostr-tools";
+import ExpandButton from "./expand-button";
+import UserName from "../../../components/user-name";
+
+export default function EventRow({ event }: { event: NostrEvent }) {
+  const expanded = useDisclosure();
+
+  return (
+    <>
+      <Flex
+        gap="2"
+        alignItems="center"
+        borderTopWidth={1}
+        p="2"
+        onClick={expanded.onToggle}
+        overflow="hidden"
+        cursor="pointer"
+      >
+        <Text fontFamily="monospace" whiteSpace="pre">
+          {event.id.slice(0, 8)} ({event.kind}) [{event.tags.length}]
+        </Text>
+        <UserName pubkey={event.pubkey} fontSize="sm" />
+        {!expanded.isOpen && (
+          <Text isTruncated fontSize="sm">
+            {event.content}
+          </Text>
+        )}
+        <ExpandButton isOpen={expanded.isOpen} onToggle={expanded.onToggle} size="xs" variant="ghost" ml="auto" />
+      </Flex>
+
+      {expanded.isOpen && (
+        <Flex gap="2" direction="column" px="2" pb="2" alignItems="flex-start">
+          <Code whiteSpace="pre-wrap" noOfLines={4} w="full">
+            {event.content}
+          </Code>
+        </Flex>
+      )}
+    </>
+  );
+}

src/views/tools/event-console/expand-button.tsx

@@ -0,0 +1,18 @@
+import { IconButton, IconButtonProps } from "@chakra-ui/react";
+import { ChevronDownIcon, ChevronUpIcon } from "../../../components/icons";
+
+export default function ExpandButton({
+  isOpen,
+  onToggle,
+  ...props
+}: { isOpen: boolean; onToggle: () => void } & Omit<IconButtonProps, "aria-label" | "title">) {
+  return (
+    <IconButton
+      onClick={onToggle}
+      icon={isOpen ? <ChevronUpIcon /> : <ChevronDownIcon />}
+      aria-label={isOpen ? "Collapse" : "Expand"}
+      title={isOpen ? "Collapse" : "Expand"}
+      {...props}
+    />
+  );
+}

src/views/tools/event-console/index.tsx

@@ -27,10 +27,11 @@ import BackButton from "../../../components/back-button";
 import { NostrFilterSchema } from "./schema";
 import { relayRequest } from "../../../helpers/relay";
 import { localRelay } from "../../../services/local-relay";
-import EmbeddedUnknown from "../../../components/embed-event/event-types/embedded-unknown";
 import Play from "../../../components/icons/play";
 import ClockRewind from "../../../components/icons/clock-rewind";
 import HistoryDrawer from "./history-drawer";
+import EventRow from "./event-row";
+import { processFilter } from "./process";
 
 const FilterEditor = memo(
   ({ value, onChange, onRun }: { value: string; onChange: (v: string) => void; onRun: () => void }) => {
@@ -74,7 +75,7 @@ const EventTimeline = memo(({ events }: { events: NostrEvent[] }) => {
   return (
     <>
       {events.map((event) => (
-        <EmbeddedUnknown key={event.id} event={event} />
+        <EventRow key={event.id} event={event} />
       ))}
     </>
   );
@@ -93,7 +94,7 @@ export default function EventConsoleView() {
   const [events, setEvents] = useState<NostrEvent[]>([]);
   const loadEvents = useCallback(async () => {
     try {
-      const filter: Filter = JSON.parse(queryRef.current);
+      const filter = await processFilter(JSON.parse(queryRef.current));
       setLoading(true);
       setHistory((arr) => (arr || []).concat(queryRef.current));
       const e = await relayRequest(localRelay, [filter]);
@@ -139,7 +140,9 @@ export default function EventConsoleView() {
       <Flex gap="2">
         <Text>{events.length} events</Text>
       </Flex>
-      <EventTimeline events={events} />
+      <Box>
+        <EventTimeline events={events} />
+      </Box>
 
       <HistoryDrawer
         isOpen={historyDrawer.isOpen}

src/views/tools/event-console/process.ts

@@ -0,0 +1,13 @@
+import { Filter, nip19 } from "nostr-tools";
+
+export async function processFilter(f: Filter): Promise<Filter> {
+  const filter = JSON.parse(JSON.stringify(f)) as Filter;
+
+  if (filter.authors)
+    filter.authors = filter.authors.map((p) => {
+      if (p.startsWith("npub")) return nip19.decode(p).data as string;
+      return p;
+    });
+
+  return filter;
+}