Files
tolaria/src/components/inspector/LinkButton.tsx
Test e581ad3691 refactor: remove Trash system — delete is now permanent with confirm modal
Remove all vestiges of the abandoned Trash system: trashed/trashedAt fields
from types, frontmatter parsing, sidebar filtering, editor banners, inspector
components, mock data, and all related tests. Delete is already permanent via
useDeleteActions with a confirmation dialog. Notes with trashed:true in
existing vault frontmatter are now treated as normal notes (the flag is
ignored by the parser).

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
2026-04-06 12:21:56 +02:00

55 lines
2.0 KiB
TypeScript

import type { ComponentType, SVGAttributes } from 'react'
import { X } from '@phosphor-icons/react'
export function StatusSuffix({ isArchived }: { isArchived: boolean }) {
if (isArchived) return <span style={{ marginLeft: 4, fontSize: 10, opacity: 0.8 }}>(archived)</span>
return null
}
export function LinkButton({ label, emoji, typeColor, bgColor, isArchived, onClick, onRemove, title, TypeIcon }: {
label: string
emoji?: string | null
typeColor: string
bgColor?: string
isArchived: boolean
onClick: () => void
onRemove?: () => void
title?: string
TypeIcon: ComponentType<SVGAttributes<SVGSVGElement>>
}) {
const isDimmed = isArchived
const color = isDimmed ? 'var(--muted-foreground)' : typeColor
return (
<button
className={`group/link flex w-full items-center justify-between gap-2 border-none text-left cursor-pointer min-w-0${bgColor ? ' ring-inset hover:ring-1 hover:ring-current' : ' hover:opacity-80'}`}
style={{
background: isDimmed ? 'var(--muted)' : (bgColor ?? 'transparent'),
color, borderRadius: 6, padding: bgColor ? '6px 10px' : '4px 0',
fontSize: 12, fontWeight: 500, opacity: isDimmed ? 0.7 : 1,
}}
onClick={onClick}
title={title}
>
<span className="flex items-center gap-1 flex-1 truncate">
{emoji && <span className="shrink-0">{emoji}</span>}
{label}
<StatusSuffix isArchived={isArchived} />
</span>
<span className="flex items-center gap-1.5 shrink-0">
{onRemove && (
<span
className="flex items-center opacity-0 transition-opacity group-hover/link:opacity-100"
onClick={(e) => { e.stopPropagation(); onRemove() }}
role="button"
title="Remove from relation"
data-testid="remove-relation-ref"
>
<X size={14} />
</span>
)}
<TypeIcon width={14} height={14} className="shrink-0" style={{ color, opacity: 0.5 }} />
</span>
</button>
)
}