feat(ui): collapsible folders for the list sidebar

Folders render above the top-level lists, each with its own collapsible
children; tapping a folder header folds it instead of selecting it.
Lists move in by dragging onto a folder header (or onto a row inside it)
and out by dropping between top-level rows or via the context menu.

Creating a folder is a toggle in the New-list modal, not a third sidebar
button: it reduces the modal to name + icon and writes a folder row
instead of the list row the create flow pre-created.
This commit is contained in:
mika kuns
2026-09-10 08:29:56 +02:00
parent 13e860f06b
commit 25c9a619dc
9 changed files with 522 additions and 95 deletions
@@ -20,10 +20,10 @@
<KeyBinding Gesture="Enter" Command="{Binding SaveCommand}"/>
</Window.KeyBindings>
<ctl:ModalShell Title="{loc:Tr modals.listSettings.title}" CloseCommand="{Binding CancelCommand}">
<ctl:ModalShell Title="{Binding HeaderTitle}" CloseCommand="{Binding CancelCommand}">
<ctl:ModalShell.Footer>
<Grid ColumnDefinitions="Auto,*,Auto" VerticalAlignment="Center">
<Button Grid.Column="0" Content="{loc:Tr modals.listSettings.deleteList}" Classes="danger"
<Button Grid.Column="0" Content="{Binding DeleteLabel}" Classes="danger"
Command="{Binding DeleteCommand}" MinWidth="90"/>
<StackPanel Grid.Column="2" Orientation="Horizontal" Spacing="8">
<Button Classes="btn" Content="{loc:Tr settings.cancel}" Command="{Binding CancelCommand}" MinWidth="90"/>
@@ -40,8 +40,12 @@
VerticalAlignment="Top">
<ListBoxItem Content="{loc:Tr modals.listSettings.sectionGeneral}"/>
<ListBoxItem Content="{loc:Tr modals.listSettings.sectionIcon}"/>
<ListBoxItem Content="{loc:Tr modals.listSettings.sectionAgent}"/>
<ListBoxItem Content="{loc:Tr modals.listSettings.sectionVerify}"/>
<!-- A folder runs nothing, so it has neither agent config nor a verify command. The
TabItems stay in place (index-driven host) and just become unreachable. -->
<ListBoxItem Content="{loc:Tr modals.listSettings.sectionAgent}"
IsVisible="{Binding !IsFolder}"/>
<ListBoxItem Content="{loc:Tr modals.listSettings.sectionVerify}"
IsVisible="{Binding !IsFolder}"/>
</ListBox>
<Border Grid.Column="1" Background="{DynamicResource LineBrush}" Width="1" Margin="0,8"/>
@@ -69,12 +73,22 @@
<TabItem Header="{loc:Tr modals.listSettings.sectionGeneral}">
<ScrollViewer>
<StackPanel Spacing="12" Margin="0,8,0,0">
<!-- Create flow only: turns this into a sidebar folder (name + icon, nothing else).
Deliberately not a second sidebar button — the "+" and the repo-import button
already sit there. -->
<StackPanel Spacing="4" IsVisible="{Binding CanToggleFolder}">
<CheckBox IsChecked="{Binding IsFolder, Mode=TwoWay}"
Content="{loc:Tr modals.listSettings.createAsFolder}"/>
<TextBlock Text="{loc:Tr modals.listSettings.createAsFolderHint}"
Opacity="0.6" FontSize="12" TextWrapping="Wrap"/>
</StackPanel>
<StackPanel Spacing="4">
<TextBlock Classes="field-label" Text="{loc:Tr modals.listSettings.name}"/>
<TextBox Text="{Binding Name, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}" />
</StackPanel>
<StackPanel Spacing="4">
<StackPanel Spacing="4" IsVisible="{Binding !IsFolder}">
<TextBlock Classes="field-label" Text="{loc:Tr modals.listSettings.workingDirectory}"/>
<Grid ColumnDefinitions="*,Auto">
<TextBox Grid.Column="0" Text="{Binding WorkingDir}" PlaceholderText="{loc:Tr modals.listSettings.workingDirectoryPlaceholder}" />
@@ -82,35 +96,35 @@
</Grid>
</StackPanel>
<StackPanel Spacing="4">
<StackPanel Spacing="4" IsVisible="{Binding !IsFolder}">
<TextBlock Classes="field-label" Text="{loc:Tr modals.listSettings.defaultCommitType}"/>
<ComboBox ItemsSource="{Binding CommitTypeOptions}"
SelectedItem="{Binding DefaultCommitType, Mode=TwoWay}"
HorizontalAlignment="Left" MinWidth="160" />
</StackPanel>
<StackPanel Spacing="4">
<StackPanel Spacing="4" IsVisible="{Binding !IsFolder}">
<CheckBox IsChecked="{Binding IsManual, Mode=TwoWay}"
Content="{loc:Tr modals.listSettings.manualList}"/>
<TextBlock Text="{loc:Tr modals.listSettings.manualListHint}"
Opacity="0.6" FontSize="12" TextWrapping="Wrap"/>
</StackPanel>
<StackPanel Spacing="4">
<StackPanel Spacing="4" IsVisible="{Binding !IsFolder}">
<CheckBox IsChecked="{Binding FindingsTracked, Mode=TwoWay}"
Content="{loc:Tr modals.listSettings.findingsTracked}"/>
<TextBlock Text="{loc:Tr modals.listSettings.findingsTrackedHint}"
Opacity="0.6" FontSize="12" TextWrapping="Wrap"/>
</StackPanel>
<StackPanel Spacing="4">
<StackPanel Spacing="4" IsVisible="{Binding !IsFolder}">
<CheckBox IsChecked="{Binding PowerUseAllowed, Mode=TwoWay}"
Content="{loc:Tr modals.listSettings.powerUseAllowed}"/>
<TextBlock Text="{loc:Tr modals.listSettings.powerUseAllowedHint}"
Opacity="0.6" FontSize="12" TextWrapping="Wrap"/>
</StackPanel>
<StackPanel Spacing="4" IsVisible="{Binding TicketsAvailable}">
<StackPanel Spacing="4" IsVisible="{Binding ShowTicketProject}">
<TextBlock Classes="field-label" Text="{loc:Tr modals.listSettings.ticketProject}"/>
<ComboBox ItemsSource="{Binding TicketProjects}"
SelectedItem="{Binding SelectedTicketProject, Mode=TwoWay}"