How do I create a hamburger or Glasswire-style menu in WPF and MahApps?

Question

Ideally it should look like something GlassWire app has (top left corner):

It behaves just like an application icon system menu but is more obvious and customizable.

Specific problems I have are:

1) How do I add a title-bar friendly hamburger menu button easily (XAML only ideally) e.g. via mahApps:MetroWindow.LeftWindowCommands?

2) How do I customize it to look just like GlassWire's menu button (top-aligned zero-top-margin thin rectangle)? I tried playing with alignment and height but it did not work - there was always a gap at the top.

Here is what I have so far (hamburger button next to app icon):

<mahApps:MetroWindow.LeftWindowCommands>
    <mahApps:WindowCommands ShowSeparators="False">
        <Button>
            <Button.ContextMenu>
                <ContextMenu>
                    <MenuItem Header="Menu Item 1"/>
                    <MenuItem Header="Menu Item 2"/>
                    <MenuItem Header="Menu Item 3"/>
                </ContextMenu>
            </Button.ContextMenu>
            <Rectangle Width="14" Height="14" Fill="{Binding RelativeSource={RelativeSource AncestorType=Button}, Path=Foreground}">
                <Rectangle.OpacityMask>
                    <VisualBrush Stretch="Fill" Visual="{StaticResource appbar_lines_horizontal_4}" />
                </Rectangle.OpacityMask>
            </Rectangle>
        </Button>
    </mahApps:WindowCommands>
</mahApps:MetroWindow.LeftWindowCommands>

Unfortunately the context menu is not ideal because it's behaviour that would require some C# code to get it right.