feat: enhance ClaudeLogsSection and TeamDetailView with improved search and layout

- Updated ClaudeLogsSection to conditionally render search and filter components based on log availability, enhancing user experience.
- Adjusted TeamDetailView layout by adding padding to the action container for better alignment and visual consistency.
- Improved handling of empty log states in ClaudeLogsSection to provide clearer user feedback.
This commit is contained in:
iliya 2026-03-07 13:51:34 +02:00
parent 821c3019be
commit f97ab7c6ce
2 changed files with 33 additions and 29 deletions

View file

@ -452,6 +452,8 @@ export const ClaudeLogsSection = ({ teamName }: ClaudeLogsSectionProps): React.J
)} )}
</span> </span>
<div className="flex items-center gap-2"> <div className="flex items-center gap-2">
{data.total > 0 ? (
<>
<div className="flex w-48 items-center gap-1.5 rounded-md border border-[var(--color-border)] bg-transparent px-2 py-1"> <div className="flex w-48 items-center gap-1.5 rounded-md border border-[var(--color-border)] bg-transparent px-2 py-1">
<Search size={12} className="shrink-0 text-[var(--color-text-muted)]" /> <Search size={12} className="shrink-0 text-[var(--color-text-muted)]" />
<input <input
@ -478,6 +480,8 @@ export const ClaudeLogsSection = ({ teamName }: ClaudeLogsSectionProps): React.J
onOpenChange={setFilterOpen} onOpenChange={setFilterOpen}
onApply={setFilter} onApply={setFilter}
/> />
</>
) : null}
{pendingNewCount > 0 && ( {pendingNewCount > 0 && (
<Button <Button
variant="outline" variant="outline"
@ -533,9 +537,9 @@ export const ClaudeLogsSection = ({ teamName }: ClaudeLogsSectionProps): React.J
} }
/> />
) : null} ) : null}
{!error && data.lines.length === 0 ? ( {!error && data.lines.length === 0 && isAlive ? (
<p className="p-2 text-xs text-[var(--color-text-muted)]"> <p className="p-2 text-xs text-[var(--color-text-muted)]">
{loading ? 'Loading…' : isAlive ? 'No logs captured.' : 'Team is not running.'} {loading ? 'Loading…' : 'No logs captured.'}
</p> </p>
) : null} ) : null}
{!error && data.lines.length > 0 && filteredText.trim().length === 0 ? ( {!error && data.lines.length > 0 && filteredText.trim().length === 0 ? (

View file

@ -1476,7 +1476,7 @@ export const TeamDetailView = ({ teamName }: TeamDetailViewProps): React.JSX.Ele
} }
defaultOpen defaultOpen
action={ action={
<div className="flex items-center gap-2 pl-2"> <div className="flex items-center gap-2 pl-2 pr-2">
<div className="flex w-36 items-center gap-1.5 rounded-md border border-[var(--color-border)] bg-transparent px-2 py-1"> <div className="flex w-36 items-center gap-1.5 rounded-md border border-[var(--color-border)] bg-transparent px-2 py-1">
<Search size={12} className="shrink-0 text-[var(--color-text-muted)]" /> <Search size={12} className="shrink-0 text-[var(--color-text-muted)]" />
<input <input