refactor: simplify NIP-89 detail renderers

Remove unnecessary metadata displays:
- Remove app image from ApplicationHandlerDetailRenderer
- Remove Event ID and Created timestamp from both detail renderers
- Remove Raw Metadata section from ApplicationHandlerDetailRenderer
- Remove Raw References section from HandlerRecommendationDetailRenderer
- Clean up unused imports (getAppImage, CopyableJsonViewer, useMemo, formatAddressPointer)

Keeps the UI focused on the essential information: app name, description,
supported kinds, and platform URLs.

src/components/nostr/kinds/ApplicationHandlerDetailRenderer.tsx

@@ -2,7 +2,6 @@ import { NostrEvent } from "@/types/nostr";
 import {
   getAppName,
   getAppDescription,
-  getAppImage,
   getSupportedKinds,
   getPlatformUrls,
   getHandlerIdentifier,
@@ -18,8 +17,6 @@ import {
   Smartphone,
   TabletSmartphone,
 } from "lucide-react";
-import { CopyableJsonViewer } from "@/components/JsonViewer";
-import { useMemo } from "react";
 
 interface ApplicationHandlerDetailRendererProps {
   event: NostrEvent;
@@ -76,34 +73,14 @@ export function ApplicationHandlerDetailRenderer({
 }: ApplicationHandlerDetailRendererProps) {
   const appName = getAppName(event);
   const description = getAppDescription(event);
-  const image = getAppImage(event);
   const supportedKinds = getSupportedKinds(event);
   const platformUrls = getPlatformUrls(event);
   const identifier = getHandlerIdentifier(event);
 
-  // Parse content JSON if available
-  const contentJson = useMemo(() => {
-    if (!event.content) return null;
-    try {
-      return JSON.parse(event.content);
-    } catch {
-      return null;
-    }
-  }, [event.content]);
-
   return (
     <div className="flex flex-col gap-6 p-6">
       {/* Header Section */}
       <div className="flex flex-col gap-3">
-        {/* App Image */}
-        {image && (
-          <img
-            src={image}
-            alt={appName}
-            className="w-20 h-20 rounded-lg object-cover border border-border"
-          />
-        )}
-
         {/* App Name */}
         <h1 className="text-3xl font-bold">{appName}</h1>
 
@@ -191,23 +168,6 @@ export function ApplicationHandlerDetailRenderer({
           </div>
         </div>
       )}
-
-      {/* Raw Metadata Section */}
-      {contentJson && Object.keys(contentJson).length > 0 && (
-        <div className="flex flex-col gap-3">
-          <h2 className="text-xl font-semibold">Metadata</h2>
-          <CopyableJsonViewer json={JSON.stringify(contentJson, null, 2)} />
-        </div>
-      )}
-
-      {/* Event Info */}
-      <div className="flex flex-col gap-2 pt-4 border-t border-border text-sm text-muted-foreground">
-        <div>
-          Event ID:{" "}
-          <code className="font-mono text-xs bg-muted px-1">{event.id}</code>
-        </div>
-        <div>Created: {new Date(event.created_at * 1000).toLocaleString()}</div>
-      </div>
     </div>
   );
 }

src/components/nostr/kinds/HandlerRecommendationDetailRenderer.tsx

@@ -3,7 +3,6 @@ import {
   getRecommendedKind,
   getHandlerReferences,
   getRecommendedPlatforms,
-  formatAddressPointer,
   getAppName,
   getAppDescription,
   getSupportedKinds,
@@ -267,36 +266,6 @@ export function HandlerRecommendationDetailRenderer({
           </div>
         )}
       </div>
-
-      {/* Raw Data Section */}
-      <div className="flex flex-col gap-3">
-        <h2 className="text-xl font-semibold">Raw References</h2>
-        <div className="bg-muted/30 p-4 rounded-lg border border-border">
-          <div className="flex flex-col gap-2 text-sm font-mono">
-            {allHandlers.map((ref, idx) => (
-              <div key={idx} className="flex flex-col gap-1">
-                <div className="text-xs text-muted-foreground">
-                  Reference {idx + 1}:
-                </div>
-                <div className="pl-2 border-l-2 border-muted flex flex-col gap-0.5 text-xs">
-                  <div>Address: {formatAddressPointer(ref.address)}</div>
-                  {ref.platform && <div>Platform: {ref.platform}</div>}
-                  {ref.relayHint && <div>Relay: {ref.relayHint}</div>}
-                </div>
-              </div>
-            ))}
-          </div>
-        </div>
-      </div>
-
-      {/* Event Info */}
-      <div className="flex flex-col gap-2 pt-4 border-t border-border text-sm text-muted-foreground">
-        <div>
-          Event ID:{" "}
-          <code className="font-mono text-xs bg-muted px-1">{event.id}</code>
-        </div>
-        <div>Created: {new Date(event.created_at * 1000).toLocaleString()}</div>
-      </div>
     </div>
   );
 }

src/components/nostr/kinds/HandlerRecommendationRenderer.tsx

@@ -48,7 +48,7 @@ function HandlerItem({
   const handlerEvent = useNostrEvent(address);
   const appName = handlerEvent
     ? getAppName(handlerEvent)
-    : (address?.identifier || "Unknown Handler");
+    : address?.identifier || "Unknown Handler";
 
   const handleClick = () => {
     addWindow("open", { pointer: address });

src/lib/nip89-helpers.ts

@@ -32,7 +32,12 @@ export function getAppName(event: NostrEvent): string {
   if (event.content) {
     try {
       const metadata = JSON.parse(event.content);
-      if (metadata && typeof metadata === "object" && metadata.name && typeof metadata.name === "string") {
+      if (
+        metadata &&
+        typeof metadata === "object" &&
+        metadata.name &&
+        typeof metadata.name === "string"
+      ) {
         return metadata.name;
       }
     } catch {