Merge pull request #754 from mjcheetham/bb-newui

New Bitbucket UI with separate OAuth and User/Pass options

src/shared/Atlassian.Bitbucket.Tests/BitbucketAuthenticationTest.cs

@@ -108,21 +108,6 @@ public async Task BitbucketAuthentication_GetCredentialsAsync_All_NoDesktopSessi
             Assert.Equal(password, result.Credential.Password);
         }
 
-        [Fact]
-        public async Task BitbucketAuthentication_ShowOAuthRequiredPromptAsync_SucceedsAfterUserInput()
-        {
-            var context = new TestCommandContext();
-            context.Terminal.Prompts["Press enter to continue..."] = " ";
-
-            var bitbucketAuthentication = new BitbucketAuthentication(context);
-
-            var result = await bitbucketAuthentication.ShowOAuthRequiredPromptAsync();
-
-            Assert.True(result);
-            Assert.Equal($"Your account has two-factor authentication enabled.{Environment.NewLine}" +
-                                           $"To continue you must complete authentication in your web browser.{Environment.NewLine}", context.Terminal.Messages[0].Item1);
-        }
-
         [Fact]
         public async Task BitbucketAuthentication_GetCredentialsAsync_AllModes_NoUser_BBCloud_HelperCmdLine()
         {
@@ -137,7 +122,7 @@ public async Task BitbucketAuthentication_GetCredentialsAsync_AllModes_NoUser_BB
                 ["password"] = expectedPassword
             };
 
-            string expectedArgs = $"userpass --show-oauth";
+            string expectedArgs = $"prompt --show-basic --show-oauth";
 
             var context = new TestCommandContext();
             context.SessionManager.IsDesktopSession = true; // Enable OAuth and UI helper selection
@@ -173,7 +158,7 @@ public async Task BitbucketAuthentication_GetCredentialsAsync_BasicOnly_User_BBC
                 ["password"] = expectedPassword
             };
 
-            string expectedArgs = $"userpass --username {expectedUserName}";
+            string expectedArgs = $"prompt --username {expectedUserName} --show-basic";
 
             var context = new TestCommandContext();
             context.SessionManager.IsDesktopSession = true; // Enable UI helper selection
@@ -209,7 +194,7 @@ public async Task BitbucketAuthentication_GetCredentialsAsync_AllModes_NoUser_BB
                 ["password"] = expectedPassword
             };
 
-            string expectedArgs = $"userpass --url {targetUri} --show-oauth";
+            string expectedArgs = $"prompt --url {targetUri} --show-basic --show-oauth";
 
             var context = new TestCommandContext();
             context.SessionManager.IsDesktopSession = true; // Enable OAuth and UI helper selection

src/shared/Atlassian.Bitbucket.UI.Avalonia/Controls/TesterWindow.axaml

@@ -6,8 +6,24 @@
         x:Class="Atlassian.Bitbucket.UI.Controls.TesterWindow"
         Title="Bitbucket Authentication Dialog Tester"
         Height="240" Width="420" CanResize="False">
-    <DockPanel>
-        <Button Content="Show Credentials Dialog" Padding="10" Click="ShowCredentials" />
-        <Button Content="Show OAuth Dialog" Padding="10" Click="ShowOAuth" />
-    </DockPanel>
+    <StackPanel Margin="10">
+        <Grid RowDefinitions="Auto,Auto,Auto" ColumnDefinitions="Auto,*">
+            <Label Grid.Row="0" Grid.Column="0"
+                   Content="Auth Modes" />
+            <StackPanel Grid.Row="0" Grid.Column="1"
+                        Orientation="Horizontal" VerticalAlignment="Center">
+                <CheckBox Content="OAuth" x:Name="showOAuth" MinWidth="90" IsChecked="True" />
+                <CheckBox Content="Basic" x:Name="showBasic" MinWidth="80" IsChecked="True" />
+            </StackPanel>
+            <Label Grid.Row="1" Grid.Column="0"
+                   Content="URL" />
+            <TextBox Grid.Row="1" Grid.Column="1"
+                     x:Name="url" />
+            <Label Grid.Row="2" Grid.Column="0"
+                   Content="Username" />
+            <TextBox Grid.Row="2" Grid.Column="1"
+                     x:Name="username" />
+        </Grid>
+        <Button Classes="accent" Content="Show" Click="ShowCredentials" />
+    </StackPanel>
 </Window>

src/shared/Atlassian.Bitbucket.UI.Avalonia/Controls/TesterWindow.axaml.cs

