ckaczor/azuredatastudio
1
0
Fork 0
mirror of https://github.com/ckaczor/azuredatastudio.git synced 2026-01-26 17:23:15 -05:00
Code Issues Packages Projects Releases Wiki Activity

Fix accessibility issue for clear history button in connection dialog (#1084)

Browse Source 
* change clear history connections button to action bar

* formatting
This commit is contained in:
Abbie Petchtes
2018-04-05 14:42:21 -07:00
committed by GitHub
parent 4967e630fb
commit a6ba44e435
3 changed files with 90 additions and 63 deletions
Download Patch File Download Diff File Expand all files Collapse all files

33
src/sql/parts/connection/connectionDialog/connectionDialogWidget.ts
View File

@@ -18,6 +18,7 @@ import { TabbedPanel, PanelTabIdentifier } from 'sql/base/browser/ui/panel/panel
import { RecentConnectionTreeController, RecentConnectionActionsProvider } from 'sql/parts/connection/connectionDialog/recentConnectionTreeController';
import { SavedConnectionTreeController } from 'sql/parts/connection/connectionDialog/savedConnectionTreeController';
import * as TelemetryKeys from 'sql/common/telemetryKeys';
import { ClearRecentConnectionsAction } from 'sql/parts/connection/common/connectionActions';
import { IContextKeyService } from 'vs/platform/contextkey/common/contextkey';
import { IWorkbenchThemeService, IColorTheme } from 'vs/workbench/services/themes/common/workbenchThemeService';
@@ -32,11 +33,11 @@ import { localize } from 'vs/nls';
import { ITree } from 'vs/base/parts/tree/browser/tree';
import { IContextMenuService, IContextViewService } from 'vs/platform/contextview/browser/contextView';
import { IInstantiationService } from 'vs/platform/instantiation/common/instantiation';
import { IConfirmationService, IChoiceService, IConfirmation, IConfirmationResult, Choice } from 'vs/platform/dialogs/common/dialogs';
import * as styler from 'vs/platform/theme/common/styler';
import { TPromise } from 'vs/base/common/winjs.base';
import * as DOM from 'vs/base/browser/dom';
import { DialogService } from 'vs/workbench/services/dialogs/electron-browser/dialogs';
import { ActionBar } from 'vs/base/browser/ui/actionbar/actionbar';
export interface OnShowUIResponse {
selectedProviderType: string;
@@ -58,6 +59,7 @@ export class ConnectionDialogWidget extends Modal {
private _savedConnectionTree: ITree;
private $connectionUIContainer: Builder;
private _databaseDropdownExpanded: boolean;
private _actionbar: ActionBar;
private _panel: TabbedPanel;
private _recentConnectionTabId: PanelTabIdentifier;
@@ -90,7 +92,6 @@ export class ConnectionDialogWidget extends Modal {
@ITelemetryService telemetryService: ITelemetryService,
@IContextKeyService contextKeyService: IContextKeyService,
@IContextMenuService private _contextMenuService: IContextMenuService,
@IConfirmationService private _confirmationService: IConfirmationService,
@IContextViewService private _contextViewService: IContextViewService
) {
super(localize('connection', 'Connection'), TelemetryKeys.Connection, _partService, telemetryService, contextKeyService, { hasSpinner: true, hasErrors: true });
@@ -257,26 +258,6 @@ export class ConnectionDialogWidget extends Modal {
this.hide();
}
private clearRecentConnectionList(): TPromise<boolean> {
let confirm: IConfirmation = {
message: localize('clearRecentConnectionMessage', 'Are you sure you want to delete all the connections from the list?'),
primaryButton: localize('connectionDialog.yes', 'Yes'),
secondaryButton: localize('connectionDialog.no', 'No'),
type: 'question'
};
return new TPromise<boolean>((resolve, reject) => {
this._confirmationService.confirm(confirm).then((confirmed) => {
if (confirmed) {
this._connectionManagementService.clearRecentConnectionsList();
this.open(false);
}
resolve(confirmed);
});
});
}
private createRecentConnectionList(): void {
this._recentConnectionBuilder.div({ class: 'connection-recent-content' }, (recentConnectionContainer) => {
let recentHistoryLabel = localize('recentHistory', 'Recent history');
@@ -284,8 +265,12 @@ export class ConnectionDialogWidget extends Modal {
container.div({ class: 'connection-history-label' }, (recentTitle) => {
recentTitle.innerHtml(recentHistoryLabel);
});
container.div({ class: 'search-action clear-search-results' }, (clearSearchIcon) => {
clearSearchIcon.on('click', () => this.clearRecentConnectionList());
container.div({ class: 'connection-history-actions' }, (actionsContainer) => {
this._actionbar = this._register(new ActionBar(actionsContainer, { animated: false }));
let clearAction = this._instantiationService.createInstance(ClearRecentConnectionsAction, ClearRecentConnectionsAction.ID, ClearRecentConnectionsAction.LABEL);
clearAction.useConfirmationMessage = true;
clearAction.onRecentConnectionsRemoved(() => this.open(false));
this._actionbar.push(clearAction, { icon: true, label: false });
});
});
recentConnectionContainer.div({ class: 'server-explorer-viewlet' }, (divContainer: Builder) => {

18
src/sql/parts/connection/connectionDialog/media/connectionDialog.css
View File

@@ -69,15 +69,21 @@
overflow-y: hidden;
}
.connection-dialog .connection-history-actions .action-label.icon {
display: block;
height: 20px;
line-height: 20px;
min-width: 20px;
background-size: 16px;
background-position: center center;
background-repeat: no-repeat;
}
.search-action.clear-search-results {
background: url('clear-search-results.svg') center right no-repeat;
width: 10%;
cursor: pointer;
background: url('clear-search-results.svg');
}
.vs-dark .search-action.clear-search-results,
.hc-black .search-action.clear-search-results {
background: url('clear-search-results-dark.svg') center right no-repeat;
width: 10%;
cursor: pointer;
background: url('clear-search-results-dark.svg');
}