ClaudeDo/src/ClaudeDo.Ui/Views/Islands/ListsIslandView.axaml

<UserControl xmlns="https://github.com/avaloniaui"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:vm="using:ClaudeDo.Ui.ViewModels.Islands"
             xmlns:converters="using:ClaudeDo.Ui.Converters"
             x:Class="ClaudeDo.Ui.Views.Islands.ListsIslandView"
             x:DataType="vm:ListsIslandViewModel">
  <UserControl.Resources>
    <converters:UpperCaseConverter x:Key="UpperCase"/>
    <converters:IconKeyConverter   x:Key="IconKey"/>
    <converters:DotBrushConverter  x:Key="DotBrush"/>
  </UserControl.Resources>

  <DockPanel LastChildFill="True">

    <!-- ── Header ── -->
    <Border DockPanel.Dock="Top" Classes="island-header">
      <StackPanel Margin="14,12,14,0" Spacing="4">
        <TextBlock FontFamily="{DynamicResource SansFamily}" FontSize="18"
                   FontWeight="SemiBold" Foreground="{DynamicResource TextBrush}"
                   Text="Lists"/>

        <!-- Search row -->
        <Border Classes="search-wrap" Margin="0,8,0,12">
          <Grid ColumnDefinitions="Auto,*,Auto" VerticalAlignment="Center">
            <PathIcon Grid.Column="0" Width="14" Height="14"
                      Data="{StaticResource Icon.Search}"
                      Foreground="{DynamicResource TextFaintBrush}"
                      Margin="2,0,0,0"/>
            <TextBox  Grid.Column="1" x:Name="SearchBox" Classes="search-inner"
                      PlaceholderText="Search tasks…"
                      Text="{Binding SearchText, Mode=TwoWay}"/>
            <Border Grid.Column="2" Classes="kbd" Margin="0,0,2,0">
              <TextBlock Text="Ctrl K"/>
            </Border>
          </Grid>
        </Border>
      </StackPanel>
    </Border>

    <!-- ── Footer ── -->
    <Border DockPanel.Dock="Bottom"
            BorderBrush="{DynamicResource LineBrush}" BorderThickness="0,1,0,0"
            Padding="12,10">
      <Grid ColumnDefinitions="Auto,*,Auto" VerticalAlignment="Center">
        <!-- Avatar circle -->
        <Border Grid.Column="0" Classes="avatar-circle"
                VerticalAlignment="Center">
          <TextBlock Text="{Binding UserInitials}"
                     FontFamily="{DynamicResource MonoFont}" FontSize="10"
                     FontWeight="SemiBold"
                     Foreground="{DynamicResource DeepBrush}"
                     HorizontalAlignment="Center" VerticalAlignment="Center"/>
        </Border>
        <!-- Name + machine -->
        <StackPanel Grid.Column="1" Margin="8,0" Spacing="1" VerticalAlignment="Center">
          <TextBlock Text="{Binding UserName}"
                     FontSize="12" Foreground="{DynamicResource TextBrush}"/>
          <TextBlock FontFamily="{DynamicResource MonoFont}" FontSize="10"
                     Foreground="{DynamicResource TextFaintBrush}">
            <TextBlock.Text>
              <MultiBinding StringFormat="{}{0} / local">
                <Binding Path="MachineName"/>
              </MultiBinding>
            </TextBlock.Text>
          </TextBlock>
        </StackPanel>
        <!-- More button -->
        <Button Grid.Column="2" Classes="icon-btn" VerticalAlignment="Center"
                Command="{Binding OpenSettingsCommand}"
                ToolTip.Tip="Settings">
          <PathIcon Data="{StaticResource Icon.MoreHorizontal}"
                    Width="14" Height="14"
                    Foreground="{DynamicResource TextMuteBrush}"/>
        </Button>
      </Grid>
    </Border>

    <!-- ── Scrollable body ── -->
    <ScrollViewer>
      <StackPanel Margin="6,0,6,4">

        <!-- SMART LISTS section -->
        <TextBlock Classes="list-section-label" Text="SMART LISTS"/>
        <ItemsControl ItemsSource="{Binding SmartLists}">
          <ItemsControl.ItemTemplate>
            <DataTemplate DataType="vm:ListNavItemViewModel">
              <Border Classes="list-item" Classes.active="{Binding IsActive}"
                      Tapped="OnItemTapped">
                <Grid ColumnDefinitions="20,*,Auto">
                  <!-- Left accent bar for active state -->
                  <Border Grid.Column="0" Grid.ColumnSpan="3"
                          Background="Transparent"
                          CornerRadius="8" IsHitTestVisible="False">
                    <Border.IsVisible>
                      <Binding Path="IsActive"/>
                    </Border.IsVisible>
                    <Border Width="2" Height="16"
                            Background="{DynamicResource AccentBrush}"
                            CornerRadius="1"
                            HorizontalAlignment="Left" VerticalAlignment="Center"
                            Margin="-8,0,0,0"/>
                  </Border>
                  <!-- Icon -->
                  <PathIcon Grid.Column="0" Classes="list-icon"
                            Width="14" Height="14"
                            Data="{Binding IconKey, Converter={StaticResource IconKey}}"
                            Foreground="{DynamicResource TextMuteBrush}"
                            HorizontalAlignment="Center" VerticalAlignment="Center"/>
                  <!-- Name -->
                  <TextBlock Grid.Column="1" Classes="list-label"
                             Text="{Binding Name}"
                             VerticalAlignment="Center" Margin="8,0"
                             Foreground="{DynamicResource TextDimBrush}" FontSize="13"/>
                  <!-- Count -->
                  <TextBlock Grid.Column="2" Classes="list-count"
                             Text="{Binding Count}"/>
                </Grid>
              </Border>
            </DataTemplate>
          </ItemsControl.ItemTemplate>
        </ItemsControl>

        <!-- MY LISTS section -->
        <TextBlock Classes="list-section-label" Text="MY LISTS"/>
        <ItemsControl ItemsSource="{Binding UserLists}">
          <ItemsControl.ItemTemplate>
            <DataTemplate DataType="vm:ListNavItemViewModel">
              <Border Classes="list-item" Classes.active="{Binding IsActive}"
                      Tapped="OnItemTapped">
                <Border.ContextMenu>
                  <ContextMenu>
                    <MenuItem Header="Settings..."
                              Command="{Binding $parent[UserControl].((vm:ListsIslandViewModel)DataContext).OpenListSettingsCommand}"
                              CommandParameter="{Binding}"/>
                    <MenuItem Header="Worktrees…"
                              Command="{Binding $parent[UserControl].((vm:ListsIslandViewModel)DataContext).OpenWorktreesOverviewCommand}"
                              CommandParameter="{Binding}"/>
                  </ContextMenu>
                </Border.ContextMenu>
                <Grid ColumnDefinitions="20,*,Auto">
                  <!-- Left accent bar for active state -->
                  <Border Grid.Column="0" Grid.ColumnSpan="3"
                          Background="Transparent"
                          CornerRadius="8" IsHitTestVisible="False"
                          IsVisible="{Binding IsActive}">
                    <Border Width="2" Height="16"
                            Background="{DynamicResource AccentBrush}"
                            CornerRadius="1"
                            HorizontalAlignment="Left" VerticalAlignment="Center"
                            Margin="-8,0,0,0"/>
                  </Border>
                  <!-- Color dot (6px circle, color from DotColorKey) -->
                  <Ellipse Grid.Column="0"
                           Width="6" Height="6"
                           Fill="{Binding DotColorKey, Converter={StaticResource DotBrush}}"
                           HorizontalAlignment="Center" VerticalAlignment="Center"/>
                  <!-- Name -->
                  <TextBlock Grid.Column="1" Classes="list-label"
                             Text="{Binding Name}"
                             VerticalAlignment="Center" Margin="8,0"
                             Foreground="{DynamicResource TextDimBrush}" FontSize="13"/>
                  <!-- Count -->
                  <TextBlock Grid.Column="2" Classes="list-count"
                             Text="{Binding Count}"/>
                </Grid>
              </Border>
            </DataTemplate>
          </ItemsControl.ItemTemplate>
        </ItemsControl>

        <!-- + New list button -->
        <Button Classes="new-list-btn" Margin="0,4,0,0"
                Command="{Binding CreateListCommand}">
          <StackPanel Orientation="Horizontal" Spacing="6">
            <PathIcon Data="{StaticResource Icon.Plus}"
                      Width="13" Height="13"
                      Foreground="{DynamicResource TextMuteBrush}"
                      VerticalAlignment="Center"/>
            <TextBlock Text="New list" FontSize="12"
                       Foreground="{DynamicResource TextMuteBrush}"
                       VerticalAlignment="Center"/>
          </StackPanel>
        </Button>

      </StackPanel>
    </ScrollViewer>
  </DockPanel>
</UserControl>