style(ui): details header with logbook eyebrow and task-id badge

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
mika kuns
2026-04-20 11:34:28 +02:00
parent 82f2d526a0
commit b64ff3d908
2 changed files with 88 additions and 27 deletions

View File

@@ -24,6 +24,9 @@ public sealed partial class DetailsIslandViewModel : ViewModelBase
[ObservableProperty] private string _notes = ""; [ObservableProperty] private string _notes = "";
[ObservableProperty] private string _promptInput = ""; [ObservableProperty] private string _promptInput = "";
// Short task-id badge, e.g. "#T1A"
public string TaskIdBadge => Task != null ? $"#T{Task.Id[..Math.Min(3, Task.Id.Length)].ToUpperInvariant()}" : "";
// Agent strip fields // Agent strip fields
[ObservableProperty] private string _agentStatusLabel = "Idle"; [ObservableProperty] private string _agentStatusLabel = "Idle";
public bool IsRunning => AgentStatusLabel == "Running"; public bool IsRunning => AgentStatusLabel == "Running";
@@ -82,6 +85,7 @@ public sealed partial class DetailsIslandViewModel : ViewModelBase
var ct = _loadCts.Token; var ct = _loadCts.Token;
Task = row; Task = row;
OnPropertyChanged(nameof(TaskIdBadge));
Log.Clear(); Log.Clear();
Subtasks.Clear(); Subtasks.Clear();

View File

@@ -4,31 +4,88 @@
xmlns:islands="using:ClaudeDo.Ui.Views.Islands" xmlns:islands="using:ClaudeDo.Ui.Views.Islands"
x:Class="ClaudeDo.Ui.Views.Islands.DetailsIslandView" x:Class="ClaudeDo.Ui.Views.Islands.DetailsIslandView"
x:DataType="vm:DetailsIslandViewModel"> x:DataType="vm:DetailsIslandViewModel">
<ScrollViewer> <DockPanel>
<StackPanel Margin="18,14" Spacing="14"> <!-- ── Header ── -->
<!-- Editable title --> <Border DockPanel.Dock="Top" Classes="island-header">
<TextBox Text="{Binding EditableTitle, Mode=TwoWay}" FontSize="18" <DockPanel>
BorderThickness="0" Background="Transparent" <!-- Eyebrow row: LOGBOOK · #T{shortId} -->
Foreground="{DynamicResource TextBrush}"/> <StackPanel Orientation="Horizontal" DockPanel.Dock="Top" Spacing="6" Margin="0,0,0,4">
<!-- Agent strip (only when a worktree exists or task is active) --> <Ellipse Width="5" Height="5" Fill="{DynamicResource AccentBrush}"
<islands:AgentStripView/> VerticalAlignment="Center"/>
<!-- Session terminal: log + prompt --> <TextBlock Classes="eyebrow" Text="LOGBOOK" VerticalAlignment="Center"/>
<islands:SessionTerminalView Height="260"/> <TextBlock Text="{Binding TaskIdBadge}"
<!-- Subtasks --> FontFamily="{DynamicResource MonoFont}" FontSize="10"
<ItemsControl ItemsSource="{Binding Subtasks}"> Foreground="{DynamicResource TextFaintBrush}"
<ItemsControl.ItemTemplate> VerticalAlignment="Center"
<DataTemplate DataType="vm:SubtaskRowViewModel"> HorizontalAlignment="Right"
<StackPanel Orientation="Horizontal" Spacing="8" Margin="0,2"> Margin="8,0,0,0"/>
<CheckBox IsChecked="{Binding Done, Mode=TwoWay}"/> </StackPanel>
<TextBlock Text="{Binding Title}" VerticalAlignment="Center" <!-- Editable title TextBox (reduced size) -->
Foreground="{DynamicResource TextBrush}"/> <TextBox DockPanel.Dock="Top"
</StackPanel> Text="{Binding EditableTitle, Mode=TwoWay}"
</DataTemplate> FontSize="14" FontWeight="Medium"
</ItemsControl.ItemTemplate> BorderThickness="0" Background="Transparent"
</ItemsControl> Foreground="{DynamicResource TextBrush}"
<!-- Notes --> Padding="0"/>
<TextBox Text="{Binding Notes, Mode=TwoWay}" AcceptsReturn="True" </DockPanel>
TextWrapping="Wrap" MinHeight="80" PlaceholderText="Notes…"/> </Border>
</StackPanel>
</ScrollViewer> <!-- ── Task strip row: check + title + star ── -->
<Border DockPanel.Dock="Top"
Padding="18,10,18,10"
BorderBrush="{DynamicResource LineBrush}"
BorderThickness="0,0,0,1">
<Grid ColumnDefinitions="Auto,*,Auto">
<!-- Ellipse checkbox -->
<Ellipse Grid.Column="0"
Classes="task-check"
Classes.done="{Binding Task.Done}"
Width="18" Height="18"
VerticalAlignment="Center"
Cursor="Hand"/>
<!-- Title display -->
<TextBlock Grid.Column="1"
Text="{Binding EditableTitle}"
FontSize="14" FontWeight="Medium"
Foreground="{DynamicResource TextBrush}"
TextTrimming="CharacterEllipsis"
VerticalAlignment="Center"
Margin="10,0"/>
<!-- Star button -->
<Button Grid.Column="2"
Classes="icon-btn star-btn"
Classes.on="{Binding Task.IsStarred}"
VerticalAlignment="Center">
<PathIcon Data="{StaticResource Icon.Star}" Width="14" Height="14"/>
</Button>
</Grid>
</Border>
<!-- ── Scrollable body ── -->
<ScrollViewer>
<StackPanel Margin="0" Spacing="0">
<!-- Agent strip -->
<islands:AgentStripView/>
<!-- Session terminal -->
<islands:SessionTerminalView Height="260" Margin="0"/>
<!-- Subtasks -->
<ItemsControl ItemsSource="{Binding Subtasks}" Margin="18,12">
<ItemsControl.ItemTemplate>
<DataTemplate DataType="vm:SubtaskRowViewModel">
<StackPanel Orientation="Horizontal" Spacing="8" Margin="0,2">
<CheckBox IsChecked="{Binding Done, Mode=TwoWay}"/>
<TextBlock Text="{Binding Title}" VerticalAlignment="Center"
Foreground="{DynamicResource TextBrush}"/>
</StackPanel>
</DataTemplate>
</ItemsControl.ItemTemplate>
</ItemsControl>
<!-- Notes -->
<TextBox Text="{Binding Notes, Mode=TwoWay}" AcceptsReturn="True"
TextWrapping="Wrap" MinHeight="80"
PlaceholderText="Notes…"
Margin="18,0,18,12"/>
</StackPanel>
</ScrollViewer>
</DockPanel>
</UserControl> </UserControl>