@@ -1,3 +1,4 @@
+using System;
 using Atlassian.Bitbucket.UI.ViewModels;
 using Atlassian.Bitbucket.UI.Views;
 using Avalonia;
@@ -53,17 +54,17 @@ private void ShowCredentials(object sender, RoutedEventArgs e)
         {
             var vm = new CredentialsViewModel(_environment)
             {
-                ShowOAuth = true
+                ShowOAuth = this.FindControl<CheckBox>("showOAuth").IsChecked ?? false,
+                ShowBasic = this.FindControl<CheckBox>("showBasic").IsChecked ?? false,
+                UserName = this.FindControl<TextBox>("username").Text
             };
-            var view = new CredentialsView();
-            var window = new DialogWindow(view) {DataContext = vm};
-            window.ShowDialog(this);
-        }
 
-        private void ShowOAuth(object sender, RoutedEventArgs e)
-        {
-            var vm = new OAuthViewModel(_environment);
-            var view = new OAuthView();
+            if (Uri.TryCreate(this.FindControl<TextBox>("url").Text, UriKind.Absolute, out Uri uri))
+            {
+                vm.Url = uri;
+            }
+
+            var view = new CredentialsView();
             var window = new DialogWindow(view) {DataContext = vm};
             window.ShowDialog(this);
         }

src/shared/Atlassian.Bitbucket.UI.Avalonia/Program.cs

