add broadcast button back to debug modal

fix bug with debug modal refreshing page when closed

src/components/debug-modal/event-debug-modal.tsx

@@ -1,4 +1,4 @@
-import { PropsWithChildren, ReactNode, useMemo } from "react";
+import { PropsWithChildren, ReactNode, useCallback, useMemo, useState } from "react";
 import {
   Modal,
   ModalOverlay,
@@ -15,6 +15,7 @@ import {
   ModalHeader,
   Code,
   AccordionPanelProps,
+  Button,
 } from "@chakra-ui/react";
 import { ModalProps } from "@chakra-ui/react";
 import { nip19 } from "nostr-tools";
@@ -25,6 +26,7 @@ import RawValue from "./raw-value";
 import { CopyIconButton } from "../copy-icon-button";
 import DebugEventTags from "./event-tags";
 import relayHintService from "../../services/event-relay-hint";
+import { usePublishEvent } from "../../providers/global/publish-provider";
 
 function Section({
   label,
@@ -60,6 +62,13 @@ function JsonCode({ data }: { data: any }) {
 
 export default function EventDebugModal({ event, ...props }: { event: NostrEvent } & Omit<ModalProps, "children">) {
   const contentRefs = useMemo(() => getContentPointers(event.content), [event]);
+  const publish = usePublishEvent();
+  const [loading, setLoading] = useState(false);
+  const broadcast = useCallback(async () => {
+    setLoading(true);
+    await publish("Broadcast", event);
+    setLoading(false);
+  }, []);
 
   return (
     <Modal size="6xl" {...props}>
@@ -84,17 +93,21 @@ export default function EventDebugModal({ event, ...props }: { event: NostrEvent
                 {event.content}
               </Code>
 
-              <Heading size="md" px="2">
+              {contentRefs.length > 0 && (
-                embeds
-              </Heading>
-              {contentRefs.map((pointer, i) => (
                 <>
-                  <Code whiteSpace="pre" overflowX="auto" width="100%" p="4">
+                  <Heading size="md" px="2">
-                    {pointer.type + "\n"}
+                    embeds
-                    {JSON.stringify(pointer.data, null, 2)}
+                  </Heading>
-                  </Code>
+                  {contentRefs.map((pointer, i) => (
+                    <>
+                      <Code whiteSpace="pre" overflowX="auto" width="100%" p="4">
+                        {pointer.type + "\n"}
+                        {JSON.stringify(pointer.data, null, 2)}
+                      </Code>
+                    </>
+                  ))}
                 </>
-              ))}
+              )}
             </Section>
             <Section
               label="JSON"
@@ -111,6 +124,11 @@ export default function EventDebugModal({ event, ...props }: { event: NostrEvent
               <Heading size="sm">Tags referenced in content</Heading>
               <JsonCode data={getContentTagRefs(event.content, event.tags)} />
             </Section>
+            <Section label="Relays">
+              <Button onClick={broadcast} mr="auto" colorScheme="primary" isLoading={loading}>
+                Broadcast
+              </Button>
+            </Section>
           </Accordion>
         </ModalBody>
       </ModalContent>

src/providers/route/debug-modal-provider.tsx

@@ -28,7 +28,7 @@ export default function DebugModalProvider({ children }: PropsWithChildren) {
   );
   const close = useCallback(() => {
     setEvent(undefined);
-    router.navigate(marker.index.current ?? -1);
+    if (marker.index.current) router.navigate(marker.index.current);
     marker.reset();
   }, [marker.reset, marker.index, router.navigate]);