chihlasm/resolutionflow
1
0
Fork 0
Code Issues 23 Pull Requests 1 Actions Packages Projects Releases Wiki Activity

fix: add missing delete button to table and list tree views

Browse Source 
The onDeleteTree prop was accepted but never used in TreeTableView and
TreeListView. Now both views show a trash icon (permission-gated) matching
the existing grid view behavior.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
Michael Chihlas
2026-02-10 19:39:15 -05:00
parent 0a157aa1a2
commit 20bec57bcc
2 changed files with 54 additions and 24 deletions
Download Patch File Download Diff File Expand all files Collapse all files

39
frontend/src/components/library/TreeListView.tsx
View File

@@ -1,5 +1,5 @@
import { Link } from 'react-router-dom' import { Link } from 'react-router-dom'
import { Pencil, Globe, Lock, GitBranch, FileText } from 'lucide-react' import { Pencil, Globe, Lock, GitBranch, FileText, Trash2 } from 'lucide-react'
import type { TreeListItem } from '@/types' import type { TreeListItem } from '@/types'
import { TagBadges } from '@/components/common/TagBadges' import { TagBadges } from '@/components/common/TagBadges'
import { AddToFolderMenu } from './AddToFolderMenu' import { AddToFolderMenu } from './AddToFolderMenu'
@@ -19,6 +19,7 @@ export function TreeListView({
trees, trees,
onStartSession, onStartSession,
onTagClick, onTagClick,
onDeleteTree,
onFolderCreated, onFolderCreated,
onForkTree, onForkTree,
}: TreeListViewProps) { }: TreeListViewProps) {
@@ -94,17 +95,31 @@ export function TreeListView({
</button> </button>
)} )}
{canEditTree({ author_id: tree.author_id, account_id: tree.account_id }) && ( {canEditTree({ author_id: tree.author_id, account_id: tree.account_id }) && (
<Link <>
to={`/trees/${tree.id}/edit`} <Link
className={cn( to={`/trees/${tree.id}/edit`}
'rounded-md border border-white/10 p-1.5 text-white/60', className={cn(
'hover:bg-white/10 hover:text-white' 'rounded-md border border-white/10 p-1.5 text-white/60',
)} 'hover:bg-white/10 hover:text-white'
title="Edit tree" )}
aria-label="Edit tree" title="Edit tree"
> aria-label="Edit tree"
<Pencil className="h-4 w-4" /> >
</Link> <Pencil className="h-4 w-4" />
</Link>
<button
type="button"
onClick={() => onDeleteTree(tree)}
className={cn(
'rounded-md border border-white/10 p-1.5 text-white/60',
'hover:bg-red-500/20 hover:text-red-400'
)}
title="Delete tree"
aria-label="Delete tree"
>
<Trash2 className="h-4 w-4" />
</button>
</>
)} )}
<button <button
type="button" type="button"

39
frontend/src/components/library/TreeTableView.tsx
View File

@@ -1,6 +1,6 @@
import { useState } from 'react' import { useState } from 'react'
import { Link } from 'react-router-dom' import { Link } from 'react-router-dom'
import { Pencil, Globe, Lock, ChevronUp, ChevronDown, GitBranch, FileText } from 'lucide-react' import { Pencil, Globe, Lock, ChevronUp, ChevronDown, GitBranch, FileText, Trash2 } from 'lucide-react'
import type { TreeListItem } from '@/types' import type { TreeListItem } from '@/types'
import { TagBadges } from '@/components/common/TagBadges' import { TagBadges } from '@/components/common/TagBadges'
import { AddToFolderMenu } from './AddToFolderMenu' import { AddToFolderMenu } from './AddToFolderMenu'
@@ -24,6 +24,7 @@ export function TreeTableView({
onStartSession, onStartSession,
onTagClick, onTagClick,
onFolderCreated, onFolderCreated,
onDeleteTree,
onSortChange, onSortChange,
onForkTree, onForkTree,
}: TreeTableViewProps) { }: TreeTableViewProps) {
@@ -198,17 +199,31 @@ export function TreeTableView({
</button> </button>
)} )}
{canEditTree({ author_id: tree.author_id, account_id: tree.account_id }) && ( {canEditTree({ author_id: tree.author_id, account_id: tree.account_id }) && (
<Link <>
to={`/trees/${tree.id}/edit`} <Link
className={cn( to={`/trees/${tree.id}/edit`}
'rounded-md border border-white/10 p-1.5 text-white/60', className={cn(
'hover:bg-white/10 hover:text-white' 'rounded-md border border-white/10 p-1.5 text-white/60',
)} 'hover:bg-white/10 hover:text-white'
title="Edit tree" )}
aria-label="Edit tree" title="Edit tree"
> aria-label="Edit tree"
<Pencil className="h-3.5 w-3.5" /> >
</Link> <Pencil className="h-3.5 w-3.5" />
</Link>
<button
type="button"
onClick={() => onDeleteTree(tree)}
className={cn(
'rounded-md border border-white/10 p-1.5 text-white/60',
'hover:bg-red-500/20 hover:text-red-400'
)}
title="Delete tree"
aria-label="Delete tree"
>
<Trash2 className="h-3.5 w-3.5" />
</button>
</>
)} )}
<button <button
type="button" type="button"