@@ -50,7 +50,6 @@ private static void AppMain(object o)
             using (var app = new HelperApplication(context))
             {
                 app.RegisterCommand(new CredentialsCommandImpl(context));
-                app.RegisterCommand(new OAuthCommandImpl(context));
 
                 int exitCode = app.RunAsync(args)
                     .ConfigureAwait(false)

src/shared/Atlassian.Bitbucket.UI.Avalonia/Views/CredentialsView.axaml

@@ -3,50 +3,79 @@
              xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
              xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
              xmlns:vm="clr-namespace:Atlassian.Bitbucket.UI.ViewModels;assembly=Atlassian.Bitbucket.UI.Shared"
+             xmlns:converters="clr-namespace:GitCredentialManager.UI.Converters;assembly=gcmcoreuiavn"
              mc:Ignorable="d" d:DesignWidth="800" d:DesignHeight="450"
              x:Class="Atlassian.Bitbucket.UI.Views.CredentialsView">
     <Design.DataContext>
         <vm:CredentialsViewModel/>
     </Design.DataContext>
     <DockPanel LastChildFill="True">
         <StackPanel DockPanel.Dock="Bottom">
-            <Button HorizontalAlignment="Center" Margin="0,30,0,10"
+            <Button HorizontalAlignment="Center" Margin="0,0,0,10"
                     Classes="hyperlink"
                     Command="{Binding ForgotPasswordCommand}"
                     Content="Can't log in?"/>
-            <Button HorizontalAlignment="Center" Margin="0,0,0,10"
+            <Button HorizontalAlignment="Center" Margin="0,0,0,8"
                     Classes="hyperlink"
                     Command="{Binding SignUpCommand}"
                     Content="Sign up for an account" />
         </StackPanel>
 
-        <StackPanel DockPanel.Dock="Top" Margin="0,0,0,30">
-            <Image HorizontalAlignment="Center" Source="/Assets/atlassian-logo.png" />
-            <TextBlock HorizontalAlignment="Center" Text="Log in to your account"/>
+        <StackPanel DockPanel.Dock="Top">
+            <Image HorizontalAlignment="Center" Source="/Assets/atlassian-logo.png" Height="90" />
+            <TextBlock HorizontalAlignment="Center" Text="Log in to your account" Margin="0,-10,0,0" />
             <TextBlock HorizontalAlignment="Center" Text="{Binding Url}"
                        IsVisible="{Binding Url, Converter={x:Static StringConverters.IsNotNullOrEmpty}}"
                        Margin="0,10,0,0"/>
         </StackPanel>
 
-        <StackPanel Width="288">
-            <TextBox x:Name="userNameTextBox" Margin="0,0,0,10"
-                     HorizontalAlignment="Stretch"
-                     Watermark="Email or username"
-                     Text="{Binding UserName}" />
-            <TextBox x:Name="passwordTextBox" Margin="0,0,0,20"
-                     HorizontalAlignment="Stretch"
-                     Watermark="Password" PasswordChar="●"
-                     Text="{Binding Password}" />
-            <Button IsDefault="True" Margin="0,0,0,10"
-                    HorizontalAlignment="Center" HorizontalContentAlignment="Center" VerticalContentAlignment="Center"
-                    Command="{Binding LoginCommand}"
-                    Content="Continue" Width="140" Height="40"
-                    Classes="accent" />
-            <Button HorizontalAlignment="Center" HorizontalContentAlignment="Center" VerticalContentAlignment="Center"
-                    IsVisible="{Binding ShowOAuth}"
-                    Command="{Binding OAuthCommand}"
-                    Classes="hyperlink"
-                    Content="Sign in with OAuth" />
-        </StackPanel>
+        <TabControl x:Name="authModesTabControl"
+                    VerticalContentAlignment="Center"
+                    AutoScrollToSelectedItem="True"
+                    Width="288"
+                    Margin="0,20">
+            <TabControl.Styles>
+                <Style Selector="TabItem">
+                    <Setter Property="MinHeight" Value="30" />
+                </Style>
+                <Style Selector="DockPanel > ItemsPresenter > WrapPanel">
+                    <Setter Property="HorizontalAlignment" Value="Center"/>
+                </Style>
+            </TabControl.Styles>
+
+            <TabItem IsVisible="{Binding ShowOAuth}">
+                <TabItem.Header>
+                    <TextBlock Text="Browser" FontSize="12" />
+                </TabItem.Header>
+                <StackPanel Margin="0,15">
+                    <Button x:Name="oauthLoginButton" IsDefault="True"
+                            HorizontalAlignment="Center" HorizontalContentAlignment="Center" VerticalContentAlignment="Center"
+                            Command="{Binding OAuthCommand}"
+                            Classes="accent" Height="40" Padding="15,5"
+                            Content="Sign in with your browser" />
+                </StackPanel>
+            </TabItem>
+
+            <TabItem IsVisible="{Binding ShowBasic}">
+                <TabItem.Header>
+                    <TextBlock Text="Password/Token" FontSize="12" />
+                </TabItem.Header>
+                <StackPanel Margin="0,15">
+                    <TextBox x:Name="userNameTextBox" Margin="0,0,0,10"
+                             HorizontalAlignment="Stretch"
+                             Watermark="Email or username"
+                             Text="{Binding UserName}" />
+                    <TextBox x:Name="passwordTextBox" Margin="0,0,0,10"
+                             HorizontalAlignment="Stretch"
+                             Watermark="Password or token" PasswordChar="●"
+                             Text="{Binding Password}" />
+                    <Button IsDefault="True"
+                            HorizontalAlignment="Center" HorizontalContentAlignment="Center" VerticalContentAlignment="Center"
+                            Command="{Binding LoginCommand}"
+                            Content="Sign in" Width="140" Height="40"
+                            Classes="accent" />
+                </StackPanel>
+            </TabItem>
+        </TabControl>
     </DockPanel>
 </UserControl>

src/shared/Atlassian.Bitbucket.UI.Avalonia/Views/CredentialsView.axaml.cs

@@ -7,6 +7,8 @@ namespace Atlassian.Bitbucket.UI.Views
 {
     public class CredentialsView : UserControl, IFocusable
     {
+        private TabControl _tabControl;
+        private Button _oauthLoginButton;
         private TextBox _userNameTextBox;
         private TextBox _passwordTextBox;
 
@@ -19,6 +21,8 @@ private void InitializeComponent()
         {
             AvaloniaXamlLoader.Load(this);
 
+            _tabControl = this.FindControl<TabControl>("authModesTabControl");
+            _oauthLoginButton = this.FindControl<Button>("oauthLoginButton");
             _userNameTextBox = this.FindControl<TextBox>("userNameTextBox");
             _passwordTextBox = this.FindControl<TextBox>("passwordTextBox");
         }
@@ -30,13 +34,22 @@ public void SetFocus()
                 return;
             }
 
-            if (string.IsNullOrWhiteSpace(vm.UserName))
+            if (vm.ShowOAuth)
             {
-                _userNameTextBox.Focus();
+                _tabControl.SelectedIndex = 0;
+                _oauthLoginButton.Focus();
             }
-            else
+            else if (vm.ShowBasic)
             {
-                _passwordTextBox.Focus();
+                _tabControl.SelectedIndex = 1;
+                if (string.IsNullOrWhiteSpace(vm.UserName))
+                {
+                    _userNameTextBox.Focus();
+                }
+                else
+                {
+                    _passwordTextBox.Focus();
+                }
             }
         }
     }