From 3ecdb45eea24ef8f56ffc65b0f8954949bbdbffc Mon Sep 17 00:00:00 2001
From: Niels Laute <niels.laute@live.nl>
Date: Thu, 4 Dec 2025 21:01:39 +0100
Subject: [PATCH] I broke it

---
 .../Dock/DockBandSettingsViewModel.cs         |   7 +
 .../Controls/DockEditor.xaml                  | 134 +++++++++---------
 .../Controls/DockEditor.xaml.cs               |  35 ++---
 .../Microsoft.CmdPal.UI/Dock/DockControl.xaml |   2 -
 .../Helpers/OpenFlyoutAction.cs               |  33 +++++
 .../Settings/DockSettingsPage.xaml            |   2 +-
 6 files changed, 122 insertions(+), 91 deletions(-)
 create mode 100644 src/modules/cmdpal/Microsoft.CmdPal.UI/Helpers/OpenFlyoutAction.cs

diff --git a/src/modules/cmdpal/Microsoft.CmdPal.UI.ViewModels/Dock/DockBandSettingsViewModel.cs b/src/modules/cmdpal/Microsoft.CmdPal.UI.ViewModels/Dock/DockBandSettingsViewModel.cs
index b2dc5d8f04..d36743aed3 100644
--- a/src/modules/cmdpal/Microsoft.CmdPal.UI.ViewModels/Dock/DockBandSettingsViewModel.cs
+++ b/src/modules/cmdpal/Microsoft.CmdPal.UI.ViewModels/Dock/DockBandSettingsViewModel.cs
@@ -5,6 +5,7 @@
 using System.Globalization;
 using System.Text;
 using CommunityToolkit.Mvvm.ComponentModel;
+using CommunityToolkit.Mvvm.Input;
 using Microsoft.CmdPal.Core.ViewModels;
 using Microsoft.CmdPal.UI.ViewModels.Settings;
 
@@ -84,6 +85,12 @@ public partial class DockBandSettingsViewModel : ObservableObject
         set => ShowLabels = (ShowLabelsOption)value;
     }
 
