From f8c2bfacf9981aeb6d8186f8f3a39cd475ce21d2 Mon Sep 17 00:00:00 2001
From: Claude <noreply@anthropic.com>
Date: Thu, 15 Jan 2026 10:28:25 +0000
Subject: [PATCH] refactor: Update relay link styling to match other inline
 links

- Use muted/underline styling consistent with NIP references
- Remove icons and show only relay name (formatted)
- Display full URL in tooltip
- Match text size with surrounding content
- Simplify component by not using RelayLink wrapper
---
 src/components/nostr/RichText/Relay.tsx | 31 +++++++++++++++++++------
 1 file changed, 24 insertions(+), 7 deletions(-)

diff --git a/src/components/nostr/RichText/Relay.tsx b/src/components/nostr/RichText/Relay.tsx
index 76ae6d3..6e2d31c 100644
--- a/src/components/nostr/RichText/Relay.tsx
+++ b/src/components/nostr/RichText/Relay.tsx
@@ -1,22 +1,39 @@
 import type { RelayNode } from "@/lib/relay-transformer";
-import { RelayLink } from "@/components/nostr/RelayLink";
+import { useGrimoire } from "@/core/state";
 
 interface RelayNodeProps {
   node: RelayNode;
 }
 
+/**
+ * Format relay URL for display by removing protocol and trailing slashes
+ */
+function formatRelayUrlForDisplay(url: string): string {
+  return url
+    .replace(/^wss?:\/\//, "") // Remove ws:// or wss://
+    .replace(/\/$/, ""); // Remove trailing slash
+}
+
 /**
  * Renders a relay URL as a clickable link that opens the relay viewer
  */
 export function Relay({ node }: RelayNodeProps) {
+  const { addWindow } = useGrimoire();
   const { url } = node;
 
+  const displayUrl = formatRelayUrlForDisplay(url);
+
+  const openRelay = () => {
+    addWindow("relay", { url });
+  };
+
   return (
-    <RelayLink
-      url={url}
-      variant="prompt"
-      showInboxOutbox={false}
-      className="inline-flex"
-    />
+    <button
+      onClick={openRelay}
+      className="text-muted-foreground underline decoration-dotted hover:text-foreground cursor-crosshair"
+      title={url}
+    >
+      {displayUrl}
+    </button>
   );
 }