mirror of
https://github.com/purrgrammer/grimoire.git
synced 2026-04-12 08:27:27 +02:00
refactor(nip-66): improve feed UI with clickable titles and simplified layout
- Add ClickableEventTitle to relay discovery feed items for opening detail view - Remove "Monitoring" label from relay monitor feed items for cleaner layout - Remove unused imports (RelayLink, Label, Activity) from feed renderers - Maintain existing Label and NIPBadge usage in detail renderers
This commit is contained in:
@@ -4,14 +4,13 @@ import {
|
||||
ClickableEventTitle,
|
||||
} from "./BaseEventRenderer";
|
||||
import { Badge } from "@/components/ui/badge";
|
||||
import { Label } from "@/components/ui/label";
|
||||
import {
|
||||
getMonitorFrequency,
|
||||
getMonitorChecks,
|
||||
formatFrequency,
|
||||
getCheckTypeName,
|
||||
} from "@/lib/nip66-helpers";
|
||||
import { Activity, Clock } from "lucide-react";
|
||||
import { Clock } from "lucide-react";
|
||||
|
||||
/**
|
||||
* Kind 10166 Renderer - NIP-66 Relay Monitor Announcement (Feed View)
|
||||
@@ -42,22 +41,16 @@ export function Kind10166Renderer({ event }: BaseEventProps) {
|
||||
|
||||
{/* Check Types */}
|
||||
{checks.length > 0 && (
|
||||
<div className="flex flex-col gap-1.5">
|
||||
<Label className="flex items-center gap-2 text-xs text-muted-foreground">
|
||||
<Activity className="size-3" />
|
||||
Monitoring
|
||||
</Label>
|
||||
<div className="flex flex-wrap gap-1.5">
|
||||
{checks.map((check) => (
|
||||
<Badge
|
||||
key={check}
|
||||
variant="secondary"
|
||||
className="h-5 px-2 text-xs"
|
||||
>
|
||||
{getCheckTypeName(check)}
|
||||
</Badge>
|
||||
))}
|
||||
</div>
|
||||
<div className="flex flex-wrap gap-1.5">
|
||||
{checks.map((check) => (
|
||||
<Badge
|
||||
key={check}
|
||||
variant="secondary"
|
||||
className="h-5 px-2 text-xs"
|
||||
>
|
||||
{getCheckTypeName(check)}
|
||||
</Badge>
|
||||
))}
|
||||
</div>
|
||||
)}
|
||||
|
||||
|
||||
@@ -1,5 +1,8 @@
|
||||
import { BaseEventProps, BaseEventContainer } from "./BaseEventRenderer";
|
||||
import { RelayLink } from "../RelayLink";
|
||||
import {
|
||||
BaseEventProps,
|
||||
BaseEventContainer,
|
||||
ClickableEventTitle,
|
||||
} from "./BaseEventRenderer";
|
||||
import { Badge } from "@/components/ui/badge";
|
||||
import {
|
||||
getRelayUrl,
|
||||
@@ -57,14 +60,14 @@ export function Kind30166Renderer({ event }: BaseEventProps) {
|
||||
return (
|
||||
<BaseEventContainer event={event}>
|
||||
<div className="flex flex-col gap-2">
|
||||
{/* Relay URL and Health Score */}
|
||||
{/* Clickable Title and Health Score */}
|
||||
<div className="flex items-center justify-between gap-2">
|
||||
<RelayLink
|
||||
url={relayUrl}
|
||||
className="py-0.5 hover:bg-none flex-1 min-w-0"
|
||||
iconClassname="size-4"
|
||||
urlClassname="underline decoration-dotted"
|
||||
/>
|
||||
<ClickableEventTitle
|
||||
event={event}
|
||||
className="text-base font-semibold truncate flex-1 min-w-0"
|
||||
>
|
||||
{relayUrl}
|
||||
</ClickableEventTitle>
|
||||
<div className="flex items-center gap-1 text-xs shrink-0">
|
||||
<Activity className={cn("size-3", healthColor)} />
|
||||
<span className={cn("font-medium", healthColor)}>{health}%</span>
|
||||
|
||||
Reference in New Issue
Block a user