diff --git a/src/sql/parts/accountManagement/firewallRuleDialog/firewallRuleDialog.ts b/src/sql/parts/accountManagement/firewallRuleDialog/firewallRuleDialog.ts index 6380d0e66a..402b22f4bc 100644 --- a/src/sql/parts/accountManagement/firewallRuleDialog/firewallRuleDialog.ts +++ b/src/sql/parts/accountManagement/firewallRuleDialog/firewallRuleDialog.ts @@ -93,7 +93,7 @@ export class FirewallRuleDialog extends Modal { protected renderBody(container: HTMLElement) { let descriptionSection; - $().div({ class: 'firewall-rule-description-section new-section' }, (descriptionContainer) => { + $().div({ 'class': 'firewall-rule-description-section new-section' }, (descriptionContainer) => { descriptionSection = descriptionContainer.getHTMLElement(); DOM.append(descriptionContainer.getHTMLElement(), DOM.$('div.firewall-rule-icon')); @@ -101,9 +101,11 @@ export class FirewallRuleDialog extends Modal { let dialogDescription = localize('firewallRuleDialogDescription', 'Your client IP address does not have access to the server. Sign in to an Azure account and create a new firewall rule to enable access.'); this.createLabelElement(new Builder(textDescriptionContainer), dialogDescription, false); - this._helpLink = DOM.append(textDescriptionContainer, DOM.$('a.help-link')); - this._helpLink.setAttribute('href', 'https://docs.microsoft.com/en-us/azure/sql-database/sql-database-firewall-configure'); - this._helpLink.innerHTML += localize('firewallRuleHelpDescription', 'Learn more about firewall settings'); + + // TODO: Make this 1) extensible and 2) open the info via an action (01/08/2018, https://github.com/Microsoft/sqlopsstudio/issues/450) + // this._helpLink = DOM.append(textDescriptionContainer, DOM.$('a.help-link')); + // this._helpLink.setAttribute('href', 'https://docs.microsoft.com/en-us/azure/sql-database/sql-database-firewall-configure'); + // this._helpLink.innerHTML += localize('firewallRuleHelpDescription', 'Learn more about firewall settings'); }); // Create account picker with event handling @@ -116,43 +118,43 @@ export class FirewallRuleDialog extends Modal { this._accountPickerService.onAccountSelectionChangeEvent((account) => this.onAccountSelectionChange(account)); let azureAccountSection; - $().div({ class: 'azure-account-section new-section' }, (azureAccountContainer) => { + $().div({ 'class': 'azure-account-section new-section' }, (azureAccountContainer) => { azureAccountSection = azureAccountContainer.getHTMLElement(); let azureAccountLabel = localize('azureAccount', 'Azure account'); this.createLabelElement(azureAccountContainer, azureAccountLabel, true); - azureAccountContainer.div({ class: 'dialog-input' }, (inputCellContainer) => { + azureAccountContainer.div({ 'class': 'dialog-input' }, (inputCellContainer) => { this._accountPickerService.renderAccountPicker(inputCellContainer.getHTMLElement()); }); }); let subnetIPRangeSection; - $().div({ class: 'subnet-ip-range-input' }, (subnetIPRangeContainer) => { + $().div({ 'class': 'subnet-ip-range-input' }, (subnetIPRangeContainer) => { subnetIPRangeSection = subnetIPRangeContainer.getHTMLElement(); - subnetIPRangeContainer.div({ class: 'dialog-input-section' }, (inputContainer) => { - inputContainer.div({ class: 'dialog-label' }, (labelContainer) => { + subnetIPRangeContainer.div({ 'class': 'dialog-input-section' }, (inputContainer) => { + inputContainer.div({ 'class': 'dialog-label' }, (labelContainer) => { labelContainer.innerHtml(localize('from', 'From')); }); - inputContainer.div({ class: 'dialog-input' }, (inputCellContainer) => { + inputContainer.div({ 'class': 'dialog-input' }, (inputCellContainer) => { this._fromRangeinputBox = new InputBox(inputCellContainer.getHTMLElement(), this._contextViewService); }); - inputContainer.div({ class: 'dialog-label' }, (labelContainer) => { + inputContainer.div({ 'class': 'dialog-label' }, (labelContainer) => { labelContainer.innerHtml(localize('to', 'To')); }); - inputContainer.div({ class: 'dialog-input' }, (inputCellContainer) => { + inputContainer.div({ 'class': 'dialog-input' }, (inputCellContainer) => { this._toRangeinputBox = new InputBox(inputCellContainer.getHTMLElement(), this._contextViewService); }); }); }); let firewallRuleSection; - $().div({ class: 'firewall-rule-section new-section' }, (firewallRuleContainer) => { + $().div({ 'class': 'firewall-rule-section new-section' }, (firewallRuleContainer) => { firewallRuleSection = firewallRuleContainer.getHTMLElement(); let firewallRuleLabel = localize('filewallRule', 'Firewall rule'); this.createLabelElement(firewallRuleContainer, firewallRuleLabel, true); - firewallRuleContainer.div({ class: 'radio-section' }, (radioContainer) => { + firewallRuleContainer.div({ 'class': 'radio-section' }, (radioContainer) => { const form = DOM.append(radioContainer.getHTMLElement(), DOM.$('form.firewall-rule')); const IPAddressDiv = DOM.append(form, DOM.$('div.firewall-ip-address dialog-input')); const subnetIPRangeDiv = DOM.append(form, DOM.$('div.firewall-subnet-ip-range dialog-input')); @@ -177,7 +179,7 @@ export class FirewallRuleDialog extends Modal { }); }); - new Builder(container).div({ class: 'firewall-rule-dialog' }, (builder) => { + new Builder(container).div({ 'class': 'firewall-rule-dialog' }, (builder) => { builder.append(descriptionSection); builder.append(azureAccountSection); builder.append(firewallRuleSection); @@ -214,7 +216,7 @@ export class FirewallRuleDialog extends Modal { if (isHeader) { className += ' header'; } - container.div({ class: className }, (labelContainer) => { + container.div({ 'class': className }, (labelContainer) => { labelContainer.innerHtml(content); }); } @@ -305,4 +307,4 @@ export class FirewallRuleDialog extends Modal { this.show(); } -} \ No newline at end of file +}