Change dialog style for Device code flow dialog (#23417)

This commit is contained in:
Cheena Malhotra
2023-07-07 22:28:50 -07:00
committed by GitHub
parent 41401cf671
commit 3f19d0026e
5 changed files with 23 additions and 14 deletions

View File

@@ -477,10 +477,9 @@ export class AccountManagementService implements IAccountManagementService {
/**
* Copy the user code to the clipboard and open a browser to the verification URI
*/
public async copyUserCodeAndOpenBrowser(userCode: string, uri: string): Promise<void> {
public async copyUserCodeAndOpenBrowser(userCode: string, uri: string): Promise<boolean> {
await this._clipboardService.writeText(userCode);
await this._openerService.open(URI.parse(uri));
return await this._openerService.open(URI.parse(uri));
}
private async _registerProvider(providerMetadata: azdata.AccountProviderMetadata, provider: azdata.AccountProvider): Promise<void> {

View File

@@ -30,6 +30,7 @@ export class AutoOAuthDialog extends Modal {
private _userCodeInputBox?: InputBox;
private _websiteInputBox?: InputBox;
private _descriptionElement?: HTMLElement;
private _selfHelpElement?: HTMLElement;
// EVENTING ////////////////////////////////////////////////////////////
private _onHandleAddAccount = new Emitter<void>();
@@ -38,6 +39,13 @@ export class AutoOAuthDialog extends Modal {
private _onCancel = new Emitter<void>();
public get onCancel(): Event<void> { return this._onCancel.event; }
public hideCopyButton(): void {
this._copyAndOpenButton.element.hidden = true;
}
public updateSelfHelpMessage(message: string): void {
this._selfHelpElement.innerText = message;
}
private _onCloseEvent = new Emitter<void>();
public get onCloseEvent(): Event<void> { return this._onCloseEvent.event; }
@@ -53,7 +61,7 @@ export class AutoOAuthDialog extends Modal {
@ITextResourcePropertiesService textResourcePropertiesService: ITextResourcePropertiesService
) {
super(
'',
localize('deviceCodeAuthDialogTitle', 'Azure Auth: Device Code'),
TelemetryKeys.ModalDialogName.AutoOAuth,
telemetryService,
layoutService,
@@ -63,8 +71,8 @@ export class AutoOAuthDialog extends Modal {
textResourcePropertiesService,
contextKeyService,
{
dialogStyle: 'flyout',
hasBackButton: true,
dialogStyle: 'normal',
height: 340,
hasSpinner: true
}
);
@@ -73,9 +81,6 @@ export class AutoOAuthDialog extends Modal {
public override render() {
super.render();
attachModalDialogStyler(this, this._themeService);
this.backButton!.onDidClick(() => this.cancel());
this._register(this.backButton);
this._copyAndOpenButton = this.addFooterButton(localize('copyAndOpen', "Copy & Open"), () => this.addAccount());
this._closeButton = this.addFooterButton(localize('oauthDialog.cancel', "Cancel"), () => this.cancel(), 'right', true);
this.registerListeners();
@@ -90,10 +95,10 @@ export class AutoOAuthDialog extends Modal {
protected renderBody(container: HTMLElement) {
const body = append(container, $('.auto-oauth-dialog'));
this._descriptionElement = append(body, $('.auto-oauth-description-section.new-section'));
const addAccountSection = append(body, $('.auto-oauth-info-section.new-section'));
this._userCodeInputBox = this.createInputBoxHelper(addAccountSection, localize('userCode', "User code"));
this._websiteInputBox = this.createInputBoxHelper(addAccountSection, localize('website', "Website"));
this._selfHelpElement = append(body, $('.auto-oauth-selfhelp-section.new-section'));
}
private createInputBoxHelper(container: HTMLElement, label: string): InputBox {

View File

@@ -74,7 +74,12 @@ export class AutoOAuthDialogController {
private async handleOnAddAccount(): Promise<void> {
if (this._userCode && this._uri) {
return this._accountManagementService.copyUserCodeAndOpenBrowser(this._userCode, this._uri);
if (!this._accountManagementService.copyUserCodeAndOpenBrowser(this._userCode, this._uri)) {
const selfHelpMessage = localize('selfHelpMessage', "A web browser cannot be launched in this environment, please launch a browser, navigate to the URL above and enter code manually.");
// URI could not be opened, prompt user to open themselves
this._autoOAuthDialog.hideCopyButton();
this._autoOAuthDialog.updateSelfHelpMessage(selfHelpMessage);
}
} else {
throw new Error('Missing user code and uri');
}