releases/ClaudeDo
2
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases 3 Wiki Activity

feat(ui): diff modal with file sidebar and tinted hunks

Browse Source 
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
mika kuns
2026-04-20 10:30:03 +02:00
parent f94bb35db7
commit 4d68543cf2
8 changed files with 455 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
src/ClaudeDo.Ui/Views/Islands/AgentStripView.axaml
View File

@@ -29,8 +29,8 @@
IsVisible="{Binding BranchLine, Converter={x:Static ObjectConverters.IsNotNull}}"/>
<!-- Button row -->
<StackPanel Orientation="Horizontal" Spacing="8" Margin="0,6,0,0">
<Button Classes="icon-btn" Content="Open diff"/>
<Button Classes="icon-btn" Content="Worktree"/>
<Button Classes="icon-btn" Content="Open diff" Command="{Binding OpenDiffCommand}"/>
<Button Classes="icon-btn" Content="Worktree" Command="{Binding OpenWorktreeCommand}"/>
<Button Classes="icon-btn" Content="Stop" Command="{Binding StopCommand}"/>
<Button Classes="icon-btn" Content="Approve &amp; merge" Command="{Binding ApproveMergeCommand}"/>
</StackPanel>

32
src/ClaudeDo.Ui/Views/Islands/AgentStripView.axaml.cs
View File

@@ -1,8 +1,38 @@
using Avalonia.Controls;
using ClaudeDo.Ui.ViewModels.Islands;
using ClaudeDo.Ui.ViewModels.Modals;
using ClaudeDo.Ui.Views.Modals;
namespace ClaudeDo.Ui.Views.Islands;
public partial class AgentStripView : UserControl
{
public AgentStripView() { InitializeComponent(); }
public AgentStripView()
{
InitializeComponent();
DataContextChanged += OnDataContextChanged;
}
private void OnDataContextChanged(object? sender, EventArgs e)
{
if (DataContext is DetailsIslandViewModel vm)
{
vm.ShowDiffModal = async (diffVm) =>
{
var owner = TopLevel.GetTopLevel(this) as Window;
if (owner == null) return;
var modal = new DiffModalView { DataContext = diffVm };
await modal.ShowDialog(owner);
};
vm.ShowWorktreeModal = async (worktreeVm) =>
{
var owner = TopLevel.GetTopLevel(this) as Window;
if (owner == null) return;
var modal = new WorktreeModalView { DataContext = worktreeVm };
worktreeVm.CloseCommand.Subscribe(_ => modal.Close());
await modal.ShowDialog(owner);
};
}
}
}

174
src/ClaudeDo.Ui/Views/Modals/DiffModalView.axaml Normal file
View File