+    [RelayCommand]
+    private void Unpin()
+    {
+        PinSideIndex = 0;
+    }
+
     private DockPinSide PinSide
     {
         get => _pinSide;
diff --git a/src/modules/cmdpal/Microsoft.CmdPal.UI/Controls/DockEditor.xaml b/src/modules/cmdpal/Microsoft.CmdPal.UI/Controls/DockEditor.xaml
index e9148ae33b..70c9d89b7f 100644
--- a/src/modules/cmdpal/Microsoft.CmdPal.UI/Controls/DockEditor.xaml
+++ b/src/modules/cmdpal/Microsoft.CmdPal.UI/Controls/DockEditor.xaml
@@ -3,6 +3,8 @@
     x:Class="Microsoft.CmdPal.UI.Controls.DockEditor"
     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+    xmlns:Core="using:Microsoft.Xaml.Interactions.Core"
+    xmlns:Interactivity="using:Microsoft.Xaml.Interactivity"
     xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
     xmlns:dockVm="using:Microsoft.CmdPal.UI.ViewModels.Dock"
     xmlns:helpers="using:Microsoft.CmdPal.UI.Helpers"
@@ -81,70 +83,74 @@
                     BorderThickness="1"
                     CornerRadius="4"
                     ToolTipService.ToolTip="{x:Bind Title}">
-                    <Button Style="{StaticResource SubtleButtonStyle}">
-                        <Button.Flyout>
-                            <Flyout Placement="Bottom">
-                                <Grid Width="280">
-                                    <Grid.RowDefinitions>
-                                        <RowDefinition Height="Auto" />
-                                        <RowDefinition Height="Auto" />
-                                        <RowDefinition Height="Auto" />
-                                        <RowDefinition Height="Auto" />
-                                    </Grid.RowDefinitions>
-                                    <StackPanel
-                                        Margin="0,0,0,16"
-                                        Orientation="Horizontal"
-                                        Spacing="8">
-                                        <local:IconBox
-                                            x:Name="OptionsFlyoutIcons"
-                                            Width="24"
-                                            Height="24"
-                                            HorizontalAlignment="Center"
-                                            VerticalAlignment="Center"
-                                            SourceKey="{x:Bind Icon, Mode=OneWay}"
-                                            SourceRequested="{x:Bind helpers:IconCacheProvider.SourceRequested}" />
-                                        <TextBlock
-                                            x:Name="OptionsFlyoutTitle"
-                                            VerticalAlignment="Center"
-                                            Foreground="{ThemeResource TextFillColorSecondaryBrush}"
-                                            Text="{x:Bind Title, Mode=OneWay}" />
-                                    </StackPanel>
-                                    <StackPanel Grid.Row="1" Margin="0,0,0,16">
-                                        <TextBlock
-                                            Margin="0,0,0,8"
-                                            FontSize="12"
-                                            Text="Show labels" />
-                                        <ComboBox
-                                            x:Name="ShowLabelsComboBox"
-                                            HorizontalAlignment="Stretch"
-                                            SelectedIndex="{x:Bind ShowLabelsIndex, Mode=TwoWay}">
-                                            <ComboBoxItem Content="Default" />
-                                            <ComboBoxItem Content="Show" />
-                                            <ComboBoxItem Content="Hide" />
-                                        </ComboBox>
-                                    </StackPanel>
-
-                                    <Border
-                                        Grid.Row="2"
-                                        Height="1"
-                                        Margin="0,0,0,16"
-                                        Background="{ThemeResource DividerStrokeColorDefaultBrush}" />
-                                    <Button
-                                        Grid.Row="3"
+                    <FlyoutBase.AttachedFlyout>
+                        <Flyout Placement="Bottom">
+                            <Grid Width="280">
+                                <Grid.RowDefinitions>
+                                    <RowDefinition Height="Auto" />
+                                    <RowDefinition Height="Auto" />
+                                    <RowDefinition Height="Auto" />
+                                    <RowDefinition Height="Auto" />
+                                </Grid.RowDefinitions>
+                                <StackPanel
+                                    Margin="0,0,0,16"
+                                    Orientation="Horizontal"
+                                    Spacing="8">
+                                    <local:IconBox
+                                        x:Name="OptionsFlyoutIcons"
+                                        Width="24"
+                                        Height="24"
+                                        HorizontalAlignment="Center"
+                                        VerticalAlignment="Center"
+                                        SourceKey="{x:Bind Icon, Mode=OneWay}"
+                                        SourceRequested="{x:Bind helpers:IconCacheProvider.SourceRequested}" />
+                                    <TextBlock
+                                        x:Name="OptionsFlyoutTitle"
+                                        VerticalAlignment="Center"
+                                        Foreground="{ThemeResource TextFillColorSecondaryBrush}"
+                                        Text="{x:Bind Title, Mode=OneWay}" />
+                                </StackPanel>
+                                <StackPanel Grid.Row="1" Margin="0,0,0,16">
+                                    <TextBlock
+                                        Margin="0,0,0,8"
+                                        FontSize="12"
+                                        Text="Show labels" />
+                                    <ComboBox
+                                        x:Name="ShowLabelsComboBox"
                                         HorizontalAlignment="Stretch"
-                                        Click="UnpinButton_Click"
-                                        Content="Unpin from dock" />
-                                </Grid>
-                            </Flyout>
-                        </Button.Flyout>
-                        <local:IconBox
-                            Width="24"
-                            Height="24"
-                            HorizontalAlignment="Center"
-                            VerticalAlignment="Center"
-                            SourceKey="{x:Bind Icon, Mode=OneWay}"
-                            SourceRequested="{x:Bind helpers:IconCacheProvider.SourceRequested}" />
-                    </Button>
+                                        SelectedIndex="{x:Bind ShowLabelsIndex, Mode=TwoWay}">
+                                        <ComboBoxItem Content="Default" />
+                                        <ComboBoxItem Content="Show" />
+                                        <ComboBoxItem Content="Hide" />
+                                    </ComboBox>
+                                </StackPanel>
+
+                                <Border
+                                    Grid.Row="2"
+                                    Height="1"
+                                    Margin="0,0,0,16"
+                                    Background="{ThemeResource DividerStrokeColorDefaultBrush}" />
+                                <Button
+                                    Grid.Row="3"
+                                    HorizontalAlignment="Stretch"
+                                    Click="UnpinButton_Click"
+                                    Command="{x:Bind UnpinCommand}"
+                                    Content="Unpin from dock" />
+                            </Grid>
+                        </Flyout>
+                    </FlyoutBase.AttachedFlyout>
+                    <Interactivity:Interaction.Behaviors>
+                        <Core:EventTriggerBehavior EventName="Tapped">
+                            <helpers:OpenFlyoutAction />
+                        </Core:EventTriggerBehavior>
+                    </Interactivity:Interaction.Behaviors>
+                    <local:IconBox
+                        Width="24"
+                        Height="24"
+                        HorizontalAlignment="Center"
+                        VerticalAlignment="Center"
+                        SourceKey="{x:Bind Icon, Mode=OneWay}"
+                        SourceRequested="{x:Bind helpers:IconCacheProvider.SourceRequested}" />
                 </Grid>
             </DataTemplate>
 
@@ -296,7 +302,7 @@
                     DragItemsCompleted="ListView_DragItemsCompleted"
                     DragItemsStarting="ListView_DragItemsStarting"
                     DragOver="ListView_DragOver"
-                    Drop="EndListView_Drop"
+                    Drop="StartListView_Drop"
                     IsItemClickEnabled="False"
                     ItemContainerStyle="{StaticResource DockEditorListViewItemStyle}"
                     ItemTemplate="{StaticResource DockBandItemTemplate}"
diff --git a/src/modules/cmdpal/Microsoft.CmdPal.UI/Controls/DockEditor.xaml.cs b/src/modules/cmdpal/Microsoft.CmdPal.UI/Controls/DockEditor.xaml.cs
index 483e0c4e60..5181b75666 100644
--- a/src/modules/cmdpal/Microsoft.CmdPal.UI/Controls/DockEditor.xaml.cs
+++ b/src/modules/cmdpal/Microsoft.CmdPal.UI/Controls/DockEditor.xaml.cs
@@ -18,7 +18,6 @@ public sealed partial class DockEditor : UserControl
     private DockBandSettingsViewModel? _draggedItem;
     private ObservableCollection<DockBandSettingsViewModel>? _sourceCollection;
     private DockEditorPinArea _targetArea;
-    private DockBandSettingsViewModel? _currentContextItem;
 
     public Orientation Orientation
     {
@@ -206,31 +205,19 @@ public sealed partial class DockEditor : UserControl
 
     private void UnpinButton_Click(object sender, RoutedEventArgs e)
     {
-        if (_currentContextItem == null)
+        if (sender is Button btn && btn.DataContext is DockBandSettingsViewModel contextItem)
         {
-            return;
+            // Remove from all UI collections
+            StartItems.Remove(contextItem);
+            CenterItems.Remove(contextItem);
+            EndItems.Remove(contextItem);
+
+            // Refresh available items
+            RefreshAvailableItems();
+
+            // Close the flyout
+            CloseFlyoutFromSender(sender);
         }
-
-        // Remove from all UI collections
-        StartItems.Remove(_currentContextItem);
-        CenterItems.Remove(_currentContextItem);
-        EndItems.Remove(_currentContextItem);
-
-        // Set pin side to None
-        _currentContextItem.PinSideIndex = 0;
-
-        // Refresh available items
-        RefreshAvailableItems();
-
-        _currentContextItem = null;
-
-        // Close the flyout
-        CloseFlyoutFromSender(sender);
-    }
-
-    private void DockItemOptionsFlyout_Closed(object sender, object e)
-    {
-        _currentContextItem = null;
     }
 
     private void ListView_DragItemsStarting(object sender, DragItemsStartingEventArgs e)
diff --git a/src/modules/cmdpal/Microsoft.CmdPal.UI/Dock/DockControl.xaml b/src/modules/cmdpal/Microsoft.CmdPal.UI/Dock/DockControl.xaml
index 96a3a22829..c5437874e1 100644
--- a/src/modules/cmdpal/Microsoft.CmdPal.UI/Dock/DockControl.xaml
+++ b/src/modules/cmdpal/Microsoft.CmdPal.UI/Dock/DockControl.xaml
@@ -41,14 +41,12 @@
                     Style="{StaticResource TaskBarButtonStyle}"
                     Tapped="BandItem_Tapped"
                     ToolTipService.ToolTip="{x:Bind Tooltip, Mode=OneWay}">
-
                     <Grid AutomationProperties.Name="{x:Bind Title, Mode=OneWay}" Background="Transparent">
                         <Grid.ColumnDefinitions>
                             <ColumnDefinition Width="Auto" />
                             <ColumnDefinition Width="Auto" />
                             <ColumnDefinition Width="Auto" />
                         </Grid.ColumnDefinitions>
-
                         <StackPanel
                             Grid.Column="0"
                             VerticalAlignment="Center"
diff --git a/src/modules/cmdpal/Microsoft.CmdPal.UI/Helpers/OpenFlyoutAction.cs b/src/modules/cmdpal/Microsoft.CmdPal.UI/Helpers/OpenFlyoutAction.cs
new file mode 100644
index 0000000000..5081a4a3de
--- /dev/null
+++ b/src/modules/cmdpal/Microsoft.CmdPal.UI/Helpers/OpenFlyoutAction.cs
@@ -0,0 +1,33 @@
+// Copyright (c) Microsoft Corporation
+// The Microsoft Corporation licenses this file to you under the MIT license.
+// See the LICENSE file in the project root for more information.
+
+using System;
+using System.Collections.Generic;
+using System.Linq;
+using System.Text;
+using System.Threading.Tasks;
+using Microsoft.UI.Xaml;
+using Microsoft.UI.Xaml.Controls;
+using Microsoft.UI.Xaml.Controls.Primitives;
+using Microsoft.Xaml.Interactivity;
+
+namespace Microsoft.CmdPal.UI.Helpers;
+
+public class OpenFlyoutAction : DependencyObject, IAction
+{
+    public object? Execute(object sender, object parameter)
+    {
+        FlyoutBase.ShowAttachedFlyout(TargetObject ?? (FrameworkElement)sender);
+        return null;
+    }
+
+    public Control TargetObject
+    {
+        get { return (Control)GetValue(TargetObjectProperty); }
+        set { SetValue(TargetObjectProperty, value); }
+    }
+
+    public static readonly DependencyProperty TargetObjectProperty =
+        DependencyProperty.Register(nameof(TargetObject), typeof(Control), typeof(OpenFlyoutAction), new PropertyMetadata(null));
+}
diff --git a/src/modules/cmdpal/Microsoft.CmdPal.UI/Settings/DockSettingsPage.xaml b/src/modules/cmdpal/Microsoft.CmdPal.UI/Settings/DockSettingsPage.xaml
index b14083b49e..b096ec6173 100644
--- a/src/modules/cmdpal/Microsoft.CmdPal.UI/Settings/DockSettingsPage.xaml
+++ b/src/modules/cmdpal/Microsoft.CmdPal.UI/Settings/DockSettingsPage.xaml
@@ -112,7 +112,7 @@
                     <!--  Bands Section  -->
                     <TextBlock x:Uid="DockBandsSettingsHeader" Style="{StaticResource SettingsSectionHeaderTextBlockStyle}" />
                     <Grid BorderBrush="{ThemeResource CardStrokeColorDefaultBrush}" BorderThickness="1">
-                        <cpControls:DockEditor Height="148" DockItems="{x:Bind AllDockBandItems, Mode=OneWay}" />
+                        <cpControls:DockEditor Height="56" DockItems="{x:Bind AllDockBandItems, Mode=OneWay}" />
                     </Grid>
 
                     <!--<ItemsRepeater ItemsSource="{x:Bind AllDockBandItems, Mode=OneWay}">