@@ -0,0 +1,174 @@
<Window xmlns="https://github.com/avaloniaui"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:vm="using:ClaudeDo.Ui.ViewModels.Modals"
x:Class="ClaudeDo.Ui.Views.Modals.DiffModalView"
x:DataType="vm:DiffModalViewModel"
Title="Diff"
Width="1200" Height="800"
SystemDecorations="None"
ExtendClientAreaToDecorationsHint="True"
WindowStartupLocation="CenterOwner"
Background="Transparent"
TransparencyLevelHint="AcrylicBlur">
<Window.KeyBindings>
<KeyBinding Gesture="Escape" Command="{Binding CloseCommand}"/>
</Window.KeyBindings>
<Window.Styles>
<!-- diff line row tints via Tag selector (compiled-binding-friendly) -->
<Style Selector="Border.diff-line[Tag=add]">
<Setter Property="Background" Value="#1A4A6B4A"/>
</Style>
<Style Selector="Border.diff-line[Tag=del]">
<Setter Property="Background" Value="#1AC87060"/>
</Style>
<Style Selector="Border.diff-line[Tag=ctx]">
<Setter Property="Background" Value="Transparent"/>
</Style>
<Style Selector="Border.diff-line[Tag=add] TextBlock.diff-sign">
<Setter Property="Foreground" Value="{StaticResource MossBrightBrush}"/>
</Style>
<Style Selector="Border.diff-line[Tag=del] TextBlock.diff-sign">
<Setter Property="Foreground" Value="{StaticResource BloodBrush}"/>
</Style>
<Style Selector="Border.diff-line[Tag=ctx] TextBlock.diff-sign">
<Setter Property="Foreground" Value="{StaticResource TextFaintBrush}"/>
</Style>
<Style Selector="Border.diff-line[Tag=add] TextBlock.diff-text">
<Setter Property="Foreground" Value="{StaticResource MossBrightBrush}"/>
</Style>
<Style Selector="Border.diff-line[Tag=del] TextBlock.diff-text">
<Setter Property="Foreground" Value="{StaticResource BloodBrush}"/>
</Style>
<Style Selector="Border.diff-line[Tag=ctx] TextBlock.diff-text">
<Setter Property="Foreground" Value="{StaticResource TextDimBrush}"/>
</Style>
</Window.Styles>
<!-- Outer container -->
<Border CornerRadius="{StaticResource ModalCornerRadius}"
BoxShadow="{StaticResource ModalShadow}"
Background="{StaticResource SurfaceBrush}"
BorderBrush="{StaticResource LineBrush}"
BorderThickness="1"
ClipToBounds="True">
<Grid RowDefinitions="36,*">
<!-- Title bar / drag handle -->
<Border Grid.Row="0"
x:Name="TitleBar"
Background="{StaticResource Surface2Brush}"
BorderBrush="{StaticResource LineBrush}"
BorderThickness="0,0,0,1"
PointerPressed="TitleBar_PointerPressed">
<Grid ColumnDefinitions="*,Auto" Margin="14,0">
<TextBlock Text="Diff" VerticalAlignment="Center"
FontFamily="{StaticResource MonoFamily}"
FontSize="12"
Foreground="{StaticResource TextDimBrush}"/>
<Button Grid.Column="1"
Classes="icon-btn"
Content="✕"
FontSize="12"
Command="{Binding CloseCommand}"
VerticalAlignment="Center"/>
</Grid>
</Border>
<!-- Body: sidebar + diff content -->
<Grid Grid.Row="1" ColumnDefinitions="240,*">
<!-- File sidebar -->
<Border Grid.Column="0"
BorderBrush="{StaticResource LineBrush}"
BorderThickness="0,0,1,0"
Background="{StaticResource DeepBrush}">
<ListBox ItemsSource="{Binding Files}"
SelectedItem="{Binding SelectedFile, Mode=TwoWay}"
Background="Transparent"
BorderThickness="0"
ScrollViewer.HorizontalScrollBarVisibility="Disabled">
<ListBox.ItemTemplate>
<DataTemplate x:DataType="vm:DiffFileViewModel">
<Border Padding="10,8" Background="Transparent">
<StackPanel Spacing="4">
<TextBlock Text="{Binding Path}"
FontFamily="{StaticResource MonoFamily}"
FontSize="11"
Foreground="{StaticResource TextDimBrush}"
TextTrimming="LeadingEllipsis"/>
<StackPanel Orientation="Horizontal" Spacing="6">
<Border Classes="chip" Padding="5,2">
<TextBlock Foreground="{StaticResource MossBrightBrush}"
FontFamily="{StaticResource MonoFamily}"
FontSize="10"
Text="{Binding Additions, StringFormat='+{0}'}"/>
</Border>
<Border Classes="chip" Padding="5,2">
<TextBlock Foreground="{StaticResource BloodBrush}"
FontFamily="{StaticResource MonoFamily}"
FontSize="10"
Text="{Binding Deletions, StringFormat='\u2212{0}'}"/>
</Border>
</StackPanel>
</StackPanel>
</Border>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
</Border>
<!-- Diff content -->
<ScrollViewer Grid.Column="1"
HorizontalScrollBarVisibility="Auto"
VerticalScrollBarVisibility="Auto"
Background="{StaticResource VoidBrush}">
<ItemsControl ItemsSource="{Binding SelectedFile.Lines}">
<ItemsControl.ItemTemplate>
<DataTemplate x:DataType="vm:DiffLineViewModel">
<Border Classes="diff-line"
Tag="{Binding ClassName}"
Padding="4,1">
<Grid ColumnDefinitions="48,48,16,*">
<!-- Old line number -->
<TextBlock Grid.Column="0"
Text="{Binding OldNo}"
Classes="diff-lineno"
FontFamily="{StaticResource MonoFamily}"
FontSize="11"
Foreground="{StaticResource TextFaintBrush}"
HorizontalAlignment="Right"
Margin="0,0,8,0"/>
<!-- New line number -->
<TextBlock Grid.Column="1"
Text="{Binding NewNo}"
Classes="diff-lineno"
FontFamily="{StaticResource MonoFamily}"
FontSize="11"
Foreground="{StaticResource TextFaintBrush}"
HorizontalAlignment="Right"
Margin="0,0,8,0"/>
<!-- Sign -->
<TextBlock Grid.Column="2"
Classes="diff-sign"
Text="{Binding Sign}"
FontFamily="{StaticResource MonoFamily}"
FontSize="11"/>
<!-- Line text -->
<TextBlock Grid.Column="3"
Classes="diff-text"
Text="{Binding Text}"
FontFamily="{StaticResource MonoFamily}"
FontSize="11"
TextWrapping="NoWrap"/>
</Grid>
</Border>
</DataTemplate>
</ItemsControl.ItemTemplate>
</ItemsControl>
</ScrollViewer>
</Grid>
</Grid>
</Border>
</Window>

26
src/ClaudeDo.Ui/Views/Modals/DiffModalView.axaml.cs Normal file
View File

@@ -0,0 +1,26 @@
using Avalonia.Controls;
using Avalonia.Input;
using ClaudeDo.Ui.ViewModels.Modals;
namespace ClaudeDo.Ui.Views.Modals;
public partial class DiffModalView : Window
{
public DiffModalView()
{
InitializeComponent();
}
protected override void OnDataContextChanged(EventArgs e)
{
base.OnDataContextChanged(e);
if (DataContext is DiffModalViewModel vm)
vm.CloseAction = Close;
}
private void TitleBar_PointerPressed(object? sender, PointerPressedEventArgs e)
{
if (e.GetCurrentPoint(this).Properties.IsLeftButtonPressed)
BeginMoveDrag(e);
